@bizdoc/core 3.6.8 → 3.7.1

package/fesm2022/bizdoc-core.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Inject, Injectable, Pipe, Directive, Component, Injector, ElementRef, HostListener, TemplateRef, ViewContainerRef, ViewChild, Input, HostBinding, Output, Optional, Self, EventEmitter, NgModule, ViewChildren, inject, Host, SkipSelf, ContentChild, ContentChildren, provideAppInitializer } from '@angular/core';
-import { Subject, firstValueFrom, of, forkJoin, BehaviorSubject, merge, takeUntil as takeUntil$1, shareReplay as shareReplay$1, map as map$1, Observable, filter as filter$1, from, interval, switchMap as switchMap$1, isObservable, catchError as catchError$1, startWith as startWith$1, EMPTY, debounceTime as debounceTime$1 } from 'rxjs';
-import { map, tap, catchError, shareReplay, filter, startWith, takeUntil, debounceTime, switchMap, first, take, finalize, delay } from 'rxjs/operators';
+import { InjectionToken, Inject, Injectable, Pipe, Directive, Component, Injector, ElementRef, HostListener, TemplateRef, ViewContainerRef, ViewChild, Input, Optional, HostBinding, Output, Self, EventEmitter, NgModule, ViewChildren, inject, Host, SkipSelf, ContentChild, ContentChildren, provideAppInitializer } from '@angular/core';
+import { Subject, firstValueFrom, of, forkJoin, filter, map as map$1, BehaviorSubject, merge, takeUntil as takeUntil$1, shareReplay as shareReplay$1, Observable, from, interval, switchMap as switchMap$1, isObservable, catchError as catchError$1, startWith as startWith$1, EMPTY, debounceTime as debounceTime$1 } from 'rxjs';
+import { map, tap, catchError, shareReplay, filter as filter$1, startWith, takeUntil, debounceTime, switchMap, first, take, finalize, delay } from 'rxjs/operators';
 import * as i4 from '@angular/material/chips';
 import { MatChipInput, MatChipsModule, MatChipListbox } from '@angular/material/chips';
 import { ENTER, COMMA, SEMICOLON } from '@angular/cdk/keycodes';
@@ -3326,6 +3326,156 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
             args: [{ providedIn: "root" }]
         }], ctorParameters: () => [{ type: i1.HttpClient }, { type: HubService }] });
 
+const QUERY_CHAR = ':', PATH_CHAR = ';', ARG_CHAR = '&', PANE_CHAR = '~';
+const PANES_DATA = new InjectionToken('panes');
+class NavigationBase {
+    preventDefault() {
+        this._preventDefault = true;
+    }
+}
+class CollapseNavigation extends NavigationBase {
+}
+class BackNavigation extends NavigationBase {
+}
+class NavigationPaneBase extends NavigationBase {
+    constructor(_pane) {
+        super();
+        this._pane = _pane;
+    }
+    get pane() {
+        return this._pane;
+    }
+}
+class NavigationStart extends NavigationPaneBase {
+}
+/** pane fucus change */
+class NavigationFocus extends NavigationPaneBase {
+}
+class NavigationEnd extends NavigationPaneBase {
+}
+class NavigationMode extends NavigationPaneBase {
+    constructor(mode, pane) {
+        super(pane);
+        this.mode = mode;
+    }
+}
+class NavigationExpand extends NavigationPaneBase {
+    constructor(expended, pane) {
+        super(pane);
+        this.expended = expended;
+    }
+}
+class NavigationResize extends NavigationPaneBase {
+    constructor(dimentions, pane) {
+        super(pane);
+        this.dimentions = dimentions;
+    }
+}
+class NavigationClose extends NavigationPaneBase {
+}
+class ParamNavigation extends NavigationPaneBase {
+    constructor(params, pane) {
+        super(pane);
+        this.params = params;
+    }
+}
+class QueryParamNavigation extends NavigationPaneBase {
+    constructor(queryParams, pane) {
+        super(pane);
+        this.queryParams = queryParams;
+    }
+}
+/** */
+class PaneRef {
+    get expandable() { return this._expandable; }
+    get injector() { return this._injector; }
+    get expanded() { return this._expanded; }
+    get fullPath() { return (this._path || '') + (this._queryString ? (QUERY_CHAR + this._queryString) : ''); }
+    get instance() { return this._instance; }
+    get data() { return this._data$.value; }
+    get params() { return this._params$.value; }
+    get queryString() { return this._queryString; }
+    get queryParams() { return this._queryParams$.value; }
+    paramsChange() { return this._params$.asObservable(); }
+    queryParamsChange() { return this._queryParams$.asObservable(); }
+    dataChange() { return this._data$.asObservable(); }
+    resized() { return this._events$.pipe(filter(e => e instanceof NavigationResize)); }
+    closeing() { return this._events$.pipe(filter(e => e instanceof NavigationClose)); }
+    closed() { return this._events$.pipe(filter(e => e instanceof NavigationClose), map$1(() => this._value)); }
+    expandedChange() { return this._events$.pipe(filter(e => e instanceof NavigationExpand), map$1(() => this.expanded)); }
+    get path() { return this._path; }
+    ;
+    get mode() { return this._mode; }
+    ;
+    get parent() { return this._options.parent; }
+    ;
+    get stretchable() { return this._stretchable === true; }
+    ;
+    set stretchable(val) { this._stretchable = val; }
+    get dialog() { return this._options.dialog; }
+    ;
+    get dismissable() { return this._options.dismissable; }
+    ;
+    get route() { return this._options.route; }
+    ;
+    constructor(component, injector, id, _options) {
+        this.id = id;
+        this._options = _options;
+        this._command$ = new Subject();
+        /** */
+        this._data$ = new BehaviorSubject({});
+        this._params$ = new BehaviorSubject({});
+        this._queryParams$ = new BehaviorSubject({});
+        this._events$ = new Subject();
+        const { stretchable, mode, data, params, queryParams, path, queryString, title, group, icon, help, guide, animation, expanded, expandable } = _options;
+        this._path = path;
+        this._mode = mode;
+        this._stretchable = stretchable;
+        this._expanded = expanded;
+        this._queryString = queryString;
+        this._expandable = expandable !== false;
+        this._injector = Injector.create({
+            providers: [
+                { provide: PaneRef, useValue: this }
+            ], parent: injector
+        });
+        this._portal = new ComponentPortal(component, null, this._injector);
+        this.title = title;
+        this.group = group;
+        this.guide = guide;
+        this.help = help;
+        this.icon = icon;
+        this.animation = animation;
+        data && this._data$.next(data);
+        params && this._params$.next(params);
+        queryParams && this._queryParams$.next(queryParams);
+    }
+    decendentOf(pane) {
+        return this.parent === pane; //||
+        //  (this.path && pane.path && this.path.startsWith(pane.path));
+    }
+    recycle() {
+        this._command$.next('recycle');
+    }
+    focus() {
+        this._command$.next('focus');
+    }
+    close(value) {
+        this._value = value;
+        this._command$.next('close');
+    }
+    expand() {
+        this._command$.next('expand');
+    }
+    _destroy() {
+        this._command$.complete();
+        this._data$.complete();
+        this._params$.complete();
+        this._queryParams$.complete();
+        this._events$.complete();
+    }
+}
+
 class PopupRef {
     constructor(_data) {
         this._data = _data;
@@ -3511,7 +3661,7 @@ class Popup {
         const portal = new ComponentPortal(PopupComponent, null, popupInjector);
         oRef.attach(portal);
         pRef._closed.subscribe(() => oRef.detach());
-        oRef.keydownEvents().pipe(filter(k => k.key === 'Escape')).
+        oRef.keydownEvents().pipe(filter$1(k => k.key === 'Escape')).
             subscribe(e => {
             e.stopPropagation();
             pRef._closed.next(null);
@@ -3633,7 +3783,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
 const OPTION_PANEL = new InjectionToken('options');
 /** options component*/
 class OptionsComponent {
-    constructor(_ps, _guide, _hub, _dialog, _fb, _accounts, _sb, _session, _popup, config) {
+    constructor(_ps, _guide, _hub, _dialog, _fb, _accounts, _sb, paneRef, _session, _popup, config) {
         this._ps = _ps;
         this._guide = _guide;
         this._hub = _hub;
@@ -3712,6 +3862,11 @@ class OptionsComponent {
         if (!this._session.isImpersonating) {
             this.guidesCount = this.guides.filter(w => w.mode === 'Eager').length || null;
         }
+        if (paneRef) {
+            const section = paneRef.queryParams['section'];
+            if (section)
+                this.sectionIndex = 2;
+        }
         this.languages = this._session.languages;
         this.currentLanguage = this._session.language;
         this.available = this._session.availabilityState;
@@ -3794,12 +3949,12 @@ class OptionsComponent {
         });
         outOfOffice.controls.from.valueChanges.pipe(takeUntil(this._destroy)).
             subscribe(from => this._toggle(outOfOffice, from !== null, 'to'));
-        this.gusers$ = this.grantUserIds.valueChanges.pipe(takeUntil(this._destroy), filter(v => isString(v)), debounceTime(100), switchMap(v => this._accounts.findAll(v)), map(r => {
+        this.gusers$ = this.grantUserIds.valueChanges.pipe(takeUntil(this._destroy), filter$1(v => isString(v)), debounceTime(100), switchMap(v => this._accounts.findAll(v)), map(r => {
             const exclude = grantAccess.value.users?.slice() || [];
             exclude.push(this._session.profile.userId);
             return r.filter(u => exclude.indexOf(u.id) < 0);
         }));
-        this.susers$ = this.oooId.valueChanges.pipe(takeUntil(this._destroy), tap(v => !v && outOfOffice.controls.substitueId.setValue(null)), filter(v => isString(v) && v.length > 0), switchMap(v => this._accounts.findAll(v)), map(r => r.filter(u => u.id !== this._session.profile.userId)));
+        this.susers$ = this.oooId.valueChanges.pipe(takeUntil(this._destroy), tap(v => !v && outOfOffice.controls.substitueId.setValue(null)), filter$1(v => isString(v) && v.length > 0), switchMap(v => this._accounts.findAll(v)), map(r => r.filter(u => u.id !== this._session.profile.userId)));
         if (this.options.outOfOffice.substitueId)
             this._accounts.get(this.options.outOfOffice.substitueId).subscribe(u => this.oooId.setValue(u, { emitEvent: false }));
         // auto save
@@ -3888,13 +4043,15 @@ class OptionsComponent {
         this._destroy.next();
         this._destroy.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: OptionsComponent, deps: [{ token: PromptService }, { token: GuideService }, { token: HubService }, { token: i2$2.MatDialog }, { token: i1$2.FormBuilder }, { token: AccountService }, { token: PromptService }, { token: SessionService }, { token: Popup }, { token: BIZDOC_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: OptionsComponent, deps: [{ token: PromptService }, { token: GuideService }, { token: HubService }, { token: i2$2.MatDialog }, { token: i1$2.FormBuilder }, { token: AccountService }, { token: PromptService }, { token: PaneRef, optional: true }, { token: SessionService }, { token: Popup }, { token: BIZDOC_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: OptionsComponent, isStandalone: false, selector: "bizdoc-options", inputs: { sectionName: ["section", "sectionName"] }, host: { listeners: { "document:keydown.escape": "close()" } }, viewQueries: [{ propertyName: "keyboard", first: true, predicate: ["keyboardTmpl"], descendants: true }, { propertyName: "substitueInput", first: true, predicate: ["substitueInput"], descendants: true, read: MatInput }, { propertyName: "grantInput", first: true, predicate: ["grantInput"], descendants: true, read: MatChipInput }, { propertyName: "oooTmpl", first: true, predicate: ["oooTmpl"], descendants: true, static: true }, { propertyName: "notificationsTmpl", first: true, predicate: ["notificationsTmpl"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"column\">\r\n    <div class=\"profile-name\">\r\n        <span class=\"mat-headline-6\">\r\n            @if (profile.byName) {\r\n            {{profile.byName}} \\\r\n            }\r\n            {{profile.name}}\r\n        </span>\r\n    </div>\r\n\r\n    <mat-divider />\r\n\r\n    <div class=\"row\">\r\n        <mat-nav-list class=\"nav-list\">\r\n            <mat-list-item (click)=\"nav('notifications', notificationsTmpl, 0)\" [class.active]=\"sectionName === 'notifications'\">\r\n                <span matListItemTitle>{{'Notifications' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('emails', emailsTmpl, 1)\" [class.active]=\"sectionName === 'emails'\">\r\n                <span matListItemTitle>{{'Emails' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('out_of_office', oooTmpl, 2)\" [class.active]=\"sectionName === 'out_of_office'\">\r\n                <span matListItemTitle>{{'OutOfOffice' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('grant_access', grantAccessTmpl, 3)\" [class.active]=\"sectionName === 'grant_access'\">\r\n                <span matListItemTitle>{{'GrantAccess' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('preferences', preferencesTmpl, 4)\" [class.active]=\"sectionName === 'preferences'\">\r\n                <span matListItemTitle>{{'Preferences' | translate}}</span>\r\n            </mat-list-item>\r\n        </mat-nav-list>\r\n        <div class=\"separator\"></div>\r\n        <form autocomplete=\"off\" [@v-swape]=\"sectionIndex\">\r\n            <ng-container *ngTemplateOutlet=\"sectionTmpl\"></ng-container>\r\n        </form>\r\n    </div>\r\n    <mat-divider />\r\n    <!--themes-->\r\n    @if (themes.length > 1) {\r\n    <div class=\"row center\">\r\n        @for (t of themes; track t) {\r\n        <button (click)=\"changeTheme(t)\" mat-icon-button class=\"theme\" [style.background]=\"t.color\" [class.active]=\"t.name === theme\" [class.dark]=\"t.dark\" [bizdocTooltip]=\"'Theme'|translate\"></button>\r\n        }\r\n    </div>\r\n    }\r\n</div>\r\n<!--guide-->\r\n<mat-nav-list role=\"list\">\r\n    <mat-divider></mat-divider>\r\n    <h3 mat-subheader [matBadge]=\"guidesCount\" matBadgeColor=\"accent\" matBadgeOverlap=\"false\" matBadgeSize=\"small\">{{'Help'|translate}}</h3>\r\n    @for (g of guides; track g) {\r\n    <button mat-menu-item (click)=\"guide(g.name)\">{{g.title}}</button>\r\n    }\r\n</mat-nav-list>\r\n<mat-divider></mat-divider>\r\n<!--footer-->\r\n<div class=\"row footer\">\r\n  <button mat-button role=\"listitem\" [matMenuTriggerFor]=\"language\">\r\n    {{currentLanguage | translate}}\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n    <!--'ChangeLanguage'-->\r\n  </button>\r\n  <mat-menu #language>\r\n    @for (l of languages; track l) {\r\n    <button mat-menu-item (click)=\"changeLanguage(l)\">{{l | translate}}</button>\r\n    }\r\n  </mat-menu>\r\n  @if (online) {\r\n  <button mat-button [matMenuTriggerFor]=\"availability\">\r\n    {{'ShowAs' | translate : (available | translate | lowercase)}}\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  }\r\n  <mat-menu #availability>\r\n    @for (m of modes; track m) {\r\n    <button mat-menu-item (click)=\"setAvailable(m)\">{{m | translate}}</button>\r\n    }\r\n  </mat-menu>\r\n  <span class=\"divider\"></span>\r\n  <!--keys-->\r\n  @if(!isMobile) {\r\n  <button mat-button role=\"listitem\" (click)=\"showKeyboard($event)\">\r\n    {{'Keyboard' | translate}}\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n    <!--'ChangeLanguage'-->\r\n  </button>\r\n  }\r\n  <button mat-button role=\"listitem\" (click)=\"about()\">{{ 'About' | translate}}</button>\r\n  @if (!online) {\r\n  <button mat-icon-button (click)=\"revive()\" [bizdocTooltip]=\"'Connect'|translate\">\r\n    <mat-icon>wifi_off</mat-icon>\r\n  </button>\r\n  }\r\n</div>\r\n<!--preferences-->\r\n<ng-template #preferencesTmpl>\r\n    <div class=\"column\">\r\n        <mat-form-field>\r\n            <mat-label>{{'Tags'|translate}}</mat-label>\r\n            <mat-chip-grid #chips>\r\n              @for (tag of form.value.tags; track tag.name) {\r\n              <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(tag)\">\r\n                {{tag.name}}\r\n                <mat-icon matChipRemove>cancel</mat-icon>\r\n              </mat-chip-row>\r\n              }\r\n            </mat-chip-grid>\r\n            <input [matChipInputFor]=\"chips\"\r\n                   [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\r\n                   [matChipInputAddOnBlur]=\"true\"\r\n                   (matChipInputTokenEnd)=\"addTag($event)\">\r\n        </mat-form-field>\r\n    </div>\r\n</ng-template>\r\n<!---->\r\n<ng-template #keyboardTmpl>\r\n  <dl class=\"keys mat-body-2\">\r\n    <dt>Alt+n</dt>\r\n    <dd>{{'AltNHelp'|translate}}</dd>\r\n    <dt>Ctrl+s</dt>\r\n    <dd>{{'CtrlSHelp'|translate}}</dd>\r\n    <dt>Alt+s</dt>\r\n    <dd>{{'AltSHelp'|translate}}</dd>\r\n    <dt>Alt+q</dt>\r\n    <dd>{{'AltQHelp'|translate}}</dd>\r\n    <dt>Alt+a</dt>\r\n    <dd>{{'AltAHelp'|translate}}</dd>\r\n    <dt>Alt+h</dt>\r\n    <dd>{{'AltHHelp'|translate}}</dd>\r\n    <dt>Ctrl+.</dt>\r\n    <dd>{{'CtrlDotHelp'|translate}}</dd>\r\n  </dl>\r\n</ng-template>\r\n<!--notifications-->\r\n<ng-template #notificationsTmpl>\r\n    <div [formGroup]=\"form.controls.notifications\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-checkbox formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"likes\" [style.display]=\"voting?'':'none'\">{{'LikedComment' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-checkbox>\r\n        <div formGroupName=\"extra\" class=\"column\"> \r\n            @for(n of profile.notifications; track n.name) {\r\n            <mat-checkbox [formControlName]=\"n.name\">{{n.title}}</mat-checkbox>\r\n            }\r\n        </div>\r\n        <div class=\"row\">\r\n            <span class=\"divider\"></span>\r\n            <button mat-icon-button type=\"button\" (click)=\"toggleSound()\" [disabled]=\"!form.value.notifications.active\" [bizdocTooltip]=\"(form.value.notifications.sound ? 'SoundOn': 'SoundOff')|translate\"><mat-icon>{{form.value.notifications.sound ? 'volume_up' : 'volume_off'}}</mat-icon></button>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n<!--emails-->\r\n<ng-template #emailsTmpl>\r\n    <div [formGroup]=\"form.controls.emails\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-checkbox formControlName=\"mail\">{{'Mails' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"chat\">{{'Conversations' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-checkbox>\r\n    </div>\r\n</ng-template>\r\n<!--ooo-->\r\n<ng-template #oooTmpl>\r\n    <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field class=\"flex\">\r\n            <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n                   [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\r\n            <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\r\n                              (optionSelected)=\"oooSelected($event)\">\r\n                @for (u of susers$ | async; track u.id) {\r\n                <mat-option [value]=\"u\">\r\n                    {{u.name}}\r\n                </mat-option>\r\n                }\r\n            </mat-autocomplete>\r\n            <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n        <mat-form-field>\r\n            <mat-label>{{'Dates'|translate}}</mat-label>\r\n            <mat-date-range-input [rangePicker]=\"oooDates\">\r\n                <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n                <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n            </mat-date-range-input>\r\n            <mat-datepicker-toggle matSuffix [for]=\"oooDates\"></mat-datepicker-toggle>\r\n            <mat-date-range-picker #oooDates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n        </mat-form-field>\r\n    </div>\r\n</ng-template>\r\n<!--grantAccess-->\r\n<ng-template #grantAccessTmpl>\r\n    <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field>\r\n            <mat-label>{{'Associates'| translate}}</mat-label>\r\n            <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\r\n                @for (u of form.value.grantAccess.users || []; track u.id) {\r\n                <mat-chip-row (removed)=\"removeGrant(u)\">\r\n                    {{u | userName | async}}\r\n                    <mat-icon matChipRemove>cancel</mat-icon>\r\n                </mat-chip-row>\r\n                }\r\n            </mat-chip-grid>\r\n            <input [formControl]=\"grantUserIds\"\r\n                   #grantInput\r\n                   [matAutocomplete]=\"grantAuto\"\r\n                   [matChipInputFor]=\"grantList\"\r\n                   [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n            <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n                @for (u of gusers$ | async; track u.id) {\r\n                <mat-option [value]=\"u.id\">\r\n                    {{u.name}}\r\n                </mat-option>\r\n                }\r\n            </mat-autocomplete>\r\n            <mat-hint>{{'GrantTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{max-width:80vw;min-width:420px}.footer{align-items:center}.profile-name{margin:8px}.theme{height:22px!important;width:22px!important;-moz-border-radius:13px 13px!important;-webkit-border-radius:13px 13px!important;border-radius:13px!important;margin:4px!important}.theme.active.dark{border:2px solid #f4f4f4}.keys{padding:8px}.keys dt{width:72px;float:inline-start;clear:both;font-variant-caps:all-small-caps}.keys dd{float:inline-end;font-size:small;margin:0}.separator{height:280px;width:1px;background-color:var(--mat-sys-outline)}form{padding:20px 8px 0;min-width:320px}\n"], dependencies: [{ kind: "directive", type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i4.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i4.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i4.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i2$4.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i2$4.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$4.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$4.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$4.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: i7$1.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i2$5.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$5.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$5.MatListSubheaderCssMatStyler, selector: "[mat-subheader], [matSubheader]" }, { kind: "component", type: i2$5.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i2$5.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "component", type: i2$6.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$6.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$6.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i8.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2$7.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i3$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i7.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.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }], animations: [verticalSwapAnimation] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: OptionsComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: 'bizdoc-options', animations: [verticalSwapAnimation], template: "<div class=\"column\">\r\n    <div class=\"profile-name\">\r\n        <span class=\"mat-headline-6\">\r\n            @if (profile.byName) {\r\n            {{profile.byName}} \\\r\n            }\r\n            {{profile.name}}\r\n        </span>\r\n    </div>\r\n\r\n    <mat-divider />\r\n\r\n    <div class=\"row\">\r\n        <mat-nav-list class=\"nav-list\">\r\n            <mat-list-item (click)=\"nav('notifications', notificationsTmpl, 0)\" [class.active]=\"sectionName === 'notifications'\">\r\n                <span matListItemTitle>{{'Notifications' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('emails', emailsTmpl, 1)\" [class.active]=\"sectionName === 'emails'\">\r\n                <span matListItemTitle>{{'Emails' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('out_of_office', oooTmpl, 2)\" [class.active]=\"sectionName === 'out_of_office'\">\r\n                <span matListItemTitle>{{'OutOfOffice' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('grant_access', grantAccessTmpl, 3)\" [class.active]=\"sectionName === 'grant_access'\">\r\n                <span matListItemTitle>{{'GrantAccess' | translate}}</span>\r\n            </mat-list-item>\r\n            <mat-list-item (click)=\"nav('preferences', preferencesTmpl, 4)\" [class.active]=\"sectionName === 'preferences'\">\r\n                <span matListItemTitle>{{'Preferences' | translate}}</span>\r\n            </mat-list-item>\r\n        </mat-nav-list>\r\n        <div class=\"separator\"></div>\r\n        <form autocomplete=\"off\" [@v-swape]=\"sectionIndex\">\r\n            <ng-container *ngTemplateOutlet=\"sectionTmpl\"></ng-container>\r\n        </form>\r\n    </div>\r\n    <mat-divider />\r\n    <!--themes-->\r\n    @if (themes.length > 1) {\r\n    <div class=\"row center\">\r\n        @for (t of themes; track t) {\r\n        <button (click)=\"changeTheme(t)\" mat-icon-button class=\"theme\" [style.background]=\"t.color\" [class.active]=\"t.name === theme\" [class.dark]=\"t.dark\" [bizdocTooltip]=\"'Theme'|translate\"></button>\r\n        }\r\n    </div>\r\n    }\r\n</div>\r\n<!--guide-->\r\n<mat-nav-list role=\"list\">\r\n    <mat-divider></mat-divider>\r\n    <h3 mat-subheader [matBadge]=\"guidesCount\" matBadgeColor=\"accent\" matBadgeOverlap=\"false\" matBadgeSize=\"small\">{{'Help'|translate}}</h3>\r\n    @for (g of guides; track g) {\r\n    <button mat-menu-item (click)=\"guide(g.name)\">{{g.title}}</button>\r\n    }\r\n</mat-nav-list>\r\n<mat-divider></mat-divider>\r\n<!--footer-->\r\n<div class=\"row footer\">\r\n  <button mat-button role=\"listitem\" [matMenuTriggerFor]=\"language\">\r\n    {{currentLanguage | translate}}\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n    <!--'ChangeLanguage'-->\r\n  </button>\r\n  <mat-menu #language>\r\n    @for (l of languages; track l) {\r\n    <button mat-menu-item (click)=\"changeLanguage(l)\">{{l | translate}}</button>\r\n    }\r\n  </mat-menu>\r\n  @if (online) {\r\n  <button mat-button [matMenuTriggerFor]=\"availability\">\r\n    {{'ShowAs' | translate : (available | translate | lowercase)}}\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  }\r\n  <mat-menu #availability>\r\n    @for (m of modes; track m) {\r\n    <button mat-menu-item (click)=\"setAvailable(m)\">{{m | translate}}</button>\r\n    }\r\n  </mat-menu>\r\n  <span class=\"divider\"></span>\r\n  <!--keys-->\r\n  @if(!isMobile) {\r\n  <button mat-button role=\"listitem\" (click)=\"showKeyboard($event)\">\r\n    {{'Keyboard' | translate}}\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n    <!--'ChangeLanguage'-->\r\n  </button>\r\n  }\r\n  <button mat-button role=\"listitem\" (click)=\"about()\">{{ 'About' | translate}}</button>\r\n  @if (!online) {\r\n  <button mat-icon-button (click)=\"revive()\" [bizdocTooltip]=\"'Connect'|translate\">\r\n    <mat-icon>wifi_off</mat-icon>\r\n  </button>\r\n  }\r\n</div>\r\n<!--preferences-->\r\n<ng-template #preferencesTmpl>\r\n    <div class=\"column\">\r\n        <mat-form-field>\r\n            <mat-label>{{'Tags'|translate}}</mat-label>\r\n            <mat-chip-grid #chips>\r\n              @for (tag of form.value.tags; track tag.name) {\r\n              <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(tag)\">\r\n                {{tag.name}}\r\n                <mat-icon matChipRemove>cancel</mat-icon>\r\n              </mat-chip-row>\r\n              }\r\n            </mat-chip-grid>\r\n            <input [matChipInputFor]=\"chips\"\r\n                   [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\r\n                   [matChipInputAddOnBlur]=\"true\"\r\n                   (matChipInputTokenEnd)=\"addTag($event)\">\r\n        </mat-form-field>\r\n    </div>\r\n</ng-template>\r\n<!---->\r\n<ng-template #keyboardTmpl>\r\n  <dl class=\"keys mat-body-2\">\r\n    <dt>Alt+n</dt>\r\n    <dd>{{'AltNHelp'|translate}}</dd>\r\n    <dt>Ctrl+s</dt>\r\n    <dd>{{'CtrlSHelp'|translate}}</dd>\r\n    <dt>Alt+s</dt>\r\n    <dd>{{'AltSHelp'|translate}}</dd>\r\n    <dt>Alt+q</dt>\r\n    <dd>{{'AltQHelp'|translate}}</dd>\r\n    <dt>Alt+a</dt>\r\n    <dd>{{'AltAHelp'|translate}}</dd>\r\n    <dt>Alt+h</dt>\r\n    <dd>{{'AltHHelp'|translate}}</dd>\r\n    <dt>Ctrl+.</dt>\r\n    <dd>{{'CtrlDotHelp'|translate}}</dd>\r\n  </dl>\r\n</ng-template>\r\n<!--notifications-->\r\n<ng-template #notificationsTmpl>\r\n    <div [formGroup]=\"form.controls.notifications\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-checkbox formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"likes\" [style.display]=\"voting?'':'none'\">{{'LikedComment' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-checkbox>\r\n        <div formGroupName=\"extra\" class=\"column\"> \r\n            @for(n of profile.notifications; track n.name) {\r\n            <mat-checkbox [formControlName]=\"n.name\">{{n.title}}</mat-checkbox>\r\n            }\r\n        </div>\r\n        <div class=\"row\">\r\n            <span class=\"divider\"></span>\r\n            <button mat-icon-button type=\"button\" (click)=\"toggleSound()\" [disabled]=\"!form.value.notifications.active\" [bizdocTooltip]=\"(form.value.notifications.sound ? 'SoundOn': 'SoundOff')|translate\"><mat-icon>{{form.value.notifications.sound ? 'volume_up' : 'volume_off'}}</mat-icon></button>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n<!--emails-->\r\n<ng-template #emailsTmpl>\r\n    <div [formGroup]=\"form.controls.emails\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-checkbox formControlName=\"mail\">{{'Mails' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"chat\">{{'Conversations' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-checkbox>\r\n        <mat-checkbox formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-checkbox>\r\n    </div>\r\n</ng-template>\r\n<!--ooo-->\r\n<ng-template #oooTmpl>\r\n    <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field class=\"flex\">\r\n            <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n                   [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\r\n            <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\r\n                              (optionSelected)=\"oooSelected($event)\">\r\n                @for (u of susers$ | async; track u.id) {\r\n                <mat-option [value]=\"u\">\r\n                    {{u.name}}\r\n                </mat-option>\r\n                }\r\n            </mat-autocomplete>\r\n            <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n        <mat-form-field>\r\n            <mat-label>{{'Dates'|translate}}</mat-label>\r\n            <mat-date-range-input [rangePicker]=\"oooDates\">\r\n                <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n                <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n            </mat-date-range-input>\r\n            <mat-datepicker-toggle matSuffix [for]=\"oooDates\"></mat-datepicker-toggle>\r\n            <mat-date-range-picker #oooDates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n        </mat-form-field>\r\n    </div>\r\n</ng-template>\r\n<!--grantAccess-->\r\n<ng-template #grantAccessTmpl>\r\n    <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field>\r\n            <mat-label>{{'Associates'| translate}}</mat-label>\r\n            <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\r\n                @for (u of form.value.grantAccess.users || []; track u.id) {\r\n                <mat-chip-row (removed)=\"removeGrant(u)\">\r\n                    {{u | userName | async}}\r\n                    <mat-icon matChipRemove>cancel</mat-icon>\r\n                </mat-chip-row>\r\n                }\r\n            </mat-chip-grid>\r\n            <input [formControl]=\"grantUserIds\"\r\n                   #grantInput\r\n                   [matAutocomplete]=\"grantAuto\"\r\n                   [matChipInputFor]=\"grantList\"\r\n                   [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n            <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n                @for (u of gusers$ | async; track u.id) {\r\n                <mat-option [value]=\"u.id\">\r\n                    {{u.name}}\r\n                </mat-option>\r\n                }\r\n            </mat-autocomplete>\r\n            <mat-hint>{{'GrantTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{max-width:80vw;min-width:420px}.footer{align-items:center}.profile-name{margin:8px}.theme{height:22px!important;width:22px!important;-moz-border-radius:13px 13px!important;-webkit-border-radius:13px 13px!important;border-radius:13px!important;margin:4px!important}.theme.active.dark{border:2px solid #f4f4f4}.keys{padding:8px}.keys dt{width:72px;float:inline-start;clear:both;font-variant-caps:all-small-caps}.keys dd{float:inline-end;font-size:small;margin:0}.separator{height:280px;width:1px;background-color:var(--mat-sys-outline)}form{padding:20px 8px 0;min-width:320px}\n"] }]
-        }], ctorParameters: () => [{ type: PromptService }, { type: GuideService }, { type: HubService }, { type: i2$2.MatDialog }, { type: i1$2.FormBuilder }, { type: AccountService }, { type: PromptService }, { type: SessionService }, { type: Popup }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: PromptService }, { type: GuideService }, { type: HubService }, { type: i2$2.MatDialog }, { type: i1$2.FormBuilder }, { type: AccountService }, { type: PromptService }, { type: PaneRef, decorators: [{
+                    type: Optional
+                }] }, { type: SessionService }, { type: Popup }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [BIZDOC_CONFIG]
                 }] }], propDecorators: { keyboard: [{
@@ -4089,7 +4246,7 @@ class ColorPicker {
             hasBackdrop: true,
             backdropClass: 'cdk-overlay-transparent-backdrop'
         });
-        merge(ref.backdropClick(), ref.keydownEvents().pipe(filter(k => k.key === 'Escape'))).subscribe(() => this.close());
+        merge(ref.backdropClick(), ref.keydownEvents().pipe(filter$1(k => k.key === 'Escape'))).subscribe(() => this.close());
         return ref;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: ColorPicker, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i2$3.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i7$2.Directionality }], target: i0.ɵɵFactoryTarget.Component }); }
@@ -5924,7 +6081,7 @@ class TypeAutocomplete {
         if (!this._configuration)
             throw `${this._type} is not a known type.`;
         this._column = this._configuration.columns ? this._configuration.columns.find(c => !c.flags || c.flags.indexOf('Key') < 0) : undefined;
-        this._items$ = this._control.valueChanges.pipe(takeUntil(this._destroy), debounceTime(250), filter(v => isString(v) && v.length > this._minimumChars), switchMap(v => this._service.all(this._type, v)));
+        this._items$ = this._control.valueChanges.pipe(takeUntil(this._destroy), debounceTime(250), filter$1(v => isString(v) && v.length > this._minimumChars), switchMap(v => this._service.all(this._type, v)));
         this._control.statusChanges.pipe(takeUntil(this._destroy)).subscribe(() => {
             this.errorState = this._control.errors != null;
         });
@@ -6876,7 +7033,7 @@ class DesignerCubeFilterComponent {
             }
             const ctrl = this._fb.control(null);
             this.form.addControl(a.name, ctrl, { emitEvent: false });
-            ctrl.valueChanges.pipe(filter(() => ctrl.valid), debounceTime(200), takeUntil(this._destroy)).subscribe(v => {
+            ctrl.valueChanges.pipe(filter$1(() => ctrl.valid), debounceTime(200), takeUntil(this._destroy)).subscribe(v => {
                 if (this._decendents[a.name])
                     for (let axis of this._decendents[a.name]) {
                         let deps = {};
@@ -7822,156 +7979,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
                 }]
         }] });
 
-const QUERY_CHAR = ':', PATH_CHAR = ';', ARG_CHAR = '&', PANE_CHAR = '~';
-const PANES_DATA = new InjectionToken('panes');
-class NavigationBase {
-    preventDefault() {
-        this._preventDefault = true;
-    }
-}
-class CollapseNavigation extends NavigationBase {
-}
-class BackNavigation extends NavigationBase {
-}
-class NavigationPaneBase extends NavigationBase {
-    constructor(_pane) {
-        super();
-        this._pane = _pane;
-    }
-    get pane() {
-        return this._pane;
-    }
-}
-class NavigationStart extends NavigationPaneBase {
-}
-/** pane fucus change */
-class NavigationFocus extends NavigationPaneBase {
-}
-class NavigationEnd extends NavigationPaneBase {
-}
-class NavigationMode extends NavigationPaneBase {
-    constructor(mode, pane) {
-        super(pane);
-        this.mode = mode;
-    }
-}
-class NavigationExpand extends NavigationPaneBase {
-    constructor(expended, pane) {
-        super(pane);
-        this.expended = expended;
-    }
-}
-class NavigationResize extends NavigationPaneBase {
-    constructor(dimentions, pane) {
-        super(pane);
-        this.dimentions = dimentions;
-    }
-}
-class NavigationClose extends NavigationPaneBase {
-}
-class ParamNavigation extends NavigationPaneBase {
-    constructor(params, pane) {
-        super(pane);
-        this.params = params;
-    }
-}
-class QueryParamNavigation extends NavigationPaneBase {
-    constructor(queryParams, pane) {
-        super(pane);
-        this.queryParams = queryParams;
-    }
-}
-/** */
-class PaneRef {
-    get expandable() { return this._expandable; }
-    get injector() { return this._injector; }
-    get expanded() { return this._expanded; }
-    get fullPath() { return (this._path || '') + (this._queryString ? (QUERY_CHAR + this._queryString) : ''); }
-    get instance() { return this._instance; }
-    get data() { return this._data$.value; }
-    get params() { return this._params$.value; }
-    get queryString() { return this._queryString; }
-    get queryParams() { return this._queryParams$.value; }
-    paramsChange() { return this._params$.asObservable(); }
-    queryParamsChange() { return this._queryParams$.asObservable(); }
-    dataChange() { return this._data$.asObservable(); }
-    resized() { return this._events$.pipe(filter$1(e => e instanceof NavigationResize)); }
-    closeing() { return this._events$.pipe(filter$1(e => e instanceof NavigationClose)); }
-    closed() { return this._events$.pipe(filter$1(e => e instanceof NavigationClose), map$1(() => this._value)); }
-    expandedChange() { return this._events$.pipe(filter$1(e => e instanceof NavigationExpand), map$1(() => this.expanded)); }
-    get path() { return this._path; }
-    ;
-    get mode() { return this._mode; }
-    ;
-    get parent() { return this._options.parent; }
-    ;
-    get stretchable() { return this._stretchable === true; }
-    ;
-    set stretchable(val) { this._stretchable = val; }
-    get dialog() { return this._options.dialog; }
-    ;
-    get dismissable() { return this._options.dismissable; }
-    ;
-    get route() { return this._options.route; }
-    ;
-    constructor(component, injector, id, _options) {
-        this.id = id;
-        this._options = _options;
-        this._command$ = new Subject();
-        /** */
-        this._data$ = new BehaviorSubject({});
-        this._params$ = new BehaviorSubject({});
-        this._queryParams$ = new BehaviorSubject({});
-        this._events$ = new Subject();
-        const { stretchable, mode, data, params, queryParams, path, queryString, title, group, icon, help, guide, animation, expanded, expandable } = _options;
-        this._path = path;
-        this._mode = mode;
-        this._stretchable = stretchable;
-        this._expanded = expanded;
-        this._queryString = queryString;
-        this._expandable = expandable !== false;
-        this._injector = Injector.create({
-            providers: [
-                { provide: PaneRef, useValue: this }
-            ], parent: injector
-        });
-        this._portal = new ComponentPortal(component, null, this._injector);
-        this.title = title;
-        this.group = group;
-        this.guide = guide;
-        this.help = help;
-        this.icon = icon;
-        this.animation = animation;
-        data && this._data$.next(data);
-        params && this._params$.next(params);
-        queryParams && this._queryParams$.next(queryParams);
-    }
-    decendentOf(pane) {
-        return this.parent === pane; //||
-        //  (this.path && pane.path && this.path.startsWith(pane.path));
-    }
-    recycle() {
-        this._command$.next('recycle');
-    }
-    focus() {
-        this._command$.next('focus');
-    }
-    close(value) {
-        this._value = value;
-        this._command$.next('close');
-    }
-    expand() {
-        this._command$.next('expand');
-    }
-    _destroy() {
-        this._command$.complete();
-        this._data$.complete();
-        this._params$.complete();
-        this._queryParams$.complete();
-        this._events$.complete();
-    }
-}
-
 /** filter component*/
 class CubeFilterComponent {
     ngOnInit() {
@@ -7997,7 +8004,7 @@ class CubeFilterComponent {
                 }
             }
             const ctrl = controls[a.name] = this._fb.control(this.axes[a.name]);
-            ctrl.valueChanges.pipe(filter(() => ctrl.valid), debounceTime(200), takeUntil(this._destroy)).subscribe(v => {
+            ctrl.valueChanges.pipe(filter$1(() => ctrl.valid), debounceTime(200), takeUntil(this._destroy)).subscribe(v => {
                 if (v === null || v === undefined || (isArray(v) && !v.length))
                     delete this.axes[a.name];
                 else
@@ -8132,7 +8139,7 @@ class BrowseFilterComponent {
             this.filters = { axes, cube };
         }
         this.senders$ = this.sendername.valueChanges.
-            pipe(takeUntil(this._destroy), debounceTime(250), filter((v) => isString(v)), switchMap((v) => this._mailbox.listSenders(v)));
+            pipe(takeUntil(this._destroy), debounceTime(250), filter$1((v) => isString(v)), switchMap((v) => this._mailbox.listSenders(v)));
         this.form.valueChanges.pipe(takeUntil(this._destroy), debounceTime(FILTER_DEBOUNCE)).
             subscribe(v => this.valuesChange.emit(cleanup(v)));
         this.form.patchValue(this.values, { emitEvent: false });
@@ -8220,7 +8227,7 @@ class PanesRouter {
     }
     navigate(commands, options) {
         return new Promise((resolve, reject) => {
-            this._events$.pipe(filter(e => e instanceof NavigationStart), first()).subscribe({
+            this._events$.pipe(filter$1(e => e instanceof NavigationStart), first()).subscribe({
                 next: e => resolve(e.pane),
                 error: reject
             });
@@ -8366,7 +8373,7 @@ class ChatInfo {
      */
     format(person) {
         if (this._config !== false)
-            return `<a data-info="${person.id}">${person.name}</a>`;
+            return `<a data-userid="${person.id}">${person.name}</a>`;
         return person.name;
     }
     /**
@@ -8466,7 +8473,7 @@ class IdentityName {
      * @param e
      */
     chat(e) {
-        const userId = e.target.getAttribute('data-info');
+        const userId = e.target.getAttribute('data-userid');
         userId &&
             this._chat.open(userId, { mode: this.chating });
     }
@@ -8547,13 +8554,13 @@ class AttachmentPreview {
     }
     close() {
         // Listen for animation 'start' events
-        this.animationStateChanged.pipe(filter(event => event.phaseName === 'start'), take(1)).subscribe(() => {
+        this.animationStateChanged.pipe(filter$1(event => event.phaseName === 'start'), take(1)).subscribe(() => {
             this._beforeClose.next();
             this._beforeClose.complete();
             this._overlayRef.detachBackdrop();
         });
         // Listen for animation 'done' events
-        this.animationStateChanged.pipe(filter(event => event.phaseName === 'done' && event.toState === 'leave'), take(1)).subscribe(() => {
+        this.animationStateChanged.pipe(filter$1(event => event.phaseName === 'done' && event.toState === 'leave'), take(1)).subscribe(() => {
             this._overlayRef.dispose();
             this._afterClosed.next();
             this._afterClosed.complete();
@@ -8984,7 +8991,7 @@ class ExpandedItemComponent {
         });
         this._mailbox.changed.pipe(takeUntil(this._destroy)).subscribe(e => (e.id === this.model.id) &&
             this._refresh());
-        this._messaging.commentTyping$.pipe(takeUntil(this._destroy), filter(e => e.id === this.model.documentId)).subscribe(() => {
+        this._messaging.commentTyping$.pipe(takeUntil(this._destroy), filter$1(e => e.id === this.model.documentId)).subscribe(() => {
             this.typing = true;
             clearTimeout(this._typingTask);
             this._typingTask = setTimeout(() => this.typing = false, TYPING_HINT_TIME);
@@ -9153,7 +9160,7 @@ class ExpandedItemComponent {
        * @param e
        */
     chat(e) {
-        const userId = e.target.getAttribute('data-info');
+        const userId = e.target.getAttribute('data-userid');
         userId &&
             this._chat.open(userId);
     }
@@ -9248,7 +9255,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
                 type: Output
             }] } });
 
-const TAKE = 200, SIZE = 20, HEADER_COLUMN_NAMES = ['number', 'subject', 'value', 'owner', 'sender', 'received', 'receivedAgo', 'replied', 'state', 'issued', 'issuedAgo'];
+const TAKE = 200, SIZE = 20, HEADER_COLUMN_NAMES = ['number', 'subject', 'value', 'owner', 'sender', 'received', 'receivedAgo', 'replied', 'repliedAgo', 'state', 'issued', 'issuedAgo'];
 /** browse items component*/
 class BrowseItemsComponent {
     /** browse ctor */
@@ -9266,10 +9273,10 @@ class BrowseItemsComponent {
         this.onopen = new EventEmitter();
         this.onInsights = new EventEmitter();
         this.CALENDAR_SPEC = {
-            lastDay: this._translate.get('Yesterday'),
-            lastWeek: 'dddd',
-            sameDay: this._translate.get('Today'),
-            sameElse: 'MMM D, yy'
+            lastWeek: 'dddd HH:mm',
+            lastDay: this._translate.get('YesterdayAt', 'HH:mm'),
+            sameDay: this._translate.get('TodayAt', 'HH:mm'),
+            sameElse: 'MMM D, YYYY'
         };
         this.sharedActions = [];
         this.dragDisabled = true;
@@ -9674,7 +9681,7 @@ class BrowseItemsComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: BrowseItemsComponent, deps: [{ token: MailboxService }, { token: AccountService }, { token: CubeService }, { token: SessionService }, { token: PromptService }, { token: TranslateService }, { token: i0.ChangeDetectorRef }, { token: RouterImpl }, { token: HubService }, { token: BIZDOC_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: BrowseItemsComponent, isStandalone: false, selector: "bizdoc-browse-items", inputs: { folderId: "folderId", filterType: "filterType", filters: "filters" }, outputs: { onopen: "open", onInsights: "insights" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-progress-bar mode=\"query\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n@if (dataSource?.data.length === 0) {\r\n  <bizdoc-none title=\"NoMessages\" [subtitle]=\"!isMobile && folderId === DRAFT ? 'AltN' : null\" icon=\"mail_outline\"></bizdoc-none>\r\n}\r\n<mat-table cdkDropList class=\"data-table\"\r\n  [cdkDropListDisabled]=\"isMobile\"\r\n  [cdkDropListData]=\"dataSource?.data\"\r\n  cdkDropListConnectedTo=\"folders\"\r\n  cdkDropListSortingDisabled\r\n  [dataSource]=\"dataSource\" matSort multiTemplateDataRows (matSortChange)=\"sortData()\"\r\n  id=\"browse-table\" [@list]=\"dataSource\" [style.display]=\"dataSource?.data.length ?'':'none'\">\r\n  <ng-container matColumnDef=\"select\">\r\n    <mat-header-cell *matHeaderCellDef>\r\n      <div class=\"\"></div>\r\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [aria-label]=\"'Check'|translate\"\r\n        [checked]=\"selection.hasValue() && isAllSelected()\"\r\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n      </mat-checkbox>\r\n    </mat-header-cell>\r\n    <mat-cell *matCellDef=\"let item\">\r\n      <mat-checkbox (click)=\"$event.stopPropagation()\" [aria-label]=\"'Check'|translate\"\r\n        (change)=\"$event ? selection.toggle(item) : null\"\r\n        [checked]=\"selection.isSelected(item)\">\r\n      </mat-checkbox>\r\n      <!-- drag -->\r\n      <!--<button mat-icon-button cdkDragHandle\r\n      (mousedown)=\"dragDisabled = false\"\r\n      (mouseup)=\"dragDisabled = true\"\r\n      (touchstart)=\"dragDisabled = false\"\r\n      (touchend)=\"dragDisabled = true\"\r\n      class=\"drag hide-xs\" aria-disabled=\"true\">\r\n      <mat-icon>drag_indicator</mat-icon>\r\n    </button>-->\r\n    <button mat-icon-button (click)=\"toggleExpanded(item, $event)\" [bizdocTooltip]=\"'Details' | translate\" [attr.aria-label]=\"'Details' | translate\" class=\"tool\"><mat-icon>{{item == expandedElement ? 'unfold_less' : 'unfold_more'}}</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Number column -->\r\n<ng-container matColumnDef=\"number\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Number' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.number}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- Subject column -->\r\n<ng-container matColumnDef=\"subject\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Subject' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.subject}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"owner\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Owner' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.ownerId) {\r\n      <bizdoc-identity-name [identity]=\"item.ownerId\" [by]=\"item.ownerById\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n<ng-container matColumnDef=\"sender\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Sender' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.senderId) {\r\n      <bizdoc-identity-name [identity]=\"item.senderId\" [by]=\"item.byId\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"received\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.received | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"receivedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"received\">{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.received | amDateFormat: 'lll'\">{{item.received | amTimeAgo}}</mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"replied\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Replied' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.replied | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issued\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.issued | amCalendar : null : CALENDAR_SPEC }} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issuedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"issued\">{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.issued | amDateFormat: 'lll'\"> {{item.issued | amTimeAgo}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"state\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"stateId\">{{'Status' | translate }}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <bizdoc-status [stateId]=\"item.stateId\"></bizdoc-status>\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n@if (customColumns) {\r\n  @for (c of customColumns; track c) {\r\n    <ng-container [matColumnDef]=\"c.name\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header> {{c.title}} </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let item\">\r\n        @switch (c.type) {\r\n          @case ('Date') {\r\n        <span>\r\n          {{item.model[c.name] | amCalendar : null : CALENDAR_SPEC}}\r\n        </span>\r\n          }\r\n          @case ('Decimal') {\r\n            <span>\r\n              {{item.model[c.name] | number }}\r\n            </span>\r\n          }\r\n          @case ('Boolean') {\r\n            <span>\r\n              <bizdoc-checkbox [checked]=\"item.model[c.name]\"></bizdoc-checkbox>\r\n            </span>\r\n          }\r\n          @default {\r\n            <span>\r\n              {{item.model[c.name]}}z\r\n            </span>\r\n          }\r\n        }\r\n      </mat-cell>\r\n    </ng-container>\r\n  }\r\n}\r\n\r\n<!-- Value column -->\r\n<ng-container matColumnDef=\"value\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Amount' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.value | currency : item.currencyCode : 'symbol' : currencyFormat}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- options column -->\r\n<ng-container matColumnDef=\"options\">\r\n  <mat-header-cell *matHeaderCellDef></mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <button mat-icon-button (click)=\"flag(item, $event)\" [bizdocTooltip]=\"'Flagged'| translate\" [attr.aria-label]=\"'ToggleFlagged' | translate\" class=\"tool\"><mat-icon [class.filled]=\"item.flag\">star</mat-icon></button>\r\n    @if (enableViews) {\r\n      <button mat-icon-button (click)=\"insights(item, $event)\" [bizdocTooltip]=\"'Insights' | translate\" [attr.aria-label]=\"'Insight' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\r\n    }\r\n    <button mat-icon-button (click)=\"$event.stopPropagation()\" [matMenuTriggerFor]=\"menu\" [matMenuTriggerData]=\"{item: item}\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\" class=\"tool hide-xs\"><mat-icon>more_vert</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Expanded Content Column -->\r\n<ng-container matColumnDef=\"expandedDetail\">\r\n  <mat-cell *matCellDef=\"let item\" [attr.colspan]=\"displayedColumns.length\" [@updated]=\"item == updatedElement\"\r\n    [class.read-row]=\"item.read\">\r\n    <div [@detailExpand]=\"item == expandedElement ? 'expanded' : 'collapsed'\" style=\"width: 100%\">\r\n      @if (item == expandedElement) {\r\n        <bizdoc-expanded-item [model]=\"item\" (sent)=\"onActionTaken($event)\"></bizdoc-expanded-item>\r\n      }\r\n    </div>\r\n  </mat-cell>\r\n</ng-container>\r\n<mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></mat-header-row>\r\n<mat-row @item [@updated]=\"item == updatedElement\"\r\n  *matRowDef=\"let item; let dataIndex = dataIndex; columns: displayedColumns;\" class=\"element-row\"\r\n  cdkDrag [cdkDragData]=\"item\"\r\n  [cdkDragDisabled]=\"dragDisabled\"\r\n  (cdkDragReleased)=\"dragDisabled = true\"\r\n           [ngClass]=\"{'selected-row': selectedElement === item,\r\n      'expanded-row': expandedElement === item,\r\n           'odd-row': dataIndex % 2,\r\n      'read-row': item.read}\" matRipple\r\n  (click)=\"open(item, $event)\">\r\n  <div *cdkDragPreview>\r\n    <button mat-icon-button aria-disabled=\"true\"><mat-icon>drag_indicator</mat-icon></button> <span>#{{item.number}}</span>\r\n  </div>\r\n  <div *cdkDragPlaceholder>\r\n    <!-- none -->\r\n  </div>\r\n</mat-row>\r\n<mat-row *matRowDef=\"let item; ; let dataIndex = dataIndex; columns: ['expandedDetail']\"\r\n  class=\"detail-row\" matRipple\r\n           [ngClass]=\"{ 'selected-row': selectedElement === item,\r\n           'odd-row': dataIndex % 2\r\n           }\"></mat-row>\r\n</mat-table>\r\n<mat-paginator #paginator [hidePageSize]=\"true\" [pageSize]=\"PAGE_SIZE\" [style.display]=\"!isMobile && dataSource?.data.length>PAGE_SIZE ? '':'none'\"></mat-paginator>\r\n<mat-menu #menu=\"matMenu\">\r\n  <ng-template matMenuContent let-item=\"item\">\r\n    <button mat-menu-item (click)=\"open(item, $event)\">{{'Open'|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"toggleRead(item)\">{{(item.read ?'MarkAsUnread':'MarkAsRead')|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"copy(item)\">{{'Copy'| translate}}</button>\r\n  </ng-template>\r\n</mat-menu>\r\n", styles: ["#browse-table{width:100%}#browse-table .detail-row{min-height:0}#browse-table .element-row{cursor:pointer}#browse-table .element-row .drag{cursor:move}#browse-table .read-row{font-weight:100}@media screen and (min-width: 600px){.mat-mdc-row .tool{opacity:.05}.mat-mdc-row:hover .tool{opacity:1}}::ng-deep .mat-column-options{justify-content:end;padding-inline-end:8px}::ng-deep .mat-column-value{justify-content:right}::ng-deep .mat-column-select{white-space:nowrap}::ng-deep .mat-column-number{white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$8.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$8.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$8.CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "directive", type: i2$8.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: i12.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { 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: ["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$1.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i7$4.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: i7$5.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i2$5.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2$7.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i7.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: CheckboxComponent, selector: "bizdoc-checkbox", inputs: ["checked", "color", "icon"] }, { kind: "directive", type: StateDirective, selector: "bizdoc-status", inputs: ["stateId"] }, { kind: "component", type: IdentityName, selector: "bizdoc-identity-name", inputs: ["identity", "by", "chating"] }, { kind: "component", type: NoneComponent, selector: "bizdoc-none", inputs: ["title", "subtitle", "icon"] }, { kind: "component", type: ExpandedItemComponent, selector: "bizdoc-expanded-item", inputs: ["model"], outputs: ["sent"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i9.DecimalPipe, name: "number" }, { kind: "pipe", type: i9.CurrencyPipe, name: "currency" }, { kind: "pipe", type: DateFormatPipe, name: "amDateFormat" }, { kind: "pipe", type: CalendarPipe, name: "amCalendar" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: BrowseItemsComponent, isStandalone: false, selector: "bizdoc-browse-items", inputs: { folderId: "folderId", filterType: "filterType", filters: "filters" }, outputs: { onopen: "open", onInsights: "insights" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-progress-bar mode=\"query\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n@if (dataSource?.data.length === 0) {\r\n  <bizdoc-none title=\"NoMessages\" [subtitle]=\"!isMobile && folderId === DRAFT ? 'AltN' : null\" icon=\"mail_outline\"></bizdoc-none>\r\n}\r\n<mat-table cdkDropList class=\"data-table\"\r\n  [cdkDropListDisabled]=\"isMobile\"\r\n  [cdkDropListData]=\"dataSource?.data\"\r\n  cdkDropListConnectedTo=\"folders\"\r\n  cdkDropListSortingDisabled\r\n  [dataSource]=\"dataSource\" matSort multiTemplateDataRows (matSortChange)=\"sortData()\"\r\n  id=\"browse-table\" [@list]=\"dataSource\" [style.display]=\"dataSource?.data.length ?'':'none'\">\r\n  <ng-container matColumnDef=\"select\">\r\n    <mat-header-cell *matHeaderCellDef>\r\n      <div class=\"\"></div>\r\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [aria-label]=\"'Check'|translate\"\r\n        [checked]=\"selection.hasValue() && isAllSelected()\"\r\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n      </mat-checkbox>\r\n    </mat-header-cell>\r\n    <mat-cell *matCellDef=\"let item\">\r\n      <mat-checkbox (click)=\"$event.stopPropagation()\" [aria-label]=\"'Check'|translate\"\r\n        (change)=\"$event ? selection.toggle(item) : null\"\r\n        [checked]=\"selection.isSelected(item)\">\r\n      </mat-checkbox>\r\n      <!-- drag -->\r\n      <!--<button mat-icon-button cdkDragHandle\r\n      (mousedown)=\"dragDisabled = false\"\r\n      (mouseup)=\"dragDisabled = true\"\r\n      (touchstart)=\"dragDisabled = false\"\r\n      (touchend)=\"dragDisabled = true\"\r\n      class=\"drag hide-xs\" aria-disabled=\"true\">\r\n      <mat-icon>drag_indicator</mat-icon>\r\n    </button>-->\r\n    <button mat-icon-button (click)=\"toggleExpanded(item, $event)\" [bizdocTooltip]=\"'Details' | translate\" [attr.aria-label]=\"'Details' | translate\" class=\"tool\"><mat-icon>{{item == expandedElement ? 'unfold_less' : 'unfold_more'}}</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Number column -->\r\n<ng-container matColumnDef=\"number\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Number' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.number}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- Subject column -->\r\n<ng-container matColumnDef=\"subject\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Subject' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.subject}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"owner\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Owner' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.ownerId) {\r\n      <bizdoc-identity-name [identity]=\"item.ownerId\" [by]=\"item.ownerById\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n<ng-container matColumnDef=\"sender\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Sender' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.senderId) {\r\n      <bizdoc-identity-name [identity]=\"item.senderId\" [by]=\"item.byId\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"received\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.received | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"receivedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"received\">{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.received | amDateFormat: 'lll'\">{{item.received | amTimeAgo}}</mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"replied\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Replied' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.replied | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"repliedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Replied' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.replied | amDateFormat: 'lll'\"> {{item.replied | amTimeAgo}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issued\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.issued | amCalendar : null : CALENDAR_SPEC }} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issuedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"issued\">{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.issued | amDateFormat: 'lll'\"> {{item.issued | amTimeAgo}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"state\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"stateId\">{{'Status' | translate }}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <bizdoc-status [stateId]=\"item.stateId\"></bizdoc-status>\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n@if (customColumns) {\r\n  @for (c of customColumns; track c) {\r\n    <ng-container [matColumnDef]=\"c.name\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header> {{c.title}} </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let item\">\r\n        @switch (c.type) {\r\n          @case ('Date') {\r\n        <span>\r\n          {{item.model[c.name] | amCalendar : null : CALENDAR_SPEC}}\r\n        </span>\r\n          }\r\n          @case ('Decimal') {\r\n            <span>\r\n              {{item.model[c.name] | number }}\r\n            </span>\r\n          }\r\n          @case ('Boolean') {\r\n            <span>\r\n              <bizdoc-checkbox [checked]=\"item.model[c.name]\"></bizdoc-checkbox>\r\n            </span>\r\n          }\r\n          @default {\r\n            <span>\r\n              {{item.model[c.name]}}z\r\n            </span>\r\n          }\r\n        }\r\n      </mat-cell>\r\n    </ng-container>\r\n  }\r\n}\r\n\r\n<!-- Value column -->\r\n<ng-container matColumnDef=\"value\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Amount' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.value | currency : item.currencyCode : 'symbol' : currencyFormat}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- options column -->\r\n<ng-container matColumnDef=\"options\">\r\n  <mat-header-cell *matHeaderCellDef></mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <button mat-icon-button (click)=\"flag(item, $event)\" [bizdocTooltip]=\"'Flagged'| translate\" [attr.aria-label]=\"'ToggleFlagged' | translate\" class=\"tool\"><mat-icon [class.filled]=\"item.flag\">star</mat-icon></button>\r\n    @if (enableViews) {\r\n      <button mat-icon-button (click)=\"insights(item, $event)\" [bizdocTooltip]=\"'Insights' | translate\" [attr.aria-label]=\"'Insight' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\r\n    }\r\n    <button mat-icon-button (click)=\"$event.stopPropagation()\" [matMenuTriggerFor]=\"menu\" [matMenuTriggerData]=\"{item: item}\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\" class=\"tool hide-xs\"><mat-icon>more_vert</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Expanded Content Column -->\r\n<ng-container matColumnDef=\"expandedDetail\">\r\n  <mat-cell *matCellDef=\"let item\" [attr.colspan]=\"displayedColumns.length\" [@updated]=\"item == updatedElement\"\r\n    [class.read-row]=\"item.read\">\r\n    <div [@detailExpand]=\"item == expandedElement ? 'expanded' : 'collapsed'\" style=\"width: 100%\">\r\n      @if (item == expandedElement) {\r\n        <bizdoc-expanded-item [model]=\"item\" (sent)=\"onActionTaken($event)\"></bizdoc-expanded-item>\r\n      }\r\n    </div>\r\n  </mat-cell>\r\n</ng-container>\r\n<mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></mat-header-row>\r\n<mat-row @item [@updated]=\"item == updatedElement\"\r\n  *matRowDef=\"let item; let dataIndex = dataIndex; columns: displayedColumns;\" class=\"element-row\"\r\n  cdkDrag [cdkDragData]=\"item\"\r\n  [cdkDragDisabled]=\"dragDisabled\"\r\n  (cdkDragReleased)=\"dragDisabled = true\"\r\n           [ngClass]=\"{'selected-row': selectedElement === item,\r\n      'expanded-row': expandedElement === item,\r\n           'odd-row': dataIndex % 2,\r\n      'read-row': item.read}\" matRipple\r\n  (click)=\"open(item, $event)\">\r\n  <div *cdkDragPreview>\r\n    <button mat-icon-button aria-disabled=\"true\"><mat-icon>drag_indicator</mat-icon></button> <span>#{{item.number}}</span>\r\n  </div>\r\n  <div *cdkDragPlaceholder>\r\n    <!-- none -->\r\n  </div>\r\n</mat-row>\r\n<mat-row *matRowDef=\"let item; ; let dataIndex = dataIndex; columns: ['expandedDetail']\"\r\n  class=\"detail-row\" matRipple\r\n           [ngClass]=\"{ 'selected-row': selectedElement === item,\r\n           'odd-row': dataIndex % 2\r\n           }\"></mat-row>\r\n</mat-table>\r\n<mat-paginator #paginator [hidePageSize]=\"true\" [pageSize]=\"PAGE_SIZE\" [style.display]=\"!isMobile && dataSource?.data.length>PAGE_SIZE ? '':'none'\"></mat-paginator>\r\n<mat-menu #menu=\"matMenu\">\r\n  <ng-template matMenuContent let-item=\"item\">\r\n    <button mat-menu-item (click)=\"open(item, $event)\">{{'Open'|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"toggleRead(item)\">{{(item.read ?'MarkAsUnread':'MarkAsRead')|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"copy(item)\">{{'Copy'| translate}}</button>\r\n  </ng-template>\r\n</mat-menu>\r\n", styles: ["#browse-table{width:100%}#browse-table .detail-row{min-height:0}#browse-table .element-row{cursor:pointer}#browse-table .element-row .drag{cursor:move}#browse-table .read-row{font-weight:100}@media screen and (min-width: 600px){.mat-mdc-row .tool{opacity:.05}.mat-mdc-row:hover .tool{opacity:1}}::ng-deep .mat-column-options{justify-content:end;padding-inline-end:8px}::ng-deep .mat-column-value{justify-content:right}::ng-deep .mat-column-select{white-space:nowrap}::ng-deep .mat-column-number{white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$8.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$8.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2$8.CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "directive", type: i2$8.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: i12.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { 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: ["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$1.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i6$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i7$4.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: i7$5.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i2$5.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2$7.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i7.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: CheckboxComponent, selector: "bizdoc-checkbox", inputs: ["checked", "color", "icon"] }, { kind: "directive", type: StateDirective, selector: "bizdoc-status", inputs: ["stateId"] }, { kind: "component", type: IdentityName, selector: "bizdoc-identity-name", inputs: ["identity", "by", "chating"] }, { kind: "component", type: NoneComponent, selector: "bizdoc-none", inputs: ["title", "subtitle", "icon"] }, { kind: "component", type: ExpandedItemComponent, selector: "bizdoc-expanded-item", inputs: ["model"], outputs: ["sent"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i9.DecimalPipe, name: "number" }, { kind: "pipe", type: i9.CurrencyPipe, name: "currency" }, { kind: "pipe", type: DateFormatPipe, name: "amDateFormat" }, { kind: "pipe", type: CalendarPipe, name: "amCalendar" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [
             listAnimation,
             itemAnimation,
             expandListItemAnimation,
@@ -9688,7 +9695,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
                         itemAnimation,
                         expandListItemAnimation,
                         listItemUpdatedAnimation
-                    ], template: "<mat-progress-bar mode=\"query\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n@if (dataSource?.data.length === 0) {\r\n  <bizdoc-none title=\"NoMessages\" [subtitle]=\"!isMobile && folderId === DRAFT ? 'AltN' : null\" icon=\"mail_outline\"></bizdoc-none>\r\n}\r\n<mat-table cdkDropList class=\"data-table\"\r\n  [cdkDropListDisabled]=\"isMobile\"\r\n  [cdkDropListData]=\"dataSource?.data\"\r\n  cdkDropListConnectedTo=\"folders\"\r\n  cdkDropListSortingDisabled\r\n  [dataSource]=\"dataSource\" matSort multiTemplateDataRows (matSortChange)=\"sortData()\"\r\n  id=\"browse-table\" [@list]=\"dataSource\" [style.display]=\"dataSource?.data.length ?'':'none'\">\r\n  <ng-container matColumnDef=\"select\">\r\n    <mat-header-cell *matHeaderCellDef>\r\n      <div class=\"\"></div>\r\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [aria-label]=\"'Check'|translate\"\r\n        [checked]=\"selection.hasValue() && isAllSelected()\"\r\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n      </mat-checkbox>\r\n    </mat-header-cell>\r\n    <mat-cell *matCellDef=\"let item\">\r\n      <mat-checkbox (click)=\"$event.stopPropagation()\" [aria-label]=\"'Check'|translate\"\r\n        (change)=\"$event ? selection.toggle(item) : null\"\r\n        [checked]=\"selection.isSelected(item)\">\r\n      </mat-checkbox>\r\n      <!-- drag -->\r\n      <!--<button mat-icon-button cdkDragHandle\r\n      (mousedown)=\"dragDisabled = false\"\r\n      (mouseup)=\"dragDisabled = true\"\r\n      (touchstart)=\"dragDisabled = false\"\r\n      (touchend)=\"dragDisabled = true\"\r\n      class=\"drag hide-xs\" aria-disabled=\"true\">\r\n      <mat-icon>drag_indicator</mat-icon>\r\n    </button>-->\r\n    <button mat-icon-button (click)=\"toggleExpanded(item, $event)\" [bizdocTooltip]=\"'Details' | translate\" [attr.aria-label]=\"'Details' | translate\" class=\"tool\"><mat-icon>{{item == expandedElement ? 'unfold_less' : 'unfold_more'}}</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Number column -->\r\n<ng-container matColumnDef=\"number\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Number' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.number}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- Subject column -->\r\n<ng-container matColumnDef=\"subject\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Subject' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.subject}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"owner\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Owner' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.ownerId) {\r\n      <bizdoc-identity-name [identity]=\"item.ownerId\" [by]=\"item.ownerById\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n<ng-container matColumnDef=\"sender\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Sender' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.senderId) {\r\n      <bizdoc-identity-name [identity]=\"item.senderId\" [by]=\"item.byId\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"received\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.received | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"receivedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"received\">{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.received | amDateFormat: 'lll'\">{{item.received | amTimeAgo}}</mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"replied\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Replied' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.replied | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issued\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.issued | amCalendar : null : CALENDAR_SPEC }} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issuedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"issued\">{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.issued | amDateFormat: 'lll'\"> {{item.issued | amTimeAgo}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"state\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"stateId\">{{'Status' | translate }}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <bizdoc-status [stateId]=\"item.stateId\"></bizdoc-status>\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n@if (customColumns) {\r\n  @for (c of customColumns; track c) {\r\n    <ng-container [matColumnDef]=\"c.name\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header> {{c.title}} </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let item\">\r\n        @switch (c.type) {\r\n          @case ('Date') {\r\n        <span>\r\n          {{item.model[c.name] | amCalendar : null : CALENDAR_SPEC}}\r\n        </span>\r\n          }\r\n          @case ('Decimal') {\r\n            <span>\r\n              {{item.model[c.name] | number }}\r\n            </span>\r\n          }\r\n          @case ('Boolean') {\r\n            <span>\r\n              <bizdoc-checkbox [checked]=\"item.model[c.name]\"></bizdoc-checkbox>\r\n            </span>\r\n          }\r\n          @default {\r\n            <span>\r\n              {{item.model[c.name]}}z\r\n            </span>\r\n          }\r\n        }\r\n      </mat-cell>\r\n    </ng-container>\r\n  }\r\n}\r\n\r\n<!-- Value column -->\r\n<ng-container matColumnDef=\"value\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Amount' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.value | currency : item.currencyCode : 'symbol' : currencyFormat}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- options column -->\r\n<ng-container matColumnDef=\"options\">\r\n  <mat-header-cell *matHeaderCellDef></mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <button mat-icon-button (click)=\"flag(item, $event)\" [bizdocTooltip]=\"'Flagged'| translate\" [attr.aria-label]=\"'ToggleFlagged' | translate\" class=\"tool\"><mat-icon [class.filled]=\"item.flag\">star</mat-icon></button>\r\n    @if (enableViews) {\r\n      <button mat-icon-button (click)=\"insights(item, $event)\" [bizdocTooltip]=\"'Insights' | translate\" [attr.aria-label]=\"'Insight' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\r\n    }\r\n    <button mat-icon-button (click)=\"$event.stopPropagation()\" [matMenuTriggerFor]=\"menu\" [matMenuTriggerData]=\"{item: item}\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\" class=\"tool hide-xs\"><mat-icon>more_vert</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Expanded Content Column -->\r\n<ng-container matColumnDef=\"expandedDetail\">\r\n  <mat-cell *matCellDef=\"let item\" [attr.colspan]=\"displayedColumns.length\" [@updated]=\"item == updatedElement\"\r\n    [class.read-row]=\"item.read\">\r\n    <div [@detailExpand]=\"item == expandedElement ? 'expanded' : 'collapsed'\" style=\"width: 100%\">\r\n      @if (item == expandedElement) {\r\n        <bizdoc-expanded-item [model]=\"item\" (sent)=\"onActionTaken($event)\"></bizdoc-expanded-item>\r\n      }\r\n    </div>\r\n  </mat-cell>\r\n</ng-container>\r\n<mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></mat-header-row>\r\n<mat-row @item [@updated]=\"item == updatedElement\"\r\n  *matRowDef=\"let item; let dataIndex = dataIndex; columns: displayedColumns;\" class=\"element-row\"\r\n  cdkDrag [cdkDragData]=\"item\"\r\n  [cdkDragDisabled]=\"dragDisabled\"\r\n  (cdkDragReleased)=\"dragDisabled = true\"\r\n           [ngClass]=\"{'selected-row': selectedElement === item,\r\n      'expanded-row': expandedElement === item,\r\n           'odd-row': dataIndex % 2,\r\n      'read-row': item.read}\" matRipple\r\n  (click)=\"open(item, $event)\">\r\n  <div *cdkDragPreview>\r\n    <button mat-icon-button aria-disabled=\"true\"><mat-icon>drag_indicator</mat-icon></button> <span>#{{item.number}}</span>\r\n  </div>\r\n  <div *cdkDragPlaceholder>\r\n    <!-- none -->\r\n  </div>\r\n</mat-row>\r\n<mat-row *matRowDef=\"let item; ; let dataIndex = dataIndex; columns: ['expandedDetail']\"\r\n  class=\"detail-row\" matRipple\r\n           [ngClass]=\"{ 'selected-row': selectedElement === item,\r\n           'odd-row': dataIndex % 2\r\n           }\"></mat-row>\r\n</mat-table>\r\n<mat-paginator #paginator [hidePageSize]=\"true\" [pageSize]=\"PAGE_SIZE\" [style.display]=\"!isMobile && dataSource?.data.length>PAGE_SIZE ? '':'none'\"></mat-paginator>\r\n<mat-menu #menu=\"matMenu\">\r\n  <ng-template matMenuContent let-item=\"item\">\r\n    <button mat-menu-item (click)=\"open(item, $event)\">{{'Open'|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"toggleRead(item)\">{{(item.read ?'MarkAsUnread':'MarkAsRead')|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"copy(item)\">{{'Copy'| translate}}</button>\r\n  </ng-template>\r\n</mat-menu>\r\n", styles: ["#browse-table{width:100%}#browse-table .detail-row{min-height:0}#browse-table .element-row{cursor:pointer}#browse-table .element-row .drag{cursor:move}#browse-table .read-row{font-weight:100}@media screen and (min-width: 600px){.mat-mdc-row .tool{opacity:.05}.mat-mdc-row:hover .tool{opacity:1}}::ng-deep .mat-column-options{justify-content:end;padding-inline-end:8px}::ng-deep .mat-column-value{justify-content:right}::ng-deep .mat-column-select{white-space:nowrap}::ng-deep .mat-column-number{white-space:nowrap}\n"] }]
+                    ], template: "<mat-progress-bar mode=\"query\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n@if (dataSource?.data.length === 0) {\r\n  <bizdoc-none title=\"NoMessages\" [subtitle]=\"!isMobile && folderId === DRAFT ? 'AltN' : null\" icon=\"mail_outline\"></bizdoc-none>\r\n}\r\n<mat-table cdkDropList class=\"data-table\"\r\n  [cdkDropListDisabled]=\"isMobile\"\r\n  [cdkDropListData]=\"dataSource?.data\"\r\n  cdkDropListConnectedTo=\"folders\"\r\n  cdkDropListSortingDisabled\r\n  [dataSource]=\"dataSource\" matSort multiTemplateDataRows (matSortChange)=\"sortData()\"\r\n  id=\"browse-table\" [@list]=\"dataSource\" [style.display]=\"dataSource?.data.length ?'':'none'\">\r\n  <ng-container matColumnDef=\"select\">\r\n    <mat-header-cell *matHeaderCellDef>\r\n      <div class=\"\"></div>\r\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [aria-label]=\"'Check'|translate\"\r\n        [checked]=\"selection.hasValue() && isAllSelected()\"\r\n        [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n      </mat-checkbox>\r\n    </mat-header-cell>\r\n    <mat-cell *matCellDef=\"let item\">\r\n      <mat-checkbox (click)=\"$event.stopPropagation()\" [aria-label]=\"'Check'|translate\"\r\n        (change)=\"$event ? selection.toggle(item) : null\"\r\n        [checked]=\"selection.isSelected(item)\">\r\n      </mat-checkbox>\r\n      <!-- drag -->\r\n      <!--<button mat-icon-button cdkDragHandle\r\n      (mousedown)=\"dragDisabled = false\"\r\n      (mouseup)=\"dragDisabled = true\"\r\n      (touchstart)=\"dragDisabled = false\"\r\n      (touchend)=\"dragDisabled = true\"\r\n      class=\"drag hide-xs\" aria-disabled=\"true\">\r\n      <mat-icon>drag_indicator</mat-icon>\r\n    </button>-->\r\n    <button mat-icon-button (click)=\"toggleExpanded(item, $event)\" [bizdocTooltip]=\"'Details' | translate\" [attr.aria-label]=\"'Details' | translate\" class=\"tool\"><mat-icon>{{item == expandedElement ? 'unfold_less' : 'unfold_more'}}</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Number column -->\r\n<ng-container matColumnDef=\"number\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Number' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.number}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- Subject column -->\r\n<ng-container matColumnDef=\"subject\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Subject' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.subject}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"owner\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Owner' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.ownerId) {\r\n      <bizdoc-identity-name [identity]=\"item.ownerId\" [by]=\"item.ownerById\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n<ng-container matColumnDef=\"sender\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Sender' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    @if (item.senderId) {\r\n      <bizdoc-identity-name [identity]=\"item.senderId\" [by]=\"item.byId\"></bizdoc-identity-name>\r\n    }\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"received\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.received | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"receivedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"received\">{{'Received' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.received | amDateFormat: 'lll'\">{{item.received | amTimeAgo}}</mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"replied\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Replied' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.replied | amCalendar : null : CALENDAR_SPEC}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"repliedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Replied' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.replied | amDateFormat: 'lll'\"> {{item.replied | amTimeAgo}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issued\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.issued | amCalendar : null : CALENDAR_SPEC }} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"issuedAgo\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"issued\">{{'Issued' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\" [bizdocTooltip]=\"item.issued | amDateFormat: 'lll'\"> {{item.issued | amTimeAgo}} </mat-cell>\r\n</ng-container>\r\n\r\n<ng-container matColumnDef=\"state\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header=\"stateId\">{{'Status' | translate }}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <bizdoc-status [stateId]=\"item.stateId\"></bizdoc-status>\r\n  </mat-cell>\r\n</ng-container>\r\n\r\n@if (customColumns) {\r\n  @for (c of customColumns; track c) {\r\n    <ng-container [matColumnDef]=\"c.name\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header> {{c.title}} </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let item\">\r\n        @switch (c.type) {\r\n          @case ('Date') {\r\n        <span>\r\n          {{item.model[c.name] | amCalendar : null : CALENDAR_SPEC}}\r\n        </span>\r\n          }\r\n          @case ('Decimal') {\r\n            <span>\r\n              {{item.model[c.name] | number }}\r\n            </span>\r\n          }\r\n          @case ('Boolean') {\r\n            <span>\r\n              <bizdoc-checkbox [checked]=\"item.model[c.name]\"></bizdoc-checkbox>\r\n            </span>\r\n          }\r\n          @default {\r\n            <span>\r\n              {{item.model[c.name]}}z\r\n            </span>\r\n          }\r\n        }\r\n      </mat-cell>\r\n    </ng-container>\r\n  }\r\n}\r\n\r\n<!-- Value column -->\r\n<ng-container matColumnDef=\"value\">\r\n  <mat-header-cell *matHeaderCellDef mat-sort-header>{{'Amount' | translate}}</mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\"> {{item.value | currency : item.currencyCode : 'symbol' : currencyFormat}} </mat-cell>\r\n</ng-container>\r\n\r\n<!-- options column -->\r\n<ng-container matColumnDef=\"options\">\r\n  <mat-header-cell *matHeaderCellDef></mat-header-cell>\r\n  <mat-cell *matCellDef=\"let item\">\r\n    <button mat-icon-button (click)=\"flag(item, $event)\" [bizdocTooltip]=\"'Flagged'| translate\" [attr.aria-label]=\"'ToggleFlagged' | translate\" class=\"tool\"><mat-icon [class.filled]=\"item.flag\">star</mat-icon></button>\r\n    @if (enableViews) {\r\n      <button mat-icon-button (click)=\"insights(item, $event)\" [bizdocTooltip]=\"'Insights' | translate\" [attr.aria-label]=\"'Insight' | translate\" class=\"tool\"><mat-icon>data_usage</mat-icon></button>\r\n    }\r\n    <button mat-icon-button (click)=\"$event.stopPropagation()\" [matMenuTriggerFor]=\"menu\" [matMenuTriggerData]=\"{item: item}\" [bizdocTooltip]=\"'Options' | translate\" [attr.aria-label]=\"'Options' | translate\" class=\"tool hide-xs\"><mat-icon>more_vert</mat-icon></button>\r\n  </mat-cell>\r\n</ng-container>\r\n<!-- Expanded Content Column -->\r\n<ng-container matColumnDef=\"expandedDetail\">\r\n  <mat-cell *matCellDef=\"let item\" [attr.colspan]=\"displayedColumns.length\" [@updated]=\"item == updatedElement\"\r\n    [class.read-row]=\"item.read\">\r\n    <div [@detailExpand]=\"item == expandedElement ? 'expanded' : 'collapsed'\" style=\"width: 100%\">\r\n      @if (item == expandedElement) {\r\n        <bizdoc-expanded-item [model]=\"item\" (sent)=\"onActionTaken($event)\"></bizdoc-expanded-item>\r\n      }\r\n    </div>\r\n  </mat-cell>\r\n</ng-container>\r\n<mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></mat-header-row>\r\n<mat-row @item [@updated]=\"item == updatedElement\"\r\n  *matRowDef=\"let item; let dataIndex = dataIndex; columns: displayedColumns;\" class=\"element-row\"\r\n  cdkDrag [cdkDragData]=\"item\"\r\n  [cdkDragDisabled]=\"dragDisabled\"\r\n  (cdkDragReleased)=\"dragDisabled = true\"\r\n           [ngClass]=\"{'selected-row': selectedElement === item,\r\n      'expanded-row': expandedElement === item,\r\n           'odd-row': dataIndex % 2,\r\n      'read-row': item.read}\" matRipple\r\n  (click)=\"open(item, $event)\">\r\n  <div *cdkDragPreview>\r\n    <button mat-icon-button aria-disabled=\"true\"><mat-icon>drag_indicator</mat-icon></button> <span>#{{item.number}}</span>\r\n  </div>\r\n  <div *cdkDragPlaceholder>\r\n    <!-- none -->\r\n  </div>\r\n</mat-row>\r\n<mat-row *matRowDef=\"let item; ; let dataIndex = dataIndex; columns: ['expandedDetail']\"\r\n  class=\"detail-row\" matRipple\r\n           [ngClass]=\"{ 'selected-row': selectedElement === item,\r\n           'odd-row': dataIndex % 2\r\n           }\"></mat-row>\r\n</mat-table>\r\n<mat-paginator #paginator [hidePageSize]=\"true\" [pageSize]=\"PAGE_SIZE\" [style.display]=\"!isMobile && dataSource?.data.length>PAGE_SIZE ? '':'none'\"></mat-paginator>\r\n<mat-menu #menu=\"matMenu\">\r\n  <ng-template matMenuContent let-item=\"item\">\r\n    <button mat-menu-item (click)=\"open(item, $event)\">{{'Open'|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"toggleRead(item)\">{{(item.read ?'MarkAsUnread':'MarkAsRead')|translate}}</button>\r\n    <mat-divider></mat-divider>\r\n    <button mat-menu-item (click)=\"copy(item)\">{{'Copy'| translate}}</button>\r\n  </ng-template>\r\n</mat-menu>\r\n", styles: ["#browse-table{width:100%}#browse-table .detail-row{min-height:0}#browse-table .element-row{cursor:pointer}#browse-table .element-row .drag{cursor:move}#browse-table .read-row{font-weight:100}@media screen and (min-width: 600px){.mat-mdc-row .tool{opacity:.05}.mat-mdc-row:hover .tool{opacity:1}}::ng-deep .mat-column-options{justify-content:end;padding-inline-end:8px}::ng-deep .mat-column-value{justify-content:right}::ng-deep .mat-column-select{white-space:nowrap}::ng-deep .mat-column-number{white-space:nowrap}\n"] }]
         }], ctorParameters: () => [{ type: MailboxService }, { type: AccountService }, { type: CubeService }, { type: SessionService }, { type: PromptService }, { type: TranslateService }, { type: i0.ChangeDetectorRef }, { type: RouterImpl }, { type: HubService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [BIZDOC_CONFIG]
@@ -10578,7 +10585,7 @@ class BrowsePaneComponent {
                 this._pane.title = this._translate.get('Tags');
             this.filters = p;
         });
-        this._router.events.pipe(takeUntil(this._destroy), filter(e => (e instanceof ParamNavigation || e instanceof NavigationStart || e instanceof NavigationFocus)
+        this._router.events.pipe(takeUntil(this._destroy), filter$1(e => (e instanceof ParamNavigation || e instanceof NavigationStart || e instanceof NavigationFocus)
             && e.pane._portal.component === ComposePaneComponent)).
             subscribe(e => this.items.select(e.pane.data['item'].id));
         this.contains.valueChanges.pipe(takeUntil(this._destroy), debounceTime(200)).subscribe(v => this.filters = { ...this.filters, contains: v });
@@ -12847,7 +12854,7 @@ class AvatarComponent {
             }
             !this.dense && this._changeMode(this.person.mode);
         }
-        this._hub.profileChange$.pipe(takeUntil$1(this._destroy), filter$1(u => u.userId === this.person.id)).subscribe(u => this._changeMode(u.mode));
+        this._hub.profileChange$.pipe(takeUntil$1(this._destroy), filter(u => u.userId === this.person.id)).subscribe(u => this._changeMode(u.mode));
     }
     _changeMode(mode) {
         if (!this._showMode)
@@ -13382,7 +13389,7 @@ class TaggingPipe {
         if (EMOJI_REGEX.test(text))
             text = text.replace(EMOJI_REGEX, (emoji) => `<i class="material-icons">${EMOJI_MAP[emoji]}</i>`);
         if (DOCUMENT_REGEX.test(text)) {
-            text = text.replace(DOCUMENT_REGEX, (e, number) => `<a data-id="${resource[number].encodeId()}">${e}</a>`);
+            text = text.replace(DOCUMENT_REGEX, (e, number) => `<a data-id="${resource[number].toString()}">${e}</a>`);
         }
         if (USER_REGEX.test(text)) {
             text = text.replace(USER_REGEX, (_, name) => {
@@ -13405,11 +13412,11 @@ class TaggingPipe {
         if (src.tagName === 'A') {
             const id = src.getAttribute('data-id');
             if (id) {
-                this._router.navigate(['mailbox/d', id], {});
+                this._router.navigate(['mailbox/d', parseInt(id).encodeId()], {});
                 evt.preventDefault();
             }
             else {
-                const userId = src.getAttribute('data-info');
+                const userId = src.getAttribute('data-userid');
                 userId && this._chat.open(userId);
             }
         }
@@ -13455,7 +13462,7 @@ class CommentLikesComponent {
         this._mailbox = _mailbox;
         this._messaging = _messaging;
         this._destroy = new Subject();
-        this._messaging.vote$.pipe(takeUntil(this._destroy), filter(e => e.id === this._data.documentId)).subscribe(e => {
+        this._messaging.vote$.pipe(takeUntil(this._destroy), filter$1(e => e.id === this._data.documentId)).subscribe(e => {
         });
     }
     ngOnInit() {
@@ -13538,7 +13545,7 @@ class CommentComponent {
      * @param e
      */
     chat(e) {
-        const userId = e.target.getAttribute('data-info');
+        const userId = e.target.getAttribute('data-userid');
         userId &&
             this._chat.open(userId);
     }
@@ -13596,7 +13603,7 @@ class CommentComponent {
             positionStrategy: this._overlay.position().global().centerHorizontally().centerVertically(),
         });
         oRef.attach(new TemplatePortal(this.previewTemplate, this._vc));
-        merge(oRef.keydownEvents().pipe(filter(k => k.key === 'Escape')), oRef.backdropClick()).subscribe(() => oRef.detach());
+        merge(oRef.keydownEvents().pipe(filter$1(k => k.key === 'Escape')), oRef.backdropClick()).subscribe(() => oRef.detach());
     }
     votes() {
         this._open(CommentLikesComponent, {
@@ -13654,7 +13661,7 @@ class CommentsComponent {
         this._preserveDraft = _config.comments && _config.comments.preserveDraft;
     }
     ngOnInit() {
-        this._messaging.comment$.pipe(takeUntil(this._destroy), filter(e => (e.id === this.model.documentId))).subscribe(e => {
+        this._messaging.comment$.pipe(takeUntil(this._destroy), filter$1(e => (e.id === this.model.documentId))).subscribe(e => {
             if (!this.model.comments.find(c => c.id === e.model.id)) {
                 this.model.comments.push(e.model);
                 if (this._inFocus)
@@ -13662,7 +13669,7 @@ class CommentsComponent {
                 this.change.emit();
             }
         });
-        this._messaging.commentTyping$.pipe(takeUntil(this._destroy), filter(e => e.id === this.model.documentId)).
+        this._messaging.commentTyping$.pipe(takeUntil(this._destroy), filter$1(e => e.id === this.model.documentId)).
             subscribe(e => {
             this._accounts.get(e.userId).subscribe(u => {
                 this.typing = u.name;
@@ -13670,15 +13677,15 @@ class CommentsComponent {
                 this._typingTask = setTimeout(() => this.typing = null, TYPING_MESSAGE_TIME);
             });
         });
-        this._messaging.vote$.pipe(takeUntil(this._destroy), filter(e => e.id === this.model.documentId)).subscribe(e => {
+        this._messaging.vote$.pipe(takeUntil(this._destroy), filter$1(e => e.id === this.model.documentId)).subscribe(e => {
             const comment = this.model.comments.find(c => c.id === e.commentId);
             comment && (comment.votes = e.votes);
         });
-        this._messaging.commentUpdate$.pipe(takeUntil(this._destroy), filter(e => e.id === this.model.documentId)).subscribe(e => {
+        this._messaging.commentUpdate$.pipe(takeUntil(this._destroy), filter$1(e => e.id === this.model.documentId)).subscribe(e => {
             const comment = this.model.comments.find(c => c.id === e.model.id);
             Object.assign(comment, e.model);
         });
-        this._messaging.commentDelete$.pipe(takeUntil(this._destroy), filter(e => e.id === this.model.documentId)).subscribe(e => {
+        this._messaging.commentDelete$.pipe(takeUntil(this._destroy), filter$1(e => e.id === this.model.documentId)).subscribe(e => {
             const comment = this.model.comments.find(c => c.id === e.id);
             comment.deleted = e.deleted;
             this.change.emit();
@@ -13696,7 +13703,7 @@ class CommentsComponent {
      * @param e
      */
     chat(e) {
-        const userId = e.target.getAttribute('data-info');
+        const userId = e.target.getAttribute('data-userid');
         userId &&
             this._chat.open(userId);
     }
@@ -14179,7 +14186,7 @@ class ReportRef {
     /** listen to progress events reported by backend code */
     progress() {
         return this._hub.reportProgress$.
-            pipe(filter(e => e.name === this._configuration.name), map(e => e.progress));
+            pipe(filter$1(e => e.name === this._configuration.name), map(e => e.progress));
     }
     /**
      *
@@ -14264,7 +14271,7 @@ class ReportViewerComponent {
                 this._instance = this.table;
             // listen to progress
             this._hub.reportProgress$.
-                pipe(filter(e => e.name === this.report.name), takeUntil(this._destroy), debounceTime(50)).
+                pipe(filter$1(e => e.name === this.report.name), takeUntil(this._destroy), debounceTime(50)).
                 subscribe(i => {
                 if (this.progress > 0)
                     this.progress = i.progress;
@@ -15294,7 +15301,7 @@ class UtilityRef {
     }
     get jobId() { return this._jobId; }
     progress() {
-        return this._hub.jobProgress$.pipe(filter(e => e.jobId === this.jobId), map(e => e.event));
+        return this._hub.jobProgress$.pipe(filter$1(e => e.jobId === this.jobId), map(e => e.event));
     }
     execute(args) {
         return this._http.post(`/api/utility/${encodeURIComponent(this._utility.name)}`, args, { observe: 'response' }).
@@ -16562,7 +16569,7 @@ class TraceViewComponent extends TraceBase {
         this._data && this._filter();
     }
     chat(e) {
-        const userId = e.target.getAttribute('data-info');
+        const userId = e.target.getAttribute('data-userid');
         userId &&
             this._chat.open(userId);
     }
@@ -17154,7 +17161,7 @@ class CubeMatrixBase {
         this._listen().subscribe(() => this.values[name] = value);
     }
     _listen() {
-        return this.table.loadingChange.pipe(filter(ok => !ok), first());
+        return this.table.loadingChange.pipe(filter$1(ok => !ok), first());
     }
     onFilter(axes) {
         this.axes = axes;
@@ -17742,14 +17749,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
                 args: [CubeMatrixComponent, { static: true }]
             }] } });
 
-const NOTIFICATION_DATA = new InjectionToken('notification');
+class NotificationRef {
+    constructor(_message) {
+        this._message = _message;
+    }
+    get message() {
+        return this._message;
+    }
+}
+
 class NotificationBase {
-    constructor(notification, _router, _session, _translate, _chat) {
-        this.notification = notification;
-        this._router = _router;
-        this._session = _session;
-        this._translate = _translate;
-        this._chat = _chat;
+    constructor() {
+        this._router = inject(RouterImpl);
+        this._session = inject(SessionService);
+        this._translate = inject(TranslateService);
+        this._chat = inject(ChatInfo);
+        this.notification = inject(NotificationRef);
     }
     _formatUserElement(person) {
         if (person.id === this._session.userId)
@@ -17757,57 +17772,64 @@ class NotificationBase {
         return this._chat.format(person);
     }
     open(e) {
-        const userId = e.target.getAttribute('data-info');
+        const el = e.target;
+        if (el.tagName !== 'A')
+            return;
+        const userId = el.getAttribute('data-userid');
         if (userId)
             this._chat.open(userId);
-        else if (this.notification.recipientId)
-            this._router.navigate(['mailbox/i', this.notification.recipientId.encodeId()], {
-                policy: OpenPolicy.Tab | OpenPolicy.Expandable
-            });
-        else if (this.notification.documentId)
-            this._router.navigate(['mailbox/d', this.notification.documentId.encodeId()], {
-                policy: OpenPolicy.Tab | OpenPolicy.Expandable
-            });
+        else {
+            const { documentId, recipientId } = this.notification.message;
+            if (recipientId)
+                this._router.navigate(['mailbox/i', recipientId.encodeId()], {
+                    policy: OpenPolicy.Clear
+                });
+            else if (documentId)
+                this._router.navigate(['mailbox/d', documentId.encodeId()], {
+                    policy: OpenPolicy.Tab | OpenPolicy.Expandable
+                });
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: NotificationBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: NotificationBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.0", type: NotificationBase, isStandalone: true, host: { listeners: { "click": "open($event)" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: NotificationBase, decorators: [{
             type: Directive
-        }], ctorParameters: () => [{ type: undefined }, { type: RouterImpl }, { type: SessionService }, { type: TranslateService }, { type: ChatInfo }], propDecorators: { open: [{
+        }], propDecorators: { open: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }] } });
 
 /** */
 class CommentedNotification extends NotificationBase {
+    constructor() {
+        super(...arguments);
+        this._accounts = inject(AccountService);
+    }
     ngOnInit() {
-        if (this.notification.userIds.length === 1)
-            this._accounts.get(this.notification.userIds[0]).subscribe(u => {
-                this.message = this._translate.get(`CommentedOne${u.gender || ''}Notify`, this._formatUserElement(u), this.notification.text, this.notification.number);
+        const { userIds, number, text } = this.notification.message;
+        this.count = userIds.length;
+        if (userIds.length === 1)
+            this._accounts.get(userIds[0]).subscribe(u => {
+                this.message = this._translate.get(`CommentedOne${u.gender || ''}Notify`, this._formatUserElement(u), text, number);
             });
         else
-            this._accounts.getAll(this.notification.userIds).subscribe(us => {
+            this._accounts.getAll(userIds).subscribe(us => {
                 if (us.length < 3)
-                    this.message = this._translate.get('CommentedManyNotify', this._translate.join(us.map(u => this._formatUserElement(u))), this.notification.number);
+                    this.message = this._translate.get('CommentedManyNotify', this._translate.join(us.map(u => this._formatUserElement(u))), number);
                 else {
                     const comma = this._translate.comma;
                     this.names = us.map(u => u.name).join(comma);
-                    this.message = this._translate.get('CommentedManyMoreNotify', us.slice(0, 2).map(u => this._formatUserElement(u)).join(comma), us.length - 2, this.notification.number);
+                    this.message = this._translate.get('CommentedManyMoreNotify', us.slice(0, 2).map(u => this._formatUserElement(u)).join(comma), us.length - 2, number);
                 }
             });
     }
-    constructor(notification, _accounts, translate, router, session, chat) {
-        super(notification, router, session, translate, chat);
-        this.notification = notification;
-        this._accounts = _accounts;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CommentedNotification, deps: [{ token: NOTIFICATION_DATA }, { token: AccountService }, { token: TranslateService }, { token: RouterImpl }, { token: SessionService }, { token: ChatInfo }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CommentedNotification, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: CommentedNotification, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `@if (message) {
-  @if (notification.userIds.length < 3) {
+  @if (count < 3) {
     <span [innerHTML]='message | sanitizeHtml'></span>
   }
-  @if (notification.userIds.length >= 3) {
+  @else {
     <span [bizdocTooltip]='names' [innerHTML]='message | sanitizeHtml'></span>
   }
 }`, isInline: true, dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
@@ -17817,117 +17839,105 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
             args: [{
                     standalone: false,
                     template: `@if (message) {
-  @if (notification.userIds.length < 3) {
+  @if (count < 3) {
     <span [innerHTML]='message | sanitizeHtml'></span>
   }
-  @if (notification.userIds.length >= 3) {
+  @else {
     <span [bizdocTooltip]='names' [innerHTML]='message | sanitizeHtml'></span>
   }
 }`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: AccountService }, { type: TranslateService }, { type: RouterImpl }, { type: SessionService }, { type: ChatInfo }] });
+        }] });
 
-class CubeAnomalyNotification {
+class CubeAnomalyNotification extends NotificationBase {
+    constructor() {
+        super(...arguments);
+        this._ds = inject(DatasourceService);
+        this.axes = '';
+    }
     ngOnInit() {
-        this.cube = this._session.profile.cubes.find(c => c.name === this.notification.cube);
+        const { cube, axes } = this.notification.message;
+        this.cube = this._session.profile.cubes.find(c => c.name === cube);
         const observables = [];
         this.cube.axes.forEach((a, i) => {
-            if (a.selectionMode !== 'None' && this.notification.axes && this.notification.axes[i]) {
-                observables.push(this._ds.get(a.dataType, this.notification.axes[i]));
+            if (a.selectionMode !== 'None' && axes && axes[i]) {
+                observables.push(this._ds.get(a.dataType, axes[i]));
             }
         });
-        forkJoin(observables).subscribe(a => this.axes = this._translate.join(a.map((e, i) => e || this.notification.axes[i])));
+        forkJoin(observables).subscribe(a => this.axes = this._translate.join(a.map((e, i) => e || axes[i])));
     }
-    open(e) {
-        const id = e.target.getAttribute('data-info');
+    open(evt) {
+        const { cube, axes } = this.notification.message;
+        const id = evt.target.getAttribute('data-id');
         if (id) {
             this._router.navigate(['mailbox/i', parseInt(id).encodeId()]);
         }
         else {
             const params = {};
-            if (this.notification.axes)
-                this.notification.axes.forEach((a, i) => a && (params[this.cube.axes[i].name] = a));
-            this._router.navigate(['cube', this.notification.cube, 'v', this.cube.views[0].name], { queryParams: params });
+            axes?.forEach((a, i) => a && (params[this.cube.axes[i].name] = a));
+            this._router.navigate(['cube', cube, 'v', this.cube.views[0].name], { queryParams: params });
         }
     }
-    constructor(notification, _ds, _session, _router, _translate) {
-        this.notification = notification;
-        this._ds = _ds;
-        this._session = _session;
-        this._router = _router;
-        this._translate = _translate;
-        this.axes = '';
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CubeAnomalyNotification, deps: [{ token: NOTIFICATION_DATA }, { token: DatasourceService }, { token: SessionService }, { token: RouterImpl }, { token: TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: CubeAnomalyNotification, isStandalone: false, selector: "ng-component", host: { listeners: { "click": "open($event)" } }, ngImport: i0, template: `<span [innerHTML]=" 'CubeAnomalyNotify' | translate : (cube.title | lowercase) : (notification.value | currency : cube.currencyCode : 'symbol') : axes | sanitizeHtml"></span>`, isInline: true, dependencies: [{ kind: "pipe", type: i9.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i9.CurrencyPipe, name: "currency" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CubeAnomalyNotification, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: CubeAnomalyNotification, isStandalone: false, selector: "ng-component", host: { listeners: { "click": "open($event)" } }, usesInheritance: true, ngImport: i0, template: `<span [innerHTML]="'CubeAnomalyNotify' | translate : (cube.title | lowercase) : (notification.message.value | currency : cube.currencyCode : 'symbol') : axes | sanitizeHtml"></span>`, isInline: true, dependencies: [{ kind: "pipe", type: i9.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: i9.CurrencyPipe, name: "currency" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CubeAnomalyNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
-                    template: `<span [innerHTML]=" 'CubeAnomalyNotify' | translate : (cube.title | lowercase) : (notification.value | currency : cube.currencyCode : 'symbol') : axes | sanitizeHtml"></span>`
+                    template: `<span [innerHTML]="'CubeAnomalyNotify' | translate : (cube.title | lowercase) : (notification.message.value | currency : cube.currencyCode : 'symbol') : axes | sanitizeHtml"></span>`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: DatasourceService }, { type: SessionService }, { type: RouterImpl }, { type: TranslateService }], propDecorators: { open: [{
+        }], propDecorators: { open: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }] } });
 
 class EscalatedNotification extends NotificationBase {
-    ngOnInit() {
-        this._accounts.get(this.notification.substituteId).subscribe(u => this.name = this._formatUserElement(u));
+    constructor() {
+        super(...arguments);
+        this._accounts = inject(AccountService);
     }
-    constructor(router, notification, _accounts, translate, session, chat) {
-        super(notification, router, session, translate, chat);
-        this.notification = notification;
-        this._accounts = _accounts;
+    ngOnInit() {
+        this._accounts.get(this.notification.message.substituteId).subscribe(u => this.name = this._formatUserElement(u));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: EscalatedNotification, deps: [{ token: RouterImpl }, { token: NOTIFICATION_DATA }, { token: AccountService }, { token: TranslateService }, { token: SessionService }, { token: ChatInfo }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: EscalatedNotification, isStandalone: false, selector: "bizdoc-notify-escalated", usesInheritance: true, ngImport: i0, template: `@if (name) {<span [innerHTML]="'EscalatedNotify' | translate : notification.number : name | sanitizeHtml"></span>}`, isInline: true, dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: EscalatedNotification, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: EscalatedNotification, isStandalone: false, selector: "bizdoc-notify-escalated", usesInheritance: true, ngImport: i0, template: `@if (name) {<span [innerHTML]="'EscalatedNotify' | translate : notification.message.number : name | sanitizeHtml"></span>}`, isInline: true, dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: EscalatedNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
                     selector: 'bizdoc-notify-escalated',
-                    template: `@if (name) {<span [innerHTML]="'EscalatedNotify' | translate : notification.number : name | sanitizeHtml"></span>}`
+                    template: `@if (name) {<span [innerHTML]="'EscalatedNotify' | translate : notification.message.number : name | sanitizeHtml"></span>}`
                 }]
-        }], ctorParameters: () => [{ type: RouterImpl }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: AccountService }, { type: TranslateService }, { type: SessionService }, { type: ChatInfo }] });
+        }] });
 
 class LikedNotification extends NotificationBase {
+    constructor() {
+        super(...arguments);
+        this._accounts = inject(AccountService);
+    }
     ngOnInit() {
-        if (this.notification.userIds.length === 1)
-            this._accounts.get(this.notification.userIds[0]).subscribe(u => this.message = this._translate.personalize(this.notification.voted === 1 ? 'LikedOneNotify' : 'DislikedOneNotify', u.gender, this._formatUserElement(u), this.notification.number));
+        const { userIds, voted, number } = this.notification.message;
+        if (userIds.length === 1)
+            this._accounts.get(userIds[0]).subscribe(u => this.message = this._translate.personalize(voted === 1 ? 'LikedOneNotify' : 'DislikedOneNotify', u.gender, this._formatUserElement(u), number));
         else
-            this._accounts.getAll(this.notification.userIds).subscribe(us => {
+            this._accounts.getAll(userIds).subscribe(us => {
                 if (us.length < 3)
-                    this.message = this._translate.get(this.notification.voted === 1 ? 'LikedManyNotify' : this.notification.voted === -1 ? 'DislikedManyNotify' : 'MixedLikeManyNotify', this._translate.join(us.map(u => this._formatUserElement(u))), this.notification.number);
+                    this.message = this._translate.get(voted === 1 ? 'LikedManyNotify' : voted === -1 ? 'DislikedManyNotify' : 'MixedLikeManyNotify', this._translate.join(us.map(u => this._formatUserElement(u))), number);
                 else {
                     const comma = this._translate.comma;
                     this.names = us.map(u => u.name).join(comma);
-                    this.message = this._translate.get(this.notification.voted === 1 ? 'LikedManyMoreNotify' : this.notification.voted === -1 ? 'DislikedManyMoreNotify' : 'MixedLikeManyMoreNotify', us.slice(0, 2).map(u => this._formatUserElement(u)).join(comma), us.length - 2, this.notification.number);
+                    this.message = this._translate.get(voted === 1 ? 'LikedManyMoreNotify' : voted === -1 ? 'DislikedManyMoreNotify' : 'MixedLikeManyMoreNotify', us.slice(0, 2).map(u => this._formatUserElement(u)).join(comma), us.length - 2, number);
                 }
             });
     }
-    constructor(notification, _accounts, translate, router, session, chat) {
-        super(notification, router, session, translate, chat);
-        this.notification = notification;
-        this._accounts = _accounts;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: LikedNotification, deps: [{ token: NOTIFICATION_DATA }, { token: AccountService }, { token: TranslateService }, { token: RouterImpl }, { token: SessionService }, { token: ChatInfo }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: LikedNotification, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: LikedNotification, isStandalone: false, selector: "bizdoc-liked-notification", usesInheritance: true, ngImport: i0, template: `@if (message) {
   @if (notification.userIds.length < 3) {
     <span [innerHTML]='message | sanitizeHtml'></span>
   }
-  @if (notification.userIds.length >= 3) {
+  @else {
     <span [bizdocTooltip]='names' [innerHTML]='message | sanitizeHtml'></span>
   }
 }`, isInline: true, dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
@@ -17941,131 +17951,111 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
   @if (notification.userIds.length < 3) {
     <span [innerHTML]='message | sanitizeHtml'></span>
   }
-  @if (notification.userIds.length >= 3) {
+  @else {
     <span [bizdocTooltip]='names' [innerHTML]='message | sanitizeHtml'></span>
   }
 }`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: AccountService }, { type: TranslateService }, { type: RouterImpl }, { type: SessionService }, { type: ChatInfo }] });
+        }] });
 
 class StateChangedNotification extends NotificationBase {
     ngOnInit() {
-        this.form = this._session.profile.forms.find(f => f.name === this.notification.formId);
-    }
-    constructor(notification, session, router, translate, chat) {
-        super(notification, router, session, translate, chat);
-        this.notification = notification;
+        this.form = this._session.profile.forms.find(f => f.name === this.notification.message.formId);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: StateChangedNotification, deps: [{ token: NOTIFICATION_DATA }, { token: SessionService }, { token: RouterImpl }, { token: TranslateService }, { token: ChatInfo }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: StateChangedNotification, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `<span [innerHTML]="'StateChangedNotify' | translate : form.title : notification.number : (notification.state | state : 'past' | lowercase) | sanitizeHtml"></span>`, isInline: true, dependencies: [{ kind: "pipe", type: i9.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: StatePipe, name: "state" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: StateChangedNotification, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: StateChangedNotification, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `<span [innerHTML]="'StateChangedNotify' | translate : form.title : notification.message.number : (notification.message.state | state : 'past' | lowercase) | sanitizeHtml"></span>`, isInline: true, dependencies: [{ kind: "pipe", type: i9.LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: StatePipe, name: "state" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: StateChangedNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
-                    template: `<span [innerHTML]="'StateChangedNotify' | translate : form.title : notification.number : (notification.state | state : 'past' | lowercase) | sanitizeHtml"></span>`
+                    template: `<span [innerHTML]="'StateChangedNotify' | translate : form.title : notification.message.number : (notification.message.state | state : 'past' | lowercase) | sanitizeHtml"></span>`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: SessionService }, { type: RouterImpl }, { type: TranslateService }, { type: ChatInfo }] });
+        }] });
 
 class TextNotification {
     constructor(notification) {
         this.notification = notification;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: TextNotification, deps: [{ token: NOTIFICATION_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: TextNotification, isStandalone: false, selector: "bizdoc-notify-text", ngImport: i0, template: `<span [innerHTML]="notification.text"></span>`, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: TextNotification, deps: [{ token: NotificationRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: TextNotification, isStandalone: false, selector: "bizdoc-notify-text", ngImport: i0, template: `<span [innerHTML]="notification.message.text"></span>`, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: TextNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
                     selector: 'bizdoc-notify-text',
-                    template: `<span [innerHTML]="notification.text"></span>`
+                    template: `<span [innerHTML]="notification.message.text"></span>`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: NotificationRef, decorators: [{
                     type: Inject,
-                    args: [NOTIFICATION_DATA]
+                    args: [NotificationRef]
                 }] }] });
 
 class UpcomingEventNotification {
-    ngOnInit() {
-        this.duration = dayjs(this.notification.starting);
+    constructor() {
+        this.notification = inject((NotificationRef));
+        this._router = inject(RouterImpl);
     }
-    open(e) {
-        this._router.navigate(['schedule'], { queryParams: { date: new Date(this.notification.starting).valueOf().encodeId() } });
+    ngOnInit() {
+        this.duration = dayjs(this.notification.message.starting);
     }
-    constructor(notification, _router) {
-        this.notification = notification;
-        this._router = _router;
+    open(_) {
+        this._router.navigate(['schedule'], { queryParams: { date: this.duration.valueOf().encodeId() } });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: UpcomingEventNotification, deps: [{ token: NOTIFICATION_DATA }, { token: RouterImpl }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: UpcomingEventNotification, isStandalone: false, selector: "ng-component", host: { listeners: { "click": "open($event)" } }, ngImport: i0, template: `<span [bizdocTooltip]="notification.starting | amCalendar" [innerHTML]="'UpcomingEventNotify' | translate : notification.number : duration.fromNow() | sanitizeHtml"></span>`, isInline: true, dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: CalendarPipe, name: "amCalendar" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: UpcomingEventNotification, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: UpcomingEventNotification, isStandalone: false, selector: "ng-component", host: { listeners: { "click": "open($event)" } }, ngImport: i0, template: `<span [bizdocTooltip]="notification.message.starting | amCalendar" [innerHTML]="'UpcomingEventNotify' | translate : notification.message.number : duration.fromNow() | sanitizeHtml"></span>`, isInline: true, dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: CalendarPipe, name: "amCalendar" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: UpcomingEventNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
-                    template: `<span [bizdocTooltip]="notification.starting | amCalendar" [innerHTML]="'UpcomingEventNotify' | translate : notification.number : duration.fromNow() | sanitizeHtml"></span>`
+                    template: `<span [bizdocTooltip]="notification.message.starting | amCalendar" [innerHTML]="'UpcomingEventNotify' | translate : notification.message.number : duration.fromNow() | sanitizeHtml"></span>`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: RouterImpl }], propDecorators: { open: [{
+        }], propDecorators: { open: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }] } });
 
 class NudgeNotification extends NotificationBase {
     ngOnInit() {
-        this.expire = dayjs(this.notification.expire);
+        this.expire = dayjs(this.notification.message.expire);
     }
-    constructor(router, translate, session, chat, notification) {
-        super(notification, router, session, translate, chat);
-        this.notification = notification;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: NudgeNotification, deps: [{ token: RouterImpl }, { token: TranslateService }, { token: SessionService }, { token: ChatInfo }, { token: NOTIFICATION_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: NudgeNotification, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `<span [innerHTML]='"NudgeNotify" | translate : notification.number : expire.toNow() | sanitizeHtml'></span>`, isInline: true, dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: NudgeNotification, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: NudgeNotification, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `<span [innerHTML]='"NudgeNotify" | translate : notification.message.number : expire.toNow() | sanitizeHtml'></span>`, isInline: true, dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: NudgeNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
-                    template: `<span [innerHTML]='"NudgeNotify" | translate : notification.number : expire.toNow() | sanitizeHtml'></span>`
+                    template: `<span [innerHTML]='"NudgeNotify" | translate : notification.message.number : expire.toNow() | sanitizeHtml'></span>`
                 }]
-        }], ctorParameters: () => [{ type: RouterImpl }, { type: TranslateService }, { type: SessionService }, { type: ChatInfo }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }] });
+        }] });
 
 class LongRunningTaskNotification {
     ngOnInit() {
-        this.report = this._session.profile.reports.find(r => r.name === this.notification.name);
+        this.report = this._session.profile.reports.find(r => r.name === this.notification.message.name);
     }
-    open(e) {
-        this._router.navigate(['reports', this.notification.name]);
+    open(_) {
+        this._router.navigate(['reports', this.notification.message.name]);
     }
     constructor(notification, _session, _router) {
         this.notification = notification;
         this._session = _session;
         this._router = _router;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: LongRunningTaskNotification, deps: [{ token: NOTIFICATION_DATA }, { token: SessionService }, { token: RouterImpl }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: LongRunningTaskNotification, isStandalone: false, selector: "ng-component", host: { listeners: { "click": "open($event)" } }, ngImport: i0, template: `<span></span>`, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: LongRunningTaskNotification, deps: [{ token: NotificationRef }, { token: SessionService }, { token: RouterImpl }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: LongRunningTaskNotification, isStandalone: false, selector: "ng-component", host: { listeners: { "click": "open($event)" } }, ngImport: i0, template: `<span [innerHTML]="report.title"></span>`, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: LongRunningTaskNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
-                    template: `<span></span>`
+                    template: `<span [innerHTML]="report.title"></span>`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: NotificationRef, decorators: [{
                     type: Inject,
-                    args: [NOTIFICATION_DATA]
+                    args: [NotificationRef]
                 }] }, { type: SessionService }, { type: RouterImpl }], propDecorators: { open: [{
                 type: HostListener,
                 args: ['click', ['$event']]
@@ -18073,21 +18063,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
 
 /** */
 class TaggedNotification extends NotificationBase {
+    constructor() {
+        super(...arguments);
+        this._accounts = inject(AccountService);
+    }
     ngOnInit() {
-        const form = this._session.profile.forms.find(f => f.name == this.notification.formId);
-        if (this.notification.who === this._session.userId)
-            this.message = this._translate.get('TaggedYourselfNotify', form.title, `<a>${this.notification.number}</a>`);
+        const { formId, who, number } = this.notification.message;
+        const form = this._session.profile.forms.find(f => f.name == formId);
+        if (who === this._session.userId)
+            this.message = this._translate.get('TaggedYourselfNotify', form.title, `<a>${number}</a>`);
         else
-            this._accounts.get(this.notification.who).subscribe(u => {
-                this.message = this._translate.get(`Tagged${u.gender || ''}Notify`, this._formatUserElement(u), form.title, `<a>${this.notification.number}</a>`);
+            this._accounts.get(who).subscribe(u => {
+                this.message = this._translate.get(`Tagged${u.gender || ''}Notify`, this._formatUserElement(u), form.title, `<a>${number}</a>`);
             });
     }
-    constructor(notification, _accounts, translate, router, session, chat) {
-        super(notification, router, session, translate, chat);
-        this.notification = notification;
-        this._accounts = _accounts;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: TaggedNotification, deps: [{ token: NOTIFICATION_DATA }, { token: AccountService }, { token: TranslateService }, { token: RouterImpl }, { token: SessionService }, { token: ChatInfo }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: TaggedNotification, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: TaggedNotification, isStandalone: false, selector: "bizdoc-notify-tagged", usesInheritance: true, ngImport: i0, template: `@if (message) {
   <span [innerHTML]='message | sanitizeHtml'></span>
 }`, isInline: true, dependencies: [{ kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
@@ -18101,10 +18091,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
   <span [innerHTML]='message | sanitizeHtml'></span>
 }`
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: AccountService }, { type: TranslateService }, { type: RouterImpl }, { type: SessionService }, { type: ChatInfo }] });
+        }] });
 
 class DocumentFactory {
     constructor(_session, _mailbox, _cf, _messaging, _ps, _overlay, _dir, _router) {
@@ -18183,7 +18170,7 @@ class DocumentFactory {
                     this._messaging.callback$.pipe(takeUntil$1(formRef._destroy$)).
                         subscribe(e => compRef.instance.onMessage && compRef.instance.onMessage(e.message));
                     // escape
-                    merge(overlayRef.backdropClick(), overlayRef.keydownEvents().pipe(filter$1(k => k.key === 'Escape'))).
+                    merge(overlayRef.backdropClick(), overlayRef.keydownEvents().pipe(filter(k => k.key === 'Escape'))).
                         subscribe(() => {
                         observe.complete();
                         overlayRef.detach();
@@ -18255,25 +18242,27 @@ class InviteNotification {
         this._router = _router;
         this._factory = _factory;
         this.notification = notification;
-        const form = session.profile.forms.find(f => f.name == notification.formId);
-        this.message = notification.message ||
-            (notification.due ?
-                translate.get(notification.recipientId ?
+        const { formId, message, due, recipientId } = notification.message;
+        const form = session.profile.forms.find(f => f.name === formId);
+        this.message = message ||
+            (due ?
+                translate.get(recipientId ?
                     'CompleteNotificationTill' :
-                    'FillNotificationTill', form.title, dayjs(notification.due).fromNow()) :
-                translate.get(notification.recipientId ?
+                    'FillNotificationTill', form.title, dayjs(due).fromNow()) :
+                translate.get(recipientId ?
                     'CompleteFillNotification' :
                     'FillNotification', form.title));
     }
     open(_) {
-        if (this.notification.recipientId)
-            this._router.navigate(['mailbox/i', this.notification.recipientId.encodeId()]);
+        const { formId, recipientId } = this.notification.message;
+        if (recipientId)
+            this._router.navigate(['mailbox/i', recipientId.encodeId()]);
         else
-            this._factory.create(this.notification.formId).subscribe(m => {
+            this._factory.create(formId).subscribe(m => {
                 this._router.navigate(['mailbox/i', m.id.encodeId()]);
             });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: InviteNotification, deps: [{ token: RouterImpl }, { token: DocumentFactory }, { token: SessionService }, { token: TranslateService }, { token: NOTIFICATION_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: InviteNotification, deps: [{ token: RouterImpl }, { token: DocumentFactory }, { token: SessionService }, { token: TranslateService }, { token: NotificationRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: InviteNotification, isStandalone: false, selector: "ng-component", host: { listeners: { "click": "open($event)" } }, ngImport: i0, template: `<span [innerHTML]="message"></span>`, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: InviteNotification, decorators: [{
@@ -18282,45 +18271,42 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
                     standalone: false,
                     template: `<span [innerHTML]="message"></span>`
                 }]
-        }], ctorParameters: () => [{ type: RouterImpl }, { type: DocumentFactory }, { type: SessionService }, { type: TranslateService }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: RouterImpl }, { type: DocumentFactory }, { type: SessionService }, { type: TranslateService }, { type: NotificationRef, decorators: [{
                     type: Inject,
-                    args: [NOTIFICATION_DATA]
+                    args: [NotificationRef]
                 }] }], propDecorators: { open: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }] } });
 
-class ContentNotification {
-    ngOnInit() {
-    }
-    constructor(notification, vc) {
-        this.notification = notification;
+class ContentMessageNotification extends NotificationBase {
+    constructor(vc) {
+        super();
         this._factory = inject(BizDocComponentFactoryResolver);
-        this._session = inject(SessionService);
-        const configuration = this._session.profile.notifications.find(n => n.contentType === notification.contentType);
-        const comp = this._factory.component(configuration.template);
-        const compRef = vc.createComponent(comp, {
-        //  injector: Injector.create([{
-        //    provide: NotificationRef,
-        //    value: new NotificationRef()
-        //  }])
-        });
-        compRef.instance.onBind(notification.content);
+        // map
+        if (!ContentMessageNotification._tamplateMap) {
+            ContentMessageNotification._tamplateMap = {};
+            this._session.profile.notifications.forEach(n => {
+                ContentMessageNotification._tamplateMap[n.contentType] = n.template;
+            });
+        }
+        const { content, contentType } = this.notification.message;
+        const template = ContentMessageNotification._tamplateMap[contentType];
+        const comp = this._factory.component(template);
+        const compRef = vc.createComponent(comp);
+        compRef.instance.onBind(content);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: ContentNotification, deps: [{ token: NOTIFICATION_DATA }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: ContentNotification, isStandalone: false, selector: "bizdoc-notify-content", ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: ContentMessageNotification, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.0", type: ContentMessageNotification, isStandalone: false, selector: "bizdoc-notify-content", usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: ContentNotification, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: ContentMessageNotification, decorators: [{
             type: Component,
             args: [{
                     standalone: false,
                     selector: 'bizdoc-notify-content',
                     template: ''
                 }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NOTIFICATION_DATA]
-                }] }, { type: i0.ViewContainerRef }] });
+        }], ctorParameters: () => [{ type: i0.ViewContainerRef }] });
 
 class NotificationsService {
     constructor(_http, messaging, _session) {
@@ -18371,19 +18357,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
         }], ctorParameters: () => [{ type: i1.HttpClient }, { type: HubService }, { type: SessionService }] });
 
 class NotificationsComponentBase {
+    constructor() {
+        this._injector = inject(Injector);
+        this._service = inject(NotificationsService);
+        this._session = inject(SessionService);
+    }
+    /**
+     *
+     * @param messages
+     */
     prepare(messages) {
         messages.forEach(m => {
             m.comp = this._getComponent(m.type);
             m.injector = this._getInjector(m);
         });
     }
-    constructor() {
-        this._uidType = {};
-        this._injector = inject(Injector);
-        this._service = inject(NotificationsService);
-        this._session = inject(SessionService);
-        this._session.profile.notifications.forEach(n => this._uidType[n.contentType] = n.template);
-    }
     _getComponent(type) {
         switch (type) {
             case 'Commented':
@@ -18401,7 +18389,7 @@ class NotificationsComponentBase {
             case 'TextMessage':
                 return TextNotification;
             case 'ContentMessage':
-                return ContentNotification;
+                return ContentMessageNotification;
             case 'Invite':
                 return InviteNotification;
             case 'UpcomingEvent':
@@ -18417,8 +18405,8 @@ class NotificationsComponentBase {
     _getInjector(item) {
         return Injector.create({
             providers: [{
-                    provide: NOTIFICATION_DATA,
-                    useValue: item
+                    provide: NotificationRef,
+                    useValue: new NotificationRef(item)
                 }],
             parent: this._injector
         });
@@ -18474,6 +18462,10 @@ class NotificationsTableComponent extends NotificationsComponentBase {
     mute(item, mute) {
         this._service.mute(item.id, mute);
     }
+    /**
+     *
+     * @param item
+     */
     delete(item) {
         this._service.delete(item.id).subscribe(i => {
             item.deleted = true;
@@ -18493,6 +18485,10 @@ class NotificationsTableComponent extends NotificationsComponentBase {
             this.selection.clear() :
             this.selection.select(...this.dataSource.data);
     }
+    /**
+     *
+     * @param evt
+     */
     openFilter(evt) {
         const popupRef = this._popup.open(NotificationsFilterComponent, evt.target);
         popupRef.opened().
@@ -18695,7 +18691,7 @@ class ContactsComponent {
     ngOnInit() {
         const me = this._session.userId;
         this._prepare();
-        this.users$ = this.searchControl.valueChanges.pipe(debounceTime(200), filter(v => isString(v)), takeUntil(this._destroy), switchMap(v => this._service.findAll(v)), map(us => us.filter(u => u.id !== me)));
+        this.users$ = this.searchControl.valueChanges.pipe(debounceTime(200), filter$1(v => isString(v)), takeUntil(this._destroy), switchMap(v => this._service.findAll(v)), map(us => us.filter(u => u.id !== me)));
     }
     optionSelected(ev) {
         const { value: id } = ev.option;
@@ -18886,7 +18882,7 @@ class ConversationComponent {
             positionStrategy: this._overlay.position().global().centerHorizontally().centerVertically(),
         });
         oRef.attach(new TemplatePortal(this.previewTemplate, this._vc, { item }));
-        merge(oRef.keydownEvents().pipe(filter(k => k.key === 'Escape')), oRef.backdropClick()).subscribe(() => oRef.detach());
+        merge(oRef.keydownEvents().pipe(filter$1(k => k.key === 'Escape')), oRef.backdropClick()).subscribe(() => oRef.detach());
     }
     ngOnDestroy() {
         if (this._typingTask)
@@ -19403,18 +19399,18 @@ class OutOfOfficeToast {
         this._accounts.get(data.substituteId).subscribe(u => this.substitute = u);
     }
     options() {
-        this._router.navigate(['options', 'out_of_office']);
+        this._router.navigate(['options'], { queryParams: { section: 'ooo' } });
         this.dismiss();
     }
     dismiss() {
         this._ref.dismiss();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: OutOfOfficeToast, deps: [{ token: RouterImpl }, { token: AccountService }, { token: MAT_SNACK_BAR_DATA }, { token: i3.MatSnackBarRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: OutOfOfficeToast, isStandalone: false, selector: "bizdoc-outofoffice", ngImport: i0, template: "@if (substitute) {\r\n  <span matSnackBarLabel [innerHTML]=\"'OutOfOfficeOn'|translate:substitute.name|sanitizeHtml\"></span>\r\n}\r\n<div matSnackBarActions>\r\n  <button mat-stroked-button (click)=\"options()\" color=\"warn\">{{'ChangeOptions'|translate}}</button>\r\n  <button matSnackBarAction mat-icon-button (click)=\"dismiss()\" [bizdocTooltip]=\"'Dismiss'|translate\"><mat-icon>close</mat-icon></button>\r\n</div>\r\n", styles: ["div{flex-direction:row;box-sizing:border-box;display:flex;align-items:center}div span{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i3.MatSnackBarLabel, selector: "[matSnackBarLabel]" }, { kind: "directive", type: i3.MatSnackBarActions, selector: "[matSnackBarActions]" }, { kind: "directive", type: i3.MatSnackBarAction, selector: "[matSnackBarAction]" }, { kind: "component", type: i8.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: OutOfOfficeToast, isStandalone: false, selector: "bizdoc-outofoffice", ngImport: i0, template: "<div matSnackBarLabel>\r\n  @if (substitute) {\r\n  <span [innerHTML]=\"'OutOfOfficeOn'|translate:substitute.name|sanitizeHtml\"></span>\r\n  }\r\n</div>\r\n<div matSnackBarActions>\r\n  <button mat-stroked-button matSnackBarAction (click)=\"options()\" color=\"warn\">{{'ChangeOptions'|translate}}</button>\r\n  <button matSnackBarAction mat-icon-button (click)=\"dismiss()\" [bizdocTooltip]=\"'Dismiss'|translate\"><mat-icon>close</mat-icon></button>\r\n</div>\r\n", styles: [":host{display:flex}\n"], dependencies: [{ kind: "directive", type: i3.MatSnackBarLabel, selector: "[matSnackBarLabel]" }, { kind: "directive", type: i3.MatSnackBarActions, selector: "[matSnackBarActions]" }, { kind: "directive", type: i3.MatSnackBarAction, selector: "[matSnackBarAction]" }, { kind: "component", type: i8.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: OutOfOfficeToast, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'bizdoc-outofoffice', template: "@if (substitute) {\r\n  <span matSnackBarLabel [innerHTML]=\"'OutOfOfficeOn'|translate:substitute.name|sanitizeHtml\"></span>\r\n}\r\n<div matSnackBarActions>\r\n  <button mat-stroked-button (click)=\"options()\" color=\"warn\">{{'ChangeOptions'|translate}}</button>\r\n  <button matSnackBarAction mat-icon-button (click)=\"dismiss()\" [bizdocTooltip]=\"'Dismiss'|translate\"><mat-icon>close</mat-icon></button>\r\n</div>\r\n", styles: ["div{flex-direction:row;box-sizing:border-box;display:flex;align-items:center}div span{flex:1 1 auto}\n"] }]
+            args: [{ standalone: false, selector: 'bizdoc-outofoffice', template: "<div matSnackBarLabel>\r\n  @if (substitute) {\r\n  <span [innerHTML]=\"'OutOfOfficeOn'|translate:substitute.name|sanitizeHtml\"></span>\r\n  }\r\n</div>\r\n<div matSnackBarActions>\r\n  <button mat-stroked-button matSnackBarAction (click)=\"options()\" color=\"warn\">{{'ChangeOptions'|translate}}</button>\r\n  <button matSnackBarAction mat-icon-button (click)=\"dismiss()\" [bizdocTooltip]=\"'Dismiss'|translate\"><mat-icon>close</mat-icon></button>\r\n</div>\r\n", styles: [":host{display:flex}\n"] }]
         }], ctorParameters: () => [{ type: RouterImpl }, { type: AccountService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_SNACK_BAR_DATA]
@@ -19652,11 +19648,11 @@ class QuickNotificationsComponent extends NotificationsComponentBase {
         this._service.mute(item.id, mute);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: QuickNotificationsComponent, deps: [{ token: PopupRef }, { token: RouterImpl }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: QuickNotificationsComponent, isStandalone: false, selector: "bizdoc-notifications", usesInheritance: true, ngImport: i0, template: "<mat-nav-list role=\"list\">\r\n  <!--dense-->\r\n  @for (n of notifications | sort: 'sent' : 'desc' | slice:0:9; track n; let i = $index) {\r\n    <mat-list-item role=\"listitem\" class=\"item\" [class.read]=\"n.read\" (click)=\"open(n, $event)\">\r\n      <h3 *ngComponentOutlet=\"n.comp; injector: n.injector\" matListItemTitle></h3>\r\n      <span matListItemLine [bizdocTooltip]=\"n.sent | amCalendar\">{{n.sent | amTimeAgo }}</span>\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\" [matMenuTriggerData]=\"{muted: false}\"\r\n              matListItemMeta class=\"tool\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-template matMenuContent let-muted=\"muted\">\r\n          <button mat-menu-item (click)=\"mute(n, true)\">{{ (!(muted | async) ? 'Mute': 'Unmute') | translate}}</button>\r\n        </ng-template>\r\n      </mat-menu>\r\n    </mat-list-item>\r\n  }\r\n</mat-nav-list>\r\n<div class=\"tools row\">\r\n  <a (click)=\"all()\">{{'ShowAll'|translate}}</a>&nbsp;\r\n  <span class=\"divider\"></span>\r\n  <a (click)='options()'>{{'Options'|translate}}</a>\r\n</div>\r\n", styles: [".item .tool{opacity:.1}.item:hover .tool{opacity:1}.tools{font-variant-caps:all-small-caps;font-size:medium;padding:8px}\n"], dependencies: [{ kind: "directive", type: i9.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: i2$5.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$5.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$5.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i2$5.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i2$5.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i7.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: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.SlicePipe, name: "slice" }, { kind: "pipe", type: CalendarPipe, name: "amCalendar" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.0", type: QuickNotificationsComponent, isStandalone: false, selector: "bizdoc-notifications", usesInheritance: true, ngImport: i0, template: "<mat-list role=\"list\">\r\n  <!--dense-->\r\n  @for (n of notifications | sort: 'sent' : 'desc' | slice:0:9; track n.id; let i = $index) {\r\n    <mat-list-item role=\"listitem\" class=\"item\" [class.read]=\"n.read\" (click)=\"open(n, $event)\">\r\n      <h3 matListItemTitle><ng-container *ngComponentOutlet=\"n.comp; injector: n.injector\" ></ng-container></h3>\r\n      <span matListItemLine [bizdocTooltip]=\"n.sent | amDateFormat: 'lll'\">{{n.sent | amTimeAgo }}</span>\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\" [matMenuTriggerData]=\"{muted: false}\"\r\n              matListItemMeta class=\"tool\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-template matMenuContent let-muted=\"muted\">\r\n          <button mat-menu-item (click)=\"mute(n, true)\">{{ (!(muted | async) ? 'Mute': 'Unmute') | translate}}</button>\r\n        </ng-template>\r\n      </mat-menu>\r\n    </mat-list-item>\r\n  }\r\n</mat-list>\r\n<div class=\"tools row\">\r\n  <a (click)=\"all()\">{{'ShowAll'|translate}}</a>&nbsp;\r\n  <span class=\"divider\"></span>\r\n  <a (click)='options()'>{{'Options'|translate}}</a>\r\n</div>\r\n", styles: [".item .tool{opacity:.1}.item:hover .tool{opacity:1}.tools{font-variant-caps:all-small-caps;font-size:medium;padding:8px}\n"], dependencies: [{ kind: "directive", type: i9.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: i2$5.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i2$5.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$5.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i2$5.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i2$5.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i7.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: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.SlicePipe, name: "slice" }, { kind: "pipe", type: DateFormatPipe, name: "amDateFormat" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: QuickNotificationsComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'bizdoc-notifications', template: "<mat-nav-list role=\"list\">\r\n  <!--dense-->\r\n  @for (n of notifications | sort: 'sent' : 'desc' | slice:0:9; track n; let i = $index) {\r\n    <mat-list-item role=\"listitem\" class=\"item\" [class.read]=\"n.read\" (click)=\"open(n, $event)\">\r\n      <h3 *ngComponentOutlet=\"n.comp; injector: n.injector\" matListItemTitle></h3>\r\n      <span matListItemLine [bizdocTooltip]=\"n.sent | amCalendar\">{{n.sent | amTimeAgo }}</span>\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\" [matMenuTriggerData]=\"{muted: false}\"\r\n              matListItemMeta class=\"tool\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-template matMenuContent let-muted=\"muted\">\r\n          <button mat-menu-item (click)=\"mute(n, true)\">{{ (!(muted | async) ? 'Mute': 'Unmute') | translate}}</button>\r\n        </ng-template>\r\n      </mat-menu>\r\n    </mat-list-item>\r\n  }\r\n</mat-nav-list>\r\n<div class=\"tools row\">\r\n  <a (click)=\"all()\">{{'ShowAll'|translate}}</a>&nbsp;\r\n  <span class=\"divider\"></span>\r\n  <a (click)='options()'>{{'Options'|translate}}</a>\r\n</div>\r\n", styles: [".item .tool{opacity:.1}.item:hover .tool{opacity:1}.tools{font-variant-caps:all-small-caps;font-size:medium;padding:8px}\n"] }]
+            args: [{ standalone: false, selector: 'bizdoc-notifications', template: "<mat-list role=\"list\">\r\n  <!--dense-->\r\n  @for (n of notifications | sort: 'sent' : 'desc' | slice:0:9; track n.id; let i = $index) {\r\n    <mat-list-item role=\"listitem\" class=\"item\" [class.read]=\"n.read\" (click)=\"open(n, $event)\">\r\n      <h3 matListItemTitle><ng-container *ngComponentOutlet=\"n.comp; injector: n.injector\" ></ng-container></h3>\r\n      <span matListItemLine [bizdocTooltip]=\"n.sent | amDateFormat: 'lll'\">{{n.sent | amTimeAgo }}</span>\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\" [matMenuTriggerData]=\"{muted: false}\"\r\n              matListItemMeta class=\"tool\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-template matMenuContent let-muted=\"muted\">\r\n          <button mat-menu-item (click)=\"mute(n, true)\">{{ (!(muted | async) ? 'Mute': 'Unmute') | translate}}</button>\r\n        </ng-template>\r\n      </mat-menu>\r\n    </mat-list-item>\r\n  }\r\n</mat-list>\r\n<div class=\"tools row\">\r\n  <a (click)=\"all()\">{{'ShowAll'|translate}}</a>&nbsp;\r\n  <span class=\"divider\"></span>\r\n  <a (click)='options()'>{{'Options'|translate}}</a>\r\n</div>\r\n", styles: [".item .tool{opacity:.1}.item:hover .tool{opacity:1}.tools{font-variant-caps:all-small-caps;font-size:medium;padding:8px}\n"] }]
         }], ctorParameters: () => [{ type: PopupRef }, { type: RouterImpl }] });
 
 let DocumentListingComponent = class DocumentListingComponent {
@@ -21316,7 +21312,7 @@ class HomeComponent extends HomeBase {
         this._collapseToggle = false;
         this.displayWith = (_) => null;
         this.profile = this._session.profile;
-        _router.events.pipe(filter(e => e instanceof NavigationStart), filter((e) => e.pane.path !== undefined && e.pane.mode === 'pane')).
+        _router.events.pipe(filter$1(e => e instanceof NavigationStart), filter$1((e) => e.pane.path !== undefined && e.pane.mode === 'pane')).
             subscribe((e) => this._path = e.pane.path.split('/')[0]);
     }
     get submenuMode() {
@@ -21358,7 +21354,7 @@ class HomeComponent extends HomeBase {
         return this.main?.panes[0]?.guide;
     }
     ngOnInit() {
-        this.results = this.search.valueChanges.pipe(filter(v => isString(v)), map(v => this._service.search(v)));
+        this.results = this.search.valueChanges.pipe(filter$1(v => isString(v)), map(v => this._service.search(v)));
         super.ngOnInit();
     }
     /** options */
@@ -21546,7 +21542,7 @@ class CopyDialog {
     constructor(_service, dialogRef) {
         this._service = _service;
         this.search = new FormControl();
-        dialogRef.keydownEvents().pipe(filter(k => k.key === 'Enter')).
+        dialogRef.keydownEvents().pipe(filter$1(k => k.key === 'Enter')).
             subscribe(() => this.selectedItem && dialogRef.close(this.selectedItem));
     }
     ngOnInit() {
@@ -21858,7 +21854,7 @@ class ImpersonateDialog {
         this._destroy = new Subject();
         this.username = new FormControl(null, Validators.required);
         this.recents$ = this._session.listImpersonate();
-        this.users$ = this.username.valueChanges.pipe(debounceTime(250), takeUntil(this._destroy), filter(v => isString(v) && v.length > 0), switchMap(v => this._session.listImpersonate(v)));
+        this.users$ = this.username.valueChanges.pipe(debounceTime(250), takeUntil(this._destroy), filter$1(v => isString(v) && v.length > 0), switchMap(v => this._session.listImpersonate(v)));
         this.logging = false;
     }
     reset() {
@@ -22430,7 +22426,7 @@ class CubeMobileViewComponent extends ViewBase {
         });
         this._route.queryParams.pipe(takeUntil(this._destroy)).subscribe(p => this.originalAxes = p);
         this.drawer.openedChange.
-            pipe(filter(() => !this._navigating), takeUntil(this._destroy)).subscribe(() => this.viewPane.resize());
+            pipe(filter$1(() => !this._navigating), takeUntil(this._destroy)).subscribe(() => this.viewPane.resize());
         this._session.loaded.pipe(takeUntil(this._destroy)).
             subscribe(() => this.viewPane.refresh());
         const queryKeys = Object.keys(this._route.snapshot.queryParams);
@@ -23112,7 +23108,7 @@ class MapComponent {
                 });
                 infowindow.open(map, marker);
             }, MARKER_DELAY);
-        this._ref.keydownEvents().pipe(filter(k => k.key === 'Escape')).subscribe(() => this._ref.detach());
+        this._ref.keydownEvents().pipe(filter$1(k => k.key === 'Escape')).subscribe(() => this._ref.detach());
         this._ref.backdropClick().pipe().subscribe(() => this._ref.detach());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: MapComponent, deps: [{ token: i2$3.OverlayRef }, { token: LOCATION_DATA }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
@@ -23189,7 +23185,7 @@ class CubeMatrixPopupComponent extends CubeMatrixBase {
         this.originalAxes = base;
     }
     ngOnInit() {
-        this.table.loadingChange.pipe(filter(ok => !ok), first()).subscribe({
+        this.table.loadingChange.pipe(filter$1(ok => !ok), first()).subscribe({
             next: () => this.preloading = false,
             error: (e) => {
                 if (e.status === 401)
@@ -24604,7 +24600,7 @@ let ActionsWidget = class ActionsWidget {
     }
     _draw() {
         this.chart?.destroy();
-        this._loaded.pipe(takeUntil(this._destroy), delay(200), filter(v => v)).subscribe(() => this.chart = new AccumulationChart({
+        this._loaded.pipe(takeUntil(this._destroy), delay(500), filter$1(v => v)).subscribe(() => this.chart = new AccumulationChart({
             background: 'transparent',
             legendSettings: this.legendSettings, enableAnimation: true,
             tooltip: this.tooltip,
@@ -27925,7 +27921,7 @@ class CombinationPicker {
             minWidth: `${el.nativeElement.getBoundingClientRect().width}px`,
             panelClass: 'home-panel'
         });
-        merge(overlayRef.backdropClick(), overlayRef.keydownEvents().pipe(filter(e => e.key === 'Escape'), tap(e => e.stopPropagation()))).
+        merge(overlayRef.backdropClick(), overlayRef.keydownEvents().pipe(filter$1(e => e.key === 'Escape'), tap(e => e.stopPropagation()))).
             subscribe(() => this.close());
         return overlayRef;
     }
@@ -28552,7 +28548,7 @@ class QuickCommentComponent {
     }
     ngOnInit() {
         this._textChange.pipe(debounceTime(TYPING_NOTIFY$1), takeUntil(this._destroy)).subscribe(() => this._mailbox.reportTyping(this.model.documentId).subscribe());
-        this._messaging.commentTyping$.pipe(takeUntil(this._destroy), filter(e => e.id === this.model.documentId)).
+        this._messaging.commentTyping$.pipe(takeUntil(this._destroy), filter$1(e => e.id === this.model.documentId)).
             subscribe(e => {
             this._accounts.get(e.userId).subscribe(u => {
                 this.typing = u.name;
@@ -31357,7 +31353,7 @@ class SharedModule {
             PrivilegeHiddenDirective,
             TaggingItemDirective, TaggingDirective, DocumentTaggingComponent, UserTaggingComponent,
             PrivilegeDisabledDirective, CubeDocumentsGridComponent,
-            LongRunningTaskNotification, TaggedNotification, CommentedNotification, NudgeNotification, InviteNotification, ContentNotification, TextNotification, CubeAnomalyNotification, EscalatedNotification, LikedNotification, StateChangedNotification, UpcomingEventNotification,
+            LongRunningTaskNotification, TaggedNotification, CommentedNotification, NudgeNotification, InviteNotification, ContentMessageNotification, TextNotification, CubeAnomalyNotification, EscalatedNotification, LikedNotification, StateChangedNotification, UpcomingEventNotification,
             NoneComponent, ScheduleViewComponent,
             OptionsComponent, TraceViewComponent,
             ProgressDirective,
@@ -31550,7 +31546,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
                         PrivilegeHiddenDirective,
                         TaggingItemDirective, TaggingDirective, DocumentTaggingComponent, UserTaggingComponent,
                         PrivilegeDisabledDirective, CubeDocumentsGridComponent,
-                        LongRunningTaskNotification, TaggedNotification, CommentedNotification, NudgeNotification, InviteNotification, ContentNotification, TextNotification, CubeAnomalyNotification, EscalatedNotification, LikedNotification, StateChangedNotification, UpcomingEventNotification,
+                        LongRunningTaskNotification, TaggedNotification, CommentedNotification, NudgeNotification, InviteNotification, ContentMessageNotification, TextNotification, CubeAnomalyNotification, EscalatedNotification, LikedNotification, StateChangedNotification, UpcomingEventNotification,
                         NoneComponent, ScheduleViewComponent,
                         OptionsComponent, TraceViewComponent,
                         ProgressDirective,
@@ -31836,7 +31832,7 @@ class TraceElementComponent {
         });
     }
     chat(e) {
-        const userId = e.target.getAttribute('data-info');
+        const userId = e.target.getAttribute('data-userid');
         userId &&
             this._chat.open(userId);
     }
@@ -31859,7 +31855,7 @@ class PositionsPopup {
         this._destroy = new Subject();
     }
     ngOnInit() {
-        this.users$ = this.control.valueChanges.pipe(debounceTime(200), takeUntil(this._destroy), filter(v => isString(v)), switchMap(v => this._service.findAll(v, { take: 20 })));
+        this.users$ = this.control.valueChanges.pipe(debounceTime(200), takeUntil(this._destroy), filter$1(v => isString(v)), switchMap(v => this._service.findAll(v, { take: 20 })));
         //  this._pRef.backdropClick().subscribe(() => {
         //    this._pRef.close(this.dirty ? this.positions : null);
         //  });
@@ -31961,7 +31957,7 @@ let ManageCubeIndexUtility = class ManageCubeIndexUtility {
             hasBackdrop: true,
             panelClass: 'home-panel'
         });
-        merge(oRef.backdropClick(), oRef.keydownEvents().pipe(filter(k => k.key === 'Escape'))).pipe(takeUntil(this._destroy)).subscribe(() => oRef.detach());
+        merge(oRef.backdropClick(), oRef.keydownEvents().pipe(filter$1(k => k.key === 'Escape'))).pipe(takeUntil(this._destroy)).subscribe(() => oRef.detach());
     }
     _find(axes) {
         const n = this.names.length;
@@ -33577,7 +33573,7 @@ let PositionsComponent = class PositionsComponent {
     _openDialog(tmpl, form, values) {
         form.reset(values);
         const dialogRef = this._dialog.open(tmpl);
-        dialogRef.keydownEvents().pipe(filter(k => k.key === 'Enter'), takeUntil(dialogRef.afterClosed())).
+        dialogRef.keydownEvents().pipe(filter$1(k => k.key === 'Enter'), takeUntil(dialogRef.afterClosed())).
             subscribe(() => form.valid && dialogRef.close(form.value));
         return dialogRef.afterClosed().pipe(switchMap(v => v ? of(v) : EMPTY));
     }
@@ -33934,7 +33930,7 @@ class ProfileSettingsDialog {
                 this.substitute.disable();
             }
         });
-        this.ousers$ = this.substitute.valueChanges.pipe(takeUntil$1(this._dialogRef.afterClosed()), filter$1(v => isString(v)), switchMap$1(v => this._accounts.findAll(v)), map$1(r => r.filter(u => u.id !== this.model.userId)));
+        this.ousers$ = this.substitute.valueChanges.pipe(takeUntil$1(this._dialogRef.afterClosed()), filter(v => isString(v)), switchMap$1(v => this._accounts.findAll(v)), map$1(r => r.filter(u => u.id !== this.model.userId)));
         from.valueChanges.pipe(takeUntil$1(this._dialogRef.afterClosed())).
             subscribe(v => {
             if (v)
@@ -33956,7 +33952,7 @@ class ProfileSettingsDialog {
                 this.grants.clearValidators();
             }
         });
-        this.gusers$ = this.grants.valueChanges.pipe(takeUntil$1(this._dialogRef.afterClosed()), filter$1(v => isString(v)), switchMap$1(v => this._accounts.findAll(v)), map$1(r => r.filter(u => u.id !== this.model.userId)));
+        this.gusers$ = this.grants.valueChanges.pipe(takeUntil$1(this._dialogRef.afterClosed()), filter(v => isString(v)), switchMap$1(v => this._accounts.findAll(v)), map$1(r => r.filter(u => u.id !== this.model.userId)));
     }
     setId(event) {
         const { id } = event.option.value;
@@ -34078,7 +34074,7 @@ let ProfilerComponent = class ProfilerComponent {
             userId && this._open(userId);
         });
         this._pane.resized().pipe(takeUntil(this._destroy)).subscribe(() => this.chart?.chartResize());
-        this.users$ = this.search.valueChanges.pipe(takeUntil(this._destroy), debounceTime(250), filter(v => isString(v)), switchMap(v => this._accounts.findAll(v)));
+        this.users$ = this.search.valueChanges.pipe(takeUntil(this._destroy), debounceTime(250), filter$1(v => isString(v)), switchMap(v => this._accounts.findAll(v)));
     }
     guide(evt) {
         const steps = [];
@@ -34407,7 +34403,7 @@ class IconPickerComponent {
         else
             this._list(IconPickerComponent.icons);
         this.filter.valueChanges.
-            pipe(takeUntil$1(this._destroy), filter$1(v => isString(v)), debounceTime$1(200)).
+            pipe(takeUntil$1(this._destroy), filter(v => isString(v)), debounceTime$1(200)).
             subscribe(v => this._list(IconPickerComponent.icons.filter(i => i.tags.findIndex(t => t.indexOf(v) > -1) > -1)));
     }
     _list(e) {
@@ -34440,7 +34436,7 @@ class IconPickerComponent {
         });
         const portal = new TemplatePortal(this.panel, this._vc);
         this._overlayRef.attach(portal);
-        merge(this._overlayRef.backdropClick(), this._overlayRef.keydownEvents().pipe(filter$1(k => k.key === 'Escape'))).subscribe(() => this._overlayRef.detach());
+        merge(this._overlayRef.backdropClick(), this._overlayRef.keydownEvents().pipe(filter(k => k.key === 'Escape'))).subscribe(() => this._overlayRef.detach());
     }
     _trackBy(index, el) {
         return el.name;
@@ -38011,5 +38007,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AccountService, AceInput, ActionDialog, ActionPicker, ActionPipe, ActionRef, ActionsWidget, AddressControlDesigner, AddressInput, AgoPipe, ArraySortPipe, AssignActionComponent, AttachmentInfo, AttachmentPreview, AuthenticationImpl, AutocompleteControlDesigner, AvatarComponent, BIZDOC_CONFIG, BackNavigation, BizDoc, BizDocApp, BizDocComponentFactoryResolver, BizDocModule, BrokenPage, BrowseFilterComponent, BrowseItemsComponent, CalendarPipe, ChatInfo, CheckboxComponent, CheckboxControlDesigner, ChecklistControlDesigner, CollapseNavigation, ColorPicker, CombinationPicker, CombinationPickerBody, CombinationPool, CommentsComponent, CompareContextDirective, CompareGroupDirective, CompareGroupsWidget, CompareNameDirective, ComposeFormComponent, ContactsComponent, ConversationComponent, CubeAccumAnalysisWidget, CubeAccumulationChartComponent, CubeAnalysisWidget, CubeChartAnalysisWidget, CubeChartComponent, CubeDocumentsGridComponent, CubeDocumentsTableComponent, CubeDocumentsWidget, CubeFilterComponent, CubeGridComponent, CubeInfo, CubeItemResolveService, CubeMatrixComponent, CubeParallelComponent, CubePerformanceWidget, CubePivotComponent, CubeService, CubeSpreadsheetComponent, CubeSumComponent, CubeViewComponent, CubeWidgetFilterComponent, DEFAULT_POLICY, DRAFT, DashboardComponent, DatasourceService, DateControlDesigner, DateFormatPipe, DateRangeControlDesigner, DateRangePipe, DesignerCubeFilterComponent, DesignerModule, DesignerRef, DifferencePipe, DocumentFactory, DocumentInfo, DocumentInfoComponent, DocumentResolveService, DocumentViewRef, DocumentViewsComponent, DurationFormatPipe, DurationPipe, EnterExitLeft, EnterExitRight, EnterExitTop, ExploreDocumentComponent, ExploreItemImplComponent, ExploreItemsComponent, ExpressionFieldDesigner, FONT_FAMILY, FadeSlideInOut, FieldKind, FileControlDesigner, FileInput, FilterPipe, FilterTagsComponent, FlowViewComponent, FormPipe, FormRef, GuideRef, GuideService, HelpTipComponent, HtmlFieldDesigner, INBOX, IdentityName, InputFieldDesigner, JoinPipe, JsonPipe, L18nPipe, LayoutComponent, ListingRef, LocalizedStringComponent, LocalizedStringControlDesigner, LocalizedStringPipe, LottieAnimation, MailboxService, MapInfo, MatIconAnimate, MaterialModule, NavigationBase, NavigationClose, NavigationEnd, NavigationExpand, NavigationFocus, NavigationMode, NavigationPaneBase, NavigationResize, NavigationStart, NodeRef, NoneComponent, NotificationsTableComponent, NumberControlDesigner, OpenPolicy, OptionsComponent, POPUP_DATA, PaneRef, PanesRouter, ParamNavigation, PeersPerformanceWidget, PendingResultsWidget, PersonalActivityWidget, PersonalScoreWidget, Popup, PopupRef, PrivilegeDisabledDirective, PrivilegeHiddenDirective, PulseAnimation, QueryParamNavigation, QuickCommentComponent, RadioButtonControlDesigner, RecentsWidget, RecipientResolveService, ReportArgumentsComponent, ReportRef, ReportViewerComponent, ReturnActionComponent, RolePipe, RouterImpl, SanitizeHtmlPipe, SaveChangesDialog, ScheduleViewComponent, SearchInput, SelectControlDesigner, SessionService, ShakeAnimation, SharedModule, SignatureControlDesigner, SlotRouterDirective, SpContainer, StateDirective, StatePipe, StickyToolbar, SubstitutionComponent, SwapAnimation, Tab, TagsComponent, TagsControlDesigner, TasksComponent, TextAreaFieldDesigner, TimeAgoPipe, TimeControlDesigner, TimePicker, TimespanControlDesigner, TimespanInput, ToNowPipe, TooltipDirective, TraceViewComponent, TranslatePipe, TranslateService, TypeAutocomplete, TypeSelect, TypeValuePipe, UsageChartComponent, UsagePivotComponent, UsageReportArgs, UserNamePipe, UtilityRef, VersionCompareComponent, VirtualTabs, WidgetItemComponent, WidgetRef, YesNoControlDesigner, cleanup, getMonthList, isArray, isBoolean, isDate, isFunction, isImage, isMobile, isObject, isPrimitive, isPromise, isString, modelize, playAudio, programName, registerComponents };
+export { AccountService, AceInput, ActionDialog, ActionPicker, ActionPipe, ActionRef, ActionsWidget, AddressControlDesigner, AddressInput, AgoPipe, ArraySortPipe, AssignActionComponent, AttachmentInfo, AttachmentPreview, AuthenticationImpl, AutocompleteControlDesigner, AvatarComponent, BIZDOC_CONFIG, BackNavigation, BizDoc, BizDocApp, BizDocComponentFactoryResolver, BizDocModule, BrokenPage, BrowseFilterComponent, BrowseItemsComponent, CalendarPipe, ChatInfo, CheckboxComponent, CheckboxControlDesigner, ChecklistControlDesigner, CollapseNavigation, ColorPicker, CombinationPicker, CombinationPickerBody, CombinationPool, CommentsComponent, CompareContextDirective, CompareGroupDirective, CompareGroupsWidget, CompareNameDirective, ComposeFormComponent, ContactsComponent, ConversationComponent, CubeAccumAnalysisWidget, CubeAccumulationChartComponent, CubeAnalysisWidget, CubeChartAnalysisWidget, CubeChartComponent, CubeDocumentsGridComponent, CubeDocumentsTableComponent, CubeDocumentsWidget, CubeFilterComponent, CubeGridComponent, CubeInfo, CubeItemResolveService, CubeMatrixComponent, CubeParallelComponent, CubePerformanceWidget, CubePivotComponent, CubeService, CubeSpreadsheetComponent, CubeSumComponent, CubeViewComponent, CubeWidgetFilterComponent, DEFAULT_POLICY, DRAFT, DashboardComponent, DatasourceService, DateControlDesigner, DateFormatPipe, DateRangeControlDesigner, DateRangePipe, DesignerCubeFilterComponent, DesignerModule, DesignerRef, DifferencePipe, DocumentFactory, DocumentInfo, DocumentInfoComponent, DocumentResolveService, DocumentViewRef, DocumentViewsComponent, DurationFormatPipe, DurationPipe, EnterExitLeft, EnterExitRight, EnterExitTop, ExploreDocumentComponent, ExploreItemImplComponent, ExploreItemsComponent, ExpressionFieldDesigner, FONT_FAMILY, FadeSlideInOut, FieldKind, FileControlDesigner, FileInput, FilterPipe, FilterTagsComponent, FlowViewComponent, FormPipe, FormRef, GuideRef, GuideService, HelpTipComponent, HtmlFieldDesigner, INBOX, IdentityName, InputFieldDesigner, JoinPipe, JsonPipe, L18nPipe, LayoutComponent, ListingRef, LocalizedStringComponent, LocalizedStringControlDesigner, LocalizedStringPipe, LottieAnimation, MailboxService, MapInfo, MatIconAnimate, MaterialModule, NavigationBase, NavigationClose, NavigationEnd, NavigationExpand, NavigationFocus, NavigationMode, NavigationPaneBase, NavigationResize, NavigationStart, NodeRef, NoneComponent, NotificationRef, NotificationsTableComponent, NumberControlDesigner, OpenPolicy, OptionsComponent, POPUP_DATA, PaneRef, PanesRouter, ParamNavigation, PeersPerformanceWidget, PendingResultsWidget, PersonalActivityWidget, PersonalScoreWidget, Popup, PopupRef, PrivilegeDisabledDirective, PrivilegeHiddenDirective, PulseAnimation, QueryParamNavigation, QuickCommentComponent, RadioButtonControlDesigner, RecentsWidget, RecipientResolveService, ReportArgumentsComponent, ReportRef, ReportViewerComponent, ReturnActionComponent, RolePipe, RouterImpl, SanitizeHtmlPipe, SaveChangesDialog, ScheduleViewComponent, SearchInput, SelectControlDesigner, SessionService, ShakeAnimation, SharedModule, SignatureControlDesigner, SlotRouterDirective, SpContainer, StateDirective, StatePipe, StickyToolbar, SubstitutionComponent, SwapAnimation, Tab, TagsComponent, TagsControlDesigner, TasksComponent, TextAreaFieldDesigner, TimeAgoPipe, TimeControlDesigner, TimePicker, TimespanControlDesigner, TimespanInput, ToNowPipe, TooltipDirective, TraceViewComponent, TranslatePipe, TranslateService, TypeAutocomplete, TypeSelect, TypeValuePipe, UsageChartComponent, UsagePivotComponent, UsageReportArgs, UserNamePipe, UtilityRef, VersionCompareComponent, VirtualTabs, WidgetItemComponent, WidgetRef, YesNoControlDesigner, cleanup, getMonthList, isArray, isBoolean, isDate, isFunction, isImage, isMobile, isObject, isPrimitive, isPromise, isString, modelize, playAudio, programName, registerComponents };
 //# sourceMappingURL=bizdoc-core.mjs.map