@bizdoc/core 2.3.22 → 2.3.24

package/fesm2022/bizdoc-core.mjs

@@ -1001,7 +1001,7 @@ const STRINGS = {
         Preferences: 'Settings',
         Tags: 'Tags',
         Mention: 'Mention',
-        TagsHint: 'Type tags',
+        TagsHint: 'Choose or type your tags',
         ContinueEditing: 'Continue editing',
         Close: 'Close',
         View: 'View',
@@ -1480,7 +1480,9 @@ const STRINGS = {
         ComposeFemale: "צרי חדש",
         Preferences: 'העדפות',
         Tags: 'תגיות',
-        TagsHint: 'הקלד/י תגיות',
+        TagsHint: 'בחר/י או הקלד/י תגיות אשיות',
+        TagsHintMale: 'בחר או הקלד תגיות אשיות',
+        TagsHintFemale: ' אשיותבחרי או הקלדי תגיות',
         ContinueEditing: 'המשך/י לערוך',
         ContinueEditingMale: 'המשך לערוך',
         ContinueEditingFemale: 'המשכי לערוך',
@@ -5407,20 +5409,22 @@ class CubeService {
         return (source) => new Observable(observe => {
             source.subscribe({
                 next: r => {
-                    const observables = [];
-                    const options = this._session.profile.cubes.find(c => c.name === cube);
-                    const axisTypeMap = {};
-                    options.axes.forEach(x => axisTypeMap[x.name] = x.dataType);
                     if (!r.length) {
                         observe.next(r);
                         observe.complete();
                         return;
                     }
+                    const observables = [];
+                    const configuration = this._session.profile.cubes.find(c => c.name === cube);
+                    const axisTypeMap = {};
+                    configuration.axes.forEach(x => axisTypeMap[x.name] = x.dataType);
+                    // compare base
                     const base = r[0].points;
                     r.forEach((s, i) => {
                         s.points.forEach(p => {
                             if (!p.x)
                                 return;
+                            // add human-readable name to point x
                             const pobservable = forkJoin(p.x.split(AXES_CODE_DIVIDER).map((k, j) => this._type.get(axisTypeMap[xAxis[j]], k))).
                                 pipe(tap(o => p.name = o.join(AXES_LABEL_DIVIDER)));
                             observables.push(pobservable);
@@ -5437,23 +5441,28 @@ class CubeService {
                                     j++;
                                 }
                                 if (missing) {
+                                    // add point to first array base
                                     const clone = { x: p.x, y: 0 };
                                     base.splice(j, 0, clone);
+                                    // add human-readable name to point x
                                     const cobservable = forkJoin(p.x.split(AXES_CODE_DIVIDER).map((k, j) => this._type.get(axisTypeMap[xAxis[j]], k))).
                                         pipe(tap(o => clone.name = o.join(AXES_LABEL_DIVIDER)));
                                     observables.push(cobservable);
                                 }
                             }
                         });
+                        // is index entry
                         if (s.index) {
-                            const index = options.indices.find(i => i.name === s.index);
+                            const index = configuration.indices.find(i => i.name === s.index);
                             s.title = index.title;
                         }
                         else if (s.name) {
+                            // add human-readable title to series name
                             const sobservable = forkJoin(s.name.split(AXES_CODE_DIVIDER).map((k, i) => this._type.get(axisTypeMap[series[i]], k))).pipe(tap(v => s.title = v.join(AXES_LABEL_DIVIDER)));
                             observables.push(sobservable);
                         }
                     });
+                    // complete when all done
                     if (observables.length)
                         forkJoin(observables).subscribe({
                             next: () => {
@@ -9694,13 +9703,13 @@ class ComposePaneComponent {
         this._navigate('views');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ComposePaneComponent, deps: [{ token: SessionService }, { token: MailboxService }, { token: PaneRef }, { token: PanesRouter }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ComposePaneComponent, selector: "bizdoc-compose.pane", host: { listeners: { "document:drop": "handleDocumentDrop($event)", "drop": "handleDrop($event)", "dragenter": "handleEnter($event)", "dragleave": "handleLeave($event)", "dragover": "handleOver($event)", "document:keydown": "handleKeydown($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "form", first: true, predicate: ComposeFormComponent, descendants: true, static: true }, { propertyName: "dropableElement", first: true, predicate: ["dropable"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar sticky\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-stroked-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\">\n      <span>{{'Submit' | translate}}</span>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-stroked-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\">\n      <span>{{form.actions[0].title}}</span>\n    </button>\n  }\n  @if (form.actions.length > 1) {\n    <button mat-stroked-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionMenu\" [disabled]=\"!valid||working\">\n      <span>{{'Send' | translate}}</span>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionMenu>\n    <ng-template matMenuContent>\n      @for (a of form.actions; track a; let i = $index) {\n        @if (i > 0 && form.actions[i - 1].group !== a.group) {\n          <mat-divider></mat-divider>\n        }\n        <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n      }\n    </ng-template>\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"save()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"'Save'|translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon [class.document-flag]=\"model.flag\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && model.pending && !model.completed) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"navTrace()\" [bizdocTooltip]=\"'Trace' | translate\" tabindex=\"1\"><mat-icon>timeline</mat-icon></button>\n  <button mat-icon-button (click)=\"navComments()\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon [class.filled]=\"model.comments.length > 0\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"view()\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  @if (expendable) {\n    <button mat-icon-button (click)=\"expand()\" [bizdocTooltip]=\"'Expand' | translate\" [attr.aria-label]=\"'Expand' | translate\"><mat-icon>open_in_new</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n      <mat-divider></mat-divider>\n      <button mat-menu-item (click)=\"close()\"><!--<mat-icon></mat-icon>--><span>{{'Close'| translate}}</span></button>\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<div class=\"file-dropable flex\" #dropable>\n  <bizdoc-form [model]=model #form\n    (modelChange)=\"change()\"\n    (saved)=\"saved()\"\n    (validChange)=\"valid=$event\"\n    (workingChange)=\"working=$event\"\n  (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i9$2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: ComposeFormComponent, selector: "bizdoc-form", inputs: ["model", "working", "dirty", "valid", "mode", "contacts"], outputs: ["modelChange", "workingChange", "dirtyChange", "validChange", "saved"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ComposePaneComponent, selector: "bizdoc-compose.pane", host: { listeners: { "document:drop": "handleDocumentDrop($event)", "drop": "handleDrop($event)", "dragenter": "handleEnter($event)", "dragleave": "handleLeave($event)", "dragover": "handleOver($event)", "document:keydown": "handleKeydown($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "form", first: true, predicate: ComposeFormComponent, descendants: true, static: true }, { propertyName: "dropableElement", first: true, predicate: ["dropable"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-stroked-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\">\n      <span>{{'Submit' | translate}}</span>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-stroked-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\">\n      <span>{{form.actions[0].title}}</span>\n    </button>\n  }\n  @else if (form.actions.length > 1) {\n    <button mat-stroked-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionMenu\" [disabled]=\"!valid||working\">\n      <span>{{'Send' | translate}}</span>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionMenu>\n    <ng-template matMenuContent>\n      @for (a of form.actions; track a; let i = $index) {\n        @if (i > 0 && form.actions[i - 1].group !== a.group) {\n          <mat-divider></mat-divider>\n        }\n        <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n      }\n    </ng-template>\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"save()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"'Save'|translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon [class.document-flag]=\"model.flag\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && model.pending && !model.completed) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"navTrace()\" [bizdocTooltip]=\"'Trace' | translate\" tabindex=\"1\"><mat-icon>timeline</mat-icon></button>\n  <button mat-icon-button (click)=\"navComments()\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon [class.filled]=\"model.comments.length > 0\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"view()\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  @if (expendable) {\n    <button mat-icon-button (click)=\"expand()\" [bizdocTooltip]=\"'Expand' | translate\" [attr.aria-label]=\"'Expand' | translate\"><mat-icon>open_in_new</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n      <mat-divider></mat-divider>\n      <button mat-menu-item (click)=\"close()\"><!--<mat-icon></mat-icon>--><span>{{'Close'| translate}}</span></button>\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<div class=\"file-dropable flex\" #dropable>\n  <bizdoc-form [model]=model #form\n    (modelChange)=\"change()\"\n    (saved)=\"saved()\"\n    (validChange)=\"valid=$event\"\n    (workingChange)=\"working=$event\"\n  (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i9$2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: ComposeFormComponent, selector: "bizdoc-form", inputs: ["model", "working", "dirty", "valid", "mode", "contacts"], outputs: ["modelChange", "workingChange", "dirtyChange", "validChange", "saved"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ComposePaneComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bizdoc-compose.pane', host: {
                         class: 'pane'
-                    }, template: "<mat-toolbar class=\"nav-toolbar sticky\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-stroked-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\">\n      <span>{{'Submit' | translate}}</span>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-stroked-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\">\n      <span>{{form.actions[0].title}}</span>\n    </button>\n  }\n  @if (form.actions.length > 1) {\n    <button mat-stroked-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionMenu\" [disabled]=\"!valid||working\">\n      <span>{{'Send' | translate}}</span>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionMenu>\n    <ng-template matMenuContent>\n      @for (a of form.actions; track a; let i = $index) {\n        @if (i > 0 && form.actions[i - 1].group !== a.group) {\n          <mat-divider></mat-divider>\n        }\n        <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n      }\n    </ng-template>\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"save()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"'Save'|translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon [class.document-flag]=\"model.flag\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && model.pending && !model.completed) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"navTrace()\" [bizdocTooltip]=\"'Trace' | translate\" tabindex=\"1\"><mat-icon>timeline</mat-icon></button>\n  <button mat-icon-button (click)=\"navComments()\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon [class.filled]=\"model.comments.length > 0\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"view()\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  @if (expendable) {\n    <button mat-icon-button (click)=\"expand()\" [bizdocTooltip]=\"'Expand' | translate\" [attr.aria-label]=\"'Expand' | translate\"><mat-icon>open_in_new</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n      <mat-divider></mat-divider>\n      <button mat-menu-item (click)=\"close()\"><!--<mat-icon></mat-icon>--><span>{{'Close'| translate}}</span></button>\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<div class=\"file-dropable flex\" #dropable>\n  <bizdoc-form [model]=model #form\n    (modelChange)=\"change()\"\n    (saved)=\"saved()\"\n    (validChange)=\"valid=$event\"\n    (workingChange)=\"working=$event\"\n  (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n</div>\n" }]
+                    }, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-stroked-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\">\n      <span>{{'Submit' | translate}}</span>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-stroked-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\">\n      <span>{{form.actions[0].title}}</span>\n    </button>\n  }\n  @else if (form.actions.length > 1) {\n    <button mat-stroked-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionMenu\" [disabled]=\"!valid||working\">\n      <span>{{'Send' | translate}}</span>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionMenu>\n    <ng-template matMenuContent>\n      @for (a of form.actions; track a; let i = $index) {\n        @if (i > 0 && form.actions[i - 1].group !== a.group) {\n          <mat-divider></mat-divider>\n        }\n        <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n      }\n    </ng-template>\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"save()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"'Save'|translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon [class.document-flag]=\"model.flag\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && model.pending && !model.completed) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"navTrace()\" [bizdocTooltip]=\"'Trace' | translate\" tabindex=\"1\"><mat-icon>timeline</mat-icon></button>\n  <button mat-icon-button (click)=\"navComments()\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon [class.filled]=\"model.comments.length > 0\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"view()\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  @if (expendable) {\n    <button mat-icon-button (click)=\"expand()\" [bizdocTooltip]=\"'Expand' | translate\" [attr.aria-label]=\"'Expand' | translate\"><mat-icon>open_in_new</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n      <mat-divider></mat-divider>\n      <button mat-menu-item (click)=\"close()\"><!--<mat-icon></mat-icon>--><span>{{'Close'| translate}}</span></button>\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<div class=\"file-dropable flex\" #dropable>\n  <bizdoc-form [model]=model #form\n    (modelChange)=\"change()\"\n    (saved)=\"saved()\"\n    (validChange)=\"valid=$event\"\n    (workingChange)=\"working=$event\"\n  (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n</div>\n" }]
         }], ctorParameters: () => [{ type: SessionService }, { type: MailboxService }, { type: PaneRef }, { type: PanesRouter }], propDecorators: { form: [{
                 type: ViewChild,
                 args: [ComposeFormComponent, { static: true }]
@@ -9826,13 +9835,13 @@ class BrowsePaneComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: BrowsePaneComponent, deps: [{ token: PaneRef }, { token: SessionService }, { token: Popup }, { token: PanesRouter }, { token: i1$3.Directionality }, { token: TranslateService }, { token: i2$6.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: BrowsePaneComponent, selector: "bizdoc-browse.pane", host: { listeners: { "document:keydown": "handleKeydown($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "items", first: true, predicate: BrowseItemsComponent, descendants: true, static: true }, { propertyName: "search", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\" >\n  @if (!items.selection.isEmpty()) {\n    <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n    @if (items.isAllDraft()) {\n      <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n    }\n    @if (items.isAllDraft()) {\n      <button mat-button color=\"primary\" class=\"hide-xs\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n    }\n    @if (items.isAllDraft()) {\n      <button mat-icon-button color=\"primary\" class=\"show-xs\" (click)=\"items.submitAll()\" [bizdocTooltip]=\"'Submit' | translate\" [attr.aria-label]=\"'Submit' | translate\"><mat-icon>send</mat-icon></button>\n    }\n    @if (items.sharedActions.length === 1) {\n      <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">@if (items.sharedActions[0].icon) {\n        <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n      }{{'SendSelected' | translate : items.selection.selected.length}}</button>\n    }\n    @if (items.sharedActions.length > 1) {\n      <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n        {{'SendSelected'| translate : items.selection.selected.length }}\n      </button>\n    }\n    <mat-menu #action>\n      @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n        @if (i>0 && items.sharedActions[i-1].group !== a.group) {\n          <mat-divider>\n          </mat-divider>\n        }\n        <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n          {{ a.title }}\n        </button>\n      }\n    </mat-menu>\n    <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n    <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n    <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n    [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'Search' | translate}}\"\n    class=\"mat-body search-box\"\n    #searchInput\n    (keydown.escape)=\"clearSearch($event)\">\n    @if (contains.value) {\n      <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n    }\n    <span class=\"divider\"></span>\n    <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n    <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n    <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n(open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n<ng-template #search>\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n  [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n  <mat-icon>search</mat-icon>\n</button>\n[@search]=\"searching\"\n(@search.done)=\"searching && focus()\"-->\n<input matInput\n  [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'Search' | translate}}\"\n  class=\"mat-body search-box\"\n  #searchInput\n  (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n    <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n</ng-template>\n", styles: [":host{min-width:540px;display:contents!important}\n"], dependencies: [{ 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: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: BrowseItemsComponent, selector: "bizdoc-browse-items", inputs: ["folderId", "filterType", "filters"], outputs: ["open", "view"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [searchAnimation] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: BrowsePaneComponent, selector: "bizdoc-browse.pane", host: { listeners: { "document:keydown": "handleKeydown($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "items", first: true, predicate: BrowseItemsComponent, descendants: true, static: true }, { propertyName: "search", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (!items.selection.isEmpty()) {\n  <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n  @if (items.isAllDraft()) {\n  <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n  <button mat-button color=\"primary\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  }\n  @if (items.sharedActions.length === 1) {\n  <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">\n    @if (items.sharedActions[0].icon) {\n    <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}\n  </button>\n  }\n  @else if (items.sharedActions.length > 1) {\n  <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n    {{'SendSelected'| translate : items.selection.selected.length }}\n  </button>\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n    @if (i>0 && items.sharedActions[i-1].group !== a.group) {\n    <mat-divider>\n    </mat-divider>\n    }\n    <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n      {{ a.title }}\n    </button>\n    }\n  </mat-menu>\n  }\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n         [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'Search' | translate}}\"\n         class=\"mat-body search-box\"\n         #searchInput\n         (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n  <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n                     (open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n", styles: [":host{min-width:540px;display:contents!important}\n"], dependencies: [{ 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: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: BrowseItemsComponent, selector: "bizdoc-browse-items", inputs: ["folderId", "filterType", "filters"], outputs: ["open", "view"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [searchAnimation] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: BrowsePaneComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bizdoc-browse.pane', animations: [searchAnimation], host: {
                         class: 'pane'
-                    }, template: "<mat-toolbar class=\"nav-toolbar\" >\n  @if (!items.selection.isEmpty()) {\n    <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n    @if (items.isAllDraft()) {\n      <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n    }\n    @if (items.isAllDraft()) {\n      <button mat-button color=\"primary\" class=\"hide-xs\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n    }\n    @if (items.isAllDraft()) {\n      <button mat-icon-button color=\"primary\" class=\"show-xs\" (click)=\"items.submitAll()\" [bizdocTooltip]=\"'Submit' | translate\" [attr.aria-label]=\"'Submit' | translate\"><mat-icon>send</mat-icon></button>\n    }\n    @if (items.sharedActions.length === 1) {\n      <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">@if (items.sharedActions[0].icon) {\n        <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n      }{{'SendSelected' | translate : items.selection.selected.length}}</button>\n    }\n    @if (items.sharedActions.length > 1) {\n      <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n        {{'SendSelected'| translate : items.selection.selected.length }}\n      </button>\n    }\n    <mat-menu #action>\n      @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n        @if (i>0 && items.sharedActions[i-1].group !== a.group) {\n          <mat-divider>\n          </mat-divider>\n        }\n        <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n          {{ a.title }}\n        </button>\n      }\n    </mat-menu>\n    <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n    <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n    <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n    [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'Search' | translate}}\"\n    class=\"mat-body search-box\"\n    #searchInput\n    (keydown.escape)=\"clearSearch($event)\">\n    @if (contains.value) {\n      <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n    }\n    <span class=\"divider\"></span>\n    <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n    <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n    <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n(open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n<ng-template #search>\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n  [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n  <mat-icon>search</mat-icon>\n</button>\n[@search]=\"searching\"\n(@search.done)=\"searching && focus()\"-->\n<input matInput\n  [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'Search' | translate}}\"\n  class=\"mat-body search-box\"\n  #searchInput\n  (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n    <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n</ng-template>\n", styles: [":host{min-width:540px;display:contents!important}\n"] }]
+                    }, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (!items.selection.isEmpty()) {\n  <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n  @if (items.isAllDraft()) {\n  <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n  <button mat-button color=\"primary\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  }\n  @if (items.sharedActions.length === 1) {\n  <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">\n    @if (items.sharedActions[0].icon) {\n    <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}\n  </button>\n  }\n  @else if (items.sharedActions.length > 1) {\n  <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n    {{'SendSelected'| translate : items.selection.selected.length }}\n  </button>\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n    @if (i>0 && items.sharedActions[i-1].group !== a.group) {\n    <mat-divider>\n    </mat-divider>\n    }\n    <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n      {{ a.title }}\n    </button>\n    }\n  </mat-menu>\n  }\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n         [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'Search' | translate}}\"\n         class=\"mat-body search-box\"\n         #searchInput\n         (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n  <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n                     (open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n", styles: [":host{min-width:540px;display:contents!important}\n"] }]
         }], ctorParameters: () => [{ type: PaneRef }, { type: SessionService }, { type: Popup }, { type: PanesRouter }, { type: i1$3.Directionality }, { type: TranslateService }, { type: i2$6.MatDialog }], propDecorators: { items: [{
                 type: ViewChild,
                 args: [BrowseItemsComponent, { static: true }]
@@ -9864,7 +9873,7 @@ class CubeAccumulationChartComponent {
         this._elementRef = _elementRef;
         this._session = _session;
         this.id = `cube-accum-chart-${CubeAccumulationChartComponent.nextId++}`;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.dataLabel = {
             visible: true,
             name: 'text',
@@ -9895,7 +9904,7 @@ class CubeAccumulationChartComponent {
         this._destroy = new Subject();
         _session.themeChange.pipe(takeUntil$1(this._destroy)).
             subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
         });
     }
@@ -10176,12 +10185,12 @@ class CubeChartComponent {
             enable: false,
             lineType: 'Vertical'
         };
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this._intl = new Internationalization();
         this._destroy = new Subject();
         _session.themeChange.pipe(takeUntil$1(this._destroy)).
             subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
             this._draw();
         });
@@ -10454,25 +10463,25 @@ class CubeGridComponent {
         this._cube = this.cube ? this._session.profile.cubes.find(c => c.name === this.cube) : this._session.profile.cubes[0];
         this.currencyCode = this._cube.currencyCode;
         const x = this._cube.axes.find(a => a.name === this._xAxis[0]), y = this._cube.axes.find(a => a.name === this._series[0]);
-        const promises = [];
-        // aquire columns source
-        let observe = this._ds.all(x.dataType).
-            pipe(tap(c => {
-            this._columns = c;
-            const format = `${this.currencyCode ? 'c' : 'n'}${this._service.fractionDigits}`;
-            this.columns = [{
-                    headerText: '', field: 'title',
-                }];
-            this._columns.forEach(c => this.columns.push({
-                field: `_${c.key}`,
-                headerText: c.value,
-                width: 120,
-                format,
-                textAlign: 'Right'
-            }));
-            this.aggregates = [{
-                    columns: this._columns.map(c => {
-                        return {
+        // prepare
+        this._ready = Promise.all([
+            // aquire rows source
+            firstValueFrom(this._ds.all(y.dataType)).
+                then(r => {
+                this._rows = r;
+                const format = `${this.currencyCode ? 'c' : 'n'}${this._service.fractionDigits}`;
+                this.columns = [{
+                        headerText: '', field: 'title',
+                    }];
+                this._columns.forEach(c => this.columns.push({
+                    field: `_${c.key}`,
+                    headerText: c.value,
+                    width: 120,
+                    format,
+                    textAlign: 'Right'
+                }));
+                this.aggregates = [{
+                        columns: this._columns.map(c => ({
                             columnName: `_${c.key}`,
                             field: `_${c.key}`,
                             type: 'Custom',
@@ -10481,17 +10490,13 @@ class CubeGridComponent {
                             //\${Custom} \${/if}`,
                             format,
                             customAggregate: this.customAggregate.bind(this)
-                        };
-                    })
-                }];
-        }));
-        promises.push(observe);
-        // aquire rows source
-        observe = this._ds.all(y.dataType).
-            pipe(tap(r => this._rows = r));
-        promises.push(observe);
-        // prepare
-        this._prepare = firstValueFrom(forkJoin(promises));
+                        }))
+                    }];
+            }),
+            // aquire columns source
+            firstValueFrom(this._ds.all(x.dataType)).
+                then(c => this._columns = c)
+        ]);
         this.execute();
     }
     /** */
@@ -10505,28 +10510,24 @@ class CubeGridComponent {
         this.loadingChange.emit(true);
         this._service.series(this._cube.name, this._xAxis, { series: this._series, filters: this.filters, indices: this._indices }).
             subscribe({
-            next: series => {
-                this._prepare.then(() => {
-                    const rows = [];
-                    series.filter(s => s.index).forEach(s => {
-                        const row = { title: s.title, type: 'Index', key: s.index };
-                        this._normalize(row, s.points);
-                        rows.push(row);
-                    });
-                    this._rows.forEach(r => {
-                        const row = { title: r.value, key: r.key }, serie = series.find(s => s.name === r.key);
-                        serie &&
-                            this._normalize(row, serie.points);
-                        rows.push(row);
-                    });
-                    this.dataSource = rows;
-                    this._draw();
-                    this.loadingChange.emit(false);
+            next: series => this._ready.then(() => {
+                const rows = [];
+                series.filter(s => s.index).forEach(s => {
+                    const row = { title: s.title, type: 'Index', key: s.index };
+                    this._normalize(row, s.points);
+                    rows.push(row);
                 });
-            }, error: (e) => {
-                this._sb.error(errResource(e));
-                this.loadingChange.emit(false);
-            }
+                this._rows.forEach(r => {
+                    const row = { title: r.value, key: r.key }, serie = series.find(s => s.name === r.key);
+                    serie &&
+                        this._normalize(row, serie.points);
+                    rows.push(row);
+                });
+                this.dataSource = rows;
+                this._draw();
+            }),
+            error: (e) => this._sb.error(errResource(e)),
+            complete: () => this.loadingChange.emit(false)
         });
     }
     _normalize(row, points) {
@@ -10539,19 +10540,23 @@ class CubeGridComponent {
     _draw() {
         this.grid && this.grid.destroy();
         this.grid = new Grid({
+            enableAdaptiveUI: isMobile(),
+            enableStickyHeader: true,
             dataSource: this.dataSource,
+            enableRtl: this._session.inverse,
+            locale: this._session.locale,
             columns: this.columns,
             enableHover: false,
             allowExcelExport: true,
             selectionSettings: this.selectionSettings,
             allowSorting: false,
             frozenColumns: 1,
+            //frozenRows: this.indices ? this.indices.length : 0,
             width: this.width,
             //height: this.height,
             cellSelecting: this.cellSelecting.bind(this),
             allowPaging: false,
             queryCellInfo: this.queryCellInfo,
-            frozenRows: this.indices ? this.indices.length : 0,
             aggregates: this.aggregates,
             currencyCode: this.currencyCode
         }, this._elementRef.nativeElement);
@@ -10688,7 +10693,7 @@ class CubePivotComponent {
         this._destroy = new Subject();
         this._session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
             if (this.pivot.chart) {
-                this.chartSettings.theme = t.dark ? 'MaterialDark' : 'Material';
+                this.chartSettings.theme = t.dark ? 'Material3Dark' : 'Material3';
                 this.chartSettings.palettes = this._session.accentPalette;
             }
             else
@@ -10728,7 +10733,7 @@ class CubePivotComponent {
                     border: { width: 0 }
                 },
                 palettes: this.palettes,
-                theme: this._session.theme.dark ? 'MaterialDark' : 'Material',
+                theme: this._session.theme.dark ? 'Material3Dark' : 'Material3',
                 background: 'transparent',
                 primaryXAxis: {
                     titleStyle: {
@@ -11291,14 +11296,15 @@ class CubeSpreadsheetComponent {
             this.rows.push({ cells, source: d, height: 25 });
         });
     }
-    _dataseries(d) {
+    _dataseries(data) {
         const style = { fontWeight: 'bold', textAlign: 'center' };
         const cells = [{ value: '' }];
         this._xcolumns.forEach(c => cells.push({ value: c.value, style }));
         this.rows = [{ cells, height: 25 }];
         this._cindices?.forEach(i => {
-            const cells = [{ value: i.title, style }], series = d.find(s => s.index === i.name), map = {};
+            const series = data.find(s => s.index === i.name);
             if (series) {
+                const cells = [{ value: i.title, style }], map = {};
                 series.points.forEach(p => map[p.x] = p.y);
                 this._xcolumns.forEach(c => cells.push({
                     value: (map[c.key] || 0),
@@ -11309,7 +11315,7 @@ class CubeSpreadsheetComponent {
             }
         });
         this._yrows.forEach(r => {
-            const cells = [{ value: r.value, style }], serie = d.find(s => s.name === r.key), map = {};
+            const cells = [{ value: r.value, style }], serie = data.find(s => s.name === r.key), map = {};
             if (serie) {
                 serie.points.forEach(p => map[p.x] = p.y);
                 this._xcolumns.forEach(c => cells.push({
@@ -13392,11 +13398,8 @@ class ReportViewerComponent {
             next: r => {
                 this._instance.onBind(r, this.args);
                 this._data = r;
-                this.progress = -1;
-            }, error: () => {
-                this._sb.error();
-                this.progress = -1;
-            }
+            }, error: () => this._sb.error(),
+            complete: () => this.progress = -1
         })));
     }
     explore(item) {
@@ -14359,13 +14362,13 @@ class WorkflowComponent {
         this._nodedestroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: WorkflowComponent, deps: [{ token: PromptService }, { token: SystemService }, { token: PaneRef }, { token: PanesRouter }, { token: SessionService }, { token: TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: WorkflowComponent, selector: "bizdoc-workflow", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "symbolPaletteEl", first: true, predicate: ["symbolPaletteEl"], descendants: true, static: true }, { propertyName: "diagramEl", first: true, predicate: ["diagramEl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\n  <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\r\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\r\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\n  </button>\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\n    </button>\n    <!--<ng-container *ngIf=\"connectors.length\">\n    < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n    <ng-container *ngIf=\"nodes[0].annotations.length\">\n      < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\n    </ng-container>\n    < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\n    < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n  </ng-container>-->\n</mat-menu>\n&nbsp;\n<button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\r\n          'sf-icon-left': alignment === 'Left',\r\n          'sf-icon-center': alignment === 'Center',\r\n          'sf-icon-bottom': alignment === 'Bottom',\r\n          'sf-icon-right': alignment === 'Right'}\"></span>\r\n  <mat-icon>arrow_drop_down</mat-icon>\n</button>\n<mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\n  <button mat-menu-item (click)=\"align('Top')\">\n    <span class=\"e-icons sf-icon-top\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Left')\">\n    <span class=\"e-icons sf-icon-left\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Center')\">\n    <span class=\"e-icons sf-icon-center\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Right')\">\n    <span class=\"e-icons sf-icon-right\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Bottom')\">\n    <span class=\"e-icons sf-icon-bottom\"></span>\n  </button>\n</mat-menu>\n<button mat-icon-button (click)=\"boldChange()\" [bizdocTooltip]=\"'Bold' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_bold</mat-icon></button>\n<button mat-icon-button (click)=\"italicChange()\" [bizdocTooltip]=\"'Italic' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_italic</mat-icon></button>\n<button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\n  [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\n  [bizdocTooltip]=\"'FontSize'|translate\">\n  <mat-icon>format_size</mat-icon>\n</button>\n<mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\n  @for (size of fontSizes; track size) {\n    <button mat-menu-item (click)=\"fontSizeChange(size)\">\n      {{size}}\n    </button>\n  }\n</mat-menu>\n<span class=\"divider\"></span>\n</mat-toolbar>\n<div class=\"row container\">\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\n    <div dir=\"ltr\" #symbolPaletteEl>\n    </div>\n  </div>\n  <div #diagramEl id=\"diagram\" class=\"flex\" dir=\"ltr\">\n  </div>\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;flex-grow:1;height:100%}.container{-webkit-flex-grow:1;flex-grow:1;overflow-y:auto}#diagram{-webkit-flex-grow:1;flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-mdc-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"], dependencies: [{ kind: "directive", type: i9$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: WorkflowComponent, selector: "bizdoc-workflow", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "symbolPaletteEl", first: true, predicate: ["symbolPaletteEl"], descendants: true, static: true }, { propertyName: "diagramEl", first: true, predicate: ["diagramEl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\n    <mat-icon>arrow_drop_down</mat-icon>\n  </button>\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\n    </button>\n    <!--<ng-container *ngIf=\"connectors.length\">\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n      <ng-container *ngIf=\"nodes[0].annotations.length\">\n        < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\n      </ng-container>\n      < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n    </ng-container>-->\n    <span class=\"divider\"></span>\n    <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\n  </mat-menu>\n  &nbsp;\n  <button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\n          'sf-icon-left': alignment === 'Left',\n          'sf-icon-center': alignment === 'Center',\n          'sf-icon-bottom': alignment === 'Bottom',\n          'sf-icon-right': alignment === 'Right'}\"></span>\n    <mat-icon>arrow_drop_down</mat-icon>\n  </button>\n  <mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\n    <button mat-menu-item (click)=\"align('Top')\">\n      <span class=\"e-icons sf-icon-top\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Left')\">\n      <span class=\"e-icons sf-icon-left\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Center')\">\n      <span class=\"e-icons sf-icon-center\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Right')\">\n      <span class=\"e-icons sf-icon-right\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Bottom')\">\n      <span class=\"e-icons sf-icon-bottom\"></span>\n    </button>\n  </mat-menu>\n  <button mat-icon-button (click)=\"boldChange()\" [bizdocTooltip]=\"'Bold' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_bold</mat-icon></button>\n  <button mat-icon-button (click)=\"italicChange()\" [bizdocTooltip]=\"'Italic' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_italic</mat-icon></button>\n  <button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\n          [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\n          [bizdocTooltip]=\"'FontSize'|translate\">\n    <mat-icon>format_size</mat-icon>\n  </button>\n  <mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\n    @for (size of fontSizes; track size) {\n    <button mat-menu-item (click)=\"fontSizeChange(size)\">\n      {{size}}\n    </button>\n    }\n  </mat-menu>\n  <span class=\"divider\"></span>\n</mat-toolbar>\n<div class=\"row container\">\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\n    <div dir=\"ltr\" #symbolPaletteEl>\n    </div>\n  </div>\n  <div #diagramEl id=\"diagram\" class=\"flex\" dir=\"ltr\">\n  </div>\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;flex-grow:1;height:100%}.container{-webkit-flex-grow:1;flex-grow:1;overflow-y:auto}#diagram{-webkit-flex-grow:1;flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-mdc-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"], dependencies: [{ kind: "directive", type: i9$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: WorkflowComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bizdoc-workflow', host: {
                         class: 'pane'
-                    }, template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\n  <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\r\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\r\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\n  </button>\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\n    </button>\n    <!--<ng-container *ngIf=\"connectors.length\">\n    < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n    <ng-container *ngIf=\"nodes[0].annotations.length\">\n      < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\n    </ng-container>\n    < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\n    < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n  </ng-container>-->\n</mat-menu>\n&nbsp;\n<button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\r\n          'sf-icon-left': alignment === 'Left',\r\n          'sf-icon-center': alignment === 'Center',\r\n          'sf-icon-bottom': alignment === 'Bottom',\r\n          'sf-icon-right': alignment === 'Right'}\"></span>\r\n  <mat-icon>arrow_drop_down</mat-icon>\n</button>\n<mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\n  <button mat-menu-item (click)=\"align('Top')\">\n    <span class=\"e-icons sf-icon-top\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Left')\">\n    <span class=\"e-icons sf-icon-left\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Center')\">\n    <span class=\"e-icons sf-icon-center\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Right')\">\n    <span class=\"e-icons sf-icon-right\"></span>\n  </button>\n  <button mat-menu-item (click)=\"align('Bottom')\">\n    <span class=\"e-icons sf-icon-bottom\"></span>\n  </button>\n</mat-menu>\n<button mat-icon-button (click)=\"boldChange()\" [bizdocTooltip]=\"'Bold' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_bold</mat-icon></button>\n<button mat-icon-button (click)=\"italicChange()\" [bizdocTooltip]=\"'Italic' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_italic</mat-icon></button>\n<button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\n  [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\n  [bizdocTooltip]=\"'FontSize'|translate\">\n  <mat-icon>format_size</mat-icon>\n</button>\n<mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\n  @for (size of fontSizes; track size) {\n    <button mat-menu-item (click)=\"fontSizeChange(size)\">\n      {{size}}\n    </button>\n  }\n</mat-menu>\n<span class=\"divider\"></span>\n</mat-toolbar>\n<div class=\"row container\">\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\n    <div dir=\"ltr\" #symbolPaletteEl>\n    </div>\n  </div>\n  <div #diagramEl id=\"diagram\" class=\"flex\" dir=\"ltr\">\n  </div>\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;flex-grow:1;height:100%}.container{-webkit-flex-grow:1;flex-grow:1;overflow-y:auto}#diagram{-webkit-flex-grow:1;flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-mdc-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"] }]
+                    }, template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\n  <span class=\"tools-divider\"></span>\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\n    <mat-icon>arrow_drop_down</mat-icon>\n  </button>\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\n    </button>\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\n    </button>\n    <!--<ng-container *ngIf=\"connectors.length\">\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n      <ng-container *ngIf=\"nodes[0].annotations.length\">\n        < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\n      </ng-container>\n      < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\n    </ng-container>-->\n    <span class=\"divider\"></span>\n    <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\n  </mat-menu>\n  &nbsp;\n  <button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\n          'sf-icon-left': alignment === 'Left',\n          'sf-icon-center': alignment === 'Center',\n          'sf-icon-bottom': alignment === 'Bottom',\n          'sf-icon-right': alignment === 'Right'}\"></span>\n    <mat-icon>arrow_drop_down</mat-icon>\n  </button>\n  <mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\n    <button mat-menu-item (click)=\"align('Top')\">\n      <span class=\"e-icons sf-icon-top\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Left')\">\n      <span class=\"e-icons sf-icon-left\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Center')\">\n      <span class=\"e-icons sf-icon-center\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Right')\">\n      <span class=\"e-icons sf-icon-right\"></span>\n    </button>\n    <button mat-menu-item (click)=\"align('Bottom')\">\n      <span class=\"e-icons sf-icon-bottom\"></span>\n    </button>\n  </mat-menu>\n  <button mat-icon-button (click)=\"boldChange()\" [bizdocTooltip]=\"'Bold' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_bold</mat-icon></button>\n  <button mat-icon-button (click)=\"italicChange()\" [bizdocTooltip]=\"'Italic' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_italic</mat-icon></button>\n  <button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\n          [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\n          [bizdocTooltip]=\"'FontSize'|translate\">\n    <mat-icon>format_size</mat-icon>\n  </button>\n  <mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\n    @for (size of fontSizes; track size) {\n    <button mat-menu-item (click)=\"fontSizeChange(size)\">\n      {{size}}\n    </button>\n    }\n  </mat-menu>\n  <span class=\"divider\"></span>\n</mat-toolbar>\n<div class=\"row container\">\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\n    <div dir=\"ltr\" #symbolPaletteEl>\n    </div>\n  </div>\n  <div #diagramEl id=\"diagram\" class=\"flex\" dir=\"ltr\">\n  </div>\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;flex-grow:1;height:100%}.container{-webkit-flex-grow:1;flex-grow:1;overflow-y:auto}#diagram{-webkit-flex-grow:1;flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-mdc-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"] }]
         }], ctorParameters: () => [{ type: PromptService }, { type: SystemService }, { type: PaneRef }, { type: PanesRouter }, { type: SessionService }, { type: TranslateService }], propDecorators: { symbolPaletteEl: [{
                 type: ViewChild,
                 args: ['symbolPaletteEl', { static: true }]
@@ -21307,11 +21310,11 @@ class BrowseMobileComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: BrowseMobileComponent, deps: [{ token: i1$4.Router }, { token: WindowTitleService }, { token: SessionService }, { token: i1$4.ActivatedRoute }, { token: i1$3.Directionality }, { token: i2$6.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: BrowseMobileComponent, selector: "ng-component", viewQueries: [{ propertyName: "items", first: true, predicate: BrowseItemsComponent, descendants: true, static: true }, { propertyName: "drawer", first: true, predicate: MatSidenav, descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  <button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>\n  @if (items.isAllDraft()) {\n    <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n    <button mat-button color=\"primary\" class=\"hide-xs\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  <!--  <span class=\"mat-body show-xs\">{{items.selection.selected.length}}</span>-->\n    <button mat-icon-button color=\"primary\" (click)=\"items.submitAll()\" [bizdocTooltip]=\"'Submit' | translate\" [attr.aria-label]=\"'Submit' | translate\" class=\"show-xs\"><mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon></button>\n  }\n  @if (items.sharedActions.length === 1) {\n    <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">@if (items.sharedActions[0].icon) {\n      <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}</button>\n  }\n  @if (items.sharedActions.length > 1) {\n    <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n      {{'SendSelected'| translate : items.selection.selected.length }}\n    </button>\n  }\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n      @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n        <mat-divider>\n        </mat-divider>\n      }\n      <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n        {{ a.title }}\n      </button>\n    }\n  </mat-menu>\n  <span class=\"divider\"></span>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\n  <button mat-icon-button (click)=\"drawer.toggle()\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\" autosize>\n  <mat-sidenav #drawer mode=\"over\" position=\"end\" [opened]=\"false\">\n    @switch (mode) {\n      @default {\n        <bizdoc-browse-filter class=\"nav-filter\" [values]=filters (valuesChange)=\"filterChange($event)\" [folderId]=\"folderId\"></bizdoc-browse-filter>\n      }\n    }\n  </mat-sidenav>\n  <mat-sidenav-content>\n    <bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\" (open)=\"open($event)\" (view)=view($event) #items></bizdoc-browse-items>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".nav-filter{padding:8px;display:flex}\n"], dependencies: [{ kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i6$4.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i6$4.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6$4.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: BrowseFilterComponent, selector: "bizdoc-browse-filter", inputs: ["values", "folderId", "exclude"], outputs: ["valuesChange"] }, { kind: "component", type: BrowseItemsComponent, selector: "bizdoc-browse-items", inputs: ["folderId", "filterType", "filters"], outputs: ["open", "view"] }, { kind: "directive", type: MatIconAnimate, selector: "[matAnimate]" }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: BrowseMobileComponent, selector: "ng-component", viewQueries: [{ propertyName: "items", first: true, predicate: BrowseItemsComponent, descendants: true, static: true }, { propertyName: "drawer", first: true, predicate: MatSidenav, descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  <button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>\n  @if (items.isAllDraft()) {\n    <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n    <button mat-button color=\"primary\" class=\"hide-xs\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  <!--  <span class=\"mat-body show-xs\">{{items.selection.selected.length}}</span>-->\n    <button mat-icon-button color=\"primary\" (click)=\"items.submitAll()\" [bizdocTooltip]=\"'Submit' | translate\" [attr.aria-label]=\"'Submit' | translate\" class=\"show-xs\"><mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon></button>\n  }\n  @if (items.sharedActions.length === 1) {\n    <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">@if (items.sharedActions[0].icon) {\n      <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}</button>\n  }\n  @else if (items.sharedActions.length > 1) {\n    <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n      {{'SendSelected'| translate : items.selection.selected.length }}\n    </button>\n  }\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n      @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n        <mat-divider>\n        </mat-divider>\n      }\n      <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n        {{ a.title }}\n      </button>\n    }\n  </mat-menu>\n  <span class=\"divider\"></span>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\n  <button mat-icon-button (click)=\"drawer.toggle()\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\" autosize>\n  <mat-sidenav #drawer mode=\"over\" position=\"end\" [opened]=\"false\">\n    @switch (mode) {\n      @default {\n        <bizdoc-browse-filter class=\"nav-filter\" [values]=filters (valuesChange)=\"filterChange($event)\" [folderId]=\"folderId\"></bizdoc-browse-filter>\n      }\n    }\n  </mat-sidenav>\n  <mat-sidenav-content>\n    <bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\" (open)=\"open($event)\" (view)=view($event) #items></bizdoc-browse-items>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".nav-filter{padding:8px;display:flex}\n"], dependencies: [{ kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i6$4.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i6$4.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6$4.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: BrowseFilterComponent, selector: "bizdoc-browse-filter", inputs: ["values", "folderId", "exclude"], outputs: ["valuesChange"] }, { kind: "component", type: BrowseItemsComponent, selector: "bizdoc-browse-items", inputs: ["folderId", "filterType", "filters"], outputs: ["open", "view"] }, { kind: "directive", type: MatIconAnimate, selector: "[matAnimate]" }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: BrowseMobileComponent, decorators: [{
             type: Component,
-            args: [{ template: "<mat-toolbar class=\"nav-toolbar\">\n  <button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>\n  @if (items.isAllDraft()) {\n    <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n    <button mat-button color=\"primary\" class=\"hide-xs\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  <!--  <span class=\"mat-body show-xs\">{{items.selection.selected.length}}</span>-->\n    <button mat-icon-button color=\"primary\" (click)=\"items.submitAll()\" [bizdocTooltip]=\"'Submit' | translate\" [attr.aria-label]=\"'Submit' | translate\" class=\"show-xs\"><mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon></button>\n  }\n  @if (items.sharedActions.length === 1) {\n    <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">@if (items.sharedActions[0].icon) {\n      <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}</button>\n  }\n  @if (items.sharedActions.length > 1) {\n    <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n      {{'SendSelected'| translate : items.selection.selected.length }}\n    </button>\n  }\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n      @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n        <mat-divider>\n        </mat-divider>\n      }\n      <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n        {{ a.title }}\n      </button>\n    }\n  </mat-menu>\n  <span class=\"divider\"></span>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\n  <button mat-icon-button (click)=\"drawer.toggle()\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\" autosize>\n  <mat-sidenav #drawer mode=\"over\" position=\"end\" [opened]=\"false\">\n    @switch (mode) {\n      @default {\n        <bizdoc-browse-filter class=\"nav-filter\" [values]=filters (valuesChange)=\"filterChange($event)\" [folderId]=\"folderId\"></bizdoc-browse-filter>\n      }\n    }\n  </mat-sidenav>\n  <mat-sidenav-content>\n    <bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\" (open)=\"open($event)\" (view)=view($event) #items></bizdoc-browse-items>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".nav-filter{padding:8px;display:flex}\n"] }]
+            args: [{ template: "<mat-toolbar class=\"nav-toolbar\">\n  <button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>\n  @if (items.isAllDraft()) {\n    <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n    <button mat-button color=\"primary\" class=\"hide-xs\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  <!--  <span class=\"mat-body show-xs\">{{items.selection.selected.length}}</span>-->\n    <button mat-icon-button color=\"primary\" (click)=\"items.submitAll()\" [bizdocTooltip]=\"'Submit' | translate\" [attr.aria-label]=\"'Submit' | translate\" class=\"show-xs\"><mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon></button>\n  }\n  @if (items.sharedActions.length === 1) {\n    <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">@if (items.sharedActions[0].icon) {\n      <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}</button>\n  }\n  @else if (items.sharedActions.length > 1) {\n    <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n      {{'SendSelected'| translate : items.selection.selected.length }}\n    </button>\n  }\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n      @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n        <mat-divider>\n        </mat-divider>\n      }\n      <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n        {{ a.title }}\n      </button>\n    }\n  </mat-menu>\n  <span class=\"divider\"></span>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button class=\"hide-xs\" (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\n  <button mat-icon-button (click)=\"drawer.toggle()\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\"><mat-icon>filter_list</mat-icon></button>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\" autosize>\n  <mat-sidenav #drawer mode=\"over\" position=\"end\" [opened]=\"false\">\n    @switch (mode) {\n      @default {\n        <bizdoc-browse-filter class=\"nav-filter\" [values]=filters (valuesChange)=\"filterChange($event)\" [folderId]=\"folderId\"></bizdoc-browse-filter>\n      }\n    }\n  </mat-sidenav>\n  <mat-sidenav-content>\n    <bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\" (open)=\"open($event)\" (view)=view($event) #items></bizdoc-browse-items>\n  </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [".nav-filter{padding:8px;display:flex}\n"] }]
         }], ctorParameters: () => [{ type: i1$4.Router }, { type: WindowTitleService }, { type: SessionService }, { type: i1$4.ActivatedRoute }, { type: i1$3.Directionality }, { type: i2$6.MatDialog }], propDecorators: { items: [{
                 type: ViewChild,
                 args: [BrowseItemsComponent, { static: true }]
@@ -21386,11 +21389,11 @@ class ComposeMobileComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ComposeMobileComponent, deps: [{ token: WindowTitleService }, { token: SessionService }, { token: i1$4.Router }, { token: i1$4.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ComposeMobileComponent, selector: "ng-component", viewQueries: [{ propertyName: "form", first: true, predicate: ComposeFormComponent, descendants: true, static: true }, { propertyName: "comments", first: true, predicate: CommentsComponent, descendants: true }, { propertyName: "drawer", first: true, predicate: MatSidenav, descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-icon-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Submit' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-icon-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"form.actions[0].title\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">{{form.actions[0].icon || 'send'}}</mat-icon>\n    </button>\n  }\n  @if (form.actions.length > 1) {\n    <button mat-icon-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionmenu\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Send' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionmenu>\n    @for (a of form.actions | sort : 'group'; track a; let i = $index) {\n      @if (i>0 && form.actions[i-1].group !== a.group) {\n        <mat-divider></mat-divider>\n      }\n      <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n    }\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"form.save().subscribe()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"(model.draft ? 'SaveDraft' : 'Save') | translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon class=\"filled\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && !model.completed && model.pending) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"toggle('comments')\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon class=\"filled\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"toggle('views')\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\">\n  <mat-sidenav-content>\n    <bizdoc-form [model]=model #form (validChange)=\"valid=$event\"\n      (workingChange)=\"working=$event\"\n    (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n  </mat-sidenav-content>\n  <mat-sidenav mode=\"over\" position=\"end\" [opened]=\"false\" #drawer autoFocus=\"false\" class=\"side-nav\">\n    @switch (viewMode) {\n      @case ('views') {\n        <bizdoc-document-views [model]=\"model\"></bizdoc-document-views>\n      }\n      @default {\n        <bizdoc-comments [model]=\"model\"></bizdoc-comments>\n      }\n    }\n  </mat-sidenav>\n</mat-sidenav-container>\n", styles: [".page-container ::ng-deep form{padding:6px}.side-nav{min-width:280px}\n"], dependencies: [{ kind: "directive", type: i9$2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i6$4.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i6$4.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6$4.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: DocumentViewsComponent, selector: "bizdoc-document-views", inputs: ["model"] }, { kind: "component", type: CommentsComponent, selector: "bizdoc-comments", inputs: ["model"], outputs: ["change"] }, { kind: "component", type: ComposeFormComponent, selector: "bizdoc-form", inputs: ["model", "working", "dirty", "valid", "mode", "contacts"], outputs: ["modelChange", "workingChange", "dirtyChange", "validChange", "saved"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ComposeMobileComponent, selector: "ng-component", viewQueries: [{ propertyName: "form", first: true, predicate: ComposeFormComponent, descendants: true, static: true }, { propertyName: "comments", first: true, predicate: CommentsComponent, descendants: true }, { propertyName: "drawer", first: true, predicate: MatSidenav, descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-icon-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Submit' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-icon-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"form.actions[0].title\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">{{form.actions[0].icon || 'send'}}</mat-icon>\n    </button>\n  }\n  @else if (form.actions.length > 1) {\n    <button mat-icon-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionmenu\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Send' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionmenu>\n    @for (a of form.actions | sort : 'group'; track a; let i = $index) {\n      @if (i > 0 && form.actions[i-1].group !== a.group) {\n        <mat-divider></mat-divider>\n      }\n      <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n    }\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"form.save().subscribe()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"(model.draft ? 'SaveDraft' : 'Save') | translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon class=\"filled\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && !model.completed && model.pending) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"toggle('comments')\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon class=\"filled\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"toggle('views')\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\">\n  <mat-sidenav-content>\n    <bizdoc-form [model]=model #form (validChange)=\"valid=$event\"\n      (workingChange)=\"working=$event\"\n    (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n  </mat-sidenav-content>\n  <mat-sidenav mode=\"over\" position=\"end\" [opened]=\"false\" #drawer autoFocus=\"false\" class=\"side-nav\">\n    @switch (viewMode) {\n      @case ('views') {\n        <bizdoc-document-views [model]=\"model\"></bizdoc-document-views>\n      }\n      @default {\n        <bizdoc-comments [model]=\"model\"></bizdoc-comments>\n      }\n    }\n  </mat-sidenav>\n</mat-sidenav-container>\n", styles: [".page-container ::ng-deep form{padding:6px}.side-nav{min-width:280px}\n"], dependencies: [{ kind: "directive", type: i9$2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i6$4.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i6$4.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6$4.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: DocumentViewsComponent, selector: "bizdoc-document-views", inputs: ["model"] }, { kind: "component", type: CommentsComponent, selector: "bizdoc-comments", inputs: ["model"], outputs: ["change"] }, { kind: "component", type: ComposeFormComponent, selector: "bizdoc-form", inputs: ["model", "working", "dirty", "valid", "mode", "contacts"], outputs: ["modelChange", "workingChange", "dirtyChange", "validChange", "saved"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ComposeMobileComponent, decorators: [{
             type: Component,
-            args: [{ template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-icon-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Submit' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-icon-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"form.actions[0].title\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">{{form.actions[0].icon || 'send'}}</mat-icon>\n    </button>\n  }\n  @if (form.actions.length > 1) {\n    <button mat-icon-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionmenu\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Send' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionmenu>\n    @for (a of form.actions | sort : 'group'; track a; let i = $index) {\n      @if (i>0 && form.actions[i-1].group !== a.group) {\n        <mat-divider></mat-divider>\n      }\n      <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n    }\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"form.save().subscribe()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"(model.draft ? 'SaveDraft' : 'Save') | translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon class=\"filled\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && !model.completed && model.pending) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"toggle('comments')\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon class=\"filled\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"toggle('views')\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\">\n  <mat-sidenav-content>\n    <bizdoc-form [model]=model #form (validChange)=\"valid=$event\"\n      (workingChange)=\"working=$event\"\n    (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n  </mat-sidenav-content>\n  <mat-sidenav mode=\"over\" position=\"end\" [opened]=\"false\" #drawer autoFocus=\"false\" class=\"side-nav\">\n    @switch (viewMode) {\n      @case ('views') {\n        <bizdoc-document-views [model]=\"model\"></bizdoc-document-views>\n      }\n      @default {\n        <bizdoc-comments [model]=\"model\"></bizdoc-comments>\n      }\n    }\n  </mat-sidenav>\n</mat-sidenav-container>\n", styles: [".page-container ::ng-deep form{padding:6px}.side-nav{min-width:280px}\n"] }]
+            args: [{ template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (form.page !== undefined) {\n    <button mat-icon-button color=\"primary\" (click)=\"form.back()\" [bizdocTooltip]=\"'Back'|translate\" tabindex=\"1\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon>\n    </button>\n  }\n  @if (model.draft) {\n    <button mat-icon-button color=\"primary\" data-help=\"submit\"\n      (click)=\"submit()\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Submit' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  @if (form.actions.length === 1) {\n    <button mat-icon-button color=\"primary\" [attr.data-help]=\"'action-'+form.actions[0].name\" (click)=\"send(model.actions[0])\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"form.actions[0].title\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">{{form.actions[0].icon || 'send'}}</mat-icon>\n    </button>\n  }\n  @else if (form.actions.length > 1) {\n    <button mat-icon-button data-help=\"send\" color=\"primary\" [matMenuTriggerFor]=\"actionmenu\" [disabled]=\"!valid||working\" [bizdocTooltip]=\"'Send' | translate\">\n      <mat-icon class=\"mat-icon-rtl-mirror\">send</mat-icon>\n    </button>\n  }\n  <!-- action -->\n  <mat-menu #actionmenu>\n    @for (a of form.actions | sort : 'group'; track a; let i = $index) {\n      @if (i > 0 && form.actions[i-1].group !== a.group) {\n        <mat-divider></mat-divider>\n      }\n      <button mat-menu-item (click)=\"send(a.name)\">{{a.title}}</button>\n    }\n  </mat-menu>\n  @if (mode === 'compose') {\n    <button mat-icon-button (click)=\"form.save().subscribe()\" data-help=\"save\" [disabled]=\"!dirty||working\" [bizdocTooltip]=\"(model.draft ? 'SaveDraft' : 'Save') | translate\">\n      <mat-icon>save</mat-icon>\n    </button>\n  }\n  <button mat-icon-button data-help=\"tag\" (click)=\"form.tag($event)\" [bizdocTooltip]=\"'Tags' | translate\" [disabled]=\"working\"><mat-icon class=\"filled\">{{model.tags && model.tags.length ?'bookmark':'bookmark_border'}}</mat-icon></button>\n  <button mat-icon-button data-help=\"flag\" [bizdocTooltip]=\"'Flagged'| translate\" [disabled]=\"working\" (click)=\"form.flag()\"><mat-icon class=\"filled\">{{model.flag ? 'star' : 'star_border'}}</mat-icon></button>\n  <button mat-icon-button (click)=\"form.attach()\" data-help=\"attach\" [bizdocTooltip]=\"'AttachFile' | translate\" [disabled]=\"working\"><mat-icon>attach_file</mat-icon></button>\n  @if (mode !== 'compose' && !model.completed && model.pending) {\n    <button mat-icon-button [disabled]=\"working\" data-help=\"edit\" (click)=\"edit()\" [bizdocTooltip]=\"'Edit' | translate\"><mat-icon>create</mat-icon></button>\n  }\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"toggle('comments')\" data-help=\"comments\" [bizdocTooltip]=\"'Comments' | translate\" [matBadge]=\"newCommentsCount\" [matBadgeHidden]=\"!newCommentsCount\" matBadgeColor=\"accent\">\n    <mat-icon class=\"filled\">format_quote</mat-icon>\n  </button>\n  @if (enableAnalysis) {\n    <button mat-icon-button (click)=\"toggle('views')\" [bizdocTooltip]=\"'View' | translate\" [attr.aria-label]=\"'View' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\n  }\n  <button mat-icon-button [matMenuTriggerFor]=\"optionsMenu\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\"><mat-icon>more_vert</mat-icon></button>\n  <mat-menu #optionsMenu=\"matMenu\">\n    <ng-template matMenuContent>\n      <button mat-menu-item (click)=\"form.copy()\" [disabled]=\"working\">\n        <!--<mat-icon>content_copy</mat-icon>-->\n        <span>{{'Copy' | translate}}</span>\n      </button>\n      @if (model.draft && !model.issued) {\n        <button mat-menu-item (click)=\"discard()\" [disabled]=\"working\">\n          <!--<mat-icon>delete_outlined</mat-icon>-->\n          <span>{{'Discard' | translate}}</span>\n        </button>\n      }\n      @if (form.help) {\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"form.guide(form.help)\">\n          <!--<mat-icon>help_outline</mat-icon>-->\n          <span>{{'Help' | translate}}</span>\n        </button>\n      }\n    </ng-template>\n  </mat-menu>\n</mat-toolbar>\n<mat-sidenav-container class=\"page-container\">\n  <mat-sidenav-content>\n    <bizdoc-form [model]=model #form (validChange)=\"valid=$event\"\n      (workingChange)=\"working=$event\"\n    (dirtyChange)=\"dirty=$event\" [mode]=\"mode\"></bizdoc-form>\n  </mat-sidenav-content>\n  <mat-sidenav mode=\"over\" position=\"end\" [opened]=\"false\" #drawer autoFocus=\"false\" class=\"side-nav\">\n    @switch (viewMode) {\n      @case ('views') {\n        <bizdoc-document-views [model]=\"model\"></bizdoc-document-views>\n      }\n      @default {\n        <bizdoc-comments [model]=\"model\"></bizdoc-comments>\n      }\n    }\n  </mat-sidenav>\n</mat-sidenav-container>\n", styles: [".page-container ::ng-deep form{padding:6px}.side-nav{min-width:280px}\n"] }]
         }], ctorParameters: () => [{ type: WindowTitleService }, { type: SessionService }, { type: i1$4.Router }, { type: i1$4.ActivatedRoute }], propDecorators: { form: [{
                 type: ViewChild,
                 args: [ComposeFormComponent, { static: true }]
@@ -23571,7 +23574,7 @@ let ActionsWidget = class ActionsWidget {
         this._session = _session;
         this._elementRef = _elementRef;
         this.id = `actions-${ActionsWidget_1.nextId++}`;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.palettes = this._session.accentPalette;
         this.tooltip = {
             enable: true,
@@ -23598,7 +23601,7 @@ let ActionsWidget = class ActionsWidget {
         this._destroy = new Subject();
         _session.profile.actions.forEach(a => this._map[a.name] = a.adjectivePlural || a.adjective || a.title);
         _session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
             this.chart.theme = this.theme;
             this.chart.series[0].palettes = this.palettes;
@@ -23688,7 +23691,7 @@ class CubeAnalysisBase {
         this._service = _service;
         this.id = `cube-analysis-${CubeAnalysisBase.nextId++}`;
         this.palettes = this._session.accentPalette;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this._axisTypeMap = {};
         this._intl = new Internationalization();
         this._destroy = new Subject();
@@ -23703,7 +23706,7 @@ class CubeAnalysisBase {
         this.yType = this._cube.yAxis?.type;
         this._cube.axes.forEach((a) => this._axisTypeMap[a.name] = a.dataType);
         _session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
             this.onThemeChange();
         });
@@ -24347,12 +24350,12 @@ let PersonalActivityWidget = class PersonalActivityWidget {
             isInversed: this._session.inverse,
             visible: true
         };
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.palettes = this._session.accentPalette;
         this.fill = this._session.getPrimery(400);
         this._destroy = new Subject();
         this._session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = this._session.accentPalette;
             this.fill = this._session.getPrimery(400);
             this._draw();
@@ -24450,7 +24453,7 @@ let CompareGroupsWidget = class CompareGroupsWidget {
         this._session = _session;
         this.id = `groups-compare-${CompareGroupsWidget_1.nextId++}`;
         this.palettes = this._session.accentPalette;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.enableRtl = this._session.inverse;
         this.rows = [
             {
@@ -24522,7 +24525,7 @@ let CompareGroupsWidget = class CompareGroupsWidget {
         };
         this._destroy = new Subject();
         _session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
             this._draw();
         });
@@ -24647,7 +24650,7 @@ let PeersPerformanceWidget = class PeersPerformanceWidget {
         this._duration = _duration;
         this._translate = _translate;
         this.id = `peers-performance-${PeersPerformanceWidget_1.nextId++}`;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.max = 0;
         this.direction = this._dir.value === 'ltr' ? 'ClockWise' : 'AntiClockWise';
         this.lineStyle = { width: 0 };
@@ -24676,7 +24679,7 @@ let PeersPerformanceWidget = class PeersPerformanceWidget {
         this._destroy = new Subject();
         _session.themeChange.pipe(takeUntil$1(this._destroy)).
             subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.gauge.theme = this.theme;
             this._prepare();
             this._refresh();
@@ -24917,7 +24920,7 @@ let PersonalScoreWidget = class PersonalScoreWidget {
         this._elementRef = _elementRef;
         this._translate = _translate;
         this.max = 0;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.margin = { left: 0, top: 0, right: 0, bottom: 0 };
         this.tooltip = {
             rangeSettings: {
@@ -24931,9 +24934,12 @@ let PersonalScoreWidget = class PersonalScoreWidget {
                 fontFamily: FONT_FAMILY
             },
             enable: true,
+            //annotationSettings: {
+            //  border: {}
+            //},
             //showAtMousePosition: true,
             type: ['Pointer', 'Range'],
-            enableAnimation: true
+            enableAnimation: false
         };
         this.lineStyle = { width: 0, color: '#1d1d1d' };
         this.labelStyle = {
@@ -24959,7 +24965,7 @@ let PersonalScoreWidget = class PersonalScoreWidget {
         this._destroy = new Subject();
         _session.themeChange.pipe(takeUntil$1(this._destroy)).
             subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.gauge.theme = this.theme;
             this._prepare();
             this._refresh();
@@ -25158,11 +25164,11 @@ class CubeDocumentsGridComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: CubeDocumentsGridComponent, deps: [{ token: ReportRef }, { token: DocumentInfo }, { token: SessionService }, { token: AccountService }, { token: CubeService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: CubeDocumentsGridComponent, selector: "ng-component", viewQueries: [{ propertyName: "grid", first: true, predicate: GridComponent, descendants: true }], ngImport: i0, template: "<ejs-grid [dataSource]=\"dataSource\" (rowSelected)=\"rowSelected($event)\" [pageSettings]=\"pageSettings\"\r\n          [allowPaging]=false\r\n          [allowExcelExport]=\"true\"\r\n          [height]=\"height\"\r\n          [allowGrouping]=true\r\n          [allowSorting]=true\r\n          [groupSettings]=\"groupSettings\">\r\n  <e-columns>\r\n    <e-column field=\"number\" [headerText]=\"'Number'|translate\"></e-column>\r\n    <e-column field=\"subject\" [headerText]=\"'Subject'|translate\"></e-column>\r\n    <e-column field=\"stateId\" [headerText]=\"'Status'|translate\">\r\n      <ng-template #template let-data>{{data.stateId | state}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"date\" [headerText]=\"'Date'|translate\">\r\n      <ng-template #template let-data>{{data.date | amDateFormat: 'lll'}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"formId\" [headerText]=\"'Form'|translate\">\r\n      <ng-template #template let-data>{{data.formId | form}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"userName\" [headerText]=\"'Name'|translate\">\r\n    </e-column>\r\n    <!--<e-column *ngFor=\"let a of cube.axes\" [field]=\"a.name\" [headerText]=\"a.title|translate\">\r\n    </e-column>-->\r\n    <e-column field=\"total\" [headerText]=\"'Value'|translate\" textAlign=\"Right\" [format]=\"valueFormat\">\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n", dependencies: [{ kind: "directive", type: i6$5.ColumnDirective, selector: "ejs-gantt>e-columns>e-column", inputs: ["allowEditing", "allowFiltering", "allowReordering", "allowResizing", "allowSorting", "clipMode", "customAttributes", "disableHtmlEncode", "displayAsCheckBox", "edit", "editType", "field", "filter", "format", "formatter", "headerTemplate", "headerText", "headerTextAlign", "hideAtMedia", "isPrimaryKey", "maxWidth", "minWidth", "sortComparer", "template", "textAlign", "type", "validationRules", "valueAccessor", "visible", "width"] }, { kind: "directive", type: i6$5.ColumnsDirective, selector: "ejs-gantt>e-columns" }, { kind: "directive", type: i11.ColumnDirective, selector: "e-columns>e-column", inputs: ["border", "width"] }, { kind: "directive", type: i11.ColumnsDirective, selector: "ejs-chart>e-columns" }, { kind: "component", type: i8$5.GridComponent, selector: "ejs-grid", inputs: ["aggregates", "allowExcelExport", "allowFiltering", "allowGrouping", "allowKeyboard", "allowMultiSorting", "allowPaging", "allowPdfExport", "allowReordering", "allowResizing", "allowRowDragAndDrop", "allowSelection", "allowSorting", "allowTextWrap", "autoFit", "childGrid", "clipMode", "columnChooserSettings", "columnMenuItems", "columnQueryMode", "columns", "contextMenuItems", "cssClass", "currencyCode", "currentAction", "currentViewData", "dataSource", "detailTemplate", "editSettings", "ej2StatePersistenceVersion", "emptyRecordTemplate", "enableAdaptiveUI", "enableAltRow", "enableAutoFill", "enableColumnVirtualization", "enableHeaderFocus", "enableHover", "enableHtmlSanitizer", "enableImmutableMode", "enableInfiniteScrolling", "enablePersistence", "enableRtl", "enableStickyHeader", "enableVirtualMaskRow", "enableVirtualization", "exportGrids", "filterSettings", "frozenColumns", "frozenRows", "gridLines", "groupSettings", "height", "hierarchyPrintMode", "infiniteScrollSettings", "loadingIndicator", "locale", "pageSettings", "pagerTemplate", "parentDetails", "printMode", "query", "queryString", "resizeSettings", "rowDropSettings", "rowHeight", "rowRenderingMode", "rowTemplate", "searchSettings", "selectedRowIndex", "selectionSettings", "showColumnChooser", "showColumnMenu", "showHider", "sortSettings", "textWrapSettings", "toolbar", "toolbarTemplate", "width"], outputs: ["actionBegin", "actionComplete", "actionFailure", "batchAdd", "batchCancel", "batchDelete", "beforeAutoFill", "beforeBatchAdd", "beforeBatchDelete", "beforeBatchSave", "beforeCopy", "beforeDataBound", "beforeExcelExport", "beforeOpenAdaptiveDialog", "beforeOpenColumnChooser", "beforePaste", "beforePdfExport", "beforePrint", "beginEdit", "cellDeselected", "cellDeselecting", "cellEdit", "cellSave", "cellSaved", "cellSelected", "cellSelecting", "checkBoxChange", "columnDataStateChange", "columnDeselected", "columnDeselecting", "columnDrag", "columnDragStart", "columnDrop", "columnMenuClick", "columnMenuOpen", "columnSelected", "columnSelecting", "commandClick", "contextMenuClick", "contextMenuOpen", "created", "dataBound", "dataSourceChanged", "dataStateChange", "destroyed", "detailDataBound", "excelAggregateQueryCellInfo", "excelExportComplete", "excelHeaderQueryCellInfo", "excelQueryCellInfo", "exportDetailDataBound", "exportDetailTemplate", "exportGroupCaption", "headerCellInfo", "keyPressed", "lazyLoadGroupCollapse", "lazyLoadGroupExpand", "load", "pdfAggregateQueryCellInfo", "pdfExportComplete", "pdfHeaderQueryCellInfo", "pdfQueryCellInfo", "printComplete", "queryCellInfo", "recordClick", "recordDoubleClick", "resizeStart", "resizeStop", "resizing", "rowDataBound", "rowDeselected", "rowDeselecting", "rowDrag", "rowDragStart", "rowDragStartHelper", "rowDrop", "rowSelected", "rowSelecting", "toolbarClick", "dataSourceChange"] }, { kind: "directive", type: i8$5.ColumnDirective, selector: "ejs-grid>e-columns>e-column", inputs: ["allowEditing", "allowFiltering", "allowGrouping", "allowReordering", "allowResizing", "allowSearching", "allowSorting", "autoFit", "clipMode", "columns", "commands", "customAttributes", "dataSource", "defaultValue", "disableHtmlEncode", "displayAsCheckBox", "edit", "editTemplate", "editType", "enableGroupByFormat", "field", "filter", "filterBarTemplate", "filterTemplate", "foreignKeyField", "foreignKeyValue", "format", "formatter", "freeze", "headerTemplate", "headerText", "headerTextAlign", "headerValueAccessor", "hideAtMedia", "index", "isFrozen", "isIdentity", "isPrimaryKey", "lockColumn", "maxWidth", "minWidth", "showColumnMenu", "showInColumnChooser", "sortComparer", "template", "textAlign", "type", "uid", "validationRules", "valueAccessor", "visible", "width"] }, { kind: "directive", type: i8$5.ColumnsDirective, selector: "ejs-grid>e-columns" }, { kind: "directive", type: i8$5.AggregateColumnDirective, selector: "ejs-grid>e-aggregates>e-aggregate>e-columns>e-column", inputs: ["columnName", "customAggregate", "field", "footerTemplate", "format", "groupCaptionTemplate", "groupFooterTemplate", "type"] }, { kind: "directive", type: i8$5.AggregateColumnsDirective, selector: "ejs-grid>e-aggregates>e-aggregate>e-columns" }, { kind: "directive", type: i9$4.ColumnDirective, selector: "e-columns>e-column", inputs: ["customWidth", "format", "hidden", "index", "isLocked", "validation", "width"] }, { kind: "directive", type: i9$4.ColumnsDirective, selector: "e-sheet>e-columns" }, { kind: "directive", type: i10$1.ColumnDirective, selector: "e-columns>e-column", inputs: ["allowDrag", "allowDrop", "allowToggle", "headerText", "isExpanded", "keyField", "maxCount", "minCount", "showAddButton", "showItemCount", "template", "transitionColumns"] }, { kind: "directive", type: i10$1.ColumnsDirective, selector: "ejs-kanban>e-columns" }, { kind: "pipe", type: DateFormatPipe, name: "amDateFormat" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: StatePipe, name: "state" }, { kind: "pipe", type: FormPipe, name: "form" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: CubeDocumentsGridComponent, selector: "ng-component", viewQueries: [{ propertyName: "grid", first: true, predicate: GridComponent, descendants: true }], ngImport: i0, template: "<ejs-grid [dataSource]=\"dataSource\" (rowSelected)=\"rowSelected($event)\"\r\n          [pageSettings]=pageSettings\r\n          [allowPaging]=false\r\n          [enableHover]=false\r\n          [enableAdaptiveUI]=true\r\n          [enableStickyHeader]=true\r\n          [allowExcelExport]=true\r\n          [height]=height\r\n          [allowGrouping]=true\r\n          [allowSorting]=true\r\n          [groupSettings]=groupSettings>\r\n  <e-columns>\r\n    <e-column field=\"number\" [headerText]=\"'Number'|translate\"></e-column>\r\n    <e-column field=\"subject\" [headerText]=\"'Subject'|translate\"></e-column>\r\n    <e-column field=\"stateId\" [headerText]=\"'Status'|translate\">\r\n      <ng-template #template let-data>{{data.stateId | state}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"date\" [headerText]=\"'Date'|translate\">\r\n      <ng-template #template let-data>{{data.date | amDateFormat: 'lll'}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"formId\" [headerText]=\"'Form'|translate\">\r\n      <ng-template #template let-data>{{data.formId | form}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"userName\" [headerText]=\"'Name'|translate\">\r\n    </e-column>\r\n    <!--<e-column *ngFor=\"let a of cube.axes\" [field]=\"a.name\" [headerText]=\"a.title|translate\">\r\n    </e-column>-->\r\n    <e-column field=\"total\" [headerText]=\"'Value'|translate\" textAlign=\"Right\" [format]=\"valueFormat\">\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n", dependencies: [{ kind: "directive", type: i6$5.ColumnDirective, selector: "ejs-gantt>e-columns>e-column", inputs: ["allowEditing", "allowFiltering", "allowReordering", "allowResizing", "allowSorting", "clipMode", "customAttributes", "disableHtmlEncode", "displayAsCheckBox", "edit", "editType", "field", "filter", "format", "formatter", "headerTemplate", "headerText", "headerTextAlign", "hideAtMedia", "isPrimaryKey", "maxWidth", "minWidth", "sortComparer", "template", "textAlign", "type", "validationRules", "valueAccessor", "visible", "width"] }, { kind: "directive", type: i6$5.ColumnsDirective, selector: "ejs-gantt>e-columns" }, { kind: "directive", type: i11.ColumnDirective, selector: "e-columns>e-column", inputs: ["border", "width"] }, { kind: "directive", type: i11.ColumnsDirective, selector: "ejs-chart>e-columns" }, { kind: "component", type: i8$5.GridComponent, selector: "ejs-grid", inputs: ["aggregates", "allowExcelExport", "allowFiltering", "allowGrouping", "allowKeyboard", "allowMultiSorting", "allowPaging", "allowPdfExport", "allowReordering", "allowResizing", "allowRowDragAndDrop", "allowSelection", "allowSorting", "allowTextWrap", "autoFit", "childGrid", "clipMode", "columnChooserSettings", "columnMenuItems", "columnQueryMode", "columns", "contextMenuItems", "cssClass", "currencyCode", "currentAction", "currentViewData", "dataSource", "detailTemplate", "editSettings", "ej2StatePersistenceVersion", "emptyRecordTemplate", "enableAdaptiveUI", "enableAltRow", "enableAutoFill", "enableColumnVirtualization", "enableHeaderFocus", "enableHover", "enableHtmlSanitizer", "enableImmutableMode", "enableInfiniteScrolling", "enablePersistence", "enableRtl", "enableStickyHeader", "enableVirtualMaskRow", "enableVirtualization", "exportGrids", "filterSettings", "frozenColumns", "frozenRows", "gridLines", "groupSettings", "height", "hierarchyPrintMode", "infiniteScrollSettings", "loadingIndicator", "locale", "pageSettings", "pagerTemplate", "parentDetails", "printMode", "query", "queryString", "resizeSettings", "rowDropSettings", "rowHeight", "rowRenderingMode", "rowTemplate", "searchSettings", "selectedRowIndex", "selectionSettings", "showColumnChooser", "showColumnMenu", "showHider", "sortSettings", "textWrapSettings", "toolbar", "toolbarTemplate", "width"], outputs: ["actionBegin", "actionComplete", "actionFailure", "batchAdd", "batchCancel", "batchDelete", "beforeAutoFill", "beforeBatchAdd", "beforeBatchDelete", "beforeBatchSave", "beforeCopy", "beforeDataBound", "beforeExcelExport", "beforeOpenAdaptiveDialog", "beforeOpenColumnChooser", "beforePaste", "beforePdfExport", "beforePrint", "beginEdit", "cellDeselected", "cellDeselecting", "cellEdit", "cellSave", "cellSaved", "cellSelected", "cellSelecting", "checkBoxChange", "columnDataStateChange", "columnDeselected", "columnDeselecting", "columnDrag", "columnDragStart", "columnDrop", "columnMenuClick", "columnMenuOpen", "columnSelected", "columnSelecting", "commandClick", "contextMenuClick", "contextMenuOpen", "created", "dataBound", "dataSourceChanged", "dataStateChange", "destroyed", "detailDataBound", "excelAggregateQueryCellInfo", "excelExportComplete", "excelHeaderQueryCellInfo", "excelQueryCellInfo", "exportDetailDataBound", "exportDetailTemplate", "exportGroupCaption", "headerCellInfo", "keyPressed", "lazyLoadGroupCollapse", "lazyLoadGroupExpand", "load", "pdfAggregateQueryCellInfo", "pdfExportComplete", "pdfHeaderQueryCellInfo", "pdfQueryCellInfo", "printComplete", "queryCellInfo", "recordClick", "recordDoubleClick", "resizeStart", "resizeStop", "resizing", "rowDataBound", "rowDeselected", "rowDeselecting", "rowDrag", "rowDragStart", "rowDragStartHelper", "rowDrop", "rowSelected", "rowSelecting", "toolbarClick", "dataSourceChange"] }, { kind: "directive", type: i8$5.ColumnDirective, selector: "ejs-grid>e-columns>e-column", inputs: ["allowEditing", "allowFiltering", "allowGrouping", "allowReordering", "allowResizing", "allowSearching", "allowSorting", "autoFit", "clipMode", "columns", "commands", "customAttributes", "dataSource", "defaultValue", "disableHtmlEncode", "displayAsCheckBox", "edit", "editTemplate", "editType", "enableGroupByFormat", "field", "filter", "filterBarTemplate", "filterTemplate", "foreignKeyField", "foreignKeyValue", "format", "formatter", "freeze", "headerTemplate", "headerText", "headerTextAlign", "headerValueAccessor", "hideAtMedia", "index", "isFrozen", "isIdentity", "isPrimaryKey", "lockColumn", "maxWidth", "minWidth", "showColumnMenu", "showInColumnChooser", "sortComparer", "template", "textAlign", "type", "uid", "validationRules", "valueAccessor", "visible", "width"] }, { kind: "directive", type: i8$5.ColumnsDirective, selector: "ejs-grid>e-columns" }, { kind: "directive", type: i8$5.AggregateColumnDirective, selector: "ejs-grid>e-aggregates>e-aggregate>e-columns>e-column", inputs: ["columnName", "customAggregate", "field", "footerTemplate", "format", "groupCaptionTemplate", "groupFooterTemplate", "type"] }, { kind: "directive", type: i8$5.AggregateColumnsDirective, selector: "ejs-grid>e-aggregates>e-aggregate>e-columns" }, { kind: "directive", type: i9$4.ColumnDirective, selector: "e-columns>e-column", inputs: ["customWidth", "format", "hidden", "index", "isLocked", "validation", "width"] }, { kind: "directive", type: i9$4.ColumnsDirective, selector: "e-sheet>e-columns" }, { kind: "directive", type: i10$1.ColumnDirective, selector: "e-columns>e-column", inputs: ["allowDrag", "allowDrop", "allowToggle", "headerText", "isExpanded", "keyField", "maxCount", "minCount", "showAddButton", "showItemCount", "template", "transitionColumns"] }, { kind: "directive", type: i10$1.ColumnsDirective, selector: "ejs-kanban>e-columns" }, { kind: "pipe", type: DateFormatPipe, name: "amDateFormat" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: StatePipe, name: "state" }, { kind: "pipe", type: FormPipe, name: "form" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: CubeDocumentsGridComponent, decorators: [{
             type: Component,
-            args: [{ template: "<ejs-grid [dataSource]=\"dataSource\" (rowSelected)=\"rowSelected($event)\" [pageSettings]=\"pageSettings\"\r\n          [allowPaging]=false\r\n          [allowExcelExport]=\"true\"\r\n          [height]=\"height\"\r\n          [allowGrouping]=true\r\n          [allowSorting]=true\r\n          [groupSettings]=\"groupSettings\">\r\n  <e-columns>\r\n    <e-column field=\"number\" [headerText]=\"'Number'|translate\"></e-column>\r\n    <e-column field=\"subject\" [headerText]=\"'Subject'|translate\"></e-column>\r\n    <e-column field=\"stateId\" [headerText]=\"'Status'|translate\">\r\n      <ng-template #template let-data>{{data.stateId | state}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"date\" [headerText]=\"'Date'|translate\">\r\n      <ng-template #template let-data>{{data.date | amDateFormat: 'lll'}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"formId\" [headerText]=\"'Form'|translate\">\r\n      <ng-template #template let-data>{{data.formId | form}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"userName\" [headerText]=\"'Name'|translate\">\r\n    </e-column>\r\n    <!--<e-column *ngFor=\"let a of cube.axes\" [field]=\"a.name\" [headerText]=\"a.title|translate\">\r\n    </e-column>-->\r\n    <e-column field=\"total\" [headerText]=\"'Value'|translate\" textAlign=\"Right\" [format]=\"valueFormat\">\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n" }]
+            args: [{ template: "<ejs-grid [dataSource]=\"dataSource\" (rowSelected)=\"rowSelected($event)\"\r\n          [pageSettings]=pageSettings\r\n          [allowPaging]=false\r\n          [enableHover]=false\r\n          [enableAdaptiveUI]=true\r\n          [enableStickyHeader]=true\r\n          [allowExcelExport]=true\r\n          [height]=height\r\n          [allowGrouping]=true\r\n          [allowSorting]=true\r\n          [groupSettings]=groupSettings>\r\n  <e-columns>\r\n    <e-column field=\"number\" [headerText]=\"'Number'|translate\"></e-column>\r\n    <e-column field=\"subject\" [headerText]=\"'Subject'|translate\"></e-column>\r\n    <e-column field=\"stateId\" [headerText]=\"'Status'|translate\">\r\n      <ng-template #template let-data>{{data.stateId | state}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"date\" [headerText]=\"'Date'|translate\">\r\n      <ng-template #template let-data>{{data.date | amDateFormat: 'lll'}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"formId\" [headerText]=\"'Form'|translate\">\r\n      <ng-template #template let-data>{{data.formId | form}}</ng-template>\r\n    </e-column>\r\n    <e-column field=\"userName\" [headerText]=\"'Name'|translate\">\r\n    </e-column>\r\n    <!--<e-column *ngFor=\"let a of cube.axes\" [field]=\"a.name\" [headerText]=\"a.title|translate\">\r\n    </e-column>-->\r\n    <e-column field=\"total\" [headerText]=\"'Value'|translate\" textAlign=\"Right\" [format]=\"valueFormat\">\r\n    </e-column>\r\n  </e-columns>\r\n</ejs-grid>\r\n" }]
         }], ctorParameters: () => [{ type: ReportRef }, { type: DocumentInfo }, { type: SessionService }, { type: AccountService }, { type: CubeService }], propDecorators: { grid: [{
                 type: ViewChild,
                 args: [GridComponent]
@@ -25337,7 +25343,7 @@ class UsageChartComponent extends UsageReportBase {
             view: 'Chart'
         };
         this._session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.chartSettings.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.chartSettings.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.chartSettings.palettes = this._palettes();
             this._draw();
         });
@@ -25373,7 +25379,7 @@ class UsageChartComponent extends UsageReportBase {
             chartArea: {
                 border: { width: 0 }
             },
-            theme: this._session.theme.dark ? 'MaterialDark' : 'Material',
+            theme: this._session.theme.dark ? 'Material3Dark' : 'Material3',
             background: 'transparent',
             primaryXAxis: {
                 titleStyle: {
@@ -28814,7 +28820,7 @@ class CubeParallelComponent {
         this._service = _service;
         this._session = _session;
         this.onExplore = new EventEmitter();
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this._palettes = this._session.accentPalette;
         this.items = [];
         this.axisSettings = {
@@ -28838,7 +28844,7 @@ class CubeParallelComponent {
     ngOnInit() {
         this._session.themeChange.pipe(takeUntil$1(this._destroy)).
             subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this._primary = this._session.primeryPalette;
             this._palettes = this._session.accentPalette;
             this._draw();
@@ -29070,7 +29076,7 @@ let CubePerformanceWidget = class CubePerformanceWidget {
         this._session = _session;
         this.id = `cube-compare-${CubePerformanceWidget_1.nextId++}`;
         this.palettes = this._session.accentPalette;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.enableRtl = this._session.inverse;
         this.rows = [
             {
@@ -29146,7 +29152,7 @@ let CubePerformanceWidget = class CubePerformanceWidget {
         };
         this._destroy = new Subject();
         _session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
             this._draw();
         });
@@ -29482,12 +29488,12 @@ let DocumentStateWidgetComponent = class DocumentStateWidgetComponent {
                 fontFamily: FONT_FAMILY
             }
         };
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.palettes = this._session.accentPalette;
         this._destroy = new Subject();
         _session.themeChange.pipe(takeUntil(this._destroy)).
             subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
         });
     }
@@ -30517,7 +30523,7 @@ let PermissionsUtility = class PermissionsUtility {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: PermissionsUtility, deps: [{ token: UtilityRef }, { token: SessionService }, { token: PromptService }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: PermissionsUtility, selector: "ng-component", viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-button [matMenuTriggerFor]=\"formMenu\">{{form?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\n  <mat-menu #formMenu>\n    @for (f of forms; track f) {\n      <button mat-menu-item (click)=\"formChange(f.name)\">{{f.title}}</button>\n    }\n  </mat-menu>\n</mat-toolbar>\n<table mat-table matSort [dataSource]=\"dataSource\">\n  <ng-container matColumnDef=\"title\" sticky>\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Permission' | translate}}</th>\n    <td mat-cell *matCellDef=\"let item\"> {{item.title || item.name}}</td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let item\"> <mat-checkbox [checked]=\"item[r.name]\" [value]=\"r.name\" (change)=\"change(item, $event)\"></mat-checkbox> </td>\n    </ng-container>\n  }\n  <tr mat-header-row *matHeaderRowDef=\"displayColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let item; columns: displayColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}::ng-deep .mat-mdc-row{cursor:pointer}\n"], dependencies: [{ kind: "component", type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i2$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: SearchInput, selector: "bizdoc-search-input", outputs: ["valueChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: PermissionsUtility, selector: "ng-component", viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-button [matMenuTriggerFor]=\"formMenu\">{{form?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\n  <mat-menu #formMenu>\n    @for (f of forms; track f) {\n      <button mat-menu-item (click)=\"formChange(f.name)\">{{f.title}}</button>\n    }\n  </mat-menu>\n</mat-toolbar>\n<table mat-table matSort [dataSource]=\"dataSource\">\n  <ng-container matColumnDef=\"title\">\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Permission' | translate}}</th>\n    <td mat-cell *matCellDef=\"let item\"> {{item.title || item.name}}</td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let item\"> <mat-checkbox [checked]=\"item[r.name]\" [value]=\"r.name\" (change)=\"change(item, $event)\"></mat-checkbox> </td>\n    </ng-container>\n  }\n  <tr mat-header-row *matHeaderRowDef=\"displayColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let item; columns: displayColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}::ng-deep .mat-mdc-row{cursor:pointer}\n"], dependencies: [{ kind: "component", type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i2$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: SearchInput, selector: "bizdoc-search-input", outputs: ["valueChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 };
 PermissionsUtility = __decorate([
     BizDoc({
@@ -30526,7 +30532,7 @@ PermissionsUtility = __decorate([
 ], PermissionsUtility);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: PermissionsUtility, decorators: [{
             type: Component,
-            args: [{ template: "<mat-toolbar>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-button [matMenuTriggerFor]=\"formMenu\">{{form?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\n  <mat-menu #formMenu>\n    @for (f of forms; track f) {\n      <button mat-menu-item (click)=\"formChange(f.name)\">{{f.title}}</button>\n    }\n  </mat-menu>\n</mat-toolbar>\n<table mat-table matSort [dataSource]=\"dataSource\">\n  <ng-container matColumnDef=\"title\" sticky>\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Permission' | translate}}</th>\n    <td mat-cell *matCellDef=\"let item\"> {{item.title || item.name}}</td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let item\"> <mat-checkbox [checked]=\"item[r.name]\" [value]=\"r.name\" (change)=\"change(item, $event)\"></mat-checkbox> </td>\n    </ng-container>\n  }\n  <tr mat-header-row *matHeaderRowDef=\"displayColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let item; columns: displayColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}::ng-deep .mat-mdc-row{cursor:pointer}\n"] }]
+            args: [{ template: "<mat-toolbar>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-button [matMenuTriggerFor]=\"formMenu\">{{form?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\n  <mat-menu #formMenu>\n    @for (f of forms; track f) {\n      <button mat-menu-item (click)=\"formChange(f.name)\">{{f.title}}</button>\n    }\n  </mat-menu>\n</mat-toolbar>\n<table mat-table matSort [dataSource]=\"dataSource\">\n  <ng-container matColumnDef=\"title\">\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Permission' | translate}}</th>\n    <td mat-cell *matCellDef=\"let item\"> {{item.title || item.name}}</td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let item\"> <mat-checkbox [checked]=\"item[r.name]\" [value]=\"r.name\" (change)=\"change(item, $event)\"></mat-checkbox> </td>\n    </ng-container>\n  }\n  <tr mat-header-row *matHeaderRowDef=\"displayColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let item; columns: displayColumns;\"></tr>\n</table>\n", styles: ["table{width:100%}::ng-deep .mat-mdc-row{cursor:pointer}\n"] }]
         }], ctorParameters: () => [{ type: UtilityRef, decorators: [{
                     type: Inject,
                     args: [UtilityRef]
@@ -31170,7 +31176,7 @@ let DocumentTraceComponent = class DocumentTraceComponent {
         this._guide = _guide;
         this._cd = _cd;
         this._fb = _fb;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.accent = this._session.getAccent();
         this.form = this._fb.group({ search: null, formId: null });
         this.diagramConstraints = DiagramConstraints.Default | DiagramConstraints.Bridging |
@@ -31244,7 +31250,7 @@ let DocumentTraceComponent = class DocumentTraceComponent {
     ngOnInit() {
         const now = dayjs();
         this._session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.accent = this._session.getAccent();
             //this.rangeNavigator.refresh();
         });
@@ -31796,7 +31802,7 @@ let PatternsComponent = class PatternsComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: PatternsComponent, deps: [{ token: SessionService }, { token: i1$3.Directionality }, { token: i1$1.FormBuilder }, { token: UtilityRef }, { token: DatasourceService }, { token: SystemService }, { token: PromptService }, { token: i2$6.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: PatternsComponent, selector: "ng-component", viewQueries: [{ propertyName: "properties", first: true, predicate: ["properties"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\n</mat-toolbar>\n<table mat-table [dataSource]=\"dataSource\" matSort>\n  <ng-container matColumnDef=\"title\" sticky>\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\n      </td>\n    </ng-container>\n  }\n  <ng-container matColumnDef=\"options\">\n    <th mat-header-cell *matHeaderCellDef></th>\n    <td mat-cell *matCellDef=\"let element\">\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n      <mat-menu #options>\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\n      </mat-menu>\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\n</table>\n@if (paging) {\n  <mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons></mat-paginator>\n}\n<!-- dialog -->\n<ng-template #properties>\n  <mat-dialog-content>\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\n      </mat-form-field>\n      @if (cube) {\n        <div formGroupName=\"axes\" class=\"row wrap sm-column\">\n          @for (a of cube?.axes; track a) {\n            @if (include.indexOf(a.name)>-1) {\n              <mat-form-field class=\"flex\">\n                <input matInput\n                  [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\n                  [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\n                  <mat-autocomplete #segment>\n                    @for (o of segments[a.name] | async; track o) {\n                      <mat-option [value]=\"o.key\">{{o.value}}</mat-option>\n                    }\n                  </mat-autocomplete>\n                  @if (axes.controls[a.name].invalid) {\n                    <mat-error>{{'SystemAxisPatternErr' |translate}}</mat-error>\n                  }\n                </mat-form-field>\n              }\n              &nbsp;\n            }\n          </div>\n        }\n        <mat-form-field>\n          <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\n            @for (r of roles; track r) {\n              <mat-option [value]=\"r.name\">{{r.title}}</mat-option>\n            }\n          </mat-select>\n          @if (form.controls.roles.hasError('required')) {\n            <mat-error>{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\n          }\n        </mat-form-field>\n      </form>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\n      <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\n    </mat-dialog-actions>\n  </ng-template>\n  <style scoped>\n    table {\n    width: 100%\n  }\n</style>\n", styles: ["\n    table {\n    width: 100%\n  }\n"], dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: i2$6.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i4$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i4.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"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i9$1.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: PatternsComponent, selector: "ng-component", viewQueries: [{ propertyName: "properties", first: true, predicate: ["properties"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\n</mat-toolbar>\n<table mat-table [dataSource]=\"dataSource\" matSort>\n  <ng-container matColumnDef=\"title\">\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\n      </td>\n    </ng-container>\n  }\n  <ng-container matColumnDef=\"options\">\n    <th mat-header-cell *matHeaderCellDef></th>\n    <td mat-cell *matCellDef=\"let element\">\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n      <mat-menu #options>\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\n      </mat-menu>\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\n</table>\n@if (paging) {\n  <mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons></mat-paginator>\n}\n<!-- dialog -->\n<ng-template #properties>\n  <mat-dialog-content>\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\n      </mat-form-field>\n      @if (cube) {\n        <div formGroupName=\"axes\" class=\"row wrap sm-column\">\n          @for (a of cube?.axes; track a) {\n            @if (include.indexOf(a.name)>-1) {\n              <mat-form-field class=\"flex\">\n                <input matInput\n                  [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\n                  [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\n                  <mat-autocomplete #segment>\n                    @for (o of segments[a.name] | async; track o) {\n                      <mat-option [value]=\"o.key\">{{o.value}}</mat-option>\n                    }\n                  </mat-autocomplete>\n                  @if (axes.controls[a.name].invalid) {\n                    <mat-error>{{'SystemAxisPatternErr' |translate}}</mat-error>\n                  }\n                </mat-form-field>\n              }\n              &nbsp;\n            }\n          </div>\n        }\n        <mat-form-field>\n          <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\n            @for (r of roles; track r) {\n              <mat-option [value]=\"r.name\">{{r.title}}</mat-option>\n            }\n          </mat-select>\n          @if (form.controls.roles.hasError('required')) {\n            <mat-error>{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\n          }\n        </mat-form-field>\n      </form>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\n      <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\n    </mat-dialog-actions>\n  </ng-template>\n  <style scoped>\n    table {\n    width: 100%\n  }\n</style>\n", styles: ["\n    table {\n    width: 100%\n  }\n"], dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: i2$6.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i4$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i4.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"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i9$1.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 };
 PatternsComponent = __decorate([
     BizDoc({
@@ -31805,7 +31811,7 @@ PatternsComponent = __decorate([
 ], PatternsComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: PatternsComponent, decorators: [{
             type: Component,
-            args: [{ template: "<mat-toolbar>\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\n</mat-toolbar>\n<table mat-table [dataSource]=\"dataSource\" matSort>\n  <ng-container matColumnDef=\"title\" sticky>\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\n      </td>\n    </ng-container>\n  }\n  <ng-container matColumnDef=\"options\">\n    <th mat-header-cell *matHeaderCellDef></th>\n    <td mat-cell *matCellDef=\"let element\">\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n      <mat-menu #options>\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\n      </mat-menu>\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\n</table>\n@if (paging) {\n  <mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons></mat-paginator>\n}\n<!-- dialog -->\n<ng-template #properties>\n  <mat-dialog-content>\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\n      </mat-form-field>\n      @if (cube) {\n        <div formGroupName=\"axes\" class=\"row wrap sm-column\">\n          @for (a of cube?.axes; track a) {\n            @if (include.indexOf(a.name)>-1) {\n              <mat-form-field class=\"flex\">\n                <input matInput\n                  [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\n                  [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\n                  <mat-autocomplete #segment>\n                    @for (o of segments[a.name] | async; track o) {\n                      <mat-option [value]=\"o.key\">{{o.value}}</mat-option>\n                    }\n                  </mat-autocomplete>\n                  @if (axes.controls[a.name].invalid) {\n                    <mat-error>{{'SystemAxisPatternErr' |translate}}</mat-error>\n                  }\n                </mat-form-field>\n              }\n              &nbsp;\n            }\n          </div>\n        }\n        <mat-form-field>\n          <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\n            @for (r of roles; track r) {\n              <mat-option [value]=\"r.name\">{{r.title}}</mat-option>\n            }\n          </mat-select>\n          @if (form.controls.roles.hasError('required')) {\n            <mat-error>{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\n          }\n        </mat-form-field>\n      </form>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\n      <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\n    </mat-dialog-actions>\n  </ng-template>\n  <style scoped>\n    table {\n    width: 100%\n  }\n</style>\n" }]
+            args: [{ template: "<mat-toolbar>\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\n</mat-toolbar>\n<table mat-table [dataSource]=\"dataSource\" matSort>\n  <ng-container matColumnDef=\"title\">\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\n  </ng-container>\n  @for (r of roles; track r) {\n    <ng-container [matColumnDef]=\"r.name\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\n      </td>\n    </ng-container>\n  }\n  <ng-container matColumnDef=\"options\">\n    <th mat-header-cell *matHeaderCellDef></th>\n    <td mat-cell *matCellDef=\"let element\">\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n      <mat-menu #options>\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\n        <mat-divider></mat-divider>\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\n      </mat-menu>\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\n</table>\n@if (paging) {\n  <mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons></mat-paginator>\n}\n<!-- dialog -->\n<ng-template #properties>\n  <mat-dialog-content>\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\n      </mat-form-field>\n      @if (cube) {\n        <div formGroupName=\"axes\" class=\"row wrap sm-column\">\n          @for (a of cube?.axes; track a) {\n            @if (include.indexOf(a.name)>-1) {\n              <mat-form-field class=\"flex\">\n                <input matInput\n                  [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\n                  [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\n                  <mat-autocomplete #segment>\n                    @for (o of segments[a.name] | async; track o) {\n                      <mat-option [value]=\"o.key\">{{o.value}}</mat-option>\n                    }\n                  </mat-autocomplete>\n                  @if (axes.controls[a.name].invalid) {\n                    <mat-error>{{'SystemAxisPatternErr' |translate}}</mat-error>\n                  }\n                </mat-form-field>\n              }\n              &nbsp;\n            }\n          </div>\n        }\n        <mat-form-field>\n          <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\n            @for (r of roles; track r) {\n              <mat-option [value]=\"r.name\">{{r.title}}</mat-option>\n            }\n          </mat-select>\n          @if (form.controls.roles.hasError('required')) {\n            <mat-error>{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\n          }\n        </mat-form-field>\n      </form>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\n      <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\n    </mat-dialog-actions>\n  </ng-template>\n  <style scoped>\n    table {\n    width: 100%\n  }\n</style>\n" }]
         }], ctorParameters: () => [{ type: SessionService }, { type: i1$3.Directionality }, { type: i1$1.FormBuilder }, { type: UtilityRef, decorators: [{
                     type: Inject,
                     args: [UtilityRef]
@@ -32208,7 +32214,7 @@ let PositionsComponent = class PositionsComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: PositionsComponent, deps: [{ token: SessionService }, { token: UtilityRef }, { token: DatasourceService }, { token: PromptService }, { token: WindowTitleService }, { token: TranslateService }, { token: Popup }, { token: SystemService }, { token: i2$6.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: PositionsComponent, selector: "ng-component", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, viewQueries: [{ propertyName: "_fileElement", first: true, predicate: ["file"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "noRoleTpl", first: true, predicate: ["noRoleTpl"], descendants: true, static: true }, { propertyName: "roleTpl", first: true, predicate: ["roleTpl"], descendants: true, static: true }, { propertyName: "patternTpl", first: true, predicate: ["patternTpl"], descendants: true, static: true }, { propertyName: "newGroupTpl", first: true, predicate: ["groupTpl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\n  <mat-menu #newMenu>\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\n  </mat-menu>\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\n</mat-toolbar>\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\n<div class=\"row flex\">\n  <mat-nav-list class=\"timeline\" [style.display]=\"tools?'':'none'\">\n    @for (t of datatypes; track t) {\n      <mat-list-item (click)=\"change(t.name)\" [class.active]=\"t === type\">{{t.title}}</mat-list-item>\n    }\n  </mat-nav-list>\n  <table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\" class=\"flex\">\n    @for (column of (type?.columns ||[]); track column) {\n      <ng-container [matColumnDef]=\"column.name\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\n        <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"key\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <span>\n          @switch (element.type) {\n            @case ('group') {\n              ({{'Group'|translate}})\n            }\n            @case ('pattern') {\n              ({{'Pattern'|translate}})\n            }\n            @default {\n              {{element.key}}\n            }\n          }\n        </span>\n      </td>\n    </ng-container>\n    <ng-container matColumnDef=\"value\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        {{element.value}}\n      </td>\n    </ng-container>\n    @for (role of roles; track role) {\n      <ng-container [matColumnDef]=\"role.name\">\n        <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\n        <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\" class=\"role-column\">\n          @if (positions[role.name][element.key]) {\n            @for (u of positions[role.name][element.key]; track u; let first = $first) {\n              @if (!first) {\n                ,\n              }\n              {{profiles[u]?.name}}\n            }\n          }\n        </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"options\">\n      <th mat-header-cell *matHeaderCellDef></th>\n      <td mat-cell *matCellDef=\"let element\">\n        @if (element.type === 'pattern' || element.type === 'group') {\n          <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n        }\n        <mat-menu #options>\n          @if (element.type === 'pattern') {\n            <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\n          }\n          @if (element.type === 'group') {\n            <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\n          }\n        </mat-menu>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n    <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\n  </table>\n</div>\n<!-- role template -->\n<ng-template #roleTpl>\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"role\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"role.value\" color=\"primary\" [disabled]=\"!role.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- pattern template -->\n<ng-template #patternTpl>\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"pattern\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- group -->\n<ng-template #groupTpl>\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"group\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\n          <mat-select-trigger>\n            {{group.value.items ? group.value.items[0] : ''}}\n            @if (group.value.items?.length > 1) {\n              <span class=\"additional-selection\">\n                (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\n              </span>\n            }\n          </mat-select-trigger>\n          @for (v of source; track v) {\n            <mat-option [value]=\"v.key\">\n              @if (!type.columns) {\n                <span>{{v.value}}</span>\n              }\n              @if (type.columns) {\n                <span>@for (c of type.columns; track c) {\n                  <span>{{v.value[c.name]}}</span>\n                }</span>\n              }\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"group.value\" color=\"primary\" [disabled]=\"!group.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<ng-template #noRoleTpl>\n  <mat-dialog-content>\n    {{'NoRoles'|translate : type?.title}}\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!--<form style=\"display:none\">\n<input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\n</form>-->\n", styles: [":host{-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}table{width:100%}.form{padding:8px}:host ::ng-deep .mat-mdc-list-item{cursor:pointer}table ::ng-deep .role-column{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i2$6.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i7$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i2$8.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$8.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "component", type: i4.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"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "component", type: SearchInput, selector: "bizdoc-search-input", outputs: ["valueChange"] }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: PositionsComponent, selector: "ng-component", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, viewQueries: [{ propertyName: "_fileElement", first: true, predicate: ["file"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "noRoleTpl", first: true, predicate: ["noRoleTpl"], descendants: true, static: true }, { propertyName: "roleTpl", first: true, predicate: ["roleTpl"], descendants: true, static: true }, { propertyName: "patternTpl", first: true, predicate: ["patternTpl"], descendants: true, static: true }, { propertyName: "newGroupTpl", first: true, predicate: ["groupTpl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\n  <mat-menu #newMenu>\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\n  </mat-menu>\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\n</mat-toolbar>\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\n<div class=\"row flex\">\n  <mat-nav-list class=\"nav-list\" [style.display]=\"tools?'':'none'\">\n    @for (t of datatypes; track t) {\n      <mat-list-item (click)=\"change(t.name)\" [class.active]=\"t === type\">{{t.title}}</mat-list-item>\n    }\n  </mat-nav-list>\n  <table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\" class=\"flex\">\n    @for (column of (type?.columns ||[]); track column) {\n      <ng-container [matColumnDef]=\"column.name\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\n        <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"key\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <span>\n          @switch (element.type) {\n            @case ('group') {\n              ({{'Group'|translate}})\n            }\n            @case ('pattern') {\n              ({{'Pattern'|translate}})\n            }\n            @default {\n              {{element.key}}\n            }\n          }\n        </span>\n      </td>\n    </ng-container>\n    <ng-container matColumnDef=\"value\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        {{element.value}}\n      </td>\n    </ng-container>\n    @for (role of roles; track role) {\n      <ng-container [matColumnDef]=\"role.name\">\n        <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\n        <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\" class=\"role-column\">\n          @if (positions[role.name][element.key]) {\n            @for (u of positions[role.name][element.key]; track u; let first = $first) {\n              @if (!first) {\n                ,\n              }\n              {{profiles[u]?.name}}\n            }\n          }\n        </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"options\">\n      <th mat-header-cell *matHeaderCellDef></th>\n      <td mat-cell *matCellDef=\"let element\">\n        @if (element.type === 'pattern' || element.type === 'group') {\n          <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n        }\n        <mat-menu #options>\n          @if (element.type === 'pattern') {\n            <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\n          }\n          @if (element.type === 'group') {\n            <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\n          }\n        </mat-menu>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n    <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\n  </table>\n</div>\n<!-- role template -->\n<ng-template #roleTpl>\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"role\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"role.value\" color=\"primary\" [disabled]=\"!role.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- pattern template -->\n<ng-template #patternTpl>\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"pattern\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- group -->\n<ng-template #groupTpl>\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"group\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\n          <mat-select-trigger>\n            {{group.value.items ? group.value.items[0] : ''}}\n            @if (group.value.items?.length > 1) {\n              <span class=\"additional-selection\">\n                (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\n              </span>\n            }\n          </mat-select-trigger>\n          @for (v of source; track v) {\n            <mat-option [value]=\"v.key\">\n              @if (!type.columns) {\n                <span>{{v.value}}</span>\n              }\n              @if (type.columns) {\n                <span>@for (c of type.columns; track c) {\n                  <span>{{v.value[c.name]}}</span>\n                }</span>\n              }\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"group.value\" color=\"primary\" [disabled]=\"!group.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<ng-template #noRoleTpl>\n  <mat-dialog-content>\n    {{'NoRoles'|translate : type?.title}}\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!--<form style=\"display:none\">\n<input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\n</form>-->\n", styles: [":host{-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}.nav-list{min-width:180px}table{width:100%}.form{padding:8px}:host ::ng-deep .mat-mdc-list-item{cursor:pointer}table ::ng-deep .role-column{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i2$6.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$6.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$6.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$6.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i7$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i2$8.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$8.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "component", type: i4.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"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "component", type: SearchInput, selector: "bizdoc-search-input", outputs: ["valueChange"] }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 };
 PositionsComponent = __decorate([
     BizDoc({ selector: 'bizdoc-positions' })
@@ -32216,7 +32222,7 @@ PositionsComponent = __decorate([
 ], PositionsComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: PositionsComponent, decorators: [{
             type: Component,
-            args: [{ template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\n  <mat-menu #newMenu>\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\n  </mat-menu>\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\n</mat-toolbar>\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\n<div class=\"row flex\">\n  <mat-nav-list class=\"timeline\" [style.display]=\"tools?'':'none'\">\n    @for (t of datatypes; track t) {\n      <mat-list-item (click)=\"change(t.name)\" [class.active]=\"t === type\">{{t.title}}</mat-list-item>\n    }\n  </mat-nav-list>\n  <table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\" class=\"flex\">\n    @for (column of (type?.columns ||[]); track column) {\n      <ng-container [matColumnDef]=\"column.name\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\n        <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"key\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <span>\n          @switch (element.type) {\n            @case ('group') {\n              ({{'Group'|translate}})\n            }\n            @case ('pattern') {\n              ({{'Pattern'|translate}})\n            }\n            @default {\n              {{element.key}}\n            }\n          }\n        </span>\n      </td>\n    </ng-container>\n    <ng-container matColumnDef=\"value\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        {{element.value}}\n      </td>\n    </ng-container>\n    @for (role of roles; track role) {\n      <ng-container [matColumnDef]=\"role.name\">\n        <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\n        <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\" class=\"role-column\">\n          @if (positions[role.name][element.key]) {\n            @for (u of positions[role.name][element.key]; track u; let first = $first) {\n              @if (!first) {\n                ,\n              }\n              {{profiles[u]?.name}}\n            }\n          }\n        </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"options\">\n      <th mat-header-cell *matHeaderCellDef></th>\n      <td mat-cell *matCellDef=\"let element\">\n        @if (element.type === 'pattern' || element.type === 'group') {\n          <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n        }\n        <mat-menu #options>\n          @if (element.type === 'pattern') {\n            <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\n          }\n          @if (element.type === 'group') {\n            <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\n          }\n        </mat-menu>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n    <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\n  </table>\n</div>\n<!-- role template -->\n<ng-template #roleTpl>\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"role\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"role.value\" color=\"primary\" [disabled]=\"!role.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- pattern template -->\n<ng-template #patternTpl>\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"pattern\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- group -->\n<ng-template #groupTpl>\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"group\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\n          <mat-select-trigger>\n            {{group.value.items ? group.value.items[0] : ''}}\n            @if (group.value.items?.length > 1) {\n              <span class=\"additional-selection\">\n                (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\n              </span>\n            }\n          </mat-select-trigger>\n          @for (v of source; track v) {\n            <mat-option [value]=\"v.key\">\n              @if (!type.columns) {\n                <span>{{v.value}}</span>\n              }\n              @if (type.columns) {\n                <span>@for (c of type.columns; track c) {\n                  <span>{{v.value[c.name]}}</span>\n                }</span>\n              }\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"group.value\" color=\"primary\" [disabled]=\"!group.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<ng-template #noRoleTpl>\n  <mat-dialog-content>\n    {{'NoRoles'|translate : type?.title}}\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!--<form style=\"display:none\">\n<input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\n</form>-->\n", styles: [":host{-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}table{width:100%}.form{padding:8px}:host ::ng-deep .mat-mdc-list-item{cursor:pointer}table ::ng-deep .role-column{cursor:pointer}\n"] }]
+            args: [{ template: "<mat-toolbar>\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\n  <span class=\"divider\"></span>\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\n  <mat-menu #newMenu>\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\n  </mat-menu>\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\n</mat-toolbar>\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\n<div class=\"row flex\">\n  <mat-nav-list class=\"nav-list\" [style.display]=\"tools?'':'none'\">\n    @for (t of datatypes; track t) {\n      <mat-list-item (click)=\"change(t.name)\" [class.active]=\"t === type\">{{t.title}}</mat-list-item>\n    }\n  </mat-nav-list>\n  <table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\" class=\"flex\">\n    @for (column of (type?.columns ||[]); track column) {\n      <ng-container [matColumnDef]=\"column.name\">\n        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\n        <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"key\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        <span>\n          @switch (element.type) {\n            @case ('group') {\n              ({{'Group'|translate}})\n            }\n            @case ('pattern') {\n              ({{'Pattern'|translate}})\n            }\n            @default {\n              {{element.key}}\n            }\n          }\n        </span>\n      </td>\n    </ng-container>\n    <ng-container matColumnDef=\"value\">\n      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\n      <td mat-cell *matCellDef=\"let element\">\n        {{element.value}}\n      </td>\n    </ng-container>\n    @for (role of roles; track role) {\n      <ng-container [matColumnDef]=\"role.name\">\n        <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\n        <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\" class=\"role-column\">\n          @if (positions[role.name][element.key]) {\n            @for (u of positions[role.name][element.key]; track u; let first = $first) {\n              @if (!first) {\n                ,\n              }\n              {{profiles[u]?.name}}\n            }\n          }\n        </td>\n      </ng-container>\n    }\n    <ng-container matColumnDef=\"options\">\n      <th mat-header-cell *matHeaderCellDef></th>\n      <td mat-cell *matCellDef=\"let element\">\n        @if (element.type === 'pattern' || element.type === 'group') {\n          <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\n        }\n        <mat-menu #options>\n          @if (element.type === 'pattern') {\n            <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\n          }\n          @if (element.type === 'group') {\n            <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\n            <mat-divider></mat-divider>\n            <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\n          }\n        </mat-menu>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\n    <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\n  </table>\n</div>\n<!-- role template -->\n<ng-template #roleTpl>\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"role\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"role.value\" color=\"primary\" [disabled]=\"!role.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- pattern template -->\n<ng-template #patternTpl>\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"pattern\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!-- group -->\n<ng-template #groupTpl>\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\n  <mat-dialog-content>\n    <form [formGroup]=\"group\" class=\"column\">\n      <mat-form-field>\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\n      </mat-form-field>\n      <mat-form-field>\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\n          <mat-select-trigger>\n            {{group.value.items ? group.value.items[0] : ''}}\n            @if (group.value.items?.length > 1) {\n              <span class=\"additional-selection\">\n                (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\n              </span>\n            }\n          </mat-select-trigger>\n          @for (v of source; track v) {\n            <mat-option [value]=\"v.key\">\n              @if (!type.columns) {\n                <span>{{v.value}}</span>\n              }\n              @if (type.columns) {\n                <span>@for (c of type.columns; track c) {\n                  <span>{{v.value[c.name]}}</span>\n                }</span>\n              }\n            </mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n    </form>\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"group.value\" color=\"primary\" [disabled]=\"!group.valid\">{{'OK' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<ng-template #noRoleTpl>\n  <mat-dialog-content>\n    {{'NoRoles'|translate : type?.title}}\n  </mat-dialog-content>\n  <mat-dialog-actions>\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\n  </mat-dialog-actions>\n</ng-template>\n<!--<form style=\"display:none\">\n<input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\n</form>-->\n", styles: [":host{-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}.nav-list{min-width:180px}table{width:100%}.form{padding:8px}:host ::ng-deep .mat-mdc-list-item{cursor:pointer}table ::ng-deep .role-column{cursor:pointer}\n"] }]
         }], ctorParameters: () => [{ type: SessionService }, { type: UtilityRef, decorators: [{
                     type: Inject,
                     args: [UtilityRef]
@@ -32431,13 +32437,13 @@ let ProfilerComponent = class ProfilerComponent {
             height: 10
         };
         this.palettes = this._session.accentPalette;
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.cols = 2;
         this._destroy = new Subject();
         this.separatorKeysCodes = [ENTER, COMMA, SEMICOLON];
         this.cols = 2;
         _session.themeChange.pipe(takeUntil$1(this._destroy)).subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.palettes = _session.accentPalette;
         });
     }
@@ -33665,7 +33671,7 @@ class FormDesignComponent extends DesignerTypeElementComponent {
             description: null,
             cubes: null
         });
-        this.theme = this._session.theme.dark ? 'MaterialDark' : 'Material';
+        this.theme = this._session.theme.dark ? 'Material3Dark' : 'Material3';
         this.axisSettings = {
             lineSettings: {
                 opacity: .5,
@@ -33691,7 +33697,7 @@ class FormDesignComponent extends DesignerTypeElementComponent {
         this.locale = _session.language;
         this._session.themeChange.pipe(takeUntil(this._destroy)).
             subscribe(t => {
-            this.theme = t.dark ? 'MaterialDark' : 'Material';
+            this.theme = t.dark ? 'Material3Dark' : 'Material3';
             this.primary = this._session.getPrimery();
         });
     }