@yuuvis/bpm-management-app 1.0.0 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +11 -1
  2. package/fesm2022/yuuvis-bpm-management-app-extensions.mjs +3 -3
  3. package/fesm2022/yuuvis-bpm-management-app.mjs +320 -130
  4. package/fesm2022/yuuvis-bpm-management-app.mjs.map +1 -1
  5. package/lib/assets/i18n/de.json +7 -1
  6. package/lib/assets/i18n/en.json +7 -1
  7. package/package.json +2 -2
  8. package/types/yuuvis-bpm-management-app.d.ts +11 -3
package/fesm2022/yuuvis-bpm-management-app.mjs CHANGED
@@ -1,10 +1,10 @@
1
1
  import * as i1$2 from '@angular/common';
2
2
  import { CommonModule, formatDate } from '@angular/common';
3
3
  import * as i0 from '@angular/core';
4
- import { inject, Component, Injectable, input, forwardRef, ViewChild, computed, signal, output, Pipe, effect } from '@angular/core';
4
+ import { inject, Component, Injectable, input, forwardRef, ViewChild, signal, computed, output, Pipe, effect } from '@angular/core';
5
5
  import * as i1 from '@angular/router';
6
6
  import { RouterModule } from '@angular/router';
7
- import { TranslateService, TranslatePipe, BackendService, ApiBase, Utils, Logger, NotificationService } from '@yuuvis/client-core';
7
+ import { TranslateService, TranslatePipe, BackendService, ApiBase, Utils, Logger, NotificationService, IdmService } from '@yuuvis/client-core';
8
8
  import { Title } from '@angular/platform-browser';
9
9
  import * as i2 from '@angular/material/tabs';
10
10
  import { MatTabsModule } from '@angular/material/tabs';
@@ -15,7 +15,7 @@ import * as i6 from '@yuuvis/material/layout';
15
15
  import { YmtLayoutModule } from '@yuuvis/material/layout';
16
16
  import * as i7 from '@yuuvis/material/panes';
17
17
  import { YmtPanesModule } from '@yuuvis/material/panes';
18
- import * as i5$1 from '@yuuvis/client-shell';
18
+ import * as i5$2 from '@yuuvis/client-shell';
19
19
  import { YuvClientShellModule } from '@yuuvis/client-shell';
20
20
  import * as i2$2 from '@angular/material/button';
21
21
  import { MatButtonModule } from '@angular/material/button';
@@ -23,14 +23,14 @@ import * as i4 from '@angular/material/tooltip';
23
23
  import { MatTooltipModule, MatTooltip } from '@angular/material/tooltip';
24
24
  import * as i4$1 from '@angular/material/table';
25
25
  import { MatTableModule } from '@angular/material/table';
26
- import * as i5 from '@angular/material/paginator';
26
+ import * as i5$1 from '@angular/material/paginator';
27
27
  import { MatPaginatorModule } from '@angular/material/paginator';
28
28
  import { MatSortModule } from '@angular/material/sort';
29
29
  import { YuvMasterDetailsModule } from '@yuuvis/client-components/master-details';
30
30
  import * as i6$1 from '@yuuvis/client-components/overflow-menu';
31
31
  import { YuvOverflowMenuModule } from '@yuuvis/client-components/overflow-menu';
32
32
  import { HttpParams } from '@angular/common/http';
33
- import { map, startWith, pairwise, debounceTime, distinctUntilChanged, forkJoin, catchError, of } from 'rxjs';
33
+ import { map, startWith, pairwise, debounceTime, distinctUntilChanged, forkJoin, catchError, of, switchMap } from 'rxjs';
34
34
  import * as i1$4 from '@angular/material/checkbox';
35
35
  import { MatCheckboxModule, MatCheckbox } from '@angular/material/checkbox';
36
36
  import * as i3 from '@angular/material/input';
@@ -45,7 +45,9 @@ import { MatMenuModule } from '@angular/material/menu';
45
45
  import { MatDividerModule } from '@angular/material/divider';
46
46
  import * as i1$1 from '@angular/forms';
47
47
  import { FormGroup, FormControl, ReactiveFormsModule, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
48
- import { DatepickerComponent } from '@yuuvis/client-components/datepicker';
48
+ import * as i5 from '@yuuvis/client-framework/datepicker';
49
+ import { YuvDatepickerModule } from '@yuuvis/client-framework/datepicker';
50
+ import { OrganizationComponent } from '@yuuvis/client-framework/forms';
49
51
  import { MatProgressBar } from '@angular/material/progress-bar';
50
52
  import { MatCardModule } from '@angular/material/card';
51
53
  import * as i1$3 from '@angular/material/progress-spinner';
@@ -54,7 +56,7 @@ import { SelectionModel } from '@angular/cdk/collections';
54
56
  import { MatDialogRef, MAT_DIALOG_DATA, MatDialog, MatDialogModule } from '@angular/material/dialog';
55
57
  import { DialogComponent, ConfirmComponent } from '@yuuvis/client-components/common';
56
58
  import { YmtButtonDirective } from '@yuuvis/material';
57
- import { OrganizationComponent } from '@yuuvis/client-framework/forms';
59
+ import { toSignal, toObservable } from '@angular/core/rxjs-interop';
58
60
 
59
61
  const APP_ID = 'io.yuuvis.app.bpm-management';
60
62
  const ProcessDefinitionScope = {
@@ -121,7 +123,8 @@ const FILTER_TYPES = {
121
123
  NUMBER: 'number',
122
124
  DATE: 'date',
123
125
  SELECT: 'select',
124
- CHECKBOX: 'checkbox'
126
+ CHECKBOX: 'checkbox',
127
+ USER: 'user'
125
128
  };
126
129
  function formatDateTime(utcDateString, locale, type = 'datetime') {
127
130
  if (!utcDateString)
@@ -175,10 +178,10 @@ class YuvBpmManagementComponent {
175
178
  : this.appName;
176
179
  this.#titleService.setTitle(translatedTitle);
177
180
  }
178
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvBpmManagementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
179
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.11", type: YuvBpmManagementComponent, isStandalone: true, selector: "ymbpm-root", ngImport: i0, template: "<section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <nav mat-tab-nav-bar [tabPanel]=\"tabPanel\">\n <a mat-tab-link\n routerLink=\"deployments\"\n routerLinkActive\n #rla1=\"routerLinkActive\"\n [active]=\"rla1.isActive\">\n {{ 'yuv.app.bpm-management.tabs.deployments' | translate }}\n </a>\n <a mat-tab-link\n routerLink=\"processdefinitions\"\n routerLinkActive\n #rla2=\"routerLinkActive\"\n [active]=\"rla2.isActive\">\n {{ 'yuv.app.bpm-management.tabs.processdefinitions' | translate }}\n </a>\n <a mat-tab-link\n routerLink=\"processes\"\n routerLinkActive\n #rla3=\"routerLinkActive\"\n [active]=\"rla3.isActive\">\n {{ 'yuv.app.bpm-management.tabs.processes' | translate }}\n </a>\n <a mat-tab-link\n routerLink=\"tasks\"\n routerLinkActive\n #rla4=\"routerLinkActive\"\n [active]=\"rla4.isActive\">\n {{ 'yuv.app.bpm-management.tabs.tasks' | translate }}\n </a>\n </nav>\n <mat-tab-nav-panel #tabPanel>\n <router-outlet></router-outlet>\n </mat-tab-nav-panel>\n</section>\n\n<router-outlet name=\"modal\"></router-outlet>\n", styles: [":host{height:100%;overflow:hidden;display:flex;flex-flow:column}:host .bpmmgmt-main__content{flex:1;overflow-y:hidden;display:flex;flex-flow:column}:host .bpmmgmt-main__content nav[mat-tab-nav-bar]{flex:0 0 auto;padding-left:1rem;padding-right:1rem}:host .bpmmgmt-main__content mat-tab-nav-panel{flex:1;overflow:hidden;display:flex;flex-flow:column}:host .bpmmgmt-main__content mat-tab-nav-panel ::ng-deep>.mat-mdc-tab-body-wrapper{height:100%;display:flex;flex-flow:column}:host ::ng-deep span.yuv-bpmn-status{border-radius:var(--ymt-corner-s);font-family:monospace;padding:2px 4px}:host ::ng-deep span.yuv-bpmn-status.running{background-color:var(--ymt-primary);color:var(--ymt-on-primary)}:host ::ng-deep span.yuv-bpmn-status.completed{background-color:var(--ymt-success);color:var(--ymt-on-primary)}:host ::ng-deep span.yuv-bpmn-status.suspended{background-color:var(--ymt-danger);color:var(--ymt-on-primary)}:host ::ng-deep span.yuv-bpmn-status.delegated{background-color:var(--ymt-warning);color:var(--ymt-on-primary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["fitInkBarToContent", "mat-stretch-tabs", "animationDuration", "backgroundColor", "disableRipple", "color", "tabPanel"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i2.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: i2.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["active", "disabled", "disableRipple", "tabIndex", "id"], exportAs: ["matTabLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
181
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvBpmManagementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
182
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: YuvBpmManagementComponent, isStandalone: true, selector: "ymbpm-root", ngImport: i0, template: "<section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <nav mat-tab-nav-bar [tabPanel]=\"tabPanel\">\n <a mat-tab-link\n routerLink=\"deployments\"\n routerLinkActive\n #rla1=\"routerLinkActive\"\n [active]=\"rla1.isActive\">\n {{ 'yuv.app.bpm-management.tabs.deployments' | translate }}\n </a>\n <a mat-tab-link\n routerLink=\"processdefinitions\"\n routerLinkActive\n #rla2=\"routerLinkActive\"\n [active]=\"rla2.isActive\">\n {{ 'yuv.app.bpm-management.tabs.processdefinitions' | translate }}\n </a>\n <a mat-tab-link\n routerLink=\"processes\"\n routerLinkActive\n #rla3=\"routerLinkActive\"\n [active]=\"rla3.isActive\">\n {{ 'yuv.app.bpm-management.tabs.processes' | translate }}\n </a>\n <a mat-tab-link\n routerLink=\"tasks\"\n routerLinkActive\n #rla4=\"routerLinkActive\"\n [active]=\"rla4.isActive\">\n {{ 'yuv.app.bpm-management.tabs.tasks' | translate }}\n </a>\n </nav>\n <mat-tab-nav-panel #tabPanel>\n <router-outlet></router-outlet>\n </mat-tab-nav-panel>\n</section>\n\n<router-outlet name=\"modal\"></router-outlet>\n", styles: [":host{height:100%;overflow:hidden;display:flex;flex-flow:column}:host .bpmmgmt-main__content{flex:1;overflow-y:hidden;display:flex;flex-flow:column}:host .bpmmgmt-main__content nav[mat-tab-nav-bar]{flex:0 0 auto;padding-left:1rem;padding-right:1rem}:host .bpmmgmt-main__content mat-tab-nav-panel{flex:1;overflow:hidden;display:flex;flex-flow:column}:host .bpmmgmt-main__content mat-tab-nav-panel ::ng-deep>.mat-mdc-tab-body-wrapper{height:100%;display:flex;flex-flow:column}:host ::ng-deep span.yuv-bpmn-status{border-radius:var(--ymt-corner-s);font-family:monospace;padding:2px 4px}:host ::ng-deep span.yuv-bpmn-status.running{background-color:var(--ymt-primary);color:var(--ymt-on-primary)}:host ::ng-deep span.yuv-bpmn-status.completed{background-color:var(--ymt-success);color:var(--ymt-on-primary)}:host ::ng-deep span.yuv-bpmn-status.suspended{background-color:var(--ymt-danger);color:var(--ymt-on-primary)}:host ::ng-deep span.yuv-bpmn-status.delegated{background-color:var(--ymt-warning);color:var(--ymt-on-primary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["fitInkBarToContent", "mat-stretch-tabs", "animationDuration", "backgroundColor", "disableRipple", "color", "tabPanel"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i2.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: i2.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["active", "disabled", "disableRipple", "tabIndex", "id"], exportAs: ["matTabLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
180
183
  }
181
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvBpmManagementComponent, decorators: [{
184
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvBpmManagementComponent, decorators: [{
182
185
  type: Component,
183
186
  args: [{ selector: 'ymbpm-root', standalone: true, imports: [
184
187
  CommonModule,
@@ -489,10 +492,13 @@ class YuvBpmAdminService {
489
492
  };
490
493
  return this.#backendService.patch(`${this.bpmApiBase}/tasks/${taskId}`, body, ApiBase.none);
491
494
  }
492
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvBpmAdminService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
493
- static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvBpmAdminService, providedIn: 'root' });
495
+ setTaskCandidates(taskId, body) {
496
+ return this.#backendService.post(`${this.bpmApiBase}/tasks/${taskId}/candidates`, body, ApiBase.none);
497
+ }
498
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvBpmAdminService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
499
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvBpmAdminService, providedIn: 'root' });
494
500
  }
495
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvBpmAdminService, decorators: [{
501
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvBpmAdminService, decorators: [{
496
502
  type: Injectable,
497
503
  args: [{
498
504
  providedIn: 'root',
@@ -620,16 +626,16 @@ class TextFilterComponent {
620
626
  type: FILTER_TYPES.TEXT
621
627
  });
622
628
  }
623
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TextFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
624
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: TextFilterComponent, isStandalone: true, selector: "ymbpm-text-filter", inputs: { operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
629
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TextFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
630
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: TextFilterComponent, isStandalone: true, selector: "ymbpm-text-filter", inputs: { operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
625
631
  {
626
632
  provide: NG_VALUE_ACCESSOR,
627
633
  useExisting: forwardRef(() => TextFilterComponent),
628
634
  multi: true
629
635
  }
630
- ], viewQueries: [{ propertyName: "tooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput \n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"textControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
636
+ ], viewQueries: [{ propertyName: "tooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput \n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"textControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;min-width:0;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1;min-width:0}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix{padding:0 8px 0 4px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix mat-icon{font-size:14px!important;width:14px!important;height:14px!important;line-height:14px!important;margin:0!important;padding:0!important}.filter-clear-btn{flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
631
637
  }
632
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TextFilterComponent, decorators: [{
638
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TextFilterComponent, decorators: [{
633
639
  type: Component,
634
640
  args: [{ selector: 'ymbpm-text-filter', standalone: true, imports: [
635
641
  CommonModule,
@@ -648,7 +654,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
648
654
  useExisting: forwardRef(() => TextFilterComponent),
649
655
  multi: true
650
656
  }
651
- ], template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput \n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"textControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}\n"] }]
657
+ ], template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput \n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"textControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;min-width:0;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1;min-width:0}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix{padding:0 8px 0 4px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix mat-icon{font-size:14px!important;width:14px!important;height:14px!important;line-height:14px!important;margin:0!important;padding:0!important}.filter-clear-btn{flex-shrink:0}\n"] }]
652
658
  }], propDecorators: { operators: [{ type: i0.Input, args: [{ isSignal: true, alias: "operators", required: false }] }], tooltip: [{
653
659
  type: ViewChild,
654
660
  args: [MatTooltip]
@@ -760,16 +766,16 @@ class NumberFilterComponent {
760
766
  type: FILTER_TYPES.NUMBER
761
767
  });
762
768
  }
763
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: NumberFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
764
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: NumberFilterComponent, isStandalone: true, selector: "ymbpm-number-filter", inputs: { operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
769
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: NumberFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
770
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: NumberFilterComponent, isStandalone: true, selector: "ymbpm-number-filter", inputs: { operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
765
771
  {
766
772
  provide: NG_VALUE_ACCESSOR,
767
773
  useExisting: forwardRef(() => NumberFilterComponent),
768
774
  multi: true
769
775
  }
770
- ], viewQueries: [{ propertyName: "tooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput type=\"number\"\n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"numberControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
776
+ ], viewQueries: [{ propertyName: "tooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput type=\"number\"\n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"numberControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;min-width:0;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1;min-width:0}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix{padding:0 8px 0 4px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix mat-icon{font-size:14px!important;width:14px!important;height:14px!important;line-height:14px!important;margin:0!important;padding:0!important}.filter-clear-btn{flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
771
777
  }
772
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: NumberFilterComponent, decorators: [{
778
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: NumberFilterComponent, decorators: [{
773
779
  type: Component,
774
780
  args: [{ selector: 'ymbpm-number-filter', standalone: true, imports: [
775
781
  CommonModule,
@@ -788,7 +794,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
788
794
  useExisting: forwardRef(() => NumberFilterComponent),
789
795
  multi: true
790
796
  }
791
- ], template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput type=\"number\"\n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"numberControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}\n"] }]
797
+ ], template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <input matInput type=\"number\"\n [placeholder]=\"('yuv.app.bpm-management.filters.search' | translate)\"\n [formControl]=\"numberControl\"\n (keydown.enter)=\"onEnter()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;min-width:0;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1;min-width:0}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix{padding:0 8px 0 4px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix mat-icon{font-size:14px!important;width:14px!important;height:14px!important;line-height:14px!important;margin:0!important;padding:0!important}.filter-clear-btn{flex-shrink:0}\n"] }]
792
798
  }], propDecorators: { operators: [{ type: i0.Input, args: [{ isSignal: true, alias: "operators", required: false }] }], tooltip: [{
793
799
  type: ViewChild,
794
800
  args: [MatTooltip]
@@ -862,16 +868,16 @@ class SelectFilterComponent {
862
868
  type: FILTER_TYPES.SELECT
863
869
  });
864
870
  }
865
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: SelectFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
866
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: SelectFilterComponent, isStandalone: true, selector: "ymbpm-select-filter", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, enableMultiselect: { classPropertyName: "enableMultiselect", publicName: "enableMultiselect", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
871
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: SelectFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
872
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: SelectFilterComponent, isStandalone: true, selector: "ymbpm-select-filter", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, enableMultiselect: { classPropertyName: "enableMultiselect", publicName: "enableMultiselect", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
867
873
  {
868
874
  provide: NG_VALUE_ACCESSOR,
869
875
  useExisting: forwardRef(() => SelectFilterComponent),
870
876
  multi: true
871
877
  }
872
- ], ngImport: i0, template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <mat-select [formControl]=\"selectControl\"\n [placeholder]=\"('yuv.app.bpm-management.filters.select' | translate)\"\n [multiple]=\"enableMultiselect()\">\n @for (option of options(); track option.value) {\n <mat-option [value]=\"option.value\">\n {{option.label | translate}}\n </mat-option>\n }\n </mat-select>\n @if (enableMultiselect()) {\n <div matSuffix class=\"multi-select-suffix\">\n @if (getSelectedCount() > 0) {\n <mat-icon>check_circle</mat-icon>\n <span class=\"count\">{{getSelectedCount()}}</span>\n }\n </div>\n }\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}.multi-select-suffix{display:flex;align-items:center;gap:4px;color:#0009}.count{font-size:12px;font-weight:500}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
878
+ ], ngImport: i0, template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <mat-select [formControl]=\"selectControl\"\n [placeholder]=\"('yuv.app.bpm-management.filters.select' | translate)\"\n [multiple]=\"enableMultiselect()\">\n @for (option of options(); track option.value) {\n <mat-option [value]=\"option.value\">\n {{option.label | translate}}\n </mat-option>\n }\n </mat-select>\n @if (enableMultiselect()) {\n <div matSuffix class=\"multi-select-suffix\">\n @if (getSelectedCount() > 0) {\n <mat-icon>check_circle</mat-icon>\n <span class=\"count\">{{getSelectedCount()}}</span>\n }\n </div>\n }\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-clear-btn{flex-shrink:0}.multi-select-suffix{display:flex;align-items:center;gap:4px;color:#0009}.count{font-size:12px;font-weight:500}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
873
879
  }
874
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: SelectFilterComponent, decorators: [{
880
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: SelectFilterComponent, decorators: [{
875
881
  type: Component,
876
882
  args: [{ selector: 'ymbpm-select-filter', standalone: true, imports: [
877
883
  CommonModule,
@@ -888,10 +894,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
888
894
  useExisting: forwardRef(() => SelectFilterComponent),
889
895
  multi: true
890
896
  }
891
- ], template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <mat-select [formControl]=\"selectControl\"\n [placeholder]=\"('yuv.app.bpm-management.filters.select' | translate)\"\n [multiple]=\"enableMultiselect()\">\n @for (option of options(); track option.value) {\n <mat-option [value]=\"option.value\">\n {{option.label | translate}}\n </mat-option>\n }\n </mat-select>\n @if (enableMultiselect()) {\n <div matSuffix class=\"multi-select-suffix\">\n @if (getSelectedCount() > 0) {\n <mat-icon>check_circle</mat-icon>\n <span class=\"count\">{{getSelectedCount()}}</span>\n }\n </div>\n }\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}.multi-select-suffix{display:flex;align-items:center;gap:4px;color:#0009}.count{font-size:12px;font-weight:500}\n"] }]
897
+ ], template: "<div class=\"filter-input-group\" [class.active]=\"isActiveFilter()\">\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n <mat-select [formControl]=\"selectControl\"\n [placeholder]=\"('yuv.app.bpm-management.filters.select' | translate)\"\n [multiple]=\"enableMultiselect()\">\n @for (option of options(); track option.value) {\n <mat-option [value]=\"option.value\">\n {{option.label | translate}}\n </mat-option>\n }\n </mat-select>\n @if (enableMultiselect()) {\n <div matSuffix class=\"multi-select-suffix\">\n @if (getSelectedCount() > 0) {\n <mat-icon>check_circle</mat-icon>\n <span class=\"count\">{{getSelectedCount()}}</span>\n }\n </div>\n }\n </mat-form-field>\n</div>", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-clear-btn{flex-shrink:0}.multi-select-suffix{display:flex;align-items:center;gap:4px;color:#0009}.count{font-size:12px;font-weight:500}\n"] }]
892
898
  }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], enableMultiselect: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableMultiselect", required: false }] }] } });
893
899
 
894
900
  class DateFilterComponent {
901
+ translateService = inject(TranslateService);
895
902
  tooltip;
896
903
  placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
897
904
  operators = input([FILTER_OPERATORS.BEFORE], ...(ngDevMode ? [{ debugName: "operators" }] : /* istanbul ignore next */ []));
@@ -1029,16 +1036,16 @@ class DateFilterComponent {
1029
1036
  });
1030
1037
  }
1031
1038
  }
1032
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DateFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1033
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: DateFilterComponent, isStandalone: true, selector: "ymbpm-date-filter", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1039
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DateFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1040
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: DateFilterComponent, isStandalone: true, selector: "ymbpm-date-filter", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1034
1041
  {
1035
1042
  provide: NG_VALUE_ACCESSOR,
1036
1043
  useExisting: forwardRef(() => DateFilterComponent),
1037
1044
  multi: true
1038
1045
  }
1039
- ], viewQueries: [{ propertyName: "tooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<div class=\"filter-input-group date-filter\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n @if (isBetweenMode()) {\n <div class=\"date-range\">\n <yuv-datepicker\n [formControl]=\"valueControl\"\n [label]=\"''\">\n </yuv-datepicker>\n\n <yuv-datepicker\n [formControl]=\"endDateControl\"\n [label]=\"''\">\n </yuv-datepicker>\n </div>\n } @else {\n <yuv-datepicker class=\"single-date-picker\"\n [formControl]=\"valueControl\"\n [label]=\"''\">\n </yuv-datepicker>\n }\n</div>\n", styles: [".filter-input-group{display:flex;align-items:flex-start;gap:4px;width:100%;opacity:.6;min-height:40px;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}.date-field{min-width:100px}.date-range{display:flex;align-items:center;gap:8px;flex:1;width:100%;min-width:0;flex-wrap:wrap}:host ::ng-deep yuv-datepicker.single-date-picker{height:40px;display:flex;align-items:center}@media(max-width:768px){.date-range{flex-direction:column;gap:4px}.date-separator{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: DatepickerComponent, selector: "yuv-datepicker", inputs: ["label", "min"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1046
+ ], viewQueries: [{ propertyName: "tooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<div class=\"filter-input-group date-filter\" [class.active]=\"isActiveFilter()\">\n <div class=\"filter-operator-anchor\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n </div>\n\n @if (isBetweenMode()) {\n <div class=\"date-range\">\n <yuv-datepicker\n [formControl]=\"valueControl\"\n [withTime]=\"true\"\n [calendar]=\"true\"\n [locale]=\"translateService.currentLang\">\n </yuv-datepicker>\n\n <yuv-datepicker\n [formControl]=\"endDateControl\"\n [withTime]=\"true\"\n [calendar]=\"true\"\n [locale]=\"translateService.currentLang\">\n </yuv-datepicker>\n </div>\n } @else {\n <yuv-datepicker\n [formControl]=\"valueControl\"\n [withTime]=\"true\"\n [calendar]=\"true\"\n [locale]=\"translateService.currentLang\">\n </yuv-datepicker>\n }\n</div>\n", styles: [".filter-input-group{display:flex;align-items:flex-start;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-operator-anchor{height:40px;display:flex;align-items:center;flex-shrink:0}.date-range{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}:host ::ng-deep yuv-datepicker{flex:1;min-width:0;height:40px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: YuvDatepickerModule }, { kind: "component", type: i5.DatepickerComponent, selector: "yuv-datepicker", inputs: ["calendar", "readonly", "hour12", "locale", "labels", "withTime", "onlyFutureDates", "minDate", "maxDate", "disabled"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1040
1047
  }
1041
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DateFilterComponent, decorators: [{
1048
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DateFilterComponent, decorators: [{
1042
1049
  type: Component,
1043
1050
  args: [{ selector: 'ymbpm-date-filter', standalone: true, imports: [
1044
1051
  CommonModule,
@@ -1053,19 +1060,84 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
1053
1060
  MatDividerModule,
1054
1061
  TranslatePipe,
1055
1062
  MatTooltipModule,
1056
- DatepickerComponent
1063
+ YuvDatepickerModule
1057
1064
  ], providers: [
1058
1065
  {
1059
1066
  provide: NG_VALUE_ACCESSOR,
1060
1067
  useExisting: forwardRef(() => DateFilterComponent),
1061
1068
  multi: true
1062
1069
  }
1063
- ], template: "<div class=\"filter-input-group date-filter\" [class.active]=\"isActiveFilter()\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n\n @if (isBetweenMode()) {\n <div class=\"date-range\">\n <yuv-datepicker\n [formControl]=\"valueControl\"\n [label]=\"''\">\n </yuv-datepicker>\n\n <yuv-datepicker\n [formControl]=\"endDateControl\"\n [label]=\"''\">\n </yuv-datepicker>\n </div>\n } @else {\n <yuv-datepicker class=\"single-date-picker\"\n [formControl]=\"valueControl\"\n [label]=\"''\">\n </yuv-datepicker>\n }\n</div>\n", styles: [".filter-input-group{display:flex;align-items:flex-start;gap:4px;width:100%;opacity:.6;min-height:40px;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1}.filter-clear-btn{flex-shrink:0}.date-field{min-width:100px}.date-range{display:flex;align-items:center;gap:8px;flex:1;width:100%;min-width:0;flex-wrap:wrap}:host ::ng-deep yuv-datepicker.single-date-picker{height:40px;display:flex;align-items:center}@media(max-width:768px){.date-range{flex-direction:column;gap:4px}.date-separator{display:none}}\n"] }]
1070
+ ], template: "<div class=\"filter-input-group date-filter\" [class.active]=\"isActiveFilter()\">\n <div class=\"filter-operator-anchor\">\n @if (operators().length > 1) {\n <button mat-icon-button\n class=\"filter-options-btn\"\n (click)=\"toggleOperator()\"\n [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">\n <mat-icon>{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n </button>\n } @else {\n <mat-icon [matTooltip]=\"(getCurrentOperatorOption()?.label || '') | translate\">{{icons[getCurrentOperatorOption()?.icon || '']}}</mat-icon>\n }\n </div>\n\n @if (isBetweenMode()) {\n <div class=\"date-range\">\n <yuv-datepicker\n [formControl]=\"valueControl\"\n [withTime]=\"true\"\n [calendar]=\"true\"\n [locale]=\"translateService.currentLang\">\n </yuv-datepicker>\n\n <yuv-datepicker\n [formControl]=\"endDateControl\"\n [withTime]=\"true\"\n [calendar]=\"true\"\n [locale]=\"translateService.currentLang\">\n </yuv-datepicker>\n </div>\n } @else {\n <yuv-datepicker\n [formControl]=\"valueControl\"\n [withTime]=\"true\"\n [calendar]=\"true\"\n [locale]=\"translateService.currentLang\">\n </yuv-datepicker>\n }\n</div>\n", styles: [".filter-input-group{display:flex;align-items:flex-start;gap:4px;width:100%;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-operator-anchor{height:40px;display:flex;align-items:center;flex-shrink:0}.date-range{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}:host ::ng-deep yuv-datepicker{flex:1;min-width:0;height:40px}\n"] }]
1064
1071
  }], propDecorators: { tooltip: [{
1065
1072
  type: ViewChild,
1066
1073
  args: [MatTooltip]
1067
1074
  }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], operators: [{ type: i0.Input, args: [{ isSignal: true, alias: "operators", required: false }] }] } });
1068
1075
 
1076
+ class UserFilterComponent {
1077
+ orgControl = new FormControl(null);
1078
+ showOrganization = signal(true, ...(ngDevMode ? [{ debugName: "showOrganization" }] : /* istanbul ignore next */ []));
1079
+ hasWrittenValue = false;
1080
+ // eslint-disable-next-line @typescript-eslint/no-empty-function
1081
+ onChange = () => { };
1082
+ // eslint-disable-next-line @typescript-eslint/no-empty-function
1083
+ onTouched = () => { };
1084
+ ngOnInit() {
1085
+ this.orgControl.valueChanges.subscribe(value => this.fireOnChangeEvent(value));
1086
+ }
1087
+ writeValue(value) {
1088
+ if (value && value.type === FILTER_TYPES.TEXT) {
1089
+ this.orgControl.setValue(value.value ? String(value.value) : null, { emitEvent: false });
1090
+ }
1091
+ else {
1092
+ this.orgControl.setValue(null, { emitEvent: false });
1093
+ if (this.hasWrittenValue) {
1094
+ this.showOrganization.set(false);
1095
+ setTimeout(() => this.showOrganization.set(true));
1096
+ }
1097
+ }
1098
+ this.hasWrittenValue = true;
1099
+ }
1100
+ registerOnChange(fn) {
1101
+ this.onChange = fn;
1102
+ }
1103
+ registerOnTouched(fn) {
1104
+ this.onTouched = fn;
1105
+ }
1106
+ fireOnChangeEvent(value) {
1107
+ this.onTouched();
1108
+ this.onChange({
1109
+ value: value || null,
1110
+ operator: FILTER_OPERATORS.EQUALS.value,
1111
+ type: FILTER_TYPES.TEXT
1112
+ });
1113
+ }
1114
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: UserFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1115
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: UserFilterComponent, isStandalone: true, selector: "ymbpm-user-filter", providers: [
1116
+ {
1117
+ provide: NG_VALUE_ACCESSOR,
1118
+ useExisting: forwardRef(() => UserFilterComponent),
1119
+ multi: true
1120
+ }
1121
+ ], ngImport: i0, template: "<div class=\"filter-input-group\" [class.active]=\"!!orgControl.value\">\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n @if (showOrganization()) {\n <yuv-organization [formControl]=\"orgControl\" [excludeMe]=\"false\" situation=\"SEARCH\" [placeholder]=\"orgControl.value ? '' : ('yuv.app.bpm-management.filters.search' | translate)\"></yuv-organization>\n }\n <mat-icon matSuffix>person_search</mat-icon>\n </mat-form-field>\n</div>\n", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;min-width:0;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1;background-color:var(--ymt-surface)}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix{padding:0 8px 0 4px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix mat-icon{font-size:14px!important;width:14px!important;height:14px!important;line-height:14px!important;margin:0!important;padding:0!important}.filter-field ::ng-deep yuv-organization mat-icon{display:none}.filter-field ::ng-deep yuv-organization input{min-height:0!important;font-weight:400!important}.filter-field ::ng-deep yuv-organization button{display:none!important}.filter-field ::ng-deep yuv-organization mat-chip-row,.filter-field ::ng-deep yuv-organization .mat-mdc-chip-row{max-width:100%!important;flex-shrink:1!important}.filter-field ::ng-deep yuv-organization .mdc-evolution-chip__cell--primary,.filter-field ::ng-deep yuv-organization .mdc-evolution-chip__action--primary{max-width:100%!important;overflow:hidden!important;padding-inline-end:var(--ymt-spacing-xs)!important}.filter-field ::ng-deep yuv-organization .mdc-evolution-chip__text-label,.filter-field ::ng-deep yuv-organization .mat-mdc-chip-action-label{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: OrganizationComponent, selector: "yuv-organization", inputs: ["situation", "multiselect", "classifications", "readonly", "excludeMe", "withMetadata", "allowFreeText"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1122
+ }
1123
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: UserFilterComponent, decorators: [{
1124
+ type: Component,
1125
+ args: [{ selector: 'ymbpm-user-filter', standalone: true, imports: [
1126
+ CommonModule,
1127
+ ReactiveFormsModule,
1128
+ MatFormFieldModule,
1129
+ MatIconModule,
1130
+ TranslatePipe,
1131
+ OrganizationComponent
1132
+ ], providers: [
1133
+ {
1134
+ provide: NG_VALUE_ACCESSOR,
1135
+ useExisting: forwardRef(() => UserFilterComponent),
1136
+ multi: true
1137
+ }
1138
+ ], template: "<div class=\"filter-input-group\" [class.active]=\"!!orgControl.value\">\n <mat-form-field appearance=\"outline\" class=\"filter-field\">\n @if (showOrganization()) {\n <yuv-organization [formControl]=\"orgControl\" [excludeMe]=\"false\" situation=\"SEARCH\" [placeholder]=\"orgControl.value ? '' : ('yuv.app.bpm-management.filters.search' | translate)\"></yuv-organization>\n }\n <mat-icon matSuffix>person_search</mat-icon>\n </mat-form-field>\n</div>\n", styles: [".filter-input-group{display:flex;align-items:center;gap:4px;width:100%;min-width:0;opacity:.6;transition:opacity .2s ease-in-out}.filter-input-group.active{opacity:1}.filter-field{flex:1;background-color:var(--ymt-surface)}.filter-field ::ng-deep .mat-mdc-text-field-wrapper{padding-left:6px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix{padding:0 8px 0 4px!important}.filter-field ::ng-deep .mat-mdc-form-field-icon-suffix mat-icon{font-size:14px!important;width:14px!important;height:14px!important;line-height:14px!important;margin:0!important;padding:0!important}.filter-field ::ng-deep yuv-organization mat-icon{display:none}.filter-field ::ng-deep yuv-organization input{min-height:0!important;font-weight:400!important}.filter-field ::ng-deep yuv-organization button{display:none!important}.filter-field ::ng-deep yuv-organization mat-chip-row,.filter-field ::ng-deep yuv-organization .mat-mdc-chip-row{max-width:100%!important;flex-shrink:1!important}.filter-field ::ng-deep yuv-organization .mdc-evolution-chip__cell--primary,.filter-field ::ng-deep yuv-organization .mdc-evolution-chip__action--primary{max-width:100%!important;overflow:hidden!important;padding-inline-end:var(--ymt-spacing-xs)!important}.filter-field ::ng-deep yuv-organization .mdc-evolution-chip__text-label,.filter-field ::ng-deep yuv-organization .mat-mdc-chip-action-label{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}\n"] }]
1139
+ }] });
1140
+
1069
1141
  class BpmTableComponent {
1070
1142
  columns = input([], ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
1071
1143
  dataSource = input([], ...(ngDevMode ? [{ debugName: "dataSource" }] : /* istanbul ignore next */ []));
@@ -1165,10 +1237,10 @@ class BpmTableComponent {
1165
1237
  this.filters.set(currentFilters);
1166
1238
  this.filtersChange.emit(currentFilters);
1167
1239
  }
1168
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BpmTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1169
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: BpmTableComponent, isStandalone: true, selector: "ymbpm-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, enableFilters: { classPropertyName: "enableFilters", publicName: "enableFilters", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null }, selectedRow: { classPropertyName: "selectedRow", publicName: "selectedRow", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filtersChange: "filtersChange", pageChange: "pageChange", rowSelected: "rowSelected" }, ngImport: i0, template: "<div class=\"table-container\">\n <table mat-table [dataSource]=\"dataSource()\" class=\"bpm-table mat-elevation-z8\">\n @for (column of columns(); track column.name) {\n <ng-container [matColumnDef]=column.name>\n <!-- Header cell -->\n <th mat-header-cell *matHeaderCellDef>\n <div class=\"header-cell-content\">\n <div class=\"header-title\">\n <span>{{column.displayName | translate}}</span>\n @if (enableFilters() && column.filter && hasActiveFilter(column.name)) {\n <div class=\"header-actions\">\n <mat-icon class=\"filter-active-icon\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.activeFilter' | translate\">{{icons.filterActive}}</mat-icon>\n <button mat-icon-button \n class=\"filter-clear-btn\"\n (click)=\"clearColumnFilter(column.name)\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.clearOne' | translate\">\n <mat-icon>{{icons.cancel}}</mat-icon>\n </button>\n </div>\n }\n </div>\n \n <!-- Filter inputs -->\n @if (enableFilters() && column.filter && getFilterControl(column.name)) {\n <div class=\"filter-container\">\n @switch (column.filter.type) {\n @case (FILTER_TYPES.TEXT) {\n <ymbpm-text-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-text-filter>\n }\n @case (FILTER_TYPES.NUMBER) {\n <ymbpm-number-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-number-filter>\n }\n @case (FILTER_TYPES.SELECT) {\n <ymbpm-select-filter [formControl]=\"getFilterControl(column.name)\" [options]=\"column.filter.options || []\" [enableMultiselect]=\"column.filter.enableMultiselect || false\"></ymbpm-select-filter>\n }\n @case (FILTER_TYPES.DATE) {\n <ymbpm-date-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-date-filter>\n }\n }\n </div>\n }\n \n </div>\n </th>\n \n <!-- Data cells -->\n @if (column.template) {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n <ng-container [ngTemplateOutlet]=\"column.template\" [ngTemplateOutletContext]=\"{ $implicit: element }\"></ng-container>\n </div>\n </td>\n } @else {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n {{element[column.name]}}\n </div>\n </td>\n }\n </ng-container>\n }\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns(); sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns();\" \n (click)=\"selectRow(row)\" \n [class.selected-row]=\"isSelected(row)\" \n class=\"process-row\">\n </tr>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell\" [attr.colspan]=\"displayedColumns().length\">\n <p class=\"no-items-label\">{{ 'yuv.app.bpm-management.emptyResult' | translate }}</p>\n </td>\n </tr>\n</table>\n</div>\n@if (busy()) {\n <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n}\n<div class=\"footer\">\n <mat-paginator class=\"paginator\" [length]=\"pagination()?.total\" [pageSize]=\"pagination()?.pageSize\" [pageSizeOptions]=\"pageSizes\" aria-label=\"Select page\"\n (page)=\"pageChange.emit($event)\"></mat-paginator>\n</div>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);--split-gutter-background-color: var(--ymt-outline-variant);height:100%;width:100%;overflow:hidden;display:flex;flex-flow:column}:host .table-container{flex:1;overflow:auto;width:100%;position:relative}:host .bpm-table{width:100%;height:auto;table-layout:fixed;border-collapse:collapse}:host .bpm-table ::ng-deep .mat-mdc-header-cell{width:170px;min-width:170px;padding:2px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:top}:host .bpm-table .mat-mdc-cell{padding:6px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:middle}:host .bpm-table .mat-mdc-cell:last-child{border-right:none}:host .bpm-table .mat-mdc-cell .cell-content{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;word-break:break-word;overflow-wrap:break-word;max-height:75px}:host .bpm-table .mat-mdc-cell ::ng-deep .mat-icon{height:25px;width:25px;font-size:25px;vertical-align:middle}:host .process-row{cursor:pointer}:host .process-row:hover{background-color:var(--ymt-surface-container-high)}:host .selected-row{background-color:var(--ymt-selection-background)!important}:host .clear-filters-btn{display:flex;align-items:center;gap:4px}:host .no-items-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .header-cell-content{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;padding:0 4px 8px;width:100%;height:100%;min-height:56px;box-sizing:border-box}:host .header-title{display:flex;height:20px;align-items:center;margin-bottom:0;gap:4px;font-weight:500}:host .header-actions{display:flex;align-items:center;gap:4px}:host .filter-active-icon{font-size:16px;height:16px;width:16px;color:var(--ymt-primary)}:host .filter-clear-btn{height:16px;width:16px;padding:0;line-height:16px;display:flex;align-items:center;justify-content:center}:host .filter-clear-btn mat-icon{font-size:16px;height:16px;width:16px}:host .filter-container{margin-top:auto;width:100%;min-width:0;min-height:40px}:host ::ng-deep .filter-options-btn{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline);border-radius:var(--ymt-corner-s)}:host .footer{display:flex;align-items:center;padding:0 16px;border-top:2px solid var(--ymt-outline-variant);box-sizing:border-box}:host .footer .paginator{margin-left:auto}@media(max-width:768px){:host .header-cell-content{min-height:100px}:host .filter-field{min-width:60px;font-size:11px}:host .filter-options-btn,:host .filter-clear-btn{min-width:24px;width:24px;height:24px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i4$1.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i5.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: TextFilterComponent, selector: "ymbpm-text-filter", inputs: ["operators"] }, { kind: "component", type: DateFilterComponent, selector: "ymbpm-date-filter", inputs: ["placeholder", "operators"] }, { kind: "component", type: SelectFilterComponent, selector: "ymbpm-select-filter", inputs: ["options", "enableMultiselect"] }, { kind: "component", type: NumberFilterComponent, selector: "ymbpm-number-filter", inputs: ["operators"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1240
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: BpmTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1241
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: BpmTableComponent, isStandalone: true, selector: "ymbpm-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, enableFilters: { classPropertyName: "enableFilters", publicName: "enableFilters", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null }, selectedRow: { classPropertyName: "selectedRow", publicName: "selectedRow", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filtersChange: "filtersChange", pageChange: "pageChange", rowSelected: "rowSelected" }, ngImport: i0, template: "<div class=\"table-container\">\n <table mat-table [dataSource]=\"dataSource()\" class=\"bpm-table mat-elevation-z8\">\n @for (column of columns(); track column.name) {\n <ng-container [matColumnDef]=column.name>\n <!-- Header cell -->\n <th mat-header-cell *matHeaderCellDef>\n <div class=\"header-cell-content\">\n <div class=\"header-title\">\n <span>{{column.displayName | translate}}</span>\n @if (enableFilters() && column.filter && hasActiveFilter(column.name)) {\n <div class=\"header-actions\">\n <mat-icon class=\"filter-active-icon\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.activeFilter' | translate\">{{icons.filterActive}}</mat-icon>\n <button mat-icon-button \n class=\"filter-clear-btn\"\n (click)=\"clearColumnFilter(column.name)\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.clearOne' | translate\">\n <mat-icon>{{icons.cancel}}</mat-icon>\n </button>\n </div>\n }\n </div>\n \n <!-- Filter inputs -->\n @if (enableFilters() && column.filter && getFilterControl(column.name)) {\n <div class=\"filter-container\">\n @switch (column.filter.type) {\n @case (FILTER_TYPES.TEXT) {\n <ymbpm-text-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-text-filter>\n }\n @case (FILTER_TYPES.NUMBER) {\n <ymbpm-number-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-number-filter>\n }\n @case (FILTER_TYPES.SELECT) {\n <ymbpm-select-filter [formControl]=\"getFilterControl(column.name)\" [options]=\"column.filter.options || []\" [enableMultiselect]=\"column.filter.enableMultiselect || false\"></ymbpm-select-filter>\n }\n @case (FILTER_TYPES.DATE) {\n <ymbpm-date-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-date-filter>\n }\n @case (FILTER_TYPES.USER) {\n <ymbpm-user-filter [formControl]=\"getFilterControl(column.name)\"></ymbpm-user-filter>\n }\n }\n </div>\n }\n \n </div>\n </th>\n \n <!-- Data cells -->\n @if (column.template) {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n <ng-container [ngTemplateOutlet]=\"column.template\" [ngTemplateOutletContext]=\"{ $implicit: element }\"></ng-container>\n </div>\n </td>\n } @else {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n {{element[column.name]}}\n </div>\n </td>\n }\n </ng-container>\n }\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns(); sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns();\" \n (click)=\"selectRow(row)\" \n [class.selected-row]=\"isSelected(row)\" \n class=\"process-row\">\n </tr>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell\" [attr.colspan]=\"displayedColumns().length\">\n <p class=\"no-items-label\">{{ 'yuv.app.bpm-management.emptyResult' | translate }}</p>\n </td>\n </tr>\n</table>\n</div>\n@if (busy()) {\n <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n}\n<div class=\"footer\">\n <mat-paginator class=\"paginator\" [length]=\"pagination()?.total\" [pageSize]=\"pagination()?.pageSize\" [pageSizeOptions]=\"pageSizes\" aria-label=\"Select page\"\n (page)=\"pageChange.emit($event)\"></mat-paginator>\n</div>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);--split-gutter-background-color: var(--ymt-outline-variant);height:100%;width:100%;overflow:hidden;display:flex;flex-flow:column}:host .table-container{flex:1;overflow:auto;width:100%;position:relative}:host .bpm-table{width:100%;height:auto;table-layout:fixed;border-collapse:collapse}:host .bpm-table ::ng-deep .mat-mdc-header-cell{width:170px;min-width:170px;padding:2px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:top}:host .bpm-table .mat-mdc-cell{padding:6px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:middle}:host .bpm-table .mat-mdc-cell:last-child{border-right:none}:host .bpm-table .mat-mdc-cell .cell-content{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;word-break:break-word;overflow-wrap:break-word;max-height:75px}:host .bpm-table .mat-mdc-cell ::ng-deep .mat-icon{height:25px;width:25px;font-size:25px;vertical-align:middle}:host .process-row{cursor:pointer}:host .process-row:hover{background-color:var(--ymt-surface-container-high)}:host .selected-row{background-color:var(--ymt-selection-background)!important}:host .clear-filters-btn{display:flex;align-items:center;gap:4px}:host .no-items-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .header-cell-content{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;padding:0 4px 8px;width:100%;height:100%;min-height:56px;box-sizing:border-box}:host .header-title{display:flex;height:20px;align-items:center;margin-bottom:0;gap:4px;font-weight:500}:host .header-actions{display:flex;align-items:center;gap:4px}:host .filter-active-icon{font-size:16px;height:16px;width:16px;color:var(--ymt-primary)}:host .filter-clear-btn{height:16px;width:16px;padding:0;line-height:16px;display:flex;align-items:center;justify-content:center}:host .filter-clear-btn mat-icon{font-size:16px;height:16px;width:16px}:host .filter-container{margin-top:auto;width:100%;min-width:0;min-height:40px}:host ::ng-deep .filter-options-btn{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline);border-radius:var(--ymt-corner-s)}:host .footer{display:flex;align-items:center;padding:0 16px;border-top:2px solid var(--ymt-outline-variant);box-sizing:border-box}:host .footer .paginator{margin-left:auto}@media(max-width:768px){:host .header-cell-content{min-height:100px}:host .filter-field{min-width:60px;font-size:11px}:host .filter-options-btn,:host .filter-clear-btn{min-width:24px;width:24px;height:24px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i4$1.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i5$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatDividerModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: TextFilterComponent, selector: "ymbpm-text-filter", inputs: ["operators"] }, { kind: "component", type: DateFilterComponent, selector: "ymbpm-date-filter", inputs: ["placeholder", "operators"] }, { kind: "component", type: SelectFilterComponent, selector: "ymbpm-select-filter", inputs: ["options", "enableMultiselect"] }, { kind: "component", type: NumberFilterComponent, selector: "ymbpm-number-filter", inputs: ["operators"] }, { kind: "component", type: UserFilterComponent, selector: "ymbpm-user-filter" }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1170
1242
  }
1171
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: BpmTableComponent, decorators: [{
1243
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: BpmTableComponent, decorators: [{
1172
1244
  type: Component,
1173
1245
  args: [{ selector: 'ymbpm-table', standalone: true, imports: [
1174
1246
  CommonModule,
@@ -1193,8 +1265,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
1193
1265
  DateFilterComponent,
1194
1266
  SelectFilterComponent,
1195
1267
  NumberFilterComponent,
1268
+ UserFilterComponent,
1196
1269
  MatProgressBar
1197
- ], template: "<div class=\"table-container\">\n <table mat-table [dataSource]=\"dataSource()\" class=\"bpm-table mat-elevation-z8\">\n @for (column of columns(); track column.name) {\n <ng-container [matColumnDef]=column.name>\n <!-- Header cell -->\n <th mat-header-cell *matHeaderCellDef>\n <div class=\"header-cell-content\">\n <div class=\"header-title\">\n <span>{{column.displayName | translate}}</span>\n @if (enableFilters() && column.filter && hasActiveFilter(column.name)) {\n <div class=\"header-actions\">\n <mat-icon class=\"filter-active-icon\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.activeFilter' | translate\">{{icons.filterActive}}</mat-icon>\n <button mat-icon-button \n class=\"filter-clear-btn\"\n (click)=\"clearColumnFilter(column.name)\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.clearOne' | translate\">\n <mat-icon>{{icons.cancel}}</mat-icon>\n </button>\n </div>\n }\n </div>\n \n <!-- Filter inputs -->\n @if (enableFilters() && column.filter && getFilterControl(column.name)) {\n <div class=\"filter-container\">\n @switch (column.filter.type) {\n @case (FILTER_TYPES.TEXT) {\n <ymbpm-text-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-text-filter>\n }\n @case (FILTER_TYPES.NUMBER) {\n <ymbpm-number-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-number-filter>\n }\n @case (FILTER_TYPES.SELECT) {\n <ymbpm-select-filter [formControl]=\"getFilterControl(column.name)\" [options]=\"column.filter.options || []\" [enableMultiselect]=\"column.filter.enableMultiselect || false\"></ymbpm-select-filter>\n }\n @case (FILTER_TYPES.DATE) {\n <ymbpm-date-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-date-filter>\n }\n }\n </div>\n }\n \n </div>\n </th>\n \n <!-- Data cells -->\n @if (column.template) {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n <ng-container [ngTemplateOutlet]=\"column.template\" [ngTemplateOutletContext]=\"{ $implicit: element }\"></ng-container>\n </div>\n </td>\n } @else {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n {{element[column.name]}}\n </div>\n </td>\n }\n </ng-container>\n }\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns(); sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns();\" \n (click)=\"selectRow(row)\" \n [class.selected-row]=\"isSelected(row)\" \n class=\"process-row\">\n </tr>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell\" [attr.colspan]=\"displayedColumns().length\">\n <p class=\"no-items-label\">{{ 'yuv.app.bpm-management.emptyResult' | translate }}</p>\n </td>\n </tr>\n</table>\n</div>\n@if (busy()) {\n <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n}\n<div class=\"footer\">\n <mat-paginator class=\"paginator\" [length]=\"pagination()?.total\" [pageSize]=\"pagination()?.pageSize\" [pageSizeOptions]=\"pageSizes\" aria-label=\"Select page\"\n (page)=\"pageChange.emit($event)\"></mat-paginator>\n</div>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);--split-gutter-background-color: var(--ymt-outline-variant);height:100%;width:100%;overflow:hidden;display:flex;flex-flow:column}:host .table-container{flex:1;overflow:auto;width:100%;position:relative}:host .bpm-table{width:100%;height:auto;table-layout:fixed;border-collapse:collapse}:host .bpm-table ::ng-deep .mat-mdc-header-cell{width:170px;min-width:170px;padding:2px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:top}:host .bpm-table .mat-mdc-cell{padding:6px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:middle}:host .bpm-table .mat-mdc-cell:last-child{border-right:none}:host .bpm-table .mat-mdc-cell .cell-content{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;word-break:break-word;overflow-wrap:break-word;max-height:75px}:host .bpm-table .mat-mdc-cell ::ng-deep .mat-icon{height:25px;width:25px;font-size:25px;vertical-align:middle}:host .process-row{cursor:pointer}:host .process-row:hover{background-color:var(--ymt-surface-container-high)}:host .selected-row{background-color:var(--ymt-selection-background)!important}:host .clear-filters-btn{display:flex;align-items:center;gap:4px}:host .no-items-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .header-cell-content{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;padding:0 4px 8px;width:100%;height:100%;min-height:56px;box-sizing:border-box}:host .header-title{display:flex;height:20px;align-items:center;margin-bottom:0;gap:4px;font-weight:500}:host .header-actions{display:flex;align-items:center;gap:4px}:host .filter-active-icon{font-size:16px;height:16px;width:16px;color:var(--ymt-primary)}:host .filter-clear-btn{height:16px;width:16px;padding:0;line-height:16px;display:flex;align-items:center;justify-content:center}:host .filter-clear-btn mat-icon{font-size:16px;height:16px;width:16px}:host .filter-container{margin-top:auto;width:100%;min-width:0;min-height:40px}:host ::ng-deep .filter-options-btn{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline);border-radius:var(--ymt-corner-s)}:host .footer{display:flex;align-items:center;padding:0 16px;border-top:2px solid var(--ymt-outline-variant);box-sizing:border-box}:host .footer .paginator{margin-left:auto}@media(max-width:768px){:host .header-cell-content{min-height:100px}:host .filter-field{min-width:60px;font-size:11px}:host .filter-options-btn,:host .filter-clear-btn{min-width:24px;width:24px;height:24px}}\n"] }]
1270
+ ], template: "<div class=\"table-container\">\n <table mat-table [dataSource]=\"dataSource()\" class=\"bpm-table mat-elevation-z8\">\n @for (column of columns(); track column.name) {\n <ng-container [matColumnDef]=column.name>\n <!-- Header cell -->\n <th mat-header-cell *matHeaderCellDef>\n <div class=\"header-cell-content\">\n <div class=\"header-title\">\n <span>{{column.displayName | translate}}</span>\n @if (enableFilters() && column.filter && hasActiveFilter(column.name)) {\n <div class=\"header-actions\">\n <mat-icon class=\"filter-active-icon\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.activeFilter' | translate\">{{icons.filterActive}}</mat-icon>\n <button mat-icon-button \n class=\"filter-clear-btn\"\n (click)=\"clearColumnFilter(column.name)\"\n [matTooltip]=\"'yuv.app.bpm-management.filters.clearOne' | translate\">\n <mat-icon>{{icons.cancel}}</mat-icon>\n </button>\n </div>\n }\n </div>\n \n <!-- Filter inputs -->\n @if (enableFilters() && column.filter && getFilterControl(column.name)) {\n <div class=\"filter-container\">\n @switch (column.filter.type) {\n @case (FILTER_TYPES.TEXT) {\n <ymbpm-text-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-text-filter>\n }\n @case (FILTER_TYPES.NUMBER) {\n <ymbpm-number-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-number-filter>\n }\n @case (FILTER_TYPES.SELECT) {\n <ymbpm-select-filter [formControl]=\"getFilterControl(column.name)\" [options]=\"column.filter.options || []\" [enableMultiselect]=\"column.filter.enableMultiselect || false\"></ymbpm-select-filter>\n }\n @case (FILTER_TYPES.DATE) {\n <ymbpm-date-filter [formControl]=\"getFilterControl(column.name)\" [operators]=\"column.filter.operators || []\"></ymbpm-date-filter>\n }\n @case (FILTER_TYPES.USER) {\n <ymbpm-user-filter [formControl]=\"getFilterControl(column.name)\"></ymbpm-user-filter>\n }\n }\n </div>\n }\n \n </div>\n </th>\n \n <!-- Data cells -->\n @if (column.template) {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n <ng-container [ngTemplateOutlet]=\"column.template\" [ngTemplateOutletContext]=\"{ $implicit: element }\"></ng-container>\n </div>\n </td>\n } @else {\n <td mat-cell *matCellDef=\"let element\">\n <div class=\"cell-content\">\n {{element[column.name]}}\n </div>\n </td>\n }\n </ng-container>\n }\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns(); sticky: true\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns();\" \n (click)=\"selectRow(row)\" \n [class.selected-row]=\"isSelected(row)\" \n class=\"process-row\">\n </tr>\n <tr class=\"mat-row\" *matNoDataRow>\n <td class=\"mat-cell\" [attr.colspan]=\"displayedColumns().length\">\n <p class=\"no-items-label\">{{ 'yuv.app.bpm-management.emptyResult' | translate }}</p>\n </td>\n </tr>\n</table>\n</div>\n@if (busy()) {\n <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n}\n<div class=\"footer\">\n <mat-paginator class=\"paginator\" [length]=\"pagination()?.total\" [pageSize]=\"pagination()?.pageSize\" [pageSizeOptions]=\"pageSizes\" aria-label=\"Select page\"\n (page)=\"pageChange.emit($event)\"></mat-paginator>\n</div>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);--split-gutter-background-color: var(--ymt-outline-variant);height:100%;width:100%;overflow:hidden;display:flex;flex-flow:column}:host .table-container{flex:1;overflow:auto;width:100%;position:relative}:host .bpm-table{width:100%;height:auto;table-layout:fixed;border-collapse:collapse}:host .bpm-table ::ng-deep .mat-mdc-header-cell{width:170px;min-width:170px;padding:2px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:top}:host .bpm-table .mat-mdc-cell{padding:6px;box-sizing:border-box;border-right:1px solid var(--ymt-outline-variant);vertical-align:middle}:host .bpm-table .mat-mdc-cell:last-child{border-right:none}:host .bpm-table .mat-mdc-cell .cell-content{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;word-break:break-word;overflow-wrap:break-word;max-height:75px}:host .bpm-table .mat-mdc-cell ::ng-deep .mat-icon{height:25px;width:25px;font-size:25px;vertical-align:middle}:host .process-row{cursor:pointer}:host .process-row:hover{background-color:var(--ymt-surface-container-high)}:host .selected-row{background-color:var(--ymt-selection-background)!important}:host .clear-filters-btn{display:flex;align-items:center;gap:4px}:host .no-items-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .header-cell-content{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;padding:0 4px 8px;width:100%;height:100%;min-height:56px;box-sizing:border-box}:host .header-title{display:flex;height:20px;align-items:center;margin-bottom:0;gap:4px;font-weight:500}:host .header-actions{display:flex;align-items:center;gap:4px}:host .filter-active-icon{font-size:16px;height:16px;width:16px;color:var(--ymt-primary)}:host .filter-clear-btn{height:16px;width:16px;padding:0;line-height:16px;display:flex;align-items:center;justify-content:center}:host .filter-clear-btn mat-icon{font-size:16px;height:16px;width:16px}:host .filter-container{margin-top:auto;width:100%;min-width:0;min-height:40px}:host ::ng-deep .filter-options-btn{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline);border-radius:var(--ymt-corner-s)}:host .footer{display:flex;align-items:center;padding:0 16px;border-top:2px solid var(--ymt-outline-variant);box-sizing:border-box}:host .footer .paginator{margin-left:auto}@media(max-width:768px){:host .header-cell-content{min-height:100px}:host .filter-field{min-width:60px;font-size:11px}:host .filter-options-btn,:host .filter-clear-btn{min-width:24px;width:24px;height:24px}}\n"] }]
1198
1271
  }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], enableFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableFilters", required: false }] }], pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: false }] }], selectedRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedRow", required: false }] }], busy: [{ type: i0.Input, args: [{ isSignal: true, alias: "busy", required: false }] }], filtersChange: [{ type: i0.Output, args: ["filtersChange"] }], pageChange: [{ type: i0.Output, args: ["pageChange"] }], rowSelected: [{ type: i0.Output, args: ["rowSelected"] }] } });
1199
1272
 
1200
1273
  class FormatDateTimePipe {
@@ -1204,10 +1277,10 @@ class FormatDateTimePipe {
1204
1277
  return '';
1205
1278
  return formatDateTime(value, this.#translateService.currentLang);
1206
1279
  }
1207
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: FormatDateTimePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1208
- static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.11", ngImport: i0, type: FormatDateTimePipe, isStandalone: true, name: "formatDateTime" });
1280
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: FormatDateTimePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
1281
+ static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.21", ngImport: i0, type: FormatDateTimePipe, isStandalone: true, name: "formatDateTime" });
1209
1282
  }
1210
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: FormatDateTimePipe, decorators: [{
1283
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: FormatDateTimePipe, decorators: [{
1211
1284
  type: Pipe,
1212
1285
  args: [{
1213
1286
  name: 'formatDateTime',
@@ -1222,10 +1295,10 @@ class DeploymentSummaryComponent {
1222
1295
  icons = {
1223
1296
  ...APP_ICONS
1224
1297
  };
1225
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DeploymentSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1226
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: DeploymentSummaryComponent, isStandalone: true, selector: "ymbpm-deployment-summary", inputs: { deployment: { classPropertyName: "deployment", publicName: "deployment", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.category' | translate }}</td>\n <td class=\"field-value\">{{ deployment()?.category }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.deploymentTime' | translate }}</td>\n <td class=\"field-value\">{{ (deployment()?.deploymentTime ?? null) | formatDateTime }}</td>\n </tr>\n </tbody>\n</table>\n\n<div class=\"resources-section\">\n <h3 class=\"resources-title\">{{ 'yuv.app.bpm-management.deployment.details.resources' | translate }}</h3>\n\n <p *ngIf=\"!deployment()?.resources || deployment()?.resources?.length === 0\" class=\"no-resources-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n </p>\n <table class=\"resources-table\" *ngIf=\"deployment()?.resources && deployment()?.resources?.length! > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.header.id' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.deployment.details.resourceMediaType' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (resource of deployment()!.resources; track resource.id) {\n <tr>\n <td class=\"resource-id\">{{ resource.id }}</td>\n <td class=\"resource-mediatype\">{{ resource.mediaType }}</td>\n </tr>\n }\n </tbody>\n </table>\n</div>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.resources-section{margin-top:var(--ymt-spacing-m)}.resources-section .resources-title{font-weight:800;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);padding-left:5px}.resources-section .no-resources-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}.resources-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.resources-table thead{background-color:var(--ymt-surface-container)}.resources-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resources-table thead th:nth-child(1){width:60%}.resources-table thead th:nth-child(2){width:40%}.resources-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.resources-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.resources-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.resources-table tbody tr td.resource-id{font-weight:600;color:var(--ymt-primary)}.resources-table tbody tr td.resource-mediatype{color:var(--ymt-on-surface);font-style:italic}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
1298
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DeploymentSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1299
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: DeploymentSummaryComponent, isStandalone: true, selector: "ymbpm-deployment-summary", inputs: { deployment: { classPropertyName: "deployment", publicName: "deployment", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.category' | translate }}</td>\n <td class=\"field-value\">{{ deployment()?.category }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.deploymentTime' | translate }}</td>\n <td class=\"field-value\">{{ (deployment()?.deploymentTime ?? null) | formatDateTime }}</td>\n </tr>\n </tbody>\n</table>\n\n<div class=\"resources-section\">\n <h3 class=\"resources-title\">{{ 'yuv.app.bpm-management.deployment.details.resources' | translate }}</h3>\n\n <p *ngIf=\"!deployment()?.resources || deployment()?.resources?.length === 0\" class=\"no-resources-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n </p>\n <table class=\"resources-table\" *ngIf=\"deployment()?.resources && deployment()?.resources?.length! > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.header.id' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.deployment.details.resourceMediaType' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (resource of deployment()!.resources; track resource.id) {\n <tr>\n <td class=\"resource-id\">{{ resource.id }}</td>\n <td class=\"resource-mediatype\">{{ resource.mediaType }}</td>\n </tr>\n }\n </tbody>\n </table>\n</div>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.resources-section{margin-top:var(--ymt-spacing-m)}.resources-section .resources-title{font-weight:800;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);padding-left:5px}.resources-section .no-resources-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}.resources-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.resources-table thead{background-color:var(--ymt-surface-container)}.resources-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resources-table thead th:nth-child(1){width:60%}.resources-table thead th:nth-child(2){width:40%}.resources-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.resources-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.resources-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.resources-table tbody tr td.resource-id{font-weight:600;color:var(--ymt-primary)}.resources-table tbody tr td.resource-mediatype{color:var(--ymt-on-surface);font-style:italic}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
1227
1300
  }
1228
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DeploymentSummaryComponent, decorators: [{
1301
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DeploymentSummaryComponent, decorators: [{
1229
1302
  type: Component,
1230
1303
  args: [{ selector: 'ymbpm-deployment-summary', standalone: true, imports: [
1231
1304
  CommonModule,
@@ -1246,10 +1319,10 @@ class DeploymentDefinitionsComponent {
1246
1319
  icons = {
1247
1320
  ...APP_ICONS
1248
1321
  };
1249
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DeploymentDefinitionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1250
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: DeploymentDefinitionsComponent, isStandalone: true, selector: "ymbpm-deployment-process-definitions", inputs: { definitions: { classPropertyName: "definitions", publicName: "definitions", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p *ngIf=\"!definitions() || definitions().length === 0\" class=\"no-definitions-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<table class=\"definitions-table\" *ngIf=\"definitions() && definitions().length > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.header.id' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.key' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (definition of definitions(); track definition) {\n <tr>\n <td class=\"definition-id\">{{ definition.id }}</td>\n <td class=\"definition-key\">{{ definition.key }}</td>\n </tr>\n }\n </tbody>\n</table>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .no-definitions-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .definitions-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}:host .definitions-table thead{background-color:var(--ymt-surface-container)}:host .definitions-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .definitions-table thead th:nth-child(1){width:60%}:host .definitions-table thead th:nth-child(2){width:40%}:host .definitions-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}:host .definitions-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}:host .definitions-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}:host .definitions-table tbody tr td.definition-id,:host .definitions-table tbody tr td.definition-key{word-break:break-word;overflow-wrap:break-word;white-space:normal}:host .definitions-table tbody tr td.definition-id{font-weight:600}:host .definitions-table tbody tr td.definition-key{font-weight:600;color:var(--ymt-on-surface);font-style:italic}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1322
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DeploymentDefinitionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1323
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: DeploymentDefinitionsComponent, isStandalone: true, selector: "ymbpm-deployment-process-definitions", inputs: { definitions: { classPropertyName: "definitions", publicName: "definitions", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p *ngIf=\"!definitions() || definitions().length === 0\" class=\"no-definitions-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<table class=\"definitions-table\" *ngIf=\"definitions() && definitions().length > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.header.id' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.key' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (definition of definitions(); track definition) {\n <tr>\n <td class=\"definition-id\">{{ definition.id }}</td>\n <td class=\"definition-key\">{{ definition.key }}</td>\n </tr>\n }\n </tbody>\n</table>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .no-definitions-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .definitions-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}:host .definitions-table thead{background-color:var(--ymt-surface-container)}:host .definitions-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .definitions-table thead th:nth-child(1){width:60%}:host .definitions-table thead th:nth-child(2){width:40%}:host .definitions-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}:host .definitions-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}:host .definitions-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}:host .definitions-table tbody tr td.definition-id,:host .definitions-table tbody tr td.definition-key{word-break:break-word;overflow-wrap:break-word;white-space:normal}:host .definitions-table tbody tr td.definition-id{font-weight:600}:host .definitions-table tbody tr td.definition-key{font-weight:600;color:var(--ymt-on-surface);font-style:italic}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1251
1324
  }
1252
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DeploymentDefinitionsComponent, decorators: [{
1325
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DeploymentDefinitionsComponent, decorators: [{
1253
1326
  type: Component,
1254
1327
  args: [{ selector: 'ymbpm-deployment-process-definitions', standalone: true, imports: [
1255
1328
  CommonModule,
@@ -1316,10 +1389,10 @@ class DeploymentDetailsComponent {
1316
1389
  this.deployment.set(undefined);
1317
1390
  }
1318
1391
  }
1319
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DeploymentDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1320
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: DeploymentDetailsComponent, isStandalone: true, selector: "ymbpm-deployment-details", inputs: { deploymentId: { classPropertyName: "deploymentId", publicName: "deploymentId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (deployment()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.summary' | translate\">\n <ymbpm-deployment-summary [deployment]=\"deployment()\"></ymbpm-deployment-summary>\n </mat-tab>\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.processdefinitions' | translate\">\n <ymbpm-deployment-process-definitions [definitions]=\"deployment()?.definitions ?? []\"></ymbpm-deployment-process-definitions>\n </mat-tab>\n </mat-tab-group>\n </section>\n}\n", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.deployment-details-card{margin-bottom:var(--ymt-spacing-m)}.deployment-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: DeploymentSummaryComponent, selector: "ymbpm-deployment-summary", inputs: ["deployment"] }, { kind: "component", type: DeploymentDefinitionsComponent, selector: "ymbpm-deployment-process-definitions", inputs: ["definitions"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1392
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DeploymentDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1393
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: DeploymentDetailsComponent, isStandalone: true, selector: "ymbpm-deployment-details", inputs: { deploymentId: { classPropertyName: "deploymentId", publicName: "deploymentId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (deployment()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.summary' | translate\">\n <ymbpm-deployment-summary [deployment]=\"deployment()\"></ymbpm-deployment-summary>\n </mat-tab>\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.processdefinitions' | translate\">\n <ymbpm-deployment-process-definitions [definitions]=\"deployment()?.definitions ?? []\"></ymbpm-deployment-process-definitions>\n </mat-tab>\n </mat-tab-group>\n </section>\n}\n", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.deployment-details-card{margin-bottom:var(--ymt-spacing-m)}.deployment-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: DeploymentSummaryComponent, selector: "ymbpm-deployment-summary", inputs: ["deployment"] }, { kind: "component", type: DeploymentDefinitionsComponent, selector: "ymbpm-deployment-process-definitions", inputs: ["definitions"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1321
1394
  }
1322
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: DeploymentDetailsComponent, decorators: [{
1395
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: DeploymentDetailsComponent, decorators: [{
1323
1396
  type: Component,
1324
1397
  args: [{ selector: 'ymbpm-deployment-details', standalone: true, imports: [
1325
1398
  CommonModule,
@@ -1462,10 +1535,10 @@ class YuvDeploymentsPageComponent {
1462
1535
  hasActiveFilters() {
1463
1536
  return this.filter ? Object.keys(this.filter).length > 0 : false;
1464
1537
  }
1465
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvDeploymentsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1466
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: YuvDeploymentsPageComponent, isStandalone: true, selector: "ymbpm-deployments-page", viewQueries: [{ propertyName: "deploymentDetailsComponent", first: true, predicate: DeploymentDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\"\n [columns]=\"displayedColumns\"\n [pagination]=\"pagination\"\n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedDeployment = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedDeployment ? 'inventory_2' : undefined\" [title]=\"selectedDeployment ? (selectedDeployment.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedDeployment ? selectedDeployment.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedDeployment) {\n <ymbpm-deployment-details [deploymentId]=\"selectedDeployment?.id\"></ymbpm-deployment-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$1.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: DeploymentDetailsComponent, selector: "ymbpm-deployment-details", inputs: ["deploymentId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1538
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvDeploymentsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1539
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: YuvDeploymentsPageComponent, isStandalone: true, selector: "ymbpm-deployments-page", viewQueries: [{ propertyName: "deploymentDetailsComponent", first: true, predicate: DeploymentDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\"\n [columns]=\"displayedColumns\"\n [pagination]=\"pagination\"\n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedDeployment = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedDeployment ? 'inventory_2' : undefined\" [title]=\"selectedDeployment ? (selectedDeployment.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedDeployment ? selectedDeployment.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedDeployment) {\n <ymbpm-deployment-details [deploymentId]=\"selectedDeployment?.id\"></ymbpm-deployment-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$2.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: DeploymentDetailsComponent, selector: "ymbpm-deployment-details", inputs: ["deploymentId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1467
1540
  }
1468
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvDeploymentsPageComponent, decorators: [{
1541
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvDeploymentsPageComponent, decorators: [{
1469
1542
  type: Component,
1470
1543
  args: [{ selector: 'ymbpm-deployments-page', standalone: true, imports: [
1471
1544
  CommonModule,
@@ -1512,10 +1585,10 @@ class ProcessDefinitionSummaryComponent {
1512
1585
  return `<span class="yuv-bpmn-status running">${this.#translateService.instant(ProcessDefinitionStatus.ACTIVE.label)}</span>`;
1513
1586
  }
1514
1587
  };
1515
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessDefinitionSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1516
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.11", type: ProcessDefinitionSummaryComponent, isStandalone: true, selector: "ymbpm-process-definition-summary", inputs: { processDefinition: { classPropertyName: "processDefinition", publicName: "processDefinition", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.deploymentId' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.deploymentId }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\" [innerHTML]=\"processStatusTemplate(processDefinition())\"></td>\n </tr>\n\n <tr> \n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.description' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.description || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.key' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.key || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.category' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.category || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.version' | translate }}</td>\n <td class=\"field-value\">{{ (processDefinition()?.version || '-') }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.processdefinitions.scope.global' | translate }}</td>\n <td class=\"field-value\">\n <mat-checkbox class=\"global-checkbox\" [disabled]=\"true\" [checked]=\"processDefinition()?.global\"></mat-checkbox>\n </td>\n </tr>\n\n <tr class=\"sub-row\">\n <td class=\"field-label\">\n {{'yuv.app.bpm-management.processdefinitions.details.processes'|translate}}\n </td>\n <td class=\"field-value\">\n {{(processDefinition()?.statistics?.processInstanceCount?.active || 0 )+ (processDefinition()?.statistics?.processInstanceCount?.suspended || 0) + (processDefinition()?.statistics?.processInstanceCount?.completed || 0)}}\n </td>\n </tr>\n <tr class=\"sub-row\">\n <td class=\"sub-field-label\">\n {{'yuv.app.bpm-management.status.running'|translate}}\n </td>\n <td class=\"sub-field-value\">\n {{processDefinition()?.statistics?.processInstanceCount?.active || 0}}\n </td>\n </tr>\n <tr class=\"sub-row\">\n <td class=\"sub-field-label\">\n {{'yuv.app.bpm-management.status.suspended'|translate}}\n </td>\n <td class=\"sub-field-value\">\n {{processDefinition()?.statistics?.processInstanceCount?.suspended || 0}}\n </td>\n </tr>\n <tr class=\"sub-row\">\n <td class=\"sub-field-label\">\n {{'yuv.app.bpm-management.status.completed'|translate}}\n </td>\n <td class=\"sub-field-value\">\n {{processDefinition()?.statistics?.processInstanceCount?.completed || 0}}\n </td>\n </tr>\n </tbody>\n</table>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr.sub-row{border:none}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-weight:300;font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.details-table tbody tr td.sub-field-label{padding-top:0;font-weight:300;padding-left:calc(var(--ymt-spacing-s) + 30px)}.details-table tbody tr td.sub-field-value{padding-top:0;font-weight:300;color:var(--ymt-on-surface);width:70%}::ng-deep .global-checkbox>div>div.mdc-checkbox{padding:0!important}::ng-deep .global-checkbox>div>div.mdc-checkbox>.mdc-checkbox__background{top:0!important;left:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1588
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessDefinitionSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1589
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.21", type: ProcessDefinitionSummaryComponent, isStandalone: true, selector: "ymbpm-process-definition-summary", inputs: { processDefinition: { classPropertyName: "processDefinition", publicName: "processDefinition", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.deploymentId' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.deploymentId }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\" [innerHTML]=\"processStatusTemplate(processDefinition())\"></td>\n </tr>\n\n <tr> \n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.description' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.description || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.key' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.key || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.category' | translate }}</td>\n <td class=\"field-value\">{{ processDefinition()?.category || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.version' | translate }}</td>\n <td class=\"field-value\">{{ (processDefinition()?.version || '-') }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.processdefinitions.scope.global' | translate }}</td>\n <td class=\"field-value\">\n <mat-checkbox class=\"global-checkbox\" [disabled]=\"true\" [checked]=\"processDefinition()?.global\"></mat-checkbox>\n </td>\n </tr>\n\n <tr class=\"sub-row\">\n <td class=\"field-label\">\n {{'yuv.app.bpm-management.processdefinitions.details.processes'|translate}}\n </td>\n <td class=\"field-value\">\n {{(processDefinition()?.statistics?.processInstanceCount?.active || 0 )+ (processDefinition()?.statistics?.processInstanceCount?.suspended || 0) + (processDefinition()?.statistics?.processInstanceCount?.completed || 0)}}\n </td>\n </tr>\n <tr class=\"sub-row\">\n <td class=\"sub-field-label\">\n {{'yuv.app.bpm-management.status.running'|translate}}\n </td>\n <td class=\"sub-field-value\">\n {{processDefinition()?.statistics?.processInstanceCount?.active || 0}}\n </td>\n </tr>\n <tr class=\"sub-row\">\n <td class=\"sub-field-label\">\n {{'yuv.app.bpm-management.status.suspended'|translate}}\n </td>\n <td class=\"sub-field-value\">\n {{processDefinition()?.statistics?.processInstanceCount?.suspended || 0}}\n </td>\n </tr>\n <tr class=\"sub-row\">\n <td class=\"sub-field-label\">\n {{'yuv.app.bpm-management.status.completed'|translate}}\n </td>\n <td class=\"sub-field-value\">\n {{processDefinition()?.statistics?.processInstanceCount?.completed || 0}}\n </td>\n </tr>\n </tbody>\n</table>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr.sub-row{border:none}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-weight:300;font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.details-table tbody tr td.sub-field-label{padding-top:0;font-weight:300;padding-left:calc(var(--ymt-spacing-s) + 30px)}.details-table tbody tr td.sub-field-value{padding-top:0;font-weight:300;color:var(--ymt-on-surface);width:70%}::ng-deep .global-checkbox>div>div.mdc-checkbox{padding:0!important}::ng-deep .global-checkbox>div>div.mdc-checkbox>.mdc-checkbox__background{top:0!important;left:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1517
1590
  }
1518
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessDefinitionSummaryComponent, decorators: [{
1591
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessDefinitionSummaryComponent, decorators: [{
1519
1592
  type: Component,
1520
1593
  args: [{ selector: 'ymbpm-process-definition-summary', standalone: true, imports: [
1521
1594
  CommonModule,
@@ -1564,10 +1637,10 @@ class ProcessDefinitionDetailsComponent {
1564
1637
  this.processDefinition.set(undefined);
1565
1638
  }
1566
1639
  }
1567
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessDefinitionDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1568
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: ProcessDefinitionDetailsComponent, isStandalone: true, selector: "ymbpm-process-definition-details", inputs: { processDefinitionId: { classPropertyName: "processDefinitionId", publicName: "processDefinitionId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (processDefinition()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.summary' | translate\">\n <ymbpm-process-definition-summary [processDefinition]=\"processDefinition()\"></ymbpm-process-definition-summary>\n </mat-tab>\n </mat-tab-group>\n </section>\n}\n", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.process-definition-details-card{margin-bottom:var(--ymt-spacing-m)}.process-definition-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: ProcessDefinitionSummaryComponent, selector: "ymbpm-process-definition-summary", inputs: ["processDefinition"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1640
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessDefinitionDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1641
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: ProcessDefinitionDetailsComponent, isStandalone: true, selector: "ymbpm-process-definition-details", inputs: { processDefinitionId: { classPropertyName: "processDefinitionId", publicName: "processDefinitionId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (processDefinition()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.summary' | translate\">\n <ymbpm-process-definition-summary [processDefinition]=\"processDefinition()\"></ymbpm-process-definition-summary>\n </mat-tab>\n </mat-tab-group>\n </section>\n}\n", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.process-definition-details-card{margin-bottom:var(--ymt-spacing-m)}.process-definition-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: ProcessDefinitionSummaryComponent, selector: "ymbpm-process-definition-summary", inputs: ["processDefinition"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1569
1642
  }
1570
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessDefinitionDetailsComponent, decorators: [{
1643
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessDefinitionDetailsComponent, decorators: [{
1571
1644
  type: Component,
1572
1645
  args: [{ selector: 'ymbpm-process-definition-details', standalone: true, imports: [
1573
1646
  CommonModule,
@@ -1592,10 +1665,10 @@ class CheckboxOverlayComponent {
1592
1665
  close() {
1593
1666
  this.#dialogRef.close();
1594
1667
  }
1595
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: CheckboxOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1596
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.11", type: CheckboxOverlayComponent, isStandalone: true, selector: "ymbpm-checkbox-overlay", viewQueries: [{ propertyName: "checkbox", first: true, predicate: ["checkbox"], descendants: true }], ngImport: i0, template: "<yuv-dialog [headertitel]=\"this.inputData.title ?? ''\" []>\n <main class=\"yuv-dialog-content\">\n <mat-label>{{ this.inputData.message !== undefined ? this.inputData.message : '' }}</mat-label>\n <mat-checkbox #checkbox [checked]=\"false\">{{ this.inputData.checkboxMessage !== undefined ? this.inputData.checkboxMessage : '' }}</mat-checkbox>\n </main>\n <footer>\n <button ymtButton=\"secondary\" (click)=\"close()\">\n {{ \"yuv.app.bpm-management.action.cancel.label\" | translate }}\n </button>\n <button ymtButton=\"primary\" (click)=\"confirm()\">\n {{ this.inputData.confirmBtnLabel !== undefined ? this.inputData.confirmBtnLabel : ('yuv.app.bpm-management.action.confirm.label' | translate) }}\n </button>\n </footer>\n</yuv-dialog>\n", styles: [":host{display:block;position:relative}:host main{display:flex;flex-direction:column;padding:var(--ymt-spacing-m)}::ng-deep mat-checkbox{padding:10px 0 0!important}::ng-deep mat-checkbox .mdc-checkbox{padding:0 5px 0 0!important}::ng-deep mat-checkbox .mdc-checkbox .mdc-checkbox__background{top:0!important;left:0!important}\n"], dependencies: [{ kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1668
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: CheckboxOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1669
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: CheckboxOverlayComponent, isStandalone: true, selector: "ymbpm-checkbox-overlay", viewQueries: [{ propertyName: "checkbox", first: true, predicate: ["checkbox"], descendants: true }], ngImport: i0, template: "<yuv-dialog [headertitel]=\"this.inputData.title ?? ''\" []>\n <main class=\"yuv-dialog-content\">\n <mat-label>{{ this.inputData.message !== undefined ? this.inputData.message : '' }}</mat-label>\n <mat-checkbox #checkbox [checked]=\"false\">{{ this.inputData.checkboxMessage !== undefined ? this.inputData.checkboxMessage : '' }}</mat-checkbox>\n </main>\n <footer>\n <button ymtButton=\"secondary\" (click)=\"close()\">\n {{ \"yuv.app.bpm-management.action.cancel.label\" | translate }}\n </button>\n <button ymtButton=\"primary\" (click)=\"confirm()\">\n {{ this.inputData.confirmBtnLabel !== undefined ? this.inputData.confirmBtnLabel : ('yuv.app.bpm-management.action.confirm.label' | translate) }}\n </button>\n </footer>\n</yuv-dialog>\n", styles: [":host{display:block;position:relative}:host main{display:flex;flex-direction:column;padding:var(--ymt-spacing-m)}::ng-deep mat-checkbox{padding:10px 0 0!important}::ng-deep mat-checkbox .mdc-checkbox{padding:0 5px 0 0!important}::ng-deep mat-checkbox .mdc-checkbox .mdc-checkbox__background{top:0!important;left:0!important}\n"], dependencies: [{ kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1597
1670
  }
1598
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: CheckboxOverlayComponent, decorators: [{
1671
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: CheckboxOverlayComponent, decorators: [{
1599
1672
  type: Component,
1600
1673
  args: [{ selector: 'ymbpm-checkbox-overlay', standalone: true, imports: [
1601
1674
  YmtButtonDirective,
@@ -1831,10 +1904,10 @@ class YuvProcessDefinitionsPageComponent {
1831
1904
  }
1832
1905
  });
1833
1906
  }
1834
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvProcessDefinitionsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1835
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: YuvProcessDefinitionsPageComponent, isStandalone: true, selector: "ymbpm-processdefinitions-page", viewQueries: [{ propertyName: "processDefinitionDetailsComponent", first: true, predicate: ProcessDefinitionDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }, { propertyName: "showOnlyLatestCheckbox", first: true, predicate: ["showOnlyLatestCheckbox"], descendants: true }, { propertyName: "globalTemplate", first: true, predicate: ["globalTemplate"], descendants: true, static: true }, { propertyName: "statusTemplate", first: true, predicate: ["statusTemplate"], descendants: true, static: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\"\n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableTableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onTableFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedDefinition = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedDefinition ? 'flowchart' : undefined\" [title]=\"selectedDefinition ? (selectedDefinition.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedDefinition ? selectedDefinition.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedDefinition) {\n <ymbpm-process-definition-details [processDefinitionId]=\"selectedDefinition?.id\"></ymbpm-process-definition-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"filter-actions\"> \n <mat-checkbox #showOnlyLatestCheckbox (change)=\"this.onTableFiltersChange(null)\" [checked]=\"true\">{{'yuv.app.bpm-management.processdefinitions.filter.onlyLatest' | translate}}</mat-checkbox>\n </div>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableTableFilters\" [disabled]=\"!hasActiveTableFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #listActions>\n <yuv-overflow-menu [menuItems]=\"actions\"></yuv-overflow-menu>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #globalTemplate let-processDefinition>\n @if (processDefinition.global) {\n <mat-icon [matTooltip]=\"ProcessDefinitionScope.GLOBAL.label | translate\">{{icons[ProcessDefinitionScope.GLOBAL.icon]}}</mat-icon>\n } @else {\n <mat-icon [matTooltip]=\"ProcessDefinitionScope.TENANT.label | translate\">{{icons[ProcessDefinitionScope.TENANT.icon]}}</mat-icon>\n }\n</ng-template>\n\n<ng-template #statusTemplate let-processDefinition>\n @if (processDefinition.suspended) {\n <span class=\"yuv-bpmn-status suspended\">{{ProcessDefinitionStatus.SUSPENDED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ProcessDefinitionStatus.ACTIVE.label | translate}}</span>\n }\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .table-actions{border-color:var(--ymt-outline-variant);border-width:0 0 0 1px;border-style:solid}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$1.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: i6$1.OverflowMenuComponent, selector: "yuv-overflow-menu", inputs: ["overflowIcon", "groupLabels", "menuItems", "vertical"] }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: ProcessDefinitionDetailsComponent, selector: "ymbpm-process-definition-details", inputs: ["processDefinitionId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1907
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvProcessDefinitionsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1908
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: YuvProcessDefinitionsPageComponent, isStandalone: true, selector: "ymbpm-processdefinitions-page", viewQueries: [{ propertyName: "processDefinitionDetailsComponent", first: true, predicate: ProcessDefinitionDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }, { propertyName: "showOnlyLatestCheckbox", first: true, predicate: ["showOnlyLatestCheckbox"], descendants: true }, { propertyName: "globalTemplate", first: true, predicate: ["globalTemplate"], descendants: true, static: true }, { propertyName: "statusTemplate", first: true, predicate: ["statusTemplate"], descendants: true, static: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\"\n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableTableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onTableFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedDefinition = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedDefinition ? 'flowchart' : undefined\" [title]=\"selectedDefinition ? (selectedDefinition.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedDefinition ? selectedDefinition.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedDefinition) {\n <ymbpm-process-definition-details [processDefinitionId]=\"selectedDefinition?.id\"></ymbpm-process-definition-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"filter-actions\"> \n <mat-checkbox #showOnlyLatestCheckbox (change)=\"this.onTableFiltersChange(null)\" [checked]=\"true\">{{'yuv.app.bpm-management.processdefinitions.filter.onlyLatest' | translate}}</mat-checkbox>\n </div>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableTableFilters\" [disabled]=\"!hasActiveTableFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #listActions>\n <yuv-overflow-menu [menuItems]=\"actions\"></yuv-overflow-menu>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #globalTemplate let-processDefinition>\n @if (processDefinition.global) {\n <mat-icon [matTooltip]=\"ProcessDefinitionScope.GLOBAL.label | translate\">{{icons[ProcessDefinitionScope.GLOBAL.icon]}}</mat-icon>\n } @else {\n <mat-icon [matTooltip]=\"ProcessDefinitionScope.TENANT.label | translate\">{{icons[ProcessDefinitionScope.TENANT.icon]}}</mat-icon>\n }\n</ng-template>\n\n<ng-template #statusTemplate let-processDefinition>\n @if (processDefinition.suspended) {\n <span class=\"yuv-bpmn-status suspended\">{{ProcessDefinitionStatus.SUSPENDED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ProcessDefinitionStatus.ACTIVE.label | translate}}</span>\n }\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .table-actions{border-color:var(--ymt-outline-variant);border-width:0 0 0 1px;border-style:solid}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$2.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: i6$1.OverflowMenuComponent, selector: "yuv-overflow-menu", inputs: ["overflowIcon", "groupLabels", "menuItems", "vertical"] }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: ProcessDefinitionDetailsComponent, selector: "ymbpm-process-definition-details", inputs: ["processDefinitionId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1836
1909
  }
1837
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvProcessDefinitionsPageComponent, decorators: [{
1910
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvProcessDefinitionsPageComponent, decorators: [{
1838
1911
  type: Component,
1839
1912
  args: [{ selector: 'ymbpm-processdefinitions-page', standalone: true, imports: [
1840
1913
  CommonModule,
@@ -1872,6 +1945,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
1872
1945
  args: ['statusTemplate', { static: true }]
1873
1946
  }] } });
1874
1947
 
1948
+ class UserDisplayComponent {
1949
+ idmService = inject(IdmService);
1950
+ notificationService = inject(NotificationService);
1951
+ translateService = inject(TranslateService);
1952
+ userId = input(...(ngDevMode ? [undefined, { debugName: "userId" }] : /* istanbul ignore next */ []));
1953
+ user = toSignal(toObservable(this.userId).pipe(switchMap(id => id ? this.idmService.getUserById(id) : of(null))), { initialValue: null });
1954
+ displayName = computed(() => this.user()?.getDisplayNameName() ?? this.userId() ?? '-', ...(ngDevMode ? [{ debugName: "displayName" }] : /* istanbul ignore next */ []));
1955
+ copyId(event) {
1956
+ event.stopPropagation();
1957
+ const id = this.userId();
1958
+ if (!id) {
1959
+ return;
1960
+ }
1961
+ navigator.clipboard.writeText(id).then(() => {
1962
+ this.notificationService.success(this.translateService.instant('yuv.app.bpm-management.user.copyId.success', { name: this.displayName() }));
1963
+ });
1964
+ }
1965
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: UserDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1966
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: UserDisplayComponent, isStandalone: true, selector: "ymbpm-user-display", inputs: { userId: { classPropertyName: "userId", publicName: "userId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (userId()) {\n <span class=\"user-display\">\n <span class=\"user-name\">{{ displayName() }}</span>\n <button mat-icon-button\n type=\"button\"\n class=\"copy-id-btn\"\n (click)=\"copyId($event)\"\n [matTooltip]=\"'yuv.app.bpm-management.user.copyId.tooltip' | translate\">\n <mat-icon>content_copy</mat-icon>\n </button>\n </span>\n} @else {\n <span>-</span>\n}\n", styles: [":host{display:inline-flex;align-items:center;vertical-align:middle}.user-display{display:inline-flex;align-items:center;gap:6px}.copy-id-btn{--mat-icon-button-state-layer-size: 20px;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;flex-shrink:0;vertical-align:middle}.copy-id-btn mat-icon{display:flex;align-items:center;justify-content:center;font-size:14px;width:14px;height:14px;line-height:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
1967
+ }
1968
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: UserDisplayComponent, decorators: [{
1969
+ type: Component,
1970
+ args: [{ selector: 'ymbpm-user-display', standalone: true, imports: [
1971
+ CommonModule,
1972
+ MatIconModule,
1973
+ MatButtonModule,
1974
+ MatTooltipModule,
1975
+ TranslatePipe
1976
+ ], template: "@if (userId()) {\n <span class=\"user-display\">\n <span class=\"user-name\">{{ displayName() }}</span>\n <button mat-icon-button\n type=\"button\"\n class=\"copy-id-btn\"\n (click)=\"copyId($event)\"\n [matTooltip]=\"'yuv.app.bpm-management.user.copyId.tooltip' | translate\">\n <mat-icon>content_copy</mat-icon>\n </button>\n </span>\n} @else {\n <span>-</span>\n}\n", styles: [":host{display:inline-flex;align-items:center;vertical-align:middle}.user-display{display:inline-flex;align-items:center;gap:6px}.copy-id-btn{--mat-icon-button-state-layer-size: 20px;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;flex-shrink:0;vertical-align:middle}.copy-id-btn mat-icon{display:flex;align-items:center;justify-content:center;font-size:14px;width:14px;height:14px;line-height:14px}\n"] }]
1977
+ }], propDecorators: { userId: [{ type: i0.Input, args: [{ isSignal: true, alias: "userId", required: false }] }] } });
1978
+
1875
1979
  class ProcessSummaryComponent {
1876
1980
  #translateService = inject(TranslateService);
1877
1981
  process = input(...(ngDevMode ? [undefined, { debugName: "process" }] : /* istanbul ignore next */ []));
@@ -1893,10 +1997,10 @@ class ProcessSummaryComponent {
1893
1997
  return `<span class="yuv-bpmn-status running">${this.#translateService.instant(ProcessStatus.RUNNING.label)}</span>`;
1894
1998
  }
1895
1999
  };
1896
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1897
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: ProcessSummaryComponent, isStandalone: true, selector: "ymbpm-process-summary", inputs: { process: { classPropertyName: "process", publicName: "process", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.processDefinitionId' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionId }}</td>\n </tr>\n \n @if (process()?.processDefinitionDescription) {\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.process.details.processDefinitionDescription' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionDescription }}</td>\n </tr>\n }\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\" [innerHTML]=\"processStatusTemplate(process())\"></td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.businessKey' | translate }}</td>\n <td class=\"field-value\">{{ process()?.businessKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startedBy' | translate }}</td>\n <td class=\"field-value\">{{ process()?.startUserId || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.startTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n </tbody>\n</table>\n\n<div class=\"variables-section\">\n <h3 class=\"variables-title\">{{ 'yuv.app.bpm-management.details.variables' | translate }}</h3>\n\n <p *ngIf=\"!process()?.variables || process()?.variables?.length === 0\" class=\"no-variables-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n </p>\n <table class=\"variables-table\" *ngIf=\"process()?.variables && process()?.variables?.length! > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.details.variableName' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableType' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableValue' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (variable of process()!.variables; track variable.name) {\n <tr>\n <td class=\"variable-name\">{{ variable.name }}</td>\n <td class=\"variable-type\">{{ variable.type }}</td>\n <td class=\"variable-value\">{{ variable.value }}</td>\n </tr>\n }\n </tbody>\n </table>\n</div>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:800;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);padding-left:5px}.variables-section .no-variables-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
2000
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2001
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: ProcessSummaryComponent, isStandalone: true, selector: "ymbpm-process-summary", inputs: { process: { classPropertyName: "process", publicName: "process", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.processDefinitionId' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionId }}</td>\n </tr>\n \n @if (process()?.processDefinitionDescription) {\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.process.details.processDefinitionDescription' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionDescription }}</td>\n </tr>\n }\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\" [innerHTML]=\"processStatusTemplate(process())\"></td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.businessKey' | translate }}</td>\n <td class=\"field-value\">{{ process()?.businessKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startedBy' | translate }}</td>\n <td class=\"field-value\"><ymbpm-user-display [userId]=\"process()?.startUserId\"></ymbpm-user-display></td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.startTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n </tbody>\n</table>\n\n<div class=\"variables-section\">\n <h3 class=\"variables-title\">{{ 'yuv.app.bpm-management.details.variables' | translate }}</h3>\n\n <p *ngIf=\"!process()?.variables || process()?.variables?.length === 0\" class=\"no-variables-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n </p>\n <table class=\"variables-table\" *ngIf=\"process()?.variables && process()?.variables?.length! > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.details.variableName' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableType' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableValue' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (variable of process()!.variables; track variable.name) {\n <tr>\n <td class=\"variable-name\">{{ variable.name }}</td>\n <td class=\"variable-type\">{{ variable.type }}</td>\n <td class=\"variable-value\">{{ variable.value }}</td>\n </tr>\n }\n </tbody>\n </table>\n</div>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:800;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);padding-left:5px}.variables-section .no-variables-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: UserDisplayComponent, selector: "ymbpm-user-display", inputs: ["userId"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
1898
2002
  }
1899
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessSummaryComponent, decorators: [{
2003
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessSummaryComponent, decorators: [{
1900
2004
  type: Component,
1901
2005
  args: [{ selector: 'ymbpm-process-summary', standalone: true, imports: [
1902
2006
  CommonModule,
@@ -1906,8 +2010,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
1906
2010
  MatIconModule,
1907
2011
  MatTooltipModule,
1908
2012
  TranslatePipe,
1909
- FormatDateTimePipe
1910
- ], template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.processDefinitionId' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionId }}</td>\n </tr>\n \n @if (process()?.processDefinitionDescription) {\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.process.details.processDefinitionDescription' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionDescription }}</td>\n </tr>\n }\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\" [innerHTML]=\"processStatusTemplate(process())\"></td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.businessKey' | translate }}</td>\n <td class=\"field-value\">{{ process()?.businessKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startedBy' | translate }}</td>\n <td class=\"field-value\">{{ process()?.startUserId || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.startTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n </tbody>\n</table>\n\n<div class=\"variables-section\">\n <h3 class=\"variables-title\">{{ 'yuv.app.bpm-management.details.variables' | translate }}</h3>\n\n <p *ngIf=\"!process()?.variables || process()?.variables?.length === 0\" class=\"no-variables-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n </p>\n <table class=\"variables-table\" *ngIf=\"process()?.variables && process()?.variables?.length! > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.details.variableName' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableType' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableValue' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (variable of process()!.variables; track variable.name) {\n <tr>\n <td class=\"variable-name\">{{ variable.name }}</td>\n <td class=\"variable-type\">{{ variable.type }}</td>\n <td class=\"variable-value\">{{ variable.value }}</td>\n </tr>\n }\n </tbody>\n </table>\n</div>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:800;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);padding-left:5px}.variables-section .no-variables-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"] }]
2013
+ FormatDateTimePipe,
2014
+ UserDisplayComponent
2015
+ ], template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.processDefinitionId' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionId }}</td>\n </tr>\n \n @if (process()?.processDefinitionDescription) {\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.process.details.processDefinitionDescription' | translate }}</td>\n <td class=\"field-value\">{{ process()?.processDefinitionDescription }}</td>\n </tr>\n }\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\" [innerHTML]=\"processStatusTemplate(process())\"></td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.businessKey' | translate }}</td>\n <td class=\"field-value\">{{ process()?.businessKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startedBy' | translate }}</td>\n <td class=\"field-value\"><ymbpm-user-display [userId]=\"process()?.startUserId\"></ymbpm-user-display></td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.startTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.startTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((process()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n </tbody>\n</table>\n\n<div class=\"variables-section\">\n <h3 class=\"variables-title\">{{ 'yuv.app.bpm-management.details.variables' | translate }}</h3>\n\n <p *ngIf=\"!process()?.variables || process()?.variables?.length === 0\" class=\"no-variables-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n </p>\n <table class=\"variables-table\" *ngIf=\"process()?.variables && process()?.variables?.length! > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.details.variableName' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableType' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.details.variableValue' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (variable of process()!.variables; track variable.name) {\n <tr>\n <td class=\"variable-name\">{{ variable.name }}</td>\n <td class=\"variable-type\">{{ variable.type }}</td>\n <td class=\"variable-value\">{{ variable.value }}</td>\n </tr>\n }\n </tbody>\n </table>\n</div>", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;width:30%;word-break:break-word}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:70%}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:800;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);padding-left:5px}.variables-section .no-variables-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"] }]
1911
2016
  }], propDecorators: { process: [{ type: i0.Input, args: [{ isSignal: true, alias: "process", required: false }] }] } });
1912
2017
 
1913
2018
  class ProcessTasksComponent {
@@ -1917,10 +2022,10 @@ class ProcessTasksComponent {
1917
2022
  icons = {
1918
2023
  ...APP_ICONS
1919
2024
  };
1920
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessTasksComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1921
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: ProcessTasksComponent, isStandalone: true, selector: "ymbpm-process-tasks", inputs: { tasks: { classPropertyName: "tasks", publicName: "tasks", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p *ngIf=\"!tasks() || tasks().length === 0\" class=\"no-tasks-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<table class=\"tasks-table\" *ngIf=\"tasks() && tasks().length > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.header.id' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.name' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.assignee' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.owner' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.createTime' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.endTime' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (task of tasks(); track task) {\n <tr>\n <td class=\"task-id\">{{ task.id }}</td>\n <td class=\"task-name\">{{ task.name }}</td>\n <td class=\"task-assignee\">{{ task.assignee }}</td>\n <td class=\"task-owner\">{{ task.owner }}</td>\n <td class=\"task-createTime\">{{ task.createTime | formatDateTime }}</td>\n <td class=\"task-endTime\">{{ task.endTime | formatDateTime }}</td>\n </tr>\n }\n </tbody>\n </table>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .no-tasks-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .tasks-table{width:100%;table-layout:fixed;border-collapse:collapse;font-family:monospace;font-size:.875rem}:host .tasks-table thead{background-color:var(--ymt-surface-container)}:host .tasks-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .tasks-table thead th:nth-child(1){width:20%}:host .tasks-table thead th:nth-child(2){width:16%}:host .tasks-table thead th:nth-child(3){width:16%}:host .tasks-table thead th:nth-child(4){width:16%}:host .tasks-table thead th:nth-child(5){width:16%}:host .tasks-table thead th:nth-child(6){width:16%}:host .tasks-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}:host .tasks-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}:host .tasks-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}:host .tasks-table tbody tr td.task-id,:host .tasks-table tbody tr td.task-name,:host .tasks-table tbody tr td.task-assignee,:host .tasks-table tbody tr td.task-owner,:host .tasks-table tbody tr td.task-createTime,:host .tasks-table tbody tr td.task-endTime{font-weight:600;word-break:break-word;overflow-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
2025
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessTasksComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2026
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: ProcessTasksComponent, isStandalone: true, selector: "ymbpm-process-tasks", inputs: { tasks: { classPropertyName: "tasks", publicName: "tasks", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p *ngIf=\"!tasks() || tasks().length === 0\" class=\"no-tasks-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<table class=\"tasks-table\" *ngIf=\"tasks() && tasks().length > 0\">\n <thead>\n <tr>\n <th>{{ 'yuv.app.bpm-management.header.id' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.name' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.assignee' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.owner' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.createTime' | translate }}</th>\n <th>{{ 'yuv.app.bpm-management.header.endTime' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n @for (task of tasks(); track task) {\n <tr>\n <td class=\"task-id\">{{ task.id }}</td>\n <td class=\"task-name\">{{ task.name }}</td>\n <td class=\"task-assignee\">{{ task.assignee }}</td>\n <td class=\"task-owner\">{{ task.owner }}</td>\n <td class=\"task-createTime\">{{ task.createTime | formatDateTime }}</td>\n <td class=\"task-endTime\">{{ task.endTime | formatDateTime }}</td>\n </tr>\n }\n </tbody>\n </table>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .no-tasks-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .tasks-table{width:100%;table-layout:fixed;border-collapse:collapse;font-family:monospace;font-size:.875rem}:host .tasks-table thead{background-color:var(--ymt-surface-container)}:host .tasks-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .tasks-table thead th:nth-child(1){width:20%}:host .tasks-table thead th:nth-child(2){width:16%}:host .tasks-table thead th:nth-child(3){width:16%}:host .tasks-table thead th:nth-child(4){width:16%}:host .tasks-table thead th:nth-child(5){width:16%}:host .tasks-table thead th:nth-child(6){width:16%}:host .tasks-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}:host .tasks-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}:host .tasks-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}:host .tasks-table tbody tr td.task-id,:host .tasks-table tbody tr td.task-name,:host .tasks-table tbody tr td.task-assignee,:host .tasks-table tbody tr td.task-owner,:host .tasks-table tbody tr td.task-createTime,:host .tasks-table tbody tr td.task-endTime{font-weight:600;word-break:break-word;overflow-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
1922
2027
  }
1923
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessTasksComponent, decorators: [{
2028
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessTasksComponent, decorators: [{
1924
2029
  type: Component,
1925
2030
  args: [{ selector: 'ymbpm-process-tasks', standalone: true, imports: [
1926
2031
  CommonModule,
@@ -1944,10 +2049,10 @@ class ProcessHistoryComponent {
1944
2049
  icons = {
1945
2050
  ...APP_ICONS
1946
2051
  };
1947
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1948
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.11", type: ProcessHistoryComponent, isStandalone: true, selector: "ymbpm-process-history", inputs: { tasks: { classPropertyName: "tasks", publicName: "tasks", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p *ngIf=\"!tasks() || tasks().length === 0\" class=\"no-tasks-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<div class=\"process-history-container\">\n <div class=\"timeline-container\" *ngIf=\"tasks() && tasks().length > 0\" [ngClass]=\"{singleEntry: tasks().length === 1}\">\n <div class=\"timeline-item\" *ngFor=\"let task of tasks()\">\n <div class=\"timeline-datetime\" [matTooltip]=\"'yuv.app.bpm-management.header.startTime' | translate\">\n <div class=\"date\">{{ formatDateTime(task.createTime, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(task.createTime, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"task-card\">\n <div class=\"task-title\" [matTooltip]=\"'yuv.app.bpm-management.header.name' | translate\">{{ task.name || '&lt;unnamed&gt;' }}</div>\n <div class=\"task-details\">\n <div class=\"task-assignee\" [matTooltip]=\"'yuv.app.bpm-management.header.assignee' | translate\">\n <mat-icon>person</mat-icon>\n <span>{{ task.assignee || '-'}}</span>\n </div>\n <div class=\"task-owner\" *ngIf=\"task.owner\" [matTooltip]=\"'yuv.app.bpm-management.header.owner' | translate\">\n <mat-icon>supervisor_account</mat-icon>\n <span>{{ task.owner }}</span>\n </div>\n <div class=\"task-endtime\" *ngIf=\"task.endTime\" [matTooltip]=\"'yuv.app.bpm-management.header.endTime' | translate\">\n <mat-icon>event_available</mat-icon>\n <span>{{ task.endTime | formatDateTime }}</span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .process-history-container{max-width:800px;margin:0 auto}:host .no-tasks-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:5px 0}:host .timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}:host .timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}:host .timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}:host .timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}:host .timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}:host .timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}:host .timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}:host .timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}:host .timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}:host .timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}:host .timeline-container .timeline-item .timeline-content .task-card{width:100%;min-width:300px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-xs) var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}:host .timeline-container .timeline-item .timeline-content .task-card .task-title{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--ymt-spacing-2xs)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);color:var(--ymt-on-surface)}:is(:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime) mat-icon{font-size:14px;width:14px;height:14px}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee mat-icon,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner mat-icon{color:var(--ymt-primary)}@media(max-width:600px){:host .timeline-date{flex:0 0 100px;font-size:11px}:host .timeline-content{padding-left:12px}:host .task-card{padding:10px 12px}:host .task-title{font-size:13px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
2052
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2053
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.21", type: ProcessHistoryComponent, isStandalone: true, selector: "ymbpm-process-history", inputs: { tasks: { classPropertyName: "tasks", publicName: "tasks", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<p *ngIf=\"!tasks() || tasks().length === 0\" class=\"no-tasks-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<div class=\"process-history-container\">\n <div class=\"timeline-container\" *ngIf=\"tasks() && tasks().length > 0\" [ngClass]=\"{singleEntry: tasks().length === 1}\">\n <div class=\"timeline-item\" *ngFor=\"let task of tasks()\">\n <div class=\"timeline-datetime\" [matTooltip]=\"'yuv.app.bpm-management.header.startTime' | translate\">\n <div class=\"date\">{{ formatDateTime(task.createTime, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(task.createTime, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"task-card\">\n <div class=\"task-title\" [matTooltip]=\"'yuv.app.bpm-management.header.name' | translate\">{{ task.name || '&lt;unnamed&gt;' }}</div>\n <div class=\"task-details\">\n <div class=\"task-assignee\" [matTooltip]=\"'yuv.app.bpm-management.header.assignee' | translate\">\n <mat-icon>person</mat-icon>\n <ymbpm-user-display [userId]=\"task.assignee\"></ymbpm-user-display>\n </div>\n <div class=\"task-owner\" *ngIf=\"task.owner\" [matTooltip]=\"'yuv.app.bpm-management.header.owner' | translate\">\n <mat-icon>supervisor_account</mat-icon>\n <ymbpm-user-display [userId]=\"task.owner\"></ymbpm-user-display>\n </div>\n <div class=\"task-endtime\" *ngIf=\"task.endTime\" [matTooltip]=\"'yuv.app.bpm-management.header.endTime' | translate\">\n <mat-icon>event_available</mat-icon>\n <span>{{ task.endTime | formatDateTime }}</span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .process-history-container{max-width:800px;margin:0 auto}:host .no-tasks-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:5px 0}:host .timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}:host .timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}:host .timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}:host .timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}:host .timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}:host .timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}:host .timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}:host .timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}:host .timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}:host .timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}:host .timeline-container .timeline-item .timeline-content .task-card{width:100%;min-width:300px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-xs) var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}:host .timeline-container .timeline-item .timeline-content .task-card .task-title{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--ymt-spacing-2xs)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);color:var(--ymt-on-surface)}:is(:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime) mat-icon{font-size:14px;width:14px;height:14px}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee mat-icon,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner mat-icon{color:var(--ymt-primary)}@media(max-width:600px){:host .timeline-date{flex:0 0 100px;font-size:11px}:host .timeline-content{padding-left:12px}:host .task-card{padding:10px 12px}:host .task-title{font-size:13px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: UserDisplayComponent, selector: "ymbpm-user-display", inputs: ["userId"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
1949
2054
  }
1950
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessHistoryComponent, decorators: [{
2055
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessHistoryComponent, decorators: [{
1951
2056
  type: Component,
1952
2057
  args: [{ selector: 'ymbpm-process-history', standalone: true, imports: [
1953
2058
  CommonModule,
@@ -1957,8 +2062,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
1957
2062
  MatIconModule,
1958
2063
  MatTooltipModule,
1959
2064
  TranslatePipe,
1960
- FormatDateTimePipe
1961
- ], template: "<p *ngIf=\"!tasks() || tasks().length === 0\" class=\"no-tasks-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<div class=\"process-history-container\">\n <div class=\"timeline-container\" *ngIf=\"tasks() && tasks().length > 0\" [ngClass]=\"{singleEntry: tasks().length === 1}\">\n <div class=\"timeline-item\" *ngFor=\"let task of tasks()\">\n <div class=\"timeline-datetime\" [matTooltip]=\"'yuv.app.bpm-management.header.startTime' | translate\">\n <div class=\"date\">{{ formatDateTime(task.createTime, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(task.createTime, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"task-card\">\n <div class=\"task-title\" [matTooltip]=\"'yuv.app.bpm-management.header.name' | translate\">{{ task.name || '&lt;unnamed&gt;' }}</div>\n <div class=\"task-details\">\n <div class=\"task-assignee\" [matTooltip]=\"'yuv.app.bpm-management.header.assignee' | translate\">\n <mat-icon>person</mat-icon>\n <span>{{ task.assignee || '-'}}</span>\n </div>\n <div class=\"task-owner\" *ngIf=\"task.owner\" [matTooltip]=\"'yuv.app.bpm-management.header.owner' | translate\">\n <mat-icon>supervisor_account</mat-icon>\n <span>{{ task.owner }}</span>\n </div>\n <div class=\"task-endtime\" *ngIf=\"task.endTime\" [matTooltip]=\"'yuv.app.bpm-management.header.endTime' | translate\">\n <mat-icon>event_available</mat-icon>\n <span>{{ task.endTime | formatDateTime }}</span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .process-history-container{max-width:800px;margin:0 auto}:host .no-tasks-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:5px 0}:host .timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}:host .timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}:host .timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}:host .timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}:host .timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}:host .timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}:host .timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}:host .timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}:host .timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}:host .timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}:host .timeline-container .timeline-item .timeline-content .task-card{width:100%;min-width:300px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-xs) var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}:host .timeline-container .timeline-item .timeline-content .task-card .task-title{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--ymt-spacing-2xs)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);color:var(--ymt-on-surface)}:is(:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime) mat-icon{font-size:14px;width:14px;height:14px}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee mat-icon,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner mat-icon{color:var(--ymt-primary)}@media(max-width:600px){:host .timeline-date{flex:0 0 100px;font-size:11px}:host .timeline-content{padding-left:12px}:host .task-card{padding:10px 12px}:host .task-title{font-size:13px}}\n"] }]
2065
+ FormatDateTimePipe,
2066
+ UserDisplayComponent
2067
+ ], template: "<p *ngIf=\"!tasks() || tasks().length === 0\" class=\"no-tasks-label\">\n {{ 'yuv.app.bpm-management.emptyResult' | translate }}\n</p>\n\n<div class=\"process-history-container\">\n <div class=\"timeline-container\" *ngIf=\"tasks() && tasks().length > 0\" [ngClass]=\"{singleEntry: tasks().length === 1}\">\n <div class=\"timeline-item\" *ngFor=\"let task of tasks()\">\n <div class=\"timeline-datetime\" [matTooltip]=\"'yuv.app.bpm-management.header.startTime' | translate\">\n <div class=\"date\">{{ formatDateTime(task.createTime, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(task.createTime, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"task-card\">\n <div class=\"task-title\" [matTooltip]=\"'yuv.app.bpm-management.header.name' | translate\">{{ task.name || '&lt;unnamed&gt;' }}</div>\n <div class=\"task-details\">\n <div class=\"task-assignee\" [matTooltip]=\"'yuv.app.bpm-management.header.assignee' | translate\">\n <mat-icon>person</mat-icon>\n <ymbpm-user-display [userId]=\"task.assignee\"></ymbpm-user-display>\n </div>\n <div class=\"task-owner\" *ngIf=\"task.owner\" [matTooltip]=\"'yuv.app.bpm-management.header.owner' | translate\">\n <mat-icon>supervisor_account</mat-icon>\n <ymbpm-user-display [userId]=\"task.owner\"></ymbpm-user-display>\n </div>\n <div class=\"task-endtime\" *ngIf=\"task.endTime\" [matTooltip]=\"'yuv.app.bpm-management.header.endTime' | translate\">\n <mat-icon>event_available</mat-icon>\n <span>{{ task.endTime | formatDateTime }}</span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: [":host{display:block;height:100%;overflow-y:auto}:host .process-history-container{max-width:800px;margin:0 auto}:host .no-tasks-label{text-align:center;color:var(--ymt-on-surface);font-style:italic;margin:32px 0}:host .timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:5px 0}:host .timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}:host .timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}:host .timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}:host .timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}:host .timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}:host .timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}:host .timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}:host .timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}:host .timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}:host .timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}:host .timeline-container .timeline-item .timeline-content .task-card{width:100%;min-width:300px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-xs) var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}:host .timeline-container .timeline-item .timeline-content .task-card .task-title{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--ymt-spacing-2xs)}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);color:var(--ymt-on-surface)}:is(:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-endtime) mat-icon{font-size:14px;width:14px;height:14px}:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-assignee mat-icon,:host .timeline-container .timeline-item .timeline-content .task-card .task-details .task-owner mat-icon{color:var(--ymt-primary)}@media(max-width:600px){:host .timeline-date{flex:0 0 100px;font-size:11px}:host .timeline-content{padding-left:12px}:host .task-card{padding:10px 12px}:host .task-title{font-size:13px}}\n"] }]
1962
2068
  }], propDecorators: { tasks: [{ type: i0.Input, args: [{ isSignal: true, alias: "tasks", required: false }] }] } });
1963
2069
 
1964
2070
  class ProcessDetailsComponent {
@@ -2004,10 +2110,10 @@ class ProcessDetailsComponent {
2004
2110
  this.process.set(undefined);
2005
2111
  }
2006
2112
  }
2007
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2008
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: ProcessDetailsComponent, isStandalone: true, selector: "ymbpm-process-details", inputs: { processInstanceId: { classPropertyName: "processInstanceId", publicName: "processInstanceId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (process() && tasks()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.summary' | translate\">\n <ymbpm-process-summary [process]=\"process()\"></ymbpm-process-summary>\n </mat-tab>\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.tasks' | translate\">\n <ymbpm-process-tasks [tasks]=\"tasks()\"></ymbpm-process-tasks>\n </mat-tab>\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.history' | translate\">\n <ymbpm-process-history [tasks]=\"tasks()\"></ymbpm-process-history>\n </mat-tab>\n </mat-tab-group>\n </section>\n}", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.process-details-card{margin-bottom:var(--ymt-spacing-m)}.process-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: ProcessSummaryComponent, selector: "ymbpm-process-summary", inputs: ["process"] }, { kind: "component", type: ProcessTasksComponent, selector: "ymbpm-process-tasks", inputs: ["tasks"] }, { kind: "component", type: ProcessHistoryComponent, selector: "ymbpm-process-history", inputs: ["tasks"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2113
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2114
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: ProcessDetailsComponent, isStandalone: true, selector: "ymbpm-process-details", inputs: { processInstanceId: { classPropertyName: "processInstanceId", publicName: "processInstanceId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (process() && tasks()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.summary' | translate\">\n <ymbpm-process-summary [process]=\"process()\"></ymbpm-process-summary>\n </mat-tab>\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.tasks' | translate\">\n <ymbpm-process-tasks [tasks]=\"tasks()\"></ymbpm-process-tasks>\n </mat-tab>\n <mat-tab [label]=\"'yuv.app.bpm-management.tabs.history' | translate\">\n <ymbpm-process-history [tasks]=\"tasks()\"></ymbpm-process-history>\n </mat-tab>\n </mat-tab-group>\n </section>\n}", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.process-details-card{margin-bottom:var(--ymt-spacing-m)}.process-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: ProcessSummaryComponent, selector: "ymbpm-process-summary", inputs: ["process"] }, { kind: "component", type: ProcessTasksComponent, selector: "ymbpm-process-tasks", inputs: ["tasks"] }, { kind: "component", type: ProcessHistoryComponent, selector: "ymbpm-process-history", inputs: ["tasks"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2009
2115
  }
2010
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ProcessDetailsComponent, decorators: [{
2116
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: ProcessDetailsComponent, decorators: [{
2011
2117
  type: Component,
2012
2118
  args: [{ selector: 'ymbpm-process-details', standalone: true, imports: [
2013
2119
  CommonModule,
@@ -2032,6 +2138,7 @@ class YuvProcessesPageComponent {
2032
2138
  processDetailsComponent;
2033
2139
  bpmTableComponent;
2034
2140
  statusTemplate;
2141
+ userTemplate;
2035
2142
  ProcessStatus = ProcessStatus;
2036
2143
  pagination = {
2037
2144
  total: 0,
@@ -2080,9 +2187,9 @@ class YuvProcessesPageComponent {
2080
2187
  {
2081
2188
  name: 'startUserId',
2082
2189
  displayName: 'yuv.app.bpm-management.header.startedBy',
2190
+ template: this.userTemplate,
2083
2191
  filter: {
2084
- type: FILTER_TYPES.TEXT,
2085
- operators: [FILTER_OPERATORS.EQUALS]
2192
+ type: FILTER_TYPES.USER
2086
2193
  }
2087
2194
  },
2088
2195
  {
@@ -2171,10 +2278,10 @@ class YuvProcessesPageComponent {
2171
2278
  this.enableDetails.set(true);
2172
2279
  }
2173
2280
  }
2174
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvProcessesPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2175
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: YuvProcessesPageComponent, isStandalone: true, selector: "ymbpm-processes-page", viewQueries: [{ propertyName: "processDetailsComponent", first: true, predicate: ProcessDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }, { propertyName: "statusTemplate", first: true, predicate: ["statusTemplate"], descendants: true, static: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedProcess = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedProcess ? 'timeline' : undefined\" [title]=\"selectedProcess ? (selectedProcess.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedProcess ? selectedProcess.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedProcess) {\n <ymbpm-process-details [processInstanceId]=\"selectedProcess?.id\"></ymbpm-process-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-process>\n @if (process.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ProcessStatus.COMPLETED.label | translate}}</span>\n } @else if (process.suspended) {\n <span class=\"yuv-bpmn-status suspended\">{{ProcessStatus.SUSPENDED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ProcessStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$1.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "component", type: ProcessDetailsComponent, selector: "ymbpm-process-details", inputs: ["processInstanceId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2281
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvProcessesPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2282
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: YuvProcessesPageComponent, isStandalone: true, selector: "ymbpm-processes-page", viewQueries: [{ propertyName: "processDetailsComponent", first: true, predicate: ProcessDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }, { propertyName: "statusTemplate", first: true, predicate: ["statusTemplate"], descendants: true, static: true }, { propertyName: "userTemplate", first: true, predicate: ["userTemplate"], descendants: true, static: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedProcess = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedProcess ? 'timeline' : undefined\" [title]=\"selectedProcess ? (selectedProcess.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedProcess ? selectedProcess.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedProcess) {\n <ymbpm-process-details [processInstanceId]=\"selectedProcess?.id\"></ymbpm-process-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-process>\n @if (process.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ProcessStatus.COMPLETED.label | translate}}</span>\n } @else if (process.suspended) {\n <span class=\"yuv-bpmn-status suspended\">{{ProcessStatus.SUSPENDED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ProcessStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>\n\n<ng-template #userTemplate let-process>\n <ymbpm-user-display [userId]=\"process.startUserId\"></ymbpm-user-display>\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$2.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "component", type: ProcessDetailsComponent, selector: "ymbpm-process-details", inputs: ["processInstanceId"] }, { kind: "component", type: UserDisplayComponent, selector: "ymbpm-user-display", inputs: ["userId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2176
2283
  }
2177
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvProcessesPageComponent, decorators: [{
2284
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvProcessesPageComponent, decorators: [{
2178
2285
  type: Component,
2179
2286
  args: [{ selector: 'ymbpm-processes-page', standalone: true, imports: [
2180
2287
  CommonModule,
@@ -2191,9 +2298,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
2191
2298
  YuvOverflowMenuModule,
2192
2299
  BpmTableComponent,
2193
2300
  ProcessDetailsComponent,
2301
+ UserDisplayComponent,
2194
2302
  YmtLayoutModule,
2195
2303
  YmtPanesModule
2196
- ], template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedProcess = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedProcess ? 'timeline' : undefined\" [title]=\"selectedProcess ? (selectedProcess.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedProcess ? selectedProcess.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedProcess) {\n <ymbpm-process-details [processInstanceId]=\"selectedProcess?.id\"></ymbpm-process-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-process>\n @if (process.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ProcessStatus.COMPLETED.label | translate}}</span>\n } @else if (process.suspended) {\n <span class=\"yuv-bpmn-status suspended\">{{ProcessStatus.SUSPENDED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ProcessStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"] }]
2304
+ ], template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [busy]=\"busy()\"\n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n\n <ng-template ymtLayoutPane role=\"details\">\n @let selectedProcess = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedProcess ? 'timeline' : undefined\" [title]=\"selectedProcess ? (selectedProcess.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedProcess ? selectedProcess.id : ''\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedProcess) {\n <ymbpm-process-details [processInstanceId]=\"selectedProcess?.id\"></ymbpm-process-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-process>\n @if (process.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ProcessStatus.COMPLETED.label | translate}}</span>\n } @else if (process.suspended) {\n <span class=\"yuv-bpmn-status suspended\">{{ProcessStatus.SUSPENDED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ProcessStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>\n\n<ng-template #userTemplate let-process>\n <ymbpm-user-display [userId]=\"process.startUserId\"></ymbpm-user-display>\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"] }]
2197
2305
  }], propDecorators: { processDetailsComponent: [{
2198
2306
  type: ViewChild,
2199
2307
  args: [ProcessDetailsComponent]
@@ -2203,6 +2311,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
2203
2311
  }], statusTemplate: [{
2204
2312
  type: ViewChild,
2205
2313
  args: ['statusTemplate', { static: true }]
2314
+ }], userTemplate: [{
2315
+ type: ViewChild,
2316
+ args: ['userTemplate', { static: true }]
2206
2317
  }] } });
2207
2318
 
2208
2319
  class TaskSummaryComponent {
@@ -2212,10 +2323,10 @@ class TaskSummaryComponent {
2212
2323
  icons = {
2213
2324
  ...APP_ICONS
2214
2325
  };
2215
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TaskSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2216
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: TaskSummaryComponent, isStandalone: true, selector: "ymbpm-task-summary", inputs: { task: { classPropertyName: "task", publicName: "task", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceId' | translate }}</td>\n <td class=\"field-value\">{{ task()?.processInstanceId }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceName' | translate }}</td>\n <td class=\"field-value\">{{ task()?.processInstanceName || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\">\n @if (task()?.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ 'yuv.app.bpm-management.status.completed' | translate }}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ 'yuv.app.bpm-management.status.running' | translate }}</span>\n }\n @if (task()?.delegationState) {\n @if (task()?.delegationState === 'pending') {\n <span class=\"yuv-bpmn-status running\">\n <mat-icon>{{ icons.delegated }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.pending' | translate }}\n </span>\n } @else {\n <span class=\"yuv-bpmn-status completed\">\n <mat-icon>{{ icons.resolved }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.resolved' | translate }}\n </span>\n }\n }\n </td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.description' | translate }}</td>\n <td class=\"field-value\">{{ task()?.description || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}</td>\n <td class=\"field-value\">{{ task()?.assignee || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}</td>\n <td class=\"field-value\">{{ task()?.owner || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.taskDefinitionKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.taskDefinitionKey }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.formKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.formKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.createTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.createTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.claimTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.claimTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.dueDate' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.dueDate ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n </tbody>\n</table>\n", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;word-break:break-word;width:20%}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:80%}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status{margin-right:5px;display:inline-flex;align-items:center;gap:4px;vertical-align:middle}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:500;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);font-weight:700}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
2326
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2327
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: TaskSummaryComponent, isStandalone: true, selector: "ymbpm-task-summary", inputs: { task: { classPropertyName: "task", publicName: "task", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceId' | translate }}</td>\n <td class=\"field-value\">\n @if (task()?.processInstanceId) {\n {{ task()?.processInstanceId }}\n } @else {\n <span class=\"standalone-task-indicator\">\n <span>-</span>\n <mat-icon [matTooltip]=\"'yuv.app.bpm-management.task.details.standaloneTask.tooltip' | translate\">{{ icons.info }}</mat-icon>\n </span>\n }\n </td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceName' | translate }}</td>\n <td class=\"field-value\">{{ task()?.processInstanceName || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\">\n @if (task()?.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ 'yuv.app.bpm-management.status.completed' | translate }}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ 'yuv.app.bpm-management.status.running' | translate }}</span>\n }\n @if (task()?.delegationState) {\n @if (task()?.delegationState === 'pending') {\n <span class=\"yuv-bpmn-status running\">\n <mat-icon>{{ icons.delegated }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.pending' | translate }}\n </span>\n } @else {\n <span class=\"yuv-bpmn-status completed\">\n <mat-icon>{{ icons.resolved }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.resolved' | translate }}\n </span>\n }\n }\n </td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.description' | translate }}</td>\n <td class=\"field-value\">{{ task()?.description || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}</td>\n <td class=\"field-value\"><ymbpm-user-display [userId]=\"task()?.assignee\"></ymbpm-user-display></td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}</td>\n <td class=\"field-value\"><ymbpm-user-display [userId]=\"task()?.owner\"></ymbpm-user-display></td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.taskDefinitionKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.taskDefinitionKey }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.formKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.formKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.createTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.createTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.claimTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.claimTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.dueDate' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.dueDate ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n </tbody>\n</table>\n", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;word-break:break-word;width:20%}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:80%}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status{margin-right:5px;display:inline-flex;align-items:center;gap:4px;vertical-align:middle}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.standalone-task-indicator{display:flex;align-items:center;justify-content:space-between;width:100%}.standalone-task-indicator mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:500;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);font-weight:700}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: UserDisplayComponent, selector: "ymbpm-user-display", inputs: ["userId"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatDateTimePipe, name: "formatDateTime" }] });
2217
2328
  }
2218
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TaskSummaryComponent, decorators: [{
2329
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskSummaryComponent, decorators: [{
2219
2330
  type: Component,
2220
2331
  args: [{ selector: 'ymbpm-task-summary', standalone: true, imports: [
2221
2332
  CommonModule,
@@ -2225,8 +2336,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
2225
2336
  MatIconModule,
2226
2337
  MatTooltipModule,
2227
2338
  TranslatePipe,
2228
- FormatDateTimePipe
2229
- ], template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceId' | translate }}</td>\n <td class=\"field-value\">{{ task()?.processInstanceId }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceName' | translate }}</td>\n <td class=\"field-value\">{{ task()?.processInstanceName || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\">\n @if (task()?.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ 'yuv.app.bpm-management.status.completed' | translate }}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ 'yuv.app.bpm-management.status.running' | translate }}</span>\n }\n @if (task()?.delegationState) {\n @if (task()?.delegationState === 'pending') {\n <span class=\"yuv-bpmn-status running\">\n <mat-icon>{{ icons.delegated }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.pending' | translate }}\n </span>\n } @else {\n <span class=\"yuv-bpmn-status completed\">\n <mat-icon>{{ icons.resolved }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.resolved' | translate }}\n </span>\n }\n }\n </td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.description' | translate }}</td>\n <td class=\"field-value\">{{ task()?.description || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}</td>\n <td class=\"field-value\">{{ task()?.assignee || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}</td>\n <td class=\"field-value\">{{ task()?.owner || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.taskDefinitionKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.taskDefinitionKey }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.formKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.formKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.createTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.createTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.claimTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.claimTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.dueDate' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.dueDate ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n </tbody>\n</table>\n", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;word-break:break-word;width:20%}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:80%}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status{margin-right:5px;display:inline-flex;align-items:center;gap:4px;vertical-align:middle}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:500;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);font-weight:700}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"] }]
2339
+ FormatDateTimePipe,
2340
+ UserDisplayComponent
2341
+ ], template: "<table class=\"details-table\">\n <tbody>\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceId' | translate }}</td>\n <td class=\"field-value\">\n @if (task()?.processInstanceId) {\n {{ task()?.processInstanceId }}\n } @else {\n <span class=\"standalone-task-indicator\">\n <span>-</span>\n <mat-icon [matTooltip]=\"'yuv.app.bpm-management.task.details.standaloneTask.tooltip' | translate\">{{ icons.info }}</mat-icon>\n </span>\n }\n </td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.processInstanceName' | translate }}</td>\n <td class=\"field-value\">{{ task()?.processInstanceName || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.status' | translate }}</td>\n <td class=\"field-value\">\n @if (task()?.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{ 'yuv.app.bpm-management.status.completed' | translate }}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{ 'yuv.app.bpm-management.status.running' | translate }}</span>\n }\n @if (task()?.delegationState) {\n @if (task()?.delegationState === 'pending') {\n <span class=\"yuv-bpmn-status running\">\n <mat-icon>{{ icons.delegated }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.pending' | translate }}\n </span>\n } @else {\n <span class=\"yuv-bpmn-status completed\">\n <mat-icon>{{ icons.resolved }}</mat-icon>\n {{ 'yuv.app.bpm-management.task.delegationState.resolved' | translate }}\n </span>\n }\n }\n </td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.description' | translate }}</td>\n <td class=\"field-value\">{{ task()?.description || '-' }}</td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}</td>\n <td class=\"field-value\"><ymbpm-user-display [userId]=\"task()?.assignee\"></ymbpm-user-display></td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}</td>\n <td class=\"field-value\"><ymbpm-user-display [userId]=\"task()?.owner\"></ymbpm-user-display></td>\n </tr>\n\n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.taskDefinitionKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.taskDefinitionKey }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.formKey' | translate }}</td>\n <td class=\"field-value\">{{ task()?.formKey || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.createTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.createTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.claimTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.claimTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.dueDate' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.dueDate ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n <tr>\n <td class=\"field-label\">{{ 'yuv.app.bpm-management.header.endTime' | translate }}</td>\n <td class=\"field-value\">{{ ((task()?.endTime ?? null) | formatDateTime) || '-' }}</td>\n </tr>\n \n </tbody>\n</table>\n", styles: [".details-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-bottom:var(--ymt-spacing-m)}.details-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.details-table tbody tr:hover{background-color:var(--ymt-surface-container-low)}.details-table tbody tr td{padding:var(--ymt-spacing-s);vertical-align:top}.details-table tbody tr td.field-label{font-weight:700;color:var(--ymt-on-surface);font-size:.875rem;word-break:break-word;width:20%}.details-table tbody tr td.field-value{font-size:1rem;color:var(--ymt-on-surface);word-break:break-word;width:80%}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status{margin-right:5px;display:inline-flex;align-items:center;gap:4px;vertical-align:middle}.details-table tbody tr td.field-value ::ng-deep .yuv-bpmn-status mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.standalone-task-indicator{display:flex;align-items:center;justify-content:space-between;width:100%}.standalone-task-indicator mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.variables-section{margin-top:var(--ymt-spacing-m)}.variables-section .variables-title{font-weight:500;color:var(--ymt-on-surface);font-size:.875rem;margin-bottom:var(--ymt-spacing-s);font-weight:700}.variables-table{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:var(--ymt-spacing-xs);font-family:monospace;font-size:.875rem}.variables-table thead{background-color:var(--ymt-surface-container)}.variables-table thead th{text-align:left;padding:var(--ymt-spacing-s);font-weight:600;color:var(--ymt-on-surface);border-bottom:2px solid var(--ymt-outline-variant);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.variables-table thead th:nth-child(1){width:20%}.variables-table thead th:nth-child(2){width:15%}.variables-table thead th:nth-child(3){width:65%}.variables-table tbody tr{border-bottom:1px solid var(--ymt-outline-variant)}.variables-table tbody tr:hover{background-color:var(--ymt-surface-container-high)}.variables-table tbody tr td{padding:var(--ymt-spacing-s);color:var(--ymt-on-surface);overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;max-width:0}.variables-table tbody tr td.variable-name{font-weight:600;color:var(--ymt-primary)}.variables-table tbody tr td.variable-type{color:var(--ymt-on-surface);font-style:italic}.variables-table tbody tr td.variable-value{word-break:break-word;overflow-wrap:break-word;white-space:normal}.variables-table tbody tr td.variable-scope{color:var(--ymt-tertiary)}\n"] }]
2230
2342
  }], propDecorators: { task: [{ type: i0.Input, args: [{ isSignal: true, alias: "task", required: false }] }] } });
2231
2343
 
2232
2344
  class EditorHistoryComponent {
@@ -2267,10 +2379,10 @@ class EditorHistoryComponent {
2267
2379
  }
2268
2380
  return `yuv.app.bpm-management.task.details.actionType.${type.toLowerCase()}`;
2269
2381
  }
2270
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EditorHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2271
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: EditorHistoryComponent, isStandalone: true, selector: "ymbpm-editor-history", inputs: { task: { classPropertyName: "task", publicName: "task", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"editor-history-container\">\n <!-- Candidate Users Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>person</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateUsers' | translate }}\n </h3>\n @if (candidateUsers.length > 0) {\n <div class=\"candidates-list\">\n @for (user of candidateUsers; track user) {\n <span class=\"candidate-chip\">\n <mat-icon>person</mat-icon>\n {{ user }}\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateUsers' | translate }}</p>\n }\n </div>\n\n <!-- Candidate Roles Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>group</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateRoles' | translate }}\n </h3>\n @if (candidateRoles.length > 0) {\n <div class=\"candidates-list\">\n @for (role of candidateRoles; track role) {\n <span class=\"candidate-chip\">\n <mat-icon>group</mat-icon>\n {{ role }}\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateRoles' | translate }}</p>\n }\n </div>\n\n <!-- Assignment History Section -->\n <div class=\"history-section\">\n <h3 class=\"section-title\">\n <mat-icon>history</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.assignmentHistory' | translate }}\n </h3>\n \n @if (assignmentHistory.length === 0) {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noAssignmentHistory' | translate }}</p>\n } @else {\n <div class=\"timeline-container\" [ngClass]=\"{singleEntry: assignmentHistory.length === 1}\">\n @for (entry of assignmentHistory; track entry.timestamp) {\n <div class=\"timeline-item\">\n <div class=\"timeline-datetime\">\n <div class=\"date\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"history-card\">\n <div class=\"action-header\">\n <mat-icon class=\"action-icon\">{{ getActionIcon(entry.type, entry.assignee) }}</mat-icon>\n <span class=\"action-label\">{{ getActionLabel(entry.type, entry.assignee) | translate }}</span>\n </div>\n @if (entry.assignee) {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}:</span>\n <span>{{ entry.assignee }}</span>\n </div>\n }\n @if (entry.owner && entry.type !== 'RESOLVE') {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}:</span>\n <span>{{ entry.owner }}</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;padding:var(--ymt-spacing-m)}.editor-history-container{display:flex;flex-direction:column;gap:var(--ymt-spacing-3xl)}.candidates-section .section-title,.history-section .section-title{display:flex;align-items:center;gap:var(--ymt-spacing-xs);margin:0 0 var(--ymt-spacing-m) 0;font-family:var(--ymt-font-title-small-font);font-size:var(--ymt-font-title-small-size);font-weight:var(--ymt-font-title-small-weight);line-height:var(--ymt-font-title-small-line-height);color:var(--ymt-on-surface)}.candidates-section .section-title mat-icon,.history-section .section-title mat-icon{font-size:var(--ymt-sizing-m);width:var(--ymt-sizing-m);height:var(--ymt-sizing-m);color:var(--ymt-primary)}.candidates-section .no-data,.history-section .no-data{color:var(--ymt-on-surface-type-subtle);font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);font-style:italic;margin:0}.candidates-list{display:flex;flex-wrap:wrap;gap:var(--ymt-spacing-s)}.candidate-chip{display:inline-flex;align-items:center;gap:var(--ymt-spacing-2xs);padding:var(--ymt-spacing-2xs) var(--ymt-spacing-s);background-color:var(--ymt-surface-container);border-radius:var(--ymt-corner-full);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.candidate-chip mat-icon{font-size:var(--ymt-sizing-xs);width:var(--ymt-sizing-xs);height:var(--ymt-sizing-xs);color:var(--ymt-on-surface-type-subtle)}.timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:var(--ymt-spacing-xs) 0}.timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}.timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}.timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}.timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}.timeline-container .timeline-item:last-child{margin-bottom:0}.timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}.timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}.timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}.timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}.timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}.timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}.timeline-container .timeline-item .timeline-content .history-card{width:100%;min-width:420px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}.timeline-container .timeline-item .timeline-content .history-card .action-header{display:flex;align-items:center;gap:var(--ymt-spacing-xs)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-icon{font-size:var(--ymt-sizing-s);width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);color:var(--ymt-primary)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-label{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);padding-left:var(--ymt-spacing-2xl);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info .label{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle)}@media(max-width:768px){.timeline-datetime{min-width:80px;padding-right:var(--ymt-spacing-xs)}.timeline-datetime .date{font-size:12px}.timeline-datetime .time{font-size:11px}.timeline-content{padding-left:var(--ymt-spacing-xs)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2382
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: EditorHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2383
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: EditorHistoryComponent, isStandalone: true, selector: "ymbpm-editor-history", inputs: { task: { classPropertyName: "task", publicName: "task", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"editor-history-container\">\n <!-- Candidate Users Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>person</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateUsers' | translate }}\n </h3>\n @if (candidateUsers.length > 0) {\n <div class=\"candidates-list\">\n @for (user of candidateUsers; track user) {\n <span class=\"candidate-chip\">\n <mat-icon>person</mat-icon>\n <ymbpm-user-display [userId]=\"user\"></ymbpm-user-display>\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateUsers' | translate }}</p>\n }\n </div>\n\n <!-- Candidate Roles Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>group</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateRoles' | translate }}\n </h3>\n @if (candidateRoles.length > 0) {\n <div class=\"candidates-list\">\n @for (role of candidateRoles; track role) {\n <span class=\"candidate-chip\">\n <mat-icon>group</mat-icon>\n {{ role }}\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateRoles' | translate }}</p>\n }\n </div>\n\n <!-- Assignment History Section -->\n <div class=\"history-section\">\n <h3 class=\"section-title\">\n <mat-icon>history</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.assignmentHistory' | translate }}\n </h3>\n \n @if (assignmentHistory.length === 0) {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noAssignmentHistory' | translate }}</p>\n } @else {\n <div class=\"timeline-container\" [ngClass]=\"{singleEntry: assignmentHistory.length === 1}\">\n @for (entry of assignmentHistory; track entry.timestamp) {\n <div class=\"timeline-item\">\n <div class=\"timeline-datetime\">\n <div class=\"date\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"history-card\">\n <div class=\"action-header\">\n <mat-icon class=\"action-icon\">{{ getActionIcon(entry.type, entry.assignee) }}</mat-icon>\n <span class=\"action-label\">{{ getActionLabel(entry.type, entry.assignee) | translate }}</span>\n </div>\n @if (entry.assignee) {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}:</span>\n <ymbpm-user-display [userId]=\"entry.assignee\"></ymbpm-user-display>\n </div>\n }\n @if (entry.owner && entry.type !== 'RESOLVE') {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}:</span>\n <ymbpm-user-display [userId]=\"entry.owner\"></ymbpm-user-display>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;padding:var(--ymt-spacing-m)}.editor-history-container{display:flex;flex-direction:column;gap:var(--ymt-spacing-3xl)}.candidates-section .section-title,.history-section .section-title{display:flex;align-items:center;gap:var(--ymt-spacing-xs);margin:0 0 var(--ymt-spacing-m) 0;font-family:var(--ymt-font-title-small-font);font-size:var(--ymt-font-title-small-size);font-weight:var(--ymt-font-title-small-weight);line-height:var(--ymt-font-title-small-line-height);color:var(--ymt-on-surface)}.candidates-section .section-title mat-icon,.history-section .section-title mat-icon{font-size:var(--ymt-sizing-m);width:var(--ymt-sizing-m);height:var(--ymt-sizing-m);color:var(--ymt-primary)}.candidates-section .no-data,.history-section .no-data{color:var(--ymt-on-surface-type-subtle);font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);font-style:italic;margin:0}.candidates-list{display:flex;flex-wrap:wrap;gap:var(--ymt-spacing-s)}.candidate-chip{display:inline-flex;align-items:center;gap:var(--ymt-spacing-2xs);padding:var(--ymt-spacing-2xs) var(--ymt-spacing-s);background-color:var(--ymt-surface-container);border-radius:var(--ymt-corner-full);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.candidate-chip mat-icon{font-size:var(--ymt-sizing-xs);width:var(--ymt-sizing-xs);height:var(--ymt-sizing-xs);color:var(--ymt-on-surface-type-subtle)}.timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:var(--ymt-spacing-xs) 0}.timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}.timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}.timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}.timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}.timeline-container .timeline-item:last-child{margin-bottom:0}.timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}.timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}.timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}.timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}.timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}.timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}.timeline-container .timeline-item .timeline-content .history-card{width:100%;min-width:420px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}.timeline-container .timeline-item .timeline-content .history-card .action-header{display:flex;align-items:center;gap:var(--ymt-spacing-xs)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-icon{font-size:var(--ymt-sizing-s);width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);color:var(--ymt-primary)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-label{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);padding-left:var(--ymt-spacing-2xl);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info .label{color:var(--ymt-on-surface-type-subtle)}@media(max-width:768px){.timeline-datetime{min-width:80px;padding-right:var(--ymt-spacing-xs)}.timeline-datetime .date{font-size:12px}.timeline-datetime .time{font-size:11px}.timeline-content{padding-left:var(--ymt-spacing-xs)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "component", type: UserDisplayComponent, selector: "ymbpm-user-display", inputs: ["userId"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2272
2384
  }
2273
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: EditorHistoryComponent, decorators: [{
2385
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: EditorHistoryComponent, decorators: [{
2274
2386
  type: Component,
2275
2387
  args: [{ selector: 'ymbpm-editor-history', standalone: true, imports: [
2276
2388
  CommonModule,
@@ -2279,8 +2391,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
2279
2391
  MatButtonModule,
2280
2392
  MatIconModule,
2281
2393
  MatTooltipModule,
2282
- TranslatePipe
2283
- ], template: "<div class=\"editor-history-container\">\n <!-- Candidate Users Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>person</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateUsers' | translate }}\n </h3>\n @if (candidateUsers.length > 0) {\n <div class=\"candidates-list\">\n @for (user of candidateUsers; track user) {\n <span class=\"candidate-chip\">\n <mat-icon>person</mat-icon>\n {{ user }}\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateUsers' | translate }}</p>\n }\n </div>\n\n <!-- Candidate Roles Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>group</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateRoles' | translate }}\n </h3>\n @if (candidateRoles.length > 0) {\n <div class=\"candidates-list\">\n @for (role of candidateRoles; track role) {\n <span class=\"candidate-chip\">\n <mat-icon>group</mat-icon>\n {{ role }}\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateRoles' | translate }}</p>\n }\n </div>\n\n <!-- Assignment History Section -->\n <div class=\"history-section\">\n <h3 class=\"section-title\">\n <mat-icon>history</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.assignmentHistory' | translate }}\n </h3>\n \n @if (assignmentHistory.length === 0) {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noAssignmentHistory' | translate }}</p>\n } @else {\n <div class=\"timeline-container\" [ngClass]=\"{singleEntry: assignmentHistory.length === 1}\">\n @for (entry of assignmentHistory; track entry.timestamp) {\n <div class=\"timeline-item\">\n <div class=\"timeline-datetime\">\n <div class=\"date\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"history-card\">\n <div class=\"action-header\">\n <mat-icon class=\"action-icon\">{{ getActionIcon(entry.type, entry.assignee) }}</mat-icon>\n <span class=\"action-label\">{{ getActionLabel(entry.type, entry.assignee) | translate }}</span>\n </div>\n @if (entry.assignee) {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}:</span>\n <span>{{ entry.assignee }}</span>\n </div>\n }\n @if (entry.owner && entry.type !== 'RESOLVE') {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}:</span>\n <span>{{ entry.owner }}</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;padding:var(--ymt-spacing-m)}.editor-history-container{display:flex;flex-direction:column;gap:var(--ymt-spacing-3xl)}.candidates-section .section-title,.history-section .section-title{display:flex;align-items:center;gap:var(--ymt-spacing-xs);margin:0 0 var(--ymt-spacing-m) 0;font-family:var(--ymt-font-title-small-font);font-size:var(--ymt-font-title-small-size);font-weight:var(--ymt-font-title-small-weight);line-height:var(--ymt-font-title-small-line-height);color:var(--ymt-on-surface)}.candidates-section .section-title mat-icon,.history-section .section-title mat-icon{font-size:var(--ymt-sizing-m);width:var(--ymt-sizing-m);height:var(--ymt-sizing-m);color:var(--ymt-primary)}.candidates-section .no-data,.history-section .no-data{color:var(--ymt-on-surface-type-subtle);font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);font-style:italic;margin:0}.candidates-list{display:flex;flex-wrap:wrap;gap:var(--ymt-spacing-s)}.candidate-chip{display:inline-flex;align-items:center;gap:var(--ymt-spacing-2xs);padding:var(--ymt-spacing-2xs) var(--ymt-spacing-s);background-color:var(--ymt-surface-container);border-radius:var(--ymt-corner-full);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.candidate-chip mat-icon{font-size:var(--ymt-sizing-xs);width:var(--ymt-sizing-xs);height:var(--ymt-sizing-xs);color:var(--ymt-on-surface-type-subtle)}.timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:var(--ymt-spacing-xs) 0}.timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}.timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}.timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}.timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}.timeline-container .timeline-item:last-child{margin-bottom:0}.timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}.timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}.timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}.timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}.timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}.timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}.timeline-container .timeline-item .timeline-content .history-card{width:100%;min-width:420px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}.timeline-container .timeline-item .timeline-content .history-card .action-header{display:flex;align-items:center;gap:var(--ymt-spacing-xs)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-icon{font-size:var(--ymt-sizing-s);width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);color:var(--ymt-primary)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-label{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);padding-left:var(--ymt-spacing-2xl);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info .label{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle)}@media(max-width:768px){.timeline-datetime{min-width:80px;padding-right:var(--ymt-spacing-xs)}.timeline-datetime .date{font-size:12px}.timeline-datetime .time{font-size:11px}.timeline-content{padding-left:var(--ymt-spacing-xs)}}\n"] }]
2394
+ TranslatePipe,
2395
+ UserDisplayComponent
2396
+ ], template: "<div class=\"editor-history-container\">\n <!-- Candidate Users Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>person</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateUsers' | translate }}\n </h3>\n @if (candidateUsers.length > 0) {\n <div class=\"candidates-list\">\n @for (user of candidateUsers; track user) {\n <span class=\"candidate-chip\">\n <mat-icon>person</mat-icon>\n <ymbpm-user-display [userId]=\"user\"></ymbpm-user-display>\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateUsers' | translate }}</p>\n }\n </div>\n\n <!-- Candidate Roles Section -->\n <div class=\"candidates-section\">\n <h3 class=\"section-title\">\n <mat-icon>group</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.candidateRoles' | translate }}\n </h3>\n @if (candidateRoles.length > 0) {\n <div class=\"candidates-list\">\n @for (role of candidateRoles; track role) {\n <span class=\"candidate-chip\">\n <mat-icon>group</mat-icon>\n {{ role }}\n </span>\n }\n </div>\n } @else {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noCandidateRoles' | translate }}</p>\n }\n </div>\n\n <!-- Assignment History Section -->\n <div class=\"history-section\">\n <h3 class=\"section-title\">\n <mat-icon>history</mat-icon>\n {{ 'yuv.app.bpm-management.task.details.assignmentHistory' | translate }}\n </h3>\n \n @if (assignmentHistory.length === 0) {\n <p class=\"no-data\">{{ 'yuv.app.bpm-management.task.details.noAssignmentHistory' | translate }}</p>\n } @else {\n <div class=\"timeline-container\" [ngClass]=\"{singleEntry: assignmentHistory.length === 1}\">\n @for (entry of assignmentHistory; track entry.timestamp) {\n <div class=\"timeline-item\">\n <div class=\"timeline-datetime\">\n <div class=\"date\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'date') }}</div>\n <div class=\"time\">{{ formatDateTime(entry.timestamp, translateService.currentLang, 'time') }}</div>\n </div>\n \n <div class=\"timeline-line\"></div>\n \n <div class=\"timeline-content\">\n <div class=\"history-card\">\n <div class=\"action-header\">\n <mat-icon class=\"action-icon\">{{ getActionIcon(entry.type, entry.assignee) }}</mat-icon>\n <span class=\"action-label\">{{ getActionLabel(entry.type, entry.assignee) | translate }}</span>\n </div>\n @if (entry.assignee) {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.assignee' | translate }}:</span>\n <ymbpm-user-display [userId]=\"entry.assignee\"></ymbpm-user-display>\n </div>\n }\n @if (entry.owner && entry.type !== 'RESOLVE') {\n <div class=\"assignee-info\">\n <span class=\"label\">{{ 'yuv.app.bpm-management.task.details.owner' | translate }}:</span>\n <ymbpm-user-display [userId]=\"entry.owner\"></ymbpm-user-display>\n </div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;padding:var(--ymt-spacing-m)}.editor-history-container{display:flex;flex-direction:column;gap:var(--ymt-spacing-3xl)}.candidates-section .section-title,.history-section .section-title{display:flex;align-items:center;gap:var(--ymt-spacing-xs);margin:0 0 var(--ymt-spacing-m) 0;font-family:var(--ymt-font-title-small-font);font-size:var(--ymt-font-title-small-size);font-weight:var(--ymt-font-title-small-weight);line-height:var(--ymt-font-title-small-line-height);color:var(--ymt-on-surface)}.candidates-section .section-title mat-icon,.history-section .section-title mat-icon{font-size:var(--ymt-sizing-m);width:var(--ymt-sizing-m);height:var(--ymt-sizing-m);color:var(--ymt-primary)}.candidates-section .no-data,.history-section .no-data{color:var(--ymt-on-surface-type-subtle);font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);font-style:italic;margin:0}.candidates-list{display:flex;flex-wrap:wrap;gap:var(--ymt-spacing-s)}.candidate-chip{display:inline-flex;align-items:center;gap:var(--ymt-spacing-2xs);padding:var(--ymt-spacing-2xs) var(--ymt-spacing-s);background-color:var(--ymt-surface-container);border-radius:var(--ymt-corner-full);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.candidate-chip mat-icon{font-size:var(--ymt-sizing-xs);width:var(--ymt-sizing-xs);height:var(--ymt-sizing-xs);color:var(--ymt-on-surface-type-subtle)}.timeline-container{display:flex;flex-flow:column;overflow-y:auto;align-items:center;padding:var(--ymt-spacing-xs) 0}.timeline-container:not(.singleEntry) .timeline-item .timeline-line:after{content:\"\";width:53%;display:block;border-width:0 3px 0 0;border-style:solid;border-color:var(--ymt-outline-variant);position:absolute;top:0;bottom:0;z-index:1}.timeline-container:not(.singleEntry) .timeline-item:first-child .timeline-line:after{top:initial;height:50%}.timeline-container:not(.singleEntry) .timeline-item:last-child .timeline-line:after{bottom:initial;height:50%}.timeline-container .timeline-item{display:grid;grid-template-rows:1fr;grid-template-columns:1fr auto 4fr;grid-template-areas:\"created timeline content\"}.timeline-container .timeline-item:last-child{margin-bottom:0}.timeline-container .timeline-item .timeline-datetime{grid-area:created;display:flex;flex-flow:column;justify-content:center;padding:0 var(--ymt-spacing-xs);width:100px}.timeline-container .timeline-item .timeline-datetime .date{font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:500;color:var(--ymt-on-surface);line-height:1.2}.timeline-container .timeline-item .timeline-datetime .time{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);line-height:var(--ymt-font-body-subtle-line-height);color:var(--ymt-on-surface-type-subtle);margin-top:var(--ymt-spacing-3xs)}.timeline-container .timeline-item .timeline-line{grid-area:timeline;display:flex;flex-flow:column;justify-content:center;width:var(--ymt-sizing-3xl);position:relative}.timeline-container .timeline-item .timeline-line:before{content:\"\";display:block;width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);border-radius:50%;background-color:var(--ymt-primary);border:3px solid var(--ymt-surface);box-shadow:0 0 0 2px var(--ymt-primary);z-index:2;align-self:center}.timeline-container .timeline-item .timeline-content{grid-area:content;padding:var(--ymt-spacing-xs);box-sizing:border-box;display:flex}.timeline-container .timeline-item .timeline-content .history-card{width:100%;min-width:420px;background-color:var(--ymt-surface-container-high);border:var(--ymt-outline-width) solid var(--ymt-outline-variant-emphasized);border-radius:var(--ymt-corner-m);padding:var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-s)}.timeline-container .timeline-item .timeline-content .history-card .action-header{display:flex;align-items:center;gap:var(--ymt-spacing-xs)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-icon{font-size:var(--ymt-sizing-s);width:var(--ymt-sizing-s);height:var(--ymt-sizing-s);color:var(--ymt-primary)}.timeline-container .timeline-item .timeline-content .history-card .action-header .action-label{font-family:var(--ymt-font-title-smallest-font);font-size:var(--ymt-font-title-smallest-size);font-weight:var(--ymt-font-title-smallest-weight);line-height:var(--ymt-font-title-smallest-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info{display:flex;align-items:center;gap:var(--ymt-spacing-2xs);padding-left:var(--ymt-spacing-2xl);font-family:var(--ymt-font-body-font);font-size:var(--ymt-font-body-size);font-weight:var(--ymt-font-body-weight);line-height:var(--ymt-font-body-line-height);color:var(--ymt-on-surface)}.timeline-container .timeline-item .timeline-content .history-card .assignee-info .label{color:var(--ymt-on-surface-type-subtle)}@media(max-width:768px){.timeline-datetime{min-width:80px;padding-right:var(--ymt-spacing-xs)}.timeline-datetime .date{font-size:12px}.timeline-datetime .time{font-size:11px}.timeline-content{padding-left:var(--ymt-spacing-xs)}}\n"] }]
2284
2397
  }], propDecorators: { task: [{ type: i0.Input, args: [{ isSignal: true, alias: "task", required: false }] }] } });
2285
2398
 
2286
2399
  class TaskDetailsComponent {
@@ -2316,10 +2429,10 @@ class TaskDetailsComponent {
2316
2429
  this.task.set(undefined);
2317
2430
  }
2318
2431
  }
2319
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TaskDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2320
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: TaskDetailsComponent, isStandalone: true, selector: "ymbpm-task-details", inputs: { taskId: { classPropertyName: "taskId", publicName: "taskId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (task()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab label=\"{{ 'yuv.app.bpm-management.tabs.summary' | translate }}\">\n <ymbpm-task-summary [task]=\"task()\"></ymbpm-task-summary>\n </mat-tab>\n <mat-tab label=\"{{ 'yuv.app.bpm-management.tabs.editorHistory' | translate }}\">\n <ymbpm-editor-history [task]=\"task()\"></ymbpm-editor-history>\n </mat-tab>\n </mat-tab-group>\n </section>\n}\n", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.task-details-card{margin-bottom:var(--ymt-spacing-m)}.task-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "component", type: TaskSummaryComponent, selector: "ymbpm-task-summary", inputs: ["task"] }, { kind: "component", type: EditorHistoryComponent, selector: "ymbpm-editor-history", inputs: ["task"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2432
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2433
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: TaskDetailsComponent, isStandalone: true, selector: "ymbpm-task-details", inputs: { taskId: { classPropertyName: "taskId", publicName: "taskId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (loading()) {\n <div class=\"loading-container\">\n <mat-spinner diameter=\"40\"></mat-spinner>\n </div>\n} @else if (error()) {\n <div class=\"error-container\">\n <p class=\"error-message\">{{ error() }}</p>\n </div>\n} @else if (task()) {\n <section class=\"bpmmgmt-main__content\" [attr.aria-label]=\"'yuv.app.bpm-management.content.aria.label' | translate\">\n <mat-tab-group [(selectedIndex)]=\"selectedTabIndex\">\n <mat-tab label=\"{{ 'yuv.app.bpm-management.tabs.summary' | translate }}\">\n <ymbpm-task-summary [task]=\"task()\"></ymbpm-task-summary>\n </mat-tab>\n <mat-tab label=\"{{ 'yuv.app.bpm-management.tabs.editorHistory' | translate }}\">\n <ymbpm-editor-history [task]=\"task()\"></ymbpm-editor-history>\n </mat-tab>\n </mat-tab-group>\n </section>\n}\n", styles: [":host{display:block}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ymt-spacing-xl);gap:var(--ymt-spacing-m)}.loading-container p{color:var(--ymt-on-surface)}.error-card{margin-bottom:var(--ymt-spacing-m);background-color:var(--ymt-error-container)}.error-card .error-message{color:var(--ymt-on-error-container);font-weight:500}.task-details-card{margin-bottom:var(--ymt-spacing-m)}.task-details-card mat-card-header{margin-bottom:var(--ymt-spacing-m);display:flex;align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatCardModule }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "component", type: TaskSummaryComponent, selector: "ymbpm-task-summary", inputs: ["task"] }, { kind: "component", type: EditorHistoryComponent, selector: "ymbpm-editor-history", inputs: ["task"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2321
2434
  }
2322
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TaskDetailsComponent, decorators: [{
2435
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskDetailsComponent, decorators: [{
2323
2436
  type: Component,
2324
2437
  args: [{ selector: 'ymbpm-task-details', standalone: true, imports: [
2325
2438
  CommonModule,
@@ -2348,10 +2461,10 @@ class TaskAssignOverlayComponent {
2348
2461
  this.#dialogRef.close(assignee.trim());
2349
2462
  }
2350
2463
  }
2351
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TaskAssignOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2352
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.11", type: TaskAssignOverlayComponent, isStandalone: true, selector: "ymbpm-task-assign-overlay", ngImport: i0, template: "<yuv-dialog [headertitle]=\"'yuv.app.bpm-management.task.actions.assign.label' | translate\">\n <main >\n <mat-label>{{ 'yuv.app.bpm-management.task.actions.assign.assignee.label' | translate }}</mat-label>\n <yuv-organization [formControl]=\"userControl\" [excludeMe]='false' />\n </main>\n <footer>\n <button ymtButton=\"secondary\" (click)=\"close()\" type=\"button\">\n {{ \"yuv.app.bpm-management.action.cancel.label\" | translate }}\n </button>\n <button ymtButton=\"primary\" (click)=\"confirm()\" type=\"button\" [disabled]=\"this.userControl.touched && this.userControl.dirty\">\n {{ 'yuv.app.bpm-management.task.actions.assign.confirm' | translate }}\n </button>\n </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m)}:host yuv-organization{border:var(--ymt-outline-width) solid var(--ymt-outline);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: OrganizationComponent, selector: "yuv-organization", inputs: ["situation", "multiselect", "classifications", "readonly", "excludeMe", "withMetadata"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2464
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskAssignOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2465
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: TaskAssignOverlayComponent, isStandalone: true, selector: "ymbpm-task-assign-overlay", ngImport: i0, template: "<yuv-dialog [headertitle]=\"'yuv.app.bpm-management.task.actions.assign.label' | translate\">\n <main >\n <mat-label>{{ 'yuv.app.bpm-management.task.actions.assign.assignee.label' | translate }}</mat-label>\n <yuv-organization [formControl]=\"userControl\" [excludeMe]='false' />\n </main>\n <footer>\n <button ymtButton=\"secondary\" (click)=\"close()\" type=\"button\">\n {{ \"yuv.app.bpm-management.action.cancel.label\" | translate }}\n </button>\n <button ymtButton=\"primary\" (click)=\"confirm()\" type=\"button\" [disabled]=\"this.userControl.touched && this.userControl.dirty\">\n {{ 'yuv.app.bpm-management.task.actions.assign.confirm' | translate }}\n </button>\n </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m)}:host yuv-organization{border:var(--ymt-outline-width) solid var(--ymt-outline);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: OrganizationComponent, selector: "yuv-organization", inputs: ["situation", "multiselect", "classifications", "readonly", "excludeMe", "withMetadata", "allowFreeText"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2353
2466
  }
2354
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: TaskAssignOverlayComponent, decorators: [{
2467
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskAssignOverlayComponent, decorators: [{
2355
2468
  type: Component,
2356
2469
  args: [{ selector: 'ymbpm-task-assign-overlay', imports: [
2357
2470
  CommonModule,
@@ -2367,6 +2480,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
2367
2480
  ], standalone: true, template: "<yuv-dialog [headertitle]=\"'yuv.app.bpm-management.task.actions.assign.label' | translate\">\n <main >\n <mat-label>{{ 'yuv.app.bpm-management.task.actions.assign.assignee.label' | translate }}</mat-label>\n <yuv-organization [formControl]=\"userControl\" [excludeMe]='false' />\n </main>\n <footer>\n <button ymtButton=\"secondary\" (click)=\"close()\" type=\"button\">\n {{ \"yuv.app.bpm-management.action.cancel.label\" | translate }}\n </button>\n <button ymtButton=\"primary\" (click)=\"confirm()\" type=\"button\" [disabled]=\"this.userControl.touched && this.userControl.dirty\">\n {{ 'yuv.app.bpm-management.task.actions.assign.confirm' | translate }}\n </button>\n </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m)}:host yuv-organization{border:var(--ymt-outline-width) solid var(--ymt-outline);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs)}\n"] }]
2368
2481
  }] });
2369
2482
 
2483
+ class TaskCandidatesOverlayComponent {
2484
+ #dialogRef = inject((MatDialogRef));
2485
+ data = inject(MAT_DIALOG_DATA);
2486
+ usersControl = new FormControl(this.data.currentUsers?.length ? this.data.currentUsers : null);
2487
+ rolesControl = new FormControl(this.data.currentRoles?.length ? this.data.currentRoles : null);
2488
+ close() {
2489
+ this.#dialogRef.close();
2490
+ }
2491
+ confirm() {
2492
+ const usersValue = this.usersControl.value;
2493
+ const rolesValue = this.rolesControl.value;
2494
+ const result = {
2495
+ users: Array.isArray(usersValue) ? usersValue.filter(Boolean) : usersValue ? [usersValue] : [],
2496
+ roles: Array.isArray(rolesValue) ? rolesValue.filter(Boolean) : rolesValue ? [rolesValue] : []
2497
+ };
2498
+ this.#dialogRef.close(result);
2499
+ }
2500
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskCandidatesOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2501
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: TaskCandidatesOverlayComponent, isStandalone: true, selector: "ymbpm-task-candidates-overlay", ngImport: i0, template: "<yuv-dialog [headertitle]=\"'yuv.app.bpm-management.task.actions.editCandidates.label' | translate\">\n <main>\n <div class=\"field-group\">\n <label class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.candidateUsers' | translate }}</label>\n <yuv-organization [formControl]=\"usersControl\" [multiselect]=\"true\" [excludeMe]=\"false\" [classifications]=\"['id:organization:set[user]']\" />\n </div>\n <div class=\"field-group\">\n <label class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.candidateRoles' | translate }}</label>\n <yuv-organization [formControl]=\"rolesControl\" [multiselect]=\"true\" [excludeMe]=\"false\" [classifications]=\"['id:organization:set[role]']\" />\n </div>\n </main>\n <footer>\n <button ymtButton=\"secondary\" (click)=\"close()\" type=\"button\">\n {{ 'yuv.app.bpm-management.action.cancel.label' | translate }}\n </button>\n <button ymtButton=\"primary\" (click)=\"confirm()\" type=\"button\">\n {{ 'yuv.app.bpm-management.action.confirm.label' | translate }}\n </button>\n </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-m)}:host .field-group{display:flex;flex-direction:column;gap:var(--ymt-spacing-xs)}:host .field-label{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);color:var(--ymt-on-surface-type-subtle)}:host yuv-organization{border:var(--ymt-outline-width) solid var(--ymt-outline);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs);min-width:0;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: OrganizationComponent, selector: "yuv-organization", inputs: ["situation", "multiselect", "classifications", "readonly", "excludeMe", "withMetadata", "allowFreeText"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2502
+ }
2503
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: TaskCandidatesOverlayComponent, decorators: [{
2504
+ type: Component,
2505
+ args: [{ selector: 'ymbpm-task-candidates-overlay', standalone: true, imports: [
2506
+ CommonModule,
2507
+ ReactiveFormsModule,
2508
+ MatDialogModule,
2509
+ MatButtonModule,
2510
+ TranslatePipe,
2511
+ OrganizationComponent,
2512
+ DialogComponent,
2513
+ YmtButtonDirective
2514
+ ], template: "<yuv-dialog [headertitle]=\"'yuv.app.bpm-management.task.actions.editCandidates.label' | translate\">\n <main>\n <div class=\"field-group\">\n <label class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.candidateUsers' | translate }}</label>\n <yuv-organization [formControl]=\"usersControl\" [multiselect]=\"true\" [excludeMe]=\"false\" [classifications]=\"['id:organization:set[user]']\" />\n </div>\n <div class=\"field-group\">\n <label class=\"field-label\">{{ 'yuv.app.bpm-management.task.details.candidateRoles' | translate }}</label>\n <yuv-organization [formControl]=\"rolesControl\" [multiselect]=\"true\" [excludeMe]=\"false\" [classifications]=\"['id:organization:set[role]']\" />\n </div>\n </main>\n <footer>\n <button ymtButton=\"secondary\" (click)=\"close()\" type=\"button\">\n {{ 'yuv.app.bpm-management.action.cancel.label' | translate }}\n </button>\n <button ymtButton=\"primary\" (click)=\"confirm()\" type=\"button\">\n {{ 'yuv.app.bpm-management.action.confirm.label' | translate }}\n </button>\n </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{padding:var(--ymt-spacing-m);display:flex;flex-direction:column;gap:var(--ymt-spacing-m)}:host .field-group{display:flex;flex-direction:column;gap:var(--ymt-spacing-xs)}:host .field-label{font-family:var(--ymt-font-body-subtle-font);font-size:var(--ymt-font-body-subtle-size);font-weight:var(--ymt-font-body-subtle-weight);color:var(--ymt-on-surface-type-subtle)}:host yuv-organization{border:var(--ymt-outline-width) solid var(--ymt-outline);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs);min-width:0;overflow:hidden}\n"] }]
2515
+ }] });
2516
+
2370
2517
  class YuvTasksPageComponent {
2371
2518
  layoutSettingsID = APP_ID + '#root.layout.settings';
2372
2519
  #logger = inject(Logger);
@@ -2377,6 +2524,8 @@ class YuvTasksPageComponent {
2377
2524
  taskDetailsComponent;
2378
2525
  bpmTableComponent;
2379
2526
  statusTemplate;
2527
+ assigneeTemplate;
2528
+ ownerTemplate;
2380
2529
  TaskStatus = TaskStatus;
2381
2530
  pagination = {
2382
2531
  total: 0,
@@ -2417,17 +2566,17 @@ class YuvTasksPageComponent {
2417
2566
  {
2418
2567
  name: 'assignee',
2419
2568
  displayName: 'yuv.app.bpm-management.header.assignee',
2569
+ template: this.assigneeTemplate,
2420
2570
  filter: {
2421
- type: FILTER_TYPES.TEXT,
2422
- operators: [FILTER_OPERATORS.EQUALS]
2571
+ type: FILTER_TYPES.USER
2423
2572
  }
2424
2573
  },
2425
2574
  {
2426
2575
  name: 'owner',
2427
2576
  displayName: 'yuv.app.bpm-management.header.owner',
2577
+ template: this.ownerTemplate,
2428
2578
  filter: {
2429
- type: FILTER_TYPES.TEXT,
2430
- operators: [FILTER_OPERATORS.EQUALS]
2579
+ type: FILTER_TYPES.USER
2431
2580
  }
2432
2581
  },
2433
2582
  {
@@ -2518,24 +2667,33 @@ class YuvTasksPageComponent {
2518
2667
  }
2519
2668
  }
2520
2669
  #updateActions(obj) {
2521
- this.actions = obj
2522
- ? [
2523
- {
2524
- id: 'yuv.app.bpm-management.task.actions.unassign',
2525
- icon: APP_ICONS.unassign,
2526
- label: this.#translateService.instant('yuv.app.bpm-management.task.actions.unassign.label'),
2527
- disabled: obj.assignee == null || obj.endTime != null,
2528
- callback: () => this.unassign(),
2529
- },
2530
- {
2531
- id: 'yuv.app.bpm-management.task.actions.assign',
2532
- icon: APP_ICONS.assign,
2533
- label: this.#translateService.instant('yuv.app.bpm-management.task.actions.assign.label'),
2534
- disabled: obj.assignee != null || obj.endTime != null,
2535
- callback: () => this.assign(),
2536
- }
2537
- ]
2538
- : [];
2670
+ if (!obj) {
2671
+ this.actions = [];
2672
+ return;
2673
+ }
2674
+ this.actions = [
2675
+ {
2676
+ id: 'yuv.app.bpm-management.task.actions.assign',
2677
+ icon: APP_ICONS.assign,
2678
+ label: this.#translateService.instant('yuv.app.bpm-management.task.actions.assign.label'),
2679
+ disabled: obj.assignee != null || obj.endTime != null,
2680
+ callback: () => this.assign(),
2681
+ },
2682
+ {
2683
+ id: 'yuv.app.bpm-management.task.actions.unassign',
2684
+ icon: APP_ICONS.unassign,
2685
+ label: this.#translateService.instant('yuv.app.bpm-management.task.actions.unassign.label'),
2686
+ disabled: obj.assignee == null || obj.endTime != null,
2687
+ callback: () => this.unassign(),
2688
+ },
2689
+ {
2690
+ id: 'yuv.app.bpm-management.task.actions.editCandidates',
2691
+ icon: 'manage_accounts',
2692
+ label: this.#translateService.instant('yuv.app.bpm-management.task.actions.editCandidates.label'),
2693
+ disabled: obj.endTime != null,
2694
+ callback: () => this.editCandidates(),
2695
+ }
2696
+ ];
2539
2697
  }
2540
2698
  unassign() {
2541
2699
  const task = this.selection().selected.at(0);
@@ -2593,10 +2751,35 @@ class YuvTasksPageComponent {
2593
2751
  }
2594
2752
  });
2595
2753
  }
2596
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvTasksPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2597
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: YuvTasksPageComponent, isStandalone: true, selector: "ymbpm-tasks-page", viewQueries: [{ propertyName: "taskDetailsComponent", first: true, predicate: TaskDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }, { propertyName: "statusTemplate", first: true, predicate: ["statusTemplate"], descendants: true, static: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\"\n [busy]=\"busy()\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n \n <ng-template ymtLayoutPane role=\"details\">\n @let selectedTask = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedTask ? 'task' : undefined\" [title]=\"selectedTask ? (selectedTask.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedTask ? selectedTask.id : ''\" [actions]=\"listActions\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedTask) {\n <ymbpm-task-details [taskId]=\"selectedTask?.id\"></ymbpm-task-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #listActions>\n <yuv-overflow-menu [menuItems]=\"actions\"></yuv-overflow-menu>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-task>\n @if (task.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{TaskStatus.COMPLETED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{TaskStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$1.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: i6$1.OverflowMenuComponent, selector: "yuv-overflow-menu", inputs: ["overflowIcon", "groupLabels", "menuItems", "vertical"] }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "component", type: TaskDetailsComponent, selector: "ymbpm-task-details", inputs: ["taskId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2754
+ editCandidates() {
2755
+ const task = this.selection().selected.at(0);
2756
+ if (!task)
2757
+ return;
2758
+ const detailTask = this.taskDetailsComponent?.task();
2759
+ const currentUsers = detailTask?.identityLinks?.candidates?.users ?? [];
2760
+ const currentRoles = detailTask?.identityLinks?.candidates?.roles ?? [];
2761
+ this.#dialog.open(TaskCandidatesOverlayComponent, {
2762
+ width: '600px',
2763
+ maxWidth: '95vw',
2764
+ data: { currentUsers: [...currentUsers], currentRoles: [...currentRoles] }
2765
+ }).afterClosed().subscribe((result) => {
2766
+ if (result === undefined)
2767
+ return;
2768
+ this.#bpmAdminSerice.setTaskCandidates(task.id, result).subscribe({
2769
+ next: () => {
2770
+ this.#notificationService.success(this.#translateService.instant('yuv.app.bpm-management.task.candidates.update.success'));
2771
+ this.taskDetailsComponent?.loadTaskDetails();
2772
+ },
2773
+ error: () => {
2774
+ this.#notificationService.error(this.#translateService.instant('yuv.app.bpm-management.task.candidates.update.error'));
2775
+ }
2776
+ });
2777
+ });
2778
+ }
2779
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvTasksPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2780
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.21", type: YuvTasksPageComponent, isStandalone: true, selector: "ymbpm-tasks-page", viewQueries: [{ propertyName: "taskDetailsComponent", first: true, predicate: TaskDetailsComponent, descendants: true }, { propertyName: "bpmTableComponent", first: true, predicate: BpmTableComponent, descendants: true }, { propertyName: "statusTemplate", first: true, predicate: ["statusTemplate"], descendants: true, static: true }, { propertyName: "assigneeTemplate", first: true, predicate: ["assigneeTemplate"], descendants: true, static: true }, { propertyName: "ownerTemplate", first: true, predicate: ["ownerTemplate"], descendants: true, static: true }], ngImport: i0, template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\"\n [busy]=\"busy()\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n \n <ng-template ymtLayoutPane role=\"details\">\n @let selectedTask = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedTask ? 'task' : undefined\" [title]=\"selectedTask ? (selectedTask.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedTask ? selectedTask.id : ''\" [actions]=\"listActions\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedTask) {\n <ymbpm-task-details [taskId]=\"selectedTask?.id\"></ymbpm-task-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #listActions>\n <yuv-overflow-menu [menuItems]=\"actions\"></yuv-overflow-menu>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-task>\n @if (task.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{TaskStatus.COMPLETED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{TaskStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>\n\n<ng-template #assigneeTemplate let-task>\n <ymbpm-user-display [userId]=\"task.assignee\"></ymbpm-user-display>\n</ng-template>\n\n<ng-template #ownerTemplate let-task>\n <ymbpm-user-display [userId]=\"task.owner\"></ymbpm-user-display>\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "ngmodule", type: MatSortModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: YuvClientShellModule }, { kind: "directive", type: i5$2.YuvAppHeaderSlotDirective, selector: "ng-template[yuvAppHeaderSlot]", inputs: ["yuvAppHeaderSlot"] }, { kind: "ngmodule", type: YuvMasterDetailsModule }, { kind: "ngmodule", type: YuvOverflowMenuModule }, { kind: "component", type: i6$1.OverflowMenuComponent, selector: "yuv-overflow-menu", inputs: ["overflowIcon", "groupLabels", "menuItems", "vertical"] }, { kind: "component", type: BpmTableComponent, selector: "ymbpm-table", inputs: ["columns", "dataSource", "enableFilters", "pagination", "selectedRow", "busy"], outputs: ["filtersChange", "pageChange", "rowSelected"] }, { kind: "component", type: TaskDetailsComponent, selector: "ymbpm-task-details", inputs: ["taskId"] }, { kind: "component", type: UserDisplayComponent, selector: "ymbpm-user-display", inputs: ["userId"] }, { kind: "ngmodule", type: YmtLayoutModule }, { kind: "component", type: i6.MasterDetailsLayoutComponent, selector: "ymt-master-details-layout", inputs: ["layoutSettingsID", "options", "direction", "gutterSize", "detailsActive"], outputs: ["detailsActiveChange"] }, { kind: "directive", type: i6.YmtLayoutPaneDirective, selector: "[ymtLayoutPane]", inputs: ["role", "topBarActions"] }, { kind: "ngmodule", type: YmtPanesModule }, { kind: "component", type: i7.YmtPaneHeaderComponent, selector: "ymt-pane-header", inputs: ["title", "icon", "subtitle", "actions", "badges"] }, { kind: "component", type: i7.YmtPaneBodyComponent, selector: "ymt-pane-body" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
2598
2781
  }
2599
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: YuvTasksPageComponent, decorators: [{
2782
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: YuvTasksPageComponent, decorators: [{
2600
2783
  type: Component,
2601
2784
  args: [{ selector: 'ymbpm-tasks-page', standalone: true, imports: [
2602
2785
  CommonModule,
@@ -2613,9 +2796,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
2613
2796
  YuvOverflowMenuModule,
2614
2797
  BpmTableComponent,
2615
2798
  TaskDetailsComponent,
2799
+ UserDisplayComponent,
2616
2800
  YmtLayoutModule,
2617
2801
  YmtPanesModule
2618
- ], template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\"\n [busy]=\"busy()\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n \n <ng-template ymtLayoutPane role=\"details\">\n @let selectedTask = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedTask ? 'task' : undefined\" [title]=\"selectedTask ? (selectedTask.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedTask ? selectedTask.id : ''\" [actions]=\"listActions\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedTask) {\n <ymbpm-task-details [taskId]=\"selectedTask?.id\"></ymbpm-task-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #listActions>\n <yuv-overflow-menu [menuItems]=\"actions\"></yuv-overflow-menu>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-task>\n @if (task.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{TaskStatus.COMPLETED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{TaskStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"] }]
2802
+ ], template: "<ng-template yuvAppHeaderSlot=\"actions\">\n</ng-template>\n\n<ymt-master-details-layout\n [detailsActive]=\"enableDetails()\"\n [options]=\"layoutOptions()\"\n [layoutSettingsID]=\"layoutSettingsID\">\n\n <ng-template ymtLayoutPane role=\"master\" [topBarActions]=\"masterPaneActions\">\n <ymt-pane-body>\n <ymbpm-table \n [dataSource]=\"dataSource()\" \n [columns]=\"displayedColumns\" \n [pagination]=\"pagination\" \n [selectedRow]=\"selection().selected.at(0)\"\n [enableFilters]=\"enableFilters\"\n (pageChange)=\"onChangePage($event)\"\n (rowSelected)=\"onRowSelected($event)\"\n (filtersChange)=\"onFiltersChange($event)\"\n [busy]=\"busy()\">\n </ymbpm-table>\n </ymt-pane-body>\n </ng-template>\n \n <ng-template ymtLayoutPane role=\"details\">\n @let selectedTask = selection().selected.at(0);\n <ymt-pane-header [icon]=\"selectedTask ? 'task' : undefined\" [title]=\"selectedTask ? (selectedTask.name || '&lt;unnamed&gt;') : ''\" [subtitle]=\"selectedTask ? selectedTask.id : ''\" [actions]=\"listActions\"></ymt-pane-header>\n <ymt-pane-body>\n <div class=\"detailsPaneContainer\">\n @if (selectedTask) {\n <ymbpm-task-details [taskId]=\"selectedTask?.id\"></ymbpm-task-details>\n } @else {\n <div class=\"no-selection\">\n <mat-icon>{{icons.info}}</mat-icon>\n <p>{{ 'yuv.app.bpm-management.details.noSelection.label' | translate }}</p>\n </div>\n }\n </div>\n </ymt-pane-body>\n </ng-template>\n</ymt-master-details-layout>\n\n<ng-template #masterPaneActions>\n <div class=\"table-actions\">\n <button mat-icon-button *ngIf=\"this.enableFilters\" [disabled]=\"!hasActiveFilters()\" (click)=\"bpmTableComponent?.clearAllFilters()\" [matTooltip]=\"'yuv.app.bpm-management.filters.clearAll' | translate\">\n <mat-icon>{{icons.clearFilter}}</mat-icon>\n </button>\n <button mat-icon-button (click)=\"refresh()\" [matTooltip]=\"'yuv.app.bpm-management.navigation.refresh.tooltip' | translate\">\n <mat-icon>{{icons.refresh}}</mat-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #listActions>\n <yuv-overflow-menu [menuItems]=\"actions\"></yuv-overflow-menu>\n</ng-template>\n\n<!-- Templates for table cells -->\n<ng-template #statusTemplate let-task>\n @if (task.endTime) {\n <span class=\"yuv-bpmn-status completed\">{{TaskStatus.COMPLETED.label | translate}}</span>\n } @else {\n <span class=\"yuv-bpmn-status running\">{{TaskStatus.RUNNING.label | translate}}</span>\n }\n</ng-template>\n\n<ng-template #assigneeTemplate let-task>\n <ymbpm-user-display [userId]=\"task.assignee\"></ymbpm-user-display>\n</ng-template>\n\n<ng-template #ownerTemplate let-task>\n <ymbpm-user-display [userId]=\"task.owner\"></ymbpm-user-display>\n</ng-template>", styles: [":host{--mat-table-row-item-outline-color: var(--ymt-outline-variant);height:100%;overflow:hidden;display:flex;flex-flow:column}:host ymt-master-details-layout{height:100%;padding:1rem}:host ymt-master-details-layout .detailsPaneContainer{display:flex;flex-direction:column;height:100%;overflow:auto}:host ymt-master-details-layout .detailsPaneContainer .no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}:host ymt-master-details-layout .detailsPaneContainer .no-selection mat-icon{font-size:48px;width:48px;height:48px;margin-bottom:var(--ymt-spacing-m);opacity:.5}:host ymt-master-details-layout .detailsPaneContainer .no-selection p{font-size:1rem}\n"] }]
2619
2803
  }], propDecorators: { taskDetailsComponent: [{
2620
2804
  type: ViewChild,
2621
2805
  args: [TaskDetailsComponent]
@@ -2625,6 +2809,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
2625
2809
  }], statusTemplate: [{
2626
2810
  type: ViewChild,
2627
2811
  args: ['statusTemplate', { static: true }]
2812
+ }], assigneeTemplate: [{
2813
+ type: ViewChild,
2814
+ args: ['assigneeTemplate', { static: true }]
2815
+ }], ownerTemplate: [{
2816
+ type: ViewChild,
2817
+ args: ['ownerTemplate', { static: true }]
2628
2818
  }] } });
2629
2819
 
2630
2820
  const YuvBpmManagementRoutes = [