@bizdoc/core 2.3.35 → 2.3.36

package/fesm2022/bizdoc-core.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Inject, Component, Pipe, Directive, Injector, TemplateRef, ViewContainerRef, ViewChild, Input, Optional, Self, Output, HostBinding, EventEmitter, ElementRef, HostListener, NgModule, ViewChildren, Host, SkipSelf, ViewEncapsulation, APP_INITIALIZER, ContentChild, ContentChildren } from '@angular/core';
+import { InjectionToken, Injectable, Inject, Component, Pipe, Directive, Injector, TemplateRef, ViewContainerRef, ViewChild, Input, Optional, Self, Output, HostBinding, EventEmitter, ElementRef, HostListener, NgModule, ViewChildren, Host, SkipSelf, ViewEncapsulation, ContentChild, ContentChildren, APP_INITIALIZER } from '@angular/core';
 import { Subject, forkJoin, Observable, firstValueFrom, of, fromEvent, BehaviorSubject, merge, takeUntil as takeUntil$1, shareReplay as shareReplay$1, map as map$1, takeWhile, interval, filter as filter$1, from, switchMap as switchMap$1, isObservable, catchError as catchError$1, startWith as startWith$1, EMPTY, debounceTime as debounceTime$1 } from 'rxjs';
 import { shareReplay, map, tap, filter, takeUntil, debounceTime, switchMap, startWith, catchError, first, take, finalize } from 'rxjs/operators';
 import * as i4 from '@angular/material/chips';
@@ -141,7 +141,7 @@ import * as i3$4 from '@syncfusion/ej2-angular-inputs';
 import { SignatureModule } from '@syncfusion/ej2-angular-inputs';
 import { LinearGaugeModule, AnnotationsService, GaugeTooltipService } from '@syncfusion/ej2-angular-lineargauge';
 import * as i11$2 from '@syncfusion/ej2-angular-charts';
-import { ChartModule, AccumulationChartModule, SparklineModule, RangeNavigatorModule, RangeTooltipService, AccumulationDistributionIndicatorService, FunnelSeriesService, StackingStepAreaSeriesService, PieSeriesService, PyramidSeriesService, LineSeriesService, ScatterSeriesService, ColumnSeriesService, SplineSeriesService, SplineAreaSeriesService, StripLineService, AreaSeriesService, ScrollBarService, StepLineSeriesService, StepAreaSeriesService, StackingColumnSeriesService, StackingLineSeriesService, StackingAreaSeriesService, BarSeriesService, StackingBarSeriesService, RangeColumnSeriesService, BubbleSeriesService, TooltipService, CrosshairService, CategoryService, DateTimeService, LogarithmicService, LegendService, ZoomService, DataLabelService, SelectionService, ChartAnnotationService, WaterfallSeriesService, RangeAreaSeriesService, PolarSeriesService, RadarSeriesService, DateTimeCategoryService, MultiLevelLabelService, ParetoSeriesService, TooltipRenderService, SparklineTooltipService, SplineRangeAreaSeriesService, AccumulationAnnotationService, AccumulationDataLabelService, AccumulationLegendService, AccumulationSelectionService, AccumulationTooltipService, AreaSeries, LineSeries, DateTime, RangeTooltip, RangeNavigator, SparklineTooltip, Sparkline, PieSeries, PyramidSeries, FunnelSeries, AccumulationDataLabel, AccumulationTooltip, AccumulationAnnotation, AccumulationLegend, AccumulationSelection, AccumulationChart as AccumulationChart$1, Category, Tooltip as Tooltip$1, Legend, Selection, Zoom, Crosshair, DataLabel, BarSeries, BubbleSeries, ColumnSeries, PolarSeries, RadarSeries, SplineSeries, SplineAreaSeries, ScatterSeries, StackingStepAreaSeries, StackingLineSeries, StackingAreaSeries, StackingColumnSeries, StackingBarSeries, StepAreaSeries, StepLineSeries, Chart as Chart$1, ChartComponent } from '@syncfusion/ej2-angular-charts';
+import { ChartModule, AccumulationChartModule, SparklineModule, RangeNavigatorModule, RangeTooltipService, AccumulationDistributionIndicatorService, FunnelSeriesService, StackingStepAreaSeriesService, PieSeriesService, PyramidSeriesService, LineSeriesService, ScatterSeriesService, ColumnSeriesService, SplineSeriesService, SplineAreaSeriesService, StripLineService, AreaSeriesService, ScrollBarService, StepLineSeriesService, StepAreaSeriesService, StackingColumnSeriesService, StackingLineSeriesService, StackingAreaSeriesService, BarSeriesService, StackingBarSeriesService, RangeColumnSeriesService, BubbleSeriesService, TooltipService, CrosshairService, CategoryService, DateTimeService, LogarithmicService, LegendService, ZoomService, DataLabelService, SelectionService, ChartAnnotationService, WaterfallSeriesService, RangeAreaSeriesService, PolarSeriesService, RadarSeriesService, DateTimeCategoryService, MultiLevelLabelService, ParetoSeriesService, TooltipRenderService, SparklineTooltipService, SplineRangeAreaSeriesService, AccumulationAnnotationService, AccumulationDataLabelService, AccumulationLegendService, AccumulationSelectionService, AccumulationTooltipService, AreaSeries, LineSeries, DateTime, RangeTooltip, RangeNavigator, SparklineTooltip, Sparkline, PieSeries, PyramidSeries, FunnelSeries, AccumulationDataLabel, AccumulationTooltip, AccumulationAnnotation, AccumulationLegend, AccumulationSelection, AccumulationChart as AccumulationChart$1, Category, Tooltip as Tooltip$1, Legend, Selection, Zoom, Crosshair, DataLabel, BarSeries, BubbleSeries, ColumnSeries, PolarSeries, RadarSeries, SplineSeries, SplineAreaSeries, ScatterSeries, StackingStepAreaSeries, StackingLineSeries, StackingAreaSeries, StackingColumnSeries, StackingBarSeries, StepAreaSeries, StepLineSeries, ChartAnnotation, Chart as Chart$1, ChartComponent } from '@syncfusion/ej2-angular-charts';
 import * as i8$3 from '@syncfusion/ej2-angular-grids';
 import { GridModule, PagerModule, ExcelExportService, AggregateService, FreezeService, GroupService, PageService, ResizeService, SortService, SelectionService as SelectionService$1, ExcelExport, Sort, Group, Page, Freeze, Selection as Selection$1, Aggregate, Grid as Grid$1, GridComponent } from '@syncfusion/ej2-angular-grids';
 import { Annotations, GaugeTooltip, Legend as Legend$1, CircularGauge, CircularGaugeModule, AnnotationsService as AnnotationsService$1, GaugeTooltipService as GaugeTooltipService$1, LegendService as LegendService$1 } from '@syncfusion/ej2-angular-circulargauge';
@@ -794,7 +794,10 @@ const SwapAnimation = [
     transition(':decrement', [style({ transform: 'translateX(-100px)' }), animate('200ms', style({ transform: 'translateX(0)' }))])
 ];
 const VerticalSwapAnimation = [
-    transition(':increment', [style({ transform: 'translateY(50px)' }), animate('200ms', style({ transform: 'translateY(0)' }))]),
+    transition(':increment', [style({
+            transform: 'translateY(50px)',
+            overflow: 'hidden'
+        }), animate('200ms', style({ transform: 'translateY(0)' }))]),
     transition(':decrement', [style({ transform: 'translateY(-50px)' }), animate('200ms', style({ transform: 'translateY(0)' }))])
 ];
 const matrixAnimation = trigger('table', [transition('void=>*', [
@@ -1274,7 +1277,7 @@ const STRINGS = {
         DeleteFileAsk: 'Are you sure you want to delete this attachment?',
         DeleteCommentAsk: 'Are you sure you want to delete this comment?',
         GrantAccess: 'Grant Access',
-        GrantTip: 'User(s) may view and take actions on your behalf.',
+        GrantTip: 'May view and take actions on your behalf.',
         OutOfOfficeTip: 'Redirect mail to another user on your absence.',
         Timeline: 'Timeline',
         Theme: 'Theme',
@@ -1436,7 +1439,9 @@ const STRINGS = {
         Duration: 'Duration',
         DurationTime: 'In {0} duration',
         Standard: 'Standard',
+        StandardValue: 'Standard: {0}',
         Average: 'Average',
+        AverageValue: 'Average: {0}',
         Open: 'Open',
         SoundOn: 'Sound on',
         SoundOff: 'Sound off',
@@ -1911,6 +1916,8 @@ const STRINGS = {
         Duration: 'משך',
         DurationTime: 'משך {0}',
         Standard: 'תקן',
+        StandardValue: 'תקן: {0}',
+        AverageValue: 'ממוצע: {0}',
         Average: 'ממוצע',
         Awaiting: 'ממתין ל{0}',
         Escalated: 'הועבר',
@@ -3134,11 +3141,11 @@ class OptionsComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: OptionsComponent, deps: [{ token: OPTION_PANEL, optional: true }, { token: i1$1.OverlayRef, optional: true }, { token: i1$2.FormBuilder }, { token: AccountService }, { token: PromptService }, { token: SessionService }, { token: BIZDOC_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: OptionsComponent, selector: "bizdoc-options", inputs: { sectionName: ["section", "sectionName"] }, viewQueries: [{ 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: "<!--<bizdov-v-tabs [initialName]=\"sectionName\">\n  <tab name=\"notifications\" title=\"Notifications\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <br />\n        <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n        <div class=\"row\">\n          <span class=\"divider\"></span>\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>\n        </div>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"emails\" title=\"Emails\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.emails\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <br />\n        <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"out_of_office\" title=\"OutOfOffice\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <br />\n        <mat-form-field class=\"flex\">\n          <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n                 [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n          <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                            (optionSelected)=\"oooSelected($event)\">\n            @for (u of susers$ | async; track u) {\n            <mat-option [value]=\"u\">\n              <span>{{u.name}}</span>\n            </mat-option>\n            }\n          </mat-autocomplete>\n          <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n        </mat-form-field>\n        <mat-form-field>\n          <mat-label>{{'Dates'|translate}}</mat-label>\n          <mat-date-range-input [rangePicker]=\"dates\">\n            <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n            <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n          </mat-date-range-input>\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n        </mat-form-field>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"grant_access\" title=\"GrantAccess\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <mat-form-field>\n          <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n            @for (u of form.value.grantAccess.users || []; track u) {\n            <mat-chip-row (removed)=\"removeGrant(u)\">\n              {{u | userName | async}}\n              <mat-icon matChipRemove>cancel</mat-icon>\n            </mat-chip-row>\n            }\n          </mat-chip-grid>\n          <input [formControl]=\"grantUsers\" placeholder=\"{{'Users'| translate}}\"\n                 #grantInput\n                 [matAutocomplete]=\"grantAuto\"\n                 [matChipInputFor]=\"grantList\"\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n          <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n            @for (u of gusers$ | async; track u) {\n            <mat-option [value]=\"u.id\">\n              {{u.name}}\n              @if (u.email) {\n              <span>&nbsp; - {{u.email}}</span>\n              }\n            </mat-option>\n            }\n          </mat-autocomplete>\n          <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n        </mat-form-field>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"preferences\" title=\"Preferences\">\n    <ng-template>\n      <div class=\"column\">\n        <mat-form-field>\n          <mat-chip-grid #chips>\n            @for (item of form.value.tags; track item) {\n            <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n              {{item}}\n              <mat-icon matChipRemove>cancel</mat-icon>\n            </mat-chip-row>\n            }\n          </mat-chip-grid>\n          <input [placeholder]=\"'Tags'|translate\"\n                 [matChipInputFor]=\"chips\"\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n                 [matChipInputAddOnBlur]=\"true\"\n                 (matChipInputTokenEnd)=\"addTag($event)\">\n        </mat-form-field>\n      </div>\n    </ng-template>\n  </tab>\n</bizdov-v-tabs>-->\n<div class=\"row\">\n  <mat-nav-list class=\"nav-list\">\n    <mat-list-item (click)=\"nav('notifications', notificationsTmpl, 0)\" [class.active]=\"sectionName === 'notifications'\">\n      <span matListItemTitle>{{'Notifications' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('emails', emailsTmpl, 1)\" [class.active]=\"sectionName === 'emails'\">\n      <span matListItemTitle>{{'Emails' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('out_of_office', oooTmpl, 2)\" [class.active]=\"sectionName === 'out_of_office'\">\n      <span matListItemTitle>{{'OutOfOffice' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('grant_access', grantAccessTmpl, 3)\" [class.active]=\"sectionName === 'grant_access'\">\n      <span matListItemTitle>{{'GrantAccess' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('preferences', preferencesTmpl, 4)\" [class.active]=\"sectionName === 'preferences'\">\n      <span matListItemTitle>{{'Preferences' | translate}}</span>\n    </mat-list-item>\n  </mat-nav-list>\n  <div class=\"separator\"></div>\n  <form autocomplete=\"off\" [@v-swape]=\"sectionIndex\">\n    <ng-container *ngTemplateOutlet=\"sectionTmpl\"></ng-container>\n  </form>\n</div>\n<!--preferences-->\n<ng-template #preferencesTmpl>\n  <div class=\"column\">\n    <mat-form-field>\n      <mat-chip-grid #chips>\n        @for (item of form.value.tags; track item) {\n        <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n          {{item}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [placeholder]=\"'Tags'|translate\"\n             [matChipInputFor]=\"chips\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n             [matChipInputAddOnBlur]=\"true\"\n             (matChipInputTokenEnd)=\"addTag($event)\">\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--notifications-->\n<ng-template #notificationsTmpl>\n  <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n    <div class=\"row\">\n      <span class=\"divider\"></span>\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>\n    </div>\n  </div>\n</ng-template>\n<!--emails-->\n<ng-template #emailsTmpl>\n  <div [formGroup]=\"form.controls.emails\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n  </div>\n</ng-template>\n<!--ooo-->\n<ng-template #oooTmpl>\n  <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-form-field class=\"flex\">\n      <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n             [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n      <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                        (optionSelected)=\"oooSelected($event)\">\n        @for (u of susers$ | async; track u) {\n        <mat-option [value]=\"u\">\n          <span>{{u.name}}</span>\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n    </mat-form-field>\n    <mat-form-field>\n      <mat-label>{{'Dates'|translate}}</mat-label>\n      <mat-date-range-input [rangePicker]=\"dates\">\n        <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n        <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n      </mat-date-range-input>\n      <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n      <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--grantAccess-->\n<ng-template #grantAccessTmpl>\n  <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <mat-form-field>\n      <mat-label>{{'Associates'| translate}}</mat-label>\n      <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n        @for (u of form.value.grantAccess.users || []; track u) {\n        <mat-chip-row (removed)=\"removeGrant(u)\">\n          {{u | userName | async}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [formControl]=\"grantUserIds\"\n             #grantInput\n             [matAutocomplete]=\"grantAuto\"\n             [matChipInputFor]=\"grantList\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n      <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n        @for (u of gusers$ | async; track u.id) {\n        <mat-option [value]=\"u.id\">\n          {{u.name}}\n          @if (u.email) {\n          <span>&nbsp; - {{u.email}}</span>\n          }\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n    </mat-form-field>\n  </div>\n</ng-template>\n", styles: [":host{max-width:80vw;min-width:420px}.separator{height:280px;width:1px;background-color:#0003}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: "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"], 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$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i2$3.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$3.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$3.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$3.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i2$4.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$4.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$4.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "component", type: i4$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3$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"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i10.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: i9.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }], animations: [verticalSwapAnimation] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: OptionsComponent, selector: "bizdoc-options", inputs: { sectionName: ["section", "sectionName"] }, viewQueries: [{ 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: "<!--<bizdoc-v-tabs [initialName]=\"sectionName\">\n  <tab name=\"notifications\" title=\"Notifications\">\n    <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <br />\n      <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n      <div class=\"row\">\n        <span class=\"divider\"></span>\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>\n      </div>\n    </div>\n  </tab>\n  <tab name=\"emails\" title=\"Emails\">\n    <div [formGroup]=\"form.controls.emails\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <br />\n      <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n    </div>\n  </tab>\n  <tab name=\"out_of_office\" title=\"OutOfOffice\">\n    <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <br />\n      <mat-form-field class=\"flex\">\n        <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n               [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n        <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                          (optionSelected)=\"oooSelected($event)\">\n          @for (u of susers$ | async; track u.id) {\n          <mat-option [value]=\"u\">\n            <span>{{u.name}}</span>\n          </mat-option>\n          }\n        </mat-autocomplete>\n        <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n      </mat-form-field>\n      <mat-form-field>\n        <mat-label>{{'Dates'|translate}}</mat-label>\n        <mat-date-range-input [rangePicker]=\"dates\">\n          <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n          <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n        </mat-date-range-input>\n        <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n        <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n      </mat-form-field>\n    </div>\n  </tab>\n  <tab name=\"grant_access\" title=\"GrantAccess\">\n    <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <mat-form-field>\n        <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n          @for (u of form.value.grantAccess.users || []; track u.id) {\n          <mat-chip-row (removed)=\"removeGrant(u)\">\n            {{u | userName | async}}\n            <mat-icon matChipRemove>cancel</mat-icon>\n          </mat-chip-row>\n          }\n        </mat-chip-grid>\n        <input [formControl]=\"grantUserIds\" placeholder=\"{{'Users'| translate}}\"\n               #grantInput\n               [matAutocomplete]=\"grantAuto\"\n               [matChipInputFor]=\"grantList\"\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n        <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n          @for (u of gusers$ | async; track u.id) {\n          <mat-option [value]=\"u.id\">\n            {{u.name}}\n            @if (u.email) {\n            <span>&nbsp; - {{u.email}}</span>\n            }\n          </mat-option>\n          }\n        </mat-autocomplete>\n        <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n      </mat-form-field>\n    </div>\n  </tab>\n  <tab name=\"preferences\" title=\"Preferences\">\n    <div class=\"column\">\n      <mat-form-field>\n        <mat-chip-grid #chips>\n          @for (item of form.value.tags; track item) {\n          <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n            {{item}}\n            <mat-icon matChipRemove>cancel</mat-icon>\n          </mat-chip-row>\n          }\n        </mat-chip-grid>\n        <input [placeholder]=\"'Tags'|translate\"\n               [matChipInputFor]=\"chips\"\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n               [matChipInputAddOnBlur]=\"true\"\n               (matChipInputTokenEnd)=\"addTag($event)\">\n      </mat-form-field>\n    </div>\n  </tab>\n</bizdoc-v-tabs>-->\n<div class=\"row\">\n  <mat-nav-list class=\"nav-list\">\n    <mat-list-item (click)=\"nav('notifications', notificationsTmpl, 0)\" [class.active]=\"sectionName === 'notifications'\">\n      <span matListItemTitle>{{'Notifications' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('emails', emailsTmpl, 1)\" [class.active]=\"sectionName === 'emails'\">\n      <span matListItemTitle>{{'Emails' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('out_of_office', oooTmpl, 2)\" [class.active]=\"sectionName === 'out_of_office'\">\n      <span matListItemTitle>{{'OutOfOffice' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('grant_access', grantAccessTmpl, 3)\" [class.active]=\"sectionName === 'grant_access'\">\n      <span matListItemTitle>{{'GrantAccess' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('preferences', preferencesTmpl, 4)\" [class.active]=\"sectionName === 'preferences'\">\n      <span matListItemTitle>{{'Preferences' | translate}}</span>\n    </mat-list-item>\n  </mat-nav-list>\n  <div class=\"separator\"></div>\n  <form autocomplete=\"off\" [@v-swape]=\"sectionIndex\">\n    <ng-container *ngTemplateOutlet=\"sectionTmpl\"></ng-container>\n  </form>\n</div>\n<!--preferences-->\n<ng-template #preferencesTmpl>\n  <div class=\"column\">\n    <mat-form-field>\n      <mat-label>{{'Tags'|translate}}</mat-label>\n      <mat-chip-grid #chips>\n        @for (item of form.value.tags; track item) {\n        <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n          {{item}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [matChipInputFor]=\"chips\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n             [matChipInputAddOnBlur]=\"true\"\n             (matChipInputTokenEnd)=\"addTag($event)\">\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--notifications-->\n<ng-template #notificationsTmpl>\n  <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n    <div class=\"row\">\n      <span class=\"divider\"></span>\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>\n    </div>\n  </div>\n</ng-template>\n<!--emails-->\n<ng-template #emailsTmpl>\n  <div [formGroup]=\"form.controls.emails\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n  </div>\n</ng-template>\n<!--ooo-->\n<ng-template #oooTmpl>\n  <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-form-field class=\"flex\">\n      <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n             [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n      <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                        (optionSelected)=\"oooSelected($event)\">\n        @for (u of susers$ | async; track u.id) {\n        <mat-option [value]=\"u\">\n          <span>{{u.name}}</span>\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n    </mat-form-field>\n    <mat-form-field>\n      <mat-label>{{'Dates'|translate}}</mat-label>\n      <mat-date-range-input [rangePicker]=\"dates\">\n        <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n        <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n      </mat-date-range-input>\n      <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n      <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--grantAccess-->\n<ng-template #grantAccessTmpl>\n  <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-form-field>\n      <mat-label>{{'Associates'| translate}}</mat-label>\n      <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n        @for (u of form.value.grantAccess.users || []; track u.id) {\n        <mat-chip-row (removed)=\"removeGrant(u)\">\n          {{u | userName | async}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [formControl]=\"grantUserIds\"\n             #grantInput\n             [matAutocomplete]=\"grantAuto\"\n             [matChipInputFor]=\"grantList\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n      <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n        @for (u of gusers$ | async; track u.id) {\n        <mat-option [value]=\"u.id\">\n          {{u.name}}\n          @if (u.email) {\n          <span>&nbsp; - {{u.email}}</span>\n          }\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n    </mat-form-field>\n  </div>\n</ng-template>\n", styles: [":host{max-width:80vw;min-width:420px}.separator{height:280px;width:1px;background-color:#0003}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: "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"], 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$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i2$3.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$3.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$3.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$3.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i2$4.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$4.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$4.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "component", type: i4$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3$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"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i10.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: i9.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }], animations: [verticalSwapAnimation] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: OptionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-options', animations: [verticalSwapAnimation], template: "<!--<bizdov-v-tabs [initialName]=\"sectionName\">\n  <tab name=\"notifications\" title=\"Notifications\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <br />\n        <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n        <div class=\"row\">\n          <span class=\"divider\"></span>\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>\n        </div>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"emails\" title=\"Emails\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.emails\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <br />\n        <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n        <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"out_of_office\" title=\"OutOfOffice\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <br />\n        <mat-form-field class=\"flex\">\n          <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n                 [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n          <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                            (optionSelected)=\"oooSelected($event)\">\n            @for (u of susers$ | async; track u) {\n            <mat-option [value]=\"u\">\n              <span>{{u.name}}</span>\n            </mat-option>\n            }\n          </mat-autocomplete>\n          <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n        </mat-form-field>\n        <mat-form-field>\n          <mat-label>{{'Dates'|translate}}</mat-label>\n          <mat-date-range-input [rangePicker]=\"dates\">\n            <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n            <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n          </mat-date-range-input>\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n        </mat-form-field>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"grant_access\" title=\"GrantAccess\">\n    <ng-template>\n      <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n        <mat-form-field>\n          <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n            @for (u of form.value.grantAccess.users || []; track u) {\n            <mat-chip-row (removed)=\"removeGrant(u)\">\n              {{u | userName | async}}\n              <mat-icon matChipRemove>cancel</mat-icon>\n            </mat-chip-row>\n            }\n          </mat-chip-grid>\n          <input [formControl]=\"grantUsers\" placeholder=\"{{'Users'| translate}}\"\n                 #grantInput\n                 [matAutocomplete]=\"grantAuto\"\n                 [matChipInputFor]=\"grantList\"\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n          <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n            @for (u of gusers$ | async; track u) {\n            <mat-option [value]=\"u.id\">\n              {{u.name}}\n              @if (u.email) {\n              <span>&nbsp; - {{u.email}}</span>\n              }\n            </mat-option>\n            }\n          </mat-autocomplete>\n          <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n        </mat-form-field>\n      </div>\n    </ng-template>\n  </tab>\n  <tab name=\"preferences\" title=\"Preferences\">\n    <ng-template>\n      <div class=\"column\">\n        <mat-form-field>\n          <mat-chip-grid #chips>\n            @for (item of form.value.tags; track item) {\n            <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n              {{item}}\n              <mat-icon matChipRemove>cancel</mat-icon>\n            </mat-chip-row>\n            }\n          </mat-chip-grid>\n          <input [placeholder]=\"'Tags'|translate\"\n                 [matChipInputFor]=\"chips\"\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n                 [matChipInputAddOnBlur]=\"true\"\n                 (matChipInputTokenEnd)=\"addTag($event)\">\n        </mat-form-field>\n      </div>\n    </ng-template>\n  </tab>\n</bizdov-v-tabs>-->\n<div class=\"row\">\n  <mat-nav-list class=\"nav-list\">\n    <mat-list-item (click)=\"nav('notifications', notificationsTmpl, 0)\" [class.active]=\"sectionName === 'notifications'\">\n      <span matListItemTitle>{{'Notifications' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('emails', emailsTmpl, 1)\" [class.active]=\"sectionName === 'emails'\">\n      <span matListItemTitle>{{'Emails' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('out_of_office', oooTmpl, 2)\" [class.active]=\"sectionName === 'out_of_office'\">\n      <span matListItemTitle>{{'OutOfOffice' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('grant_access', grantAccessTmpl, 3)\" [class.active]=\"sectionName === 'grant_access'\">\n      <span matListItemTitle>{{'GrantAccess' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('preferences', preferencesTmpl, 4)\" [class.active]=\"sectionName === 'preferences'\">\n      <span matListItemTitle>{{'Preferences' | translate}}</span>\n    </mat-list-item>\n  </mat-nav-list>\n  <div class=\"separator\"></div>\n  <form autocomplete=\"off\" [@v-swape]=\"sectionIndex\">\n    <ng-container *ngTemplateOutlet=\"sectionTmpl\"></ng-container>\n  </form>\n</div>\n<!--preferences-->\n<ng-template #preferencesTmpl>\n  <div class=\"column\">\n    <mat-form-field>\n      <mat-chip-grid #chips>\n        @for (item of form.value.tags; track item) {\n        <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n          {{item}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [placeholder]=\"'Tags'|translate\"\n             [matChipInputFor]=\"chips\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n             [matChipInputAddOnBlur]=\"true\"\n             (matChipInputTokenEnd)=\"addTag($event)\">\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--notifications-->\n<ng-template #notificationsTmpl>\n  <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n    <div class=\"row\">\n      <span class=\"divider\"></span>\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>\n    </div>\n  </div>\n</ng-template>\n<!--emails-->\n<ng-template #emailsTmpl>\n  <div [formGroup]=\"form.controls.emails\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n  </div>\n</ng-template>\n<!--ooo-->\n<ng-template #oooTmpl>\n  <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-form-field class=\"flex\">\n      <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n             [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n      <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                        (optionSelected)=\"oooSelected($event)\">\n        @for (u of susers$ | async; track u) {\n        <mat-option [value]=\"u\">\n          <span>{{u.name}}</span>\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n    </mat-form-field>\n    <mat-form-field>\n      <mat-label>{{'Dates'|translate}}</mat-label>\n      <mat-date-range-input [rangePicker]=\"dates\">\n        <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n        <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n      </mat-date-range-input>\n      <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n      <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--grantAccess-->\n<ng-template #grantAccessTmpl>\n  <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <mat-form-field>\n      <mat-label>{{'Associates'| translate}}</mat-label>\n      <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n        @for (u of form.value.grantAccess.users || []; track u) {\n        <mat-chip-row (removed)=\"removeGrant(u)\">\n          {{u | userName | async}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [formControl]=\"grantUserIds\"\n             #grantInput\n             [matAutocomplete]=\"grantAuto\"\n             [matChipInputFor]=\"grantList\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n      <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n        @for (u of gusers$ | async; track u.id) {\n        <mat-option [value]=\"u.id\">\n          {{u.name}}\n          @if (u.email) {\n          <span>&nbsp; - {{u.email}}</span>\n          }\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n    </mat-form-field>\n  </div>\n</ng-template>\n", styles: [":host{max-width:80vw;min-width:420px}.separator{height:280px;width:1px;background-color:#0003}form{padding:20px 8px 0;min-width:320px}\n"] }]
+            args: [{ selector: 'bizdoc-options', animations: [verticalSwapAnimation], template: "<!--<bizdoc-v-tabs [initialName]=\"sectionName\">\n  <tab name=\"notifications\" title=\"Notifications\">\n    <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <br />\n      <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n      <div class=\"row\">\n        <span class=\"divider\"></span>\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>\n      </div>\n    </div>\n  </tab>\n  <tab name=\"emails\" title=\"Emails\">\n    <div [formGroup]=\"form.controls.emails\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <br />\n      <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n      <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n    </div>\n  </tab>\n  <tab name=\"out_of_office\" title=\"OutOfOffice\">\n    <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <br />\n      <mat-form-field class=\"flex\">\n        <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n               [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n        <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                          (optionSelected)=\"oooSelected($event)\">\n          @for (u of susers$ | async; track u.id) {\n          <mat-option [value]=\"u\">\n            <span>{{u.name}}</span>\n          </mat-option>\n          }\n        </mat-autocomplete>\n        <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n      </mat-form-field>\n      <mat-form-field>\n        <mat-label>{{'Dates'|translate}}</mat-label>\n        <mat-date-range-input [rangePicker]=\"dates\">\n          <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n          <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n        </mat-date-range-input>\n        <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n        <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n      </mat-form-field>\n    </div>\n  </tab>\n  <tab name=\"grant_access\" title=\"GrantAccess\">\n    <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n      <mat-form-field>\n        <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n          @for (u of form.value.grantAccess.users || []; track u.id) {\n          <mat-chip-row (removed)=\"removeGrant(u)\">\n            {{u | userName | async}}\n            <mat-icon matChipRemove>cancel</mat-icon>\n          </mat-chip-row>\n          }\n        </mat-chip-grid>\n        <input [formControl]=\"grantUserIds\" placeholder=\"{{'Users'| translate}}\"\n               #grantInput\n               [matAutocomplete]=\"grantAuto\"\n               [matChipInputFor]=\"grantList\"\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n        <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n          @for (u of gusers$ | async; track u.id) {\n          <mat-option [value]=\"u.id\">\n            {{u.name}}\n            @if (u.email) {\n            <span>&nbsp; - {{u.email}}</span>\n            }\n          </mat-option>\n          }\n        </mat-autocomplete>\n        <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n      </mat-form-field>\n    </div>\n  </tab>\n  <tab name=\"preferences\" title=\"Preferences\">\n    <div class=\"column\">\n      <mat-form-field>\n        <mat-chip-grid #chips>\n          @for (item of form.value.tags; track item) {\n          <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n            {{item}}\n            <mat-icon matChipRemove>cancel</mat-icon>\n          </mat-chip-row>\n          }\n        </mat-chip-grid>\n        <input [placeholder]=\"'Tags'|translate\"\n               [matChipInputFor]=\"chips\"\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n               [matChipInputAddOnBlur]=\"true\"\n               (matChipInputTokenEnd)=\"addTag($event)\">\n      </mat-form-field>\n    </div>\n  </tab>\n</bizdoc-v-tabs>-->\n<div class=\"row\">\n  <mat-nav-list class=\"nav-list\">\n    <mat-list-item (click)=\"nav('notifications', notificationsTmpl, 0)\" [class.active]=\"sectionName === 'notifications'\">\n      <span matListItemTitle>{{'Notifications' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('emails', emailsTmpl, 1)\" [class.active]=\"sectionName === 'emails'\">\n      <span matListItemTitle>{{'Emails' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('out_of_office', oooTmpl, 2)\" [class.active]=\"sectionName === 'out_of_office'\">\n      <span matListItemTitle>{{'OutOfOffice' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('grant_access', grantAccessTmpl, 3)\" [class.active]=\"sectionName === 'grant_access'\">\n      <span matListItemTitle>{{'GrantAccess' | translate}}</span>\n    </mat-list-item>\n    <mat-list-item (click)=\"nav('preferences', preferencesTmpl, 4)\" [class.active]=\"sectionName === 'preferences'\">\n      <span matListItemTitle>{{'Preferences' | translate}}</span>\n    </mat-list-item>\n  </mat-nav-list>\n  <div class=\"separator\"></div>\n  <form autocomplete=\"off\" [@v-swape]=\"sectionIndex\">\n    <ng-container *ngTemplateOutlet=\"sectionTmpl\"></ng-container>\n  </form>\n</div>\n<!--preferences-->\n<ng-template #preferencesTmpl>\n  <div class=\"column\">\n    <mat-form-field>\n      <mat-label>{{'Tags'|translate}}</mat-label>\n      <mat-chip-grid #chips>\n        @for (item of form.value.tags; track item) {\n        <mat-chip-row [removable]=\"true\" (removed)=\"removeTag(item)\">\n          {{item}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [matChipInputFor]=\"chips\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n             [matChipInputAddOnBlur]=\"true\"\n             (matChipInputTokenEnd)=\"addTag($event)\">\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--notifications-->\n<ng-template #notificationsTmpl>\n  <div [formGroup]=\"form.controls.notifications\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\n    <div class=\"row\">\n      <span class=\"divider\"></span>\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>\n    </div>\n  </div>\n</ng-template>\n<!--emails-->\n<ng-template #emailsTmpl>\n  <div [formGroup]=\"form.controls.emails\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\n    <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\n  </div>\n</ng-template>\n<!--ooo-->\n<ng-template #oooTmpl>\n  <div [formGroup]=\"form.controls.outOfOffice\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-form-field class=\"flex\">\n      <input matInput [formControl]=\"oooId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\n             [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\n      <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\n                        (optionSelected)=\"oooSelected($event)\">\n        @for (u of susers$ | async; track u.id) {\n        <mat-option [value]=\"u\">\n          <span>{{u.name}}</span>\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\n    </mat-form-field>\n    <mat-form-field>\n      <mat-label>{{'Dates'|translate}}</mat-label>\n      <mat-date-range-input [rangePicker]=\"dates\">\n        <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\n        <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\n      </mat-date-range-input>\n      <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\n      <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\n    </mat-form-field>\n  </div>\n</ng-template>\n<!--grantAccess-->\n<ng-template #grantAccessTmpl>\n  <div [formGroup]=\"form.controls.grantAccess\" class=\"column\">\n    <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\n    <br />\n    <mat-form-field>\n      <mat-label>{{'Associates'| translate}}</mat-label>\n      <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\n        @for (u of form.value.grantAccess.users || []; track u.id) {\n        <mat-chip-row (removed)=\"removeGrant(u)\">\n          {{u | userName | async}}\n          <mat-icon matChipRemove>cancel</mat-icon>\n        </mat-chip-row>\n        }\n      </mat-chip-grid>\n      <input [formControl]=\"grantUserIds\"\n             #grantInput\n             [matAutocomplete]=\"grantAuto\"\n             [matChipInputFor]=\"grantList\"\n             [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n      <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\n        @for (u of gusers$ | async; track u.id) {\n        <mat-option [value]=\"u.id\">\n          {{u.name}}\n          @if (u.email) {\n          <span>&nbsp; - {{u.email}}</span>\n          }\n        </mat-option>\n        }\n      </mat-autocomplete>\n      <mat-hint>{{'GrantTip' | translate}}</mat-hint>\n    </mat-form-field>\n  </div>\n</ng-template>\n", styles: [":host{max-width:80vw;min-width:420px}.separator{height:280px;width:1px;background-color:#0003}form{padding:20px 8px 0;min-width:320px}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [OPTION_PANEL]
@@ -7598,11 +7605,11 @@ class CubeFilterComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: CubeFilterComponent, deps: [{ token: CubeService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$2.FormBuilder }, { token: SessionService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: CubeFilterComponent, selector: "bizdoc-cube-filter", inputs: { cube: "cube", exclude: "exclude", include: "include", axes: "axes" }, outputs: { axesChange: "axesChange" }, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"column\">\n  @for (a of visibleAxes; track a) {\n    <mat-form-field [attr.data-help]=\"'axis-'+a.name\">\n      @switch (a.selectionMode) {\n        @case ('Pattern') {\n          <input matInput autocomplete=\"off\"\n            [pattern]=\"pattern\" autofocus\n            [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" />\n            @if (form.controls[a.name].invalid) {\n              <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n            }\n          }\n          @case ('Search') {\n            <input matInput autocomplete=\"off\" type=\"search\"\n              [matAutocomplete]=\"segment\" #inp\n              [placeholder]=\"a.title||a.name\" />\n              <mat-autocomplete #segment [displayWith]=\"display\"\n                (optionSelected)=\"change(a.name, $event)\">\n                @for (r of sources[a.name] | async | filterBy : 'value' : inp.value | slice:0:50; track r) {\n                  <mat-option [value]=\"r\">{{r.value}}</mat-option>\n                }\n              </mat-autocomplete>\n              @if (inp.value) {\n                <button mat-icon-button matSuffix aria-label=\"\" (click)=\"inp.value = ''; form.controls[a.name].setValue(null)\"><mat-icon>close</mat-icon></button>\n              }\n              @if (form.controls[a.name].invalid) {\n                <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n              }\n            }\n            @default {\n              <mat-select [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" [multiple]=\"a.selectionMode === 'Multiple'\">\n                @if (a.selectionMode !== 'Multiple') {\n                  <mat-option>{{'All' | translate}}</mat-option>\n                }\n                @for (r of sources[a.name] | async; track r) {\n                  <mat-option [value]=\"r.key\">{{r.value}}</mat-option>\n                }\n              </mat-select>\n            }\n          }\n        </mat-form-field>\n      }\n    </form>\n", styles: ["form{padding:8px}\n"], dependencies: [{ 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.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { 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: "component", type: i4$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.SlicePipe, name: "slice" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FilterPipe, name: "filterBy" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: CubeFilterComponent, selector: "bizdoc-cube-filter", inputs: { cube: "cube", exclude: "exclude", include: "include", axes: "axes" }, outputs: { axesChange: "axesChange" }, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"column gap\">\n  @for (a of visibleAxes; track a) {\n  <mat-form-field [attr.data-help]=\"'axis-'+a.name\" subscriptSizing=\"dynamic\">\n    @switch (a.selectionMode) {\n    @case ('Pattern') {\n    <input matInput autocomplete=\"off\"\n           [pattern]=\"pattern\" autofocus\n           [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" />\n    @if (form.controls[a.name].invalid) {\n    <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n    }\n    }\n    @case ('Search') {\n    <input matInput autocomplete=\"off\" type=\"search\"\n           [matAutocomplete]=\"segment\" #inp\n           [placeholder]=\"a.title||a.name\" />\n    <mat-autocomplete #segment [displayWith]=\"display\"\n                      (optionSelected)=\"change(a.name, $event)\">\n      @for (r of sources[a.name] | async | filterBy : 'value' : inp.value | slice:0:50; track r) {\n      <mat-option [value]=\"r\">{{r.value}}</mat-option>\n      }\n    </mat-autocomplete>\n    @if (inp.value) {\n    <button mat-icon-button matSuffix aria-label=\"\" (click)=\"inp.value = ''; form.controls[a.name].setValue(null)\"><mat-icon>close</mat-icon></button>\n    }\n    @if (form.controls[a.name].invalid) {\n    <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n    }\n    }\n    @default {\n    <mat-select [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" [multiple]=\"a.selectionMode === 'Multiple'\">\n      @if (a.selectionMode !== 'Multiple') {\n      <mat-option>{{'All' | translate}}</mat-option>\n      }\n      @for (r of sources[a.name] | async; track r) {\n      <mat-option [value]=\"r.key\">{{r.value}}</mat-option>\n      }\n    </mat-select>\n    }\n    }\n  </mat-form-field>\n  }\n</form>\n", styles: ["form{padding:8px}\n"], dependencies: [{ 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.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { 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: "component", type: i4$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { 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"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.SlicePipe, name: "slice" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FilterPipe, name: "filterBy" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: CubeFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-cube-filter', template: "<form [formGroup]=\"form\" class=\"column\">\n  @for (a of visibleAxes; track a) {\n    <mat-form-field [attr.data-help]=\"'axis-'+a.name\">\n      @switch (a.selectionMode) {\n        @case ('Pattern') {\n          <input matInput autocomplete=\"off\"\n            [pattern]=\"pattern\" autofocus\n            [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" />\n            @if (form.controls[a.name].invalid) {\n              <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n            }\n          }\n          @case ('Search') {\n            <input matInput autocomplete=\"off\" type=\"search\"\n              [matAutocomplete]=\"segment\" #inp\n              [placeholder]=\"a.title||a.name\" />\n              <mat-autocomplete #segment [displayWith]=\"display\"\n                (optionSelected)=\"change(a.name, $event)\">\n                @for (r of sources[a.name] | async | filterBy : 'value' : inp.value | slice:0:50; track r) {\n                  <mat-option [value]=\"r\">{{r.value}}</mat-option>\n                }\n              </mat-autocomplete>\n              @if (inp.value) {\n                <button mat-icon-button matSuffix aria-label=\"\" (click)=\"inp.value = ''; form.controls[a.name].setValue(null)\"><mat-icon>close</mat-icon></button>\n              }\n              @if (form.controls[a.name].invalid) {\n                <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n              }\n            }\n            @default {\n              <mat-select [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" [multiple]=\"a.selectionMode === 'Multiple'\">\n                @if (a.selectionMode !== 'Multiple') {\n                  <mat-option>{{'All' | translate}}</mat-option>\n                }\n                @for (r of sources[a.name] | async; track r) {\n                  <mat-option [value]=\"r.key\">{{r.value}}</mat-option>\n                }\n              </mat-select>\n            }\n          }\n        </mat-form-field>\n      }\n    </form>\n", styles: ["form{padding:8px}\n"] }]
+            args: [{ selector: 'bizdoc-cube-filter', template: "<form [formGroup]=\"form\" class=\"column gap\">\n  @for (a of visibleAxes; track a) {\n  <mat-form-field [attr.data-help]=\"'axis-'+a.name\" subscriptSizing=\"dynamic\">\n    @switch (a.selectionMode) {\n    @case ('Pattern') {\n    <input matInput autocomplete=\"off\"\n           [pattern]=\"pattern\" autofocus\n           [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" />\n    @if (form.controls[a.name].invalid) {\n    <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n    }\n    }\n    @case ('Search') {\n    <input matInput autocomplete=\"off\" type=\"search\"\n           [matAutocomplete]=\"segment\" #inp\n           [placeholder]=\"a.title||a.name\" />\n    <mat-autocomplete #segment [displayWith]=\"display\"\n                      (optionSelected)=\"change(a.name, $event)\">\n      @for (r of sources[a.name] | async | filterBy : 'value' : inp.value | slice:0:50; track r) {\n      <mat-option [value]=\"r\">{{r.value}}</mat-option>\n      }\n    </mat-autocomplete>\n    @if (inp.value) {\n    <button mat-icon-button matSuffix aria-label=\"\" (click)=\"inp.value = ''; form.controls[a.name].setValue(null)\"><mat-icon>close</mat-icon></button>\n    }\n    @if (form.controls[a.name].invalid) {\n    <mat-error>{{'AxisPatternErr' |translate}}</mat-error>\n    }\n    }\n    @default {\n    <mat-select [formControlName]=\"a.name\" [placeholder]=\"a.title||a.name\" [multiple]=\"a.selectionMode === 'Multiple'\">\n      @if (a.selectionMode !== 'Multiple') {\n      <mat-option>{{'All' | translate}}</mat-option>\n      }\n      @for (r of sources[a.name] | async; track r) {\n      <mat-option [value]=\"r.key\">{{r.value}}</mat-option>\n      }\n    </mat-select>\n    }\n    }\n  </mat-form-field>\n  }\n</form>\n", styles: ["form{padding:8px}\n"] }]
         }], ctorParameters: () => [{ type: CubeService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$2.FormBuilder }, { type: SessionService }], propDecorators: { cube: [{
                 type: Input
             }], exclude: [{
@@ -8832,11 +8839,11 @@ class ExpandedItemComponent {
         this._typingTask && clearTimeout(this._typingTask);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: ExpandedItemComponent, deps: [{ token: PromptService }, { token: ChatInfo }, { token: AccountService }, { token: MailboxService }, { token: SessionService }, { token: i1$3.Directionality }, { token: i2$2.MatDialog }, { token: TranslateService }, { token: HubService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: ExpandedItemComponent, selector: "bizdoc-expanded-item", inputs: { model: "model" }, outputs: { sent: "sent" }, ngImport: i0, template: "@if (model.summary) {\n  <div class=\"summary\" [innerHTML]=\"model.summary\">\n  </div>\n}\n<div>\n  <bizdoc-attachments [model]=\"model\"></bizdoc-attachments>\n  <bizdoc-events [model]=\"model\"></bizdoc-events>\n</div>\n<div class=\"row\">\n  <span class=\"note\" [innerHTML]=\"note | sanitizeHtml\" (click)=\"chat($event)\"></span>\n  <span class=\"divider\"></span>\n  @for (a of actions; track a) {\n    @if (a.icon) {\n      <button mat-icon-button (click)=\"send(a.name)\" [bizdocTooltip]=\"a.title\" class=\"tool\">\n        <mat-icon>{{a.icon}}</mat-icon>\n      </button>\n    }\n  }\n</div>\n<div class=\"row\">\n  <div class=\"mat-small row\">\n    <span>{{model.stateId | state : 'past' }}</span>\n    &nbsp;\n    <span class=\"time\" [bizdocTooltip]=\"model.received | amCalendar\">{{model.received | amTimeAgo}}</span>\n    &nbsp;\n    <span [innerHTML]=\"sender | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>&nbsp;\n    <span [innerHTML]=\"awaiting | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>\n  </div>\n  <span class=\"divider\"></span>\n  <div class=\"center center\">\n    @if (typing) {\n      <span class=\"mat-small\">{{'SomeoneTyping'|translate}}</span>\n    }\n    @if (model.comments.length) {\n      <div class=\"mat-small\">\n        @if (!newComments) {\n          <span>{{model.comments.length > 1 ? ('CommentsCount' | translate : model.comments.length) : 'OneComment' | translate }}</span>\n        } @else {\n          <span [innerHTML]=\"'NewCommentsCount' | translate : model.comments.length : newComments | sanitizeHtml\"></span>\n        }\n      </div>\n    }\n  </div>\n  @if (model.tags) {\n    <mat-chip-set>\n      @for (tag of model.tags; track tag) {\n        <mat-chip [highlighted]=\"true\" [disableRipple]=\"true\">{{tag}}</mat-chip>\n      }\n    </mat-chip-set>\n  }\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow:hidden;padding-right:24px;padding-left:24px;text-align:start}.row{align-items:center;min-height:27px;flex-direction:row;box-sizing:border-box;display:flex}.note{font-weight:200}.time{text-transform:uppercase}.summary{max-width:fit-content}\n"], dependencies: [{ kind: "component", type: i4.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i4.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: AttachmentsComponent, selector: "bizdoc-attachments", inputs: ["model", "viewedIndicator", "includeDeleted"] }, { kind: "component", type: DocumentEventsComponent, selector: "bizdoc-events", inputs: ["model"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: CalendarPipe, name: "amCalendar" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: StatePipe, name: "state" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: ExpandedItemComponent, selector: "bizdoc-expanded-item", inputs: { model: "model" }, outputs: { sent: "sent" }, ngImport: i0, template: "@if (model.summary) {\n  <div class=\"summary\" [innerHTML]=\"model.summary\">\n  </div>\n}\n<div>\n  <bizdoc-attachments [model]=\"model\"></bizdoc-attachments>\n  <bizdoc-events [model]=\"model\"></bizdoc-events>\n</div>\n<div class=\"row\">\n  <span class=\"note\" [innerHTML]=\"note | sanitizeHtml\" (click)=\"chat($event)\"></span>\n  <span class=\"divider\"></span>\n  @for (a of actions; track a) {\n    @if (a.icon) {\n      <button mat-icon-button (click)=\"send(a.name)\" [bizdocTooltip]=\"a.title\" class=\"tool\">\n        <mat-icon>{{a.icon}}</mat-icon>\n      </button>\n    }\n  }\n</div>\n<div class=\"row\">\n  <div class=\"mat-small row\">\n    <span>{{model.stateId | state : 'past' }}</span>\n    &nbsp;\n    <span class=\"time\" [bizdocTooltip]=\"model.received | amCalendar\">{{model.received | amTimeAgo}}</span>\n    &nbsp;\n    <span [innerHTML]=\"sender | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>&nbsp;\n    <span [innerHTML]=\"awaiting | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>\n  </div>\n  <span class=\"divider\"></span>\n  <div class=\"center center\">\n    @if (typing) {\n      <span class=\"mat-small\">{{'SomeoneTyping'|translate}}</span>\n    }\n    @if (model.comments.length) {\n      <div class=\"mat-small\">\n        @if (!newComments) {\n          <span>{{model.comments.length > 1 ? ('CommentsCount' | translate : model.comments.length) : 'OneComment' | translate }}</span>\n        } @else {\n          <span [innerHTML]=\"'NewCommentsCount' | translate : model.comments.length : newComments | sanitizeHtml\"></span>\n        }\n      </div>\n    }\n  </div>\n  @if (model.tags) {\n    <mat-chip-set>\n      @for (tag of model.tags; track tag) {\n        <mat-chip [disabled]=\"true\">{{tag}}</mat-chip>\n      }\n    </mat-chip-set>\n  }\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow:hidden;padding-right:24px;padding-left:24px;text-align:start}.row{align-items:center;min-height:27px;flex-direction:row;box-sizing:border-box;display:flex}.note{font-weight:200}.time{text-transform:uppercase}.summary{max-width:fit-content}\n"], dependencies: [{ kind: "component", type: i4.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i4.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: AttachmentsComponent, selector: "bizdoc-attachments", inputs: ["model", "viewedIndicator", "includeDeleted"] }, { kind: "component", type: DocumentEventsComponent, selector: "bizdoc-events", inputs: ["model"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: CalendarPipe, name: "amCalendar" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { 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: "17.2.1", ngImport: i0, type: ExpandedItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-expanded-item', template: "@if (model.summary) {\n  <div class=\"summary\" [innerHTML]=\"model.summary\">\n  </div>\n}\n<div>\n  <bizdoc-attachments [model]=\"model\"></bizdoc-attachments>\n  <bizdoc-events [model]=\"model\"></bizdoc-events>\n</div>\n<div class=\"row\">\n  <span class=\"note\" [innerHTML]=\"note | sanitizeHtml\" (click)=\"chat($event)\"></span>\n  <span class=\"divider\"></span>\n  @for (a of actions; track a) {\n    @if (a.icon) {\n      <button mat-icon-button (click)=\"send(a.name)\" [bizdocTooltip]=\"a.title\" class=\"tool\">\n        <mat-icon>{{a.icon}}</mat-icon>\n      </button>\n    }\n  }\n</div>\n<div class=\"row\">\n  <div class=\"mat-small row\">\n    <span>{{model.stateId | state : 'past' }}</span>\n    &nbsp;\n    <span class=\"time\" [bizdocTooltip]=\"model.received | amCalendar\">{{model.received | amTimeAgo}}</span>\n    &nbsp;\n    <span [innerHTML]=\"sender | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>&nbsp;\n    <span [innerHTML]=\"awaiting | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>\n  </div>\n  <span class=\"divider\"></span>\n  <div class=\"center center\">\n    @if (typing) {\n      <span class=\"mat-small\">{{'SomeoneTyping'|translate}}</span>\n    }\n    @if (model.comments.length) {\n      <div class=\"mat-small\">\n        @if (!newComments) {\n          <span>{{model.comments.length > 1 ? ('CommentsCount' | translate : model.comments.length) : 'OneComment' | translate }}</span>\n        } @else {\n          <span [innerHTML]=\"'NewCommentsCount' | translate : model.comments.length : newComments | sanitizeHtml\"></span>\n        }\n      </div>\n    }\n  </div>\n  @if (model.tags) {\n    <mat-chip-set>\n      @for (tag of model.tags; track tag) {\n        <mat-chip [highlighted]=\"true\" [disableRipple]=\"true\">{{tag}}</mat-chip>\n      }\n    </mat-chip-set>\n  }\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow:hidden;padding-right:24px;padding-left:24px;text-align:start}.row{align-items:center;min-height:27px;flex-direction:row;box-sizing:border-box;display:flex}.note{font-weight:200}.time{text-transform:uppercase}.summary{max-width:fit-content}\n"] }]
+            args: [{ selector: 'bizdoc-expanded-item', template: "@if (model.summary) {\n  <div class=\"summary\" [innerHTML]=\"model.summary\">\n  </div>\n}\n<div>\n  <bizdoc-attachments [model]=\"model\"></bizdoc-attachments>\n  <bizdoc-events [model]=\"model\"></bizdoc-events>\n</div>\n<div class=\"row\">\n  <span class=\"note\" [innerHTML]=\"note | sanitizeHtml\" (click)=\"chat($event)\"></span>\n  <span class=\"divider\"></span>\n  @for (a of actions; track a) {\n    @if (a.icon) {\n      <button mat-icon-button (click)=\"send(a.name)\" [bizdocTooltip]=\"a.title\" class=\"tool\">\n        <mat-icon>{{a.icon}}</mat-icon>\n      </button>\n    }\n  }\n</div>\n<div class=\"row\">\n  <div class=\"mat-small row\">\n    <span>{{model.stateId | state : 'past' }}</span>\n    &nbsp;\n    <span class=\"time\" [bizdocTooltip]=\"model.received | amCalendar\">{{model.received | amTimeAgo}}</span>\n    &nbsp;\n    <span [innerHTML]=\"sender | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>&nbsp;\n    <span [innerHTML]=\"awaiting | sanitizeHtml\" (click)=\"chat($event)\" class=\"who\"></span>\n  </div>\n  <span class=\"divider\"></span>\n  <div class=\"center center\">\n    @if (typing) {\n      <span class=\"mat-small\">{{'SomeoneTyping'|translate}}</span>\n    }\n    @if (model.comments.length) {\n      <div class=\"mat-small\">\n        @if (!newComments) {\n          <span>{{model.comments.length > 1 ? ('CommentsCount' | translate : model.comments.length) : 'OneComment' | translate }}</span>\n        } @else {\n          <span [innerHTML]=\"'NewCommentsCount' | translate : model.comments.length : newComments | sanitizeHtml\"></span>\n        }\n      </div>\n    }\n  </div>\n  @if (model.tags) {\n    <mat-chip-set>\n      @for (tag of model.tags; track tag) {\n        <mat-chip [disabled]=\"true\">{{tag}}</mat-chip>\n      }\n    </mat-chip-set>\n  }\n</div>\n", styles: [":host{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow:hidden;padding-right:24px;padding-left:24px;text-align:start}.row{align-items:center;min-height:27px;flex-direction:row;box-sizing:border-box;display:flex}.note{font-weight:200}.time{text-transform:uppercase}.summary{max-width:fit-content}\n"] }]
         }], ctorParameters: () => [{ type: PromptService }, { type: ChatInfo }, { type: AccountService }, { type: MailboxService }, { type: SessionService }, { type: i1$3.Directionality }, { type: i2$2.MatDialog }, { type: TranslateService }, { type: HubService }], propDecorators: { model: [{
                 type: Input
             }], sent: [{
@@ -10157,11 +10164,11 @@ class BrowsePaneComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: BrowsePaneComponent, deps: [{ token: PaneRef }, { token: SessionService }, { token: Popup }, { token: PanesRouter }, { token: i1$3.Directionality }, { token: TranslateService }, { token: i2$2.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: BrowsePaneComponent, selector: "bizdoc-browse.pane", host: { listeners: { "document:keydown": "handleKeydown($event)" } }, viewQueries: [{ propertyName: "items", first: true, predicate: BrowseItemsComponent, descendants: true, static: true }, { propertyName: "filterEl", first: true, predicate: ["filterEl"], descendants: true, read: ElementRef }, { propertyName: "search", first: true, predicate: ["searchEl"], descendants: true, read: ElementRef }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (!items.selection.isEmpty()) {\n  <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n  @if (items.isAllDraft()) {\n  <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n  <button mat-button color=\"primary\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  }\n  @if (items.sharedActions.length === 1) {\n  <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">\n    @if (items.sharedActions[0].icon) {\n    <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}\n  </button>\n  }\n  @else if (items.sharedActions.length > 1) {\n  <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n    {{'SendSelected'| translate : items.selection.selected.length }}\n  </button>\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n    @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n    <mat-divider>\n    </mat-divider>\n    }\n    <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n      {{ a.title }}\n    </button>\n    }\n  </mat-menu>\n  }\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n         [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'SearchFolders' | translate}}\"\n         class=\"mat-body search-box\"\n         #searchEl\n         (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n  <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\" #filterEl><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n                     (open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n", styles: [":host{min-width:540px;display:contents!important}\n"], dependencies: [{ kind: "directive", type: i1$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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3$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"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10$1.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$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: BrowseItemsComponent, selector: "bizdoc-browse-items", inputs: ["folderId", "filterType", "filters"], outputs: ["open", "view"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [searchAnimation] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: BrowsePaneComponent, selector: "bizdoc-browse.pane", host: { listeners: { "document:keydown": "handleKeydown($event)" } }, viewQueries: [{ propertyName: "items", first: true, predicate: BrowseItemsComponent, descendants: true, static: true }, { propertyName: "filterEl", first: true, predicate: ["filterEl"], descendants: true, read: ElementRef }, { propertyName: "search", first: true, predicate: ["searchEl"], descendants: true, read: ElementRef }], ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (!items.selection.isEmpty()) {\n  <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n  @if (items.isAllDraft()) {\n  <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n  <button mat-button color=\"primary\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  }\n  @if (items.sharedActions.length === 1) {\n  <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">\n    @if (items.sharedActions[0].icon) {\n    <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}\n  </button>\n  }\n  @else if (items.sharedActions.length > 1) {\n  <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n    {{'SendSelected'| translate : items.selection.selected.length }}\n  </button>\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n    @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n    <mat-divider>\n    </mat-divider>\n    }\n    <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n      {{ a.title }}\n    </button>\n    }\n  </mat-menu>\n  }\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n         [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'SearchFolders' | translate}}\"\n         class=\"mat-body search-box\"\n         #searchEl\n         (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n  <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\" #filterEl><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n                     (open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n", styles: [""], dependencies: [{ 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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i6$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i8$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3$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"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10$1.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$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: BrowseItemsComponent, selector: "bizdoc-browse-items", inputs: ["folderId", "filterType", "filters"], outputs: ["open", "view"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [searchAnimation] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: BrowsePaneComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-browse.pane', animations: [searchAnimation], template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (!items.selection.isEmpty()) {\n  <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n  @if (items.isAllDraft()) {\n  <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n  <button mat-button color=\"primary\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  }\n  @if (items.sharedActions.length === 1) {\n  <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">\n    @if (items.sharedActions[0].icon) {\n    <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}\n  </button>\n  }\n  @else if (items.sharedActions.length > 1) {\n  <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n    {{'SendSelected'| translate : items.selection.selected.length }}\n  </button>\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n    @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n    <mat-divider>\n    </mat-divider>\n    }\n    <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n      {{ a.title }}\n    </button>\n    }\n  </mat-menu>\n  }\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n         [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'SearchFolders' | translate}}\"\n         class=\"mat-body search-box\"\n         #searchEl\n         (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n  <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\" #filterEl><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n                     (open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n", styles: [":host{min-width:540px;display:contents!important}\n"] }]
+            args: [{ selector: 'bizdoc-browse.pane', animations: [searchAnimation], template: "<mat-toolbar class=\"nav-toolbar\">\n  @if (!items.selection.isEmpty()) {\n  <!--<button mat-icon-button (click)=\"items.refresh()\" [bizdocTooltip]=\"'Refresh' | translate\" [attr.aria-label]=\"'Refresh' | translate\"><mat-icon matAnimate=\"rotate\">autorenew</mat-icon></button>-->\n  @if (items.isAllDraft()) {\n  <button mat-icon-button (click)=\"items.discardAll()\" [bizdocTooltip]=\"'DiscardSelected' | translate : items.selection.selected.length\" [attr.aria-label]=\"'DiscardSelected' | translate : items.selection.selected.length\"><mat-icon>delete_sweep</mat-icon></button>\n  <button mat-button color=\"primary\" (click)=\"items.submitAll()\">{{'SubmitSelected' | translate : items.selection.selected.length }}</button>\n  }\n  @if (items.sharedActions.length === 1) {\n  <button mat-button color=\"primary\" (click)=\"sendAll(items.sharedActions[0].name)\" [bizdocTooltip]=\"items.sharedActions[0].title\">\n    @if (items.sharedActions[0].icon) {\n    <mat-icon>{{items.sharedActions[0].icon}}</mat-icon>\n    }{{'SendSelected' | translate : items.selection.selected.length}}\n  </button>\n  }\n  @else if (items.sharedActions.length > 1) {\n  <button mat-button color=\"primary\" [matMenuTriggerFor]=\"action\" [bizdocTooltip]=\"'Send' | translate\" [attr.aria-label]=\"'Send' | translate\">\n    {{'SendSelected'| translate : items.selection.selected.length }}\n  </button>\n  <mat-menu #action>\n    @for (a of items.sharedActions | sort : 'group'; track a; let i = $index) {\n    @if (i > 0 && items.sharedActions[i-1].group !== a.group) {\n    <mat-divider>\n    </mat-divider>\n    }\n    <button mat-menu-item (click)=\"sendAll(a.name)\" [attr.aria-label]=\"a.title\">\n      {{ a.title }}\n    </button>\n    }\n  </mat-menu>\n  }\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  } @else {\n  <!--<button mat-icon-button (click)=\"openSearch()\"\n    [bizdocTooltip]=\"'Search'|translate\" class=\"tool\">\n    <mat-icon>search</mat-icon>\n  </button>\n  [@search]=\"searching\"\n  (@search.done)=\"searching && focus()\"-->\n  <input matInput\n         [formControl]=\"contains\" autocomplete=\"off\" placeholder=\"{{'SearchFolders' | translate}}\"\n         class=\"mat-body search-box\"\n         #searchEl\n         (keydown.escape)=\"clearSearch($event)\">\n  @if (contains.value) {\n  <mat-icon (click)=\"clearSearch()\">close</mat-icon>\n  }\n  <span class=\"divider\"></span>\n  <!--<button mat-icon-button (click)=\"items.paginator.previousPage()\" [bizdocTooltip]=\"'PrevPage' | translate\" [attr.aria-label]=\"'PrevPage' | translate\" [disabled]=\"!items.paginator.hasPreviousPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\n  <button mat-icon-button (click)=\"items.paginator.nextPage()\" [bizdocTooltip]=\"'NextPage' | translate\" [attr.aria-label]=\"'NextPage' | translate\" [disabled]=\"!items.paginator.hasNextPage()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>-->\n  <button mat-icon-button (click)=\"openFilter($event)\" [bizdocTooltip]=\"'Filter' | translate\" [attr.aria-label]=\"'Filter' | translate\" #filterEl><mat-icon>filter_list</mat-icon></button>\n  }\n</mat-toolbar>\n<bizdoc-browse-items [filters]=\"filters\" [folderId]=\"folderId\" [filterType]=\"filterType\"\n                     (open)=\"open($event)\" (view)=\"view($event) \" #items></bizdoc-browse-items>\n" }]
         }], ctorParameters: () => [{ type: PaneRef }, { type: SessionService }, { type: Popup }, { type: PanesRouter }, { type: i1$3.Directionality }, { type: TranslateService }, { type: i2$2.MatDialog }], propDecorators: { items: [{
                 type: ViewChild,
                 args: [BrowseItemsComponent, { static: true }]
@@ -13340,11 +13347,11 @@ class FilterTagsComponent {
         this.axesChange.emit(this.axes);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FilterTagsComponent, deps: [{ token: SessionService }, { token: DatasourceService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FilterTagsComponent, selector: "bizdoc-cube-tags", inputs: { axes: "axes", cube: "cube", interactive: "interactive" }, outputs: { axesChange: "axesChange" }, usesOnChanges: true, ngImport: i0, template: "<mat-chip-set [attr.aria-label]=\"'Filters'|l18n\">\n  @for (t of tags; track t) {\n    <mat-chip\n      [removable]=\"true\"\n      (removed)=\"remove(t)\">\n      {{t.value}}\n      @if (interactive) {\n        <mat-icon matChipRemove>cancel</mat-icon>\n      }\n    </mat-chip>\n  }\n</mat-chip-set>\n", styles: [":host{padding:0 8px}\n"], dependencies: [{ kind: "component", type: i4.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i4.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: L18nPipe, name: "l18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: FilterTagsComponent, selector: "bizdoc-cube-tags", inputs: { axes: "axes", cube: "cube", interactive: "interactive" }, outputs: { axesChange: "axesChange" }, usesOnChanges: true, ngImport: i0, template: "<mat-chip-set [attr.aria-label]=\"'Filters'|translate\">\n  @for (t of tags; track t) {\n    <mat-chip\n      [removable]=\"true\"\n      (removed)=\"remove(t)\">\n      {{t.value}}\n      @if (interactive) {\n        <mat-icon matChipRemove>cancel</mat-icon>\n      }\n    </mat-chip>\n  }\n</mat-chip-set>\n", styles: [":host{padding:0 8px}\n"], dependencies: [{ kind: "component", type: i4.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i4.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: FilterTagsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-cube-tags', template: "<mat-chip-set [attr.aria-label]=\"'Filters'|l18n\">\n  @for (t of tags; track t) {\n    <mat-chip\n      [removable]=\"true\"\n      (removed)=\"remove(t)\">\n      {{t.value}}\n      @if (interactive) {\n        <mat-icon matChipRemove>cancel</mat-icon>\n      }\n    </mat-chip>\n  }\n</mat-chip-set>\n", styles: [":host{padding:0 8px}\n"] }]
+            args: [{ selector: 'bizdoc-cube-tags', template: "<mat-chip-set [attr.aria-label]=\"'Filters'|translate\">\n  @for (t of tags; track t) {\n    <mat-chip\n      [removable]=\"true\"\n      (removed)=\"remove(t)\">\n      {{t.value}}\n      @if (interactive) {\n        <mat-icon matChipRemove>cancel</mat-icon>\n      }\n    </mat-chip>\n  }\n</mat-chip-set>\n", styles: [":host{padding:0 8px}\n"] }]
         }], ctorParameters: () => [{ type: SessionService }, { type: DatasourceService }], propDecorators: { axes: [{
                 type: Input
             }], cube: [{
@@ -13728,6 +13735,7 @@ class ReportViewerComponent {
             next: r => {
                 this._instance.onBind(r, this.args);
                 this._data = r;
+                this.progress = -1;
             }, error: () => this._sb.error(),
             complete: () => this.progress = -1
         })));
@@ -19945,7 +19953,7 @@ class SlotsComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: SlotsComponent, deps: [{ token: PANES_DATA }, { token: SessionService }, { token: i0.ChangeDetectorRef }, { token: PanesRouter }, { token: WindowTitleService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: SlotsComponent, selector: "bizdoc-panes-outlet", outputs: { dialogChange: "dialogChange" }, host: { listeners: { "document:keydown": "handleKeydown($event)", "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "_panesContainerRef", first: true, predicate: ["panesEl"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "_tabsElement", first: true, predicate: ["tabsEl"], descendants: true }, { propertyName: "_scrollable", first: true, predicate: CdkScrollable, descendants: true, static: true }], ngImport: i0, template: "<div #panesEl class=\"panes\"\n     cdkScrollable\n     @panes\n     (scroll)=\"enableNavigationArrows($event)\">\n  <!---->\n  @if (prev) {\n  <div class=\"scroll-arrow\" (click)=\"scrollBy(-400)\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleColor]=\"accent\">\n    <i class=\"material-icons mat-icon-rtl-mirror\">\n      arrow_back_ios\n    </i>\n  </div>\n  }\n  <!--panes-->\n  @for (p of panes; track p; let i = $index) {\n  <div (mouseenter)=\"selectedIndex !== i && !dragging && select(i)\"\n       (click)=\"select(i)\"\n       [class.active]=\"selectedIndex === i && panes.length > 1\" class=\"pane-content\" @pane>\n    <ng-container [cdkPortalOutlet]=\"p._portal\" (attached)=\"p._instance = $event.instance\"></ng-container>\n  </div>\n  @if (i < panes.length - 1) {\n  <div class=\"pane-separator\" (mousedown)=\"onPaneResize(p, $event)\"></div>\n  }\n  }\n  <!--dialog-->\n  @if (dialog) {\n  <div class=\"backdrop\" (click)=\"closeTab(0)\"></div>\n  }\n  <!--next-->\n  @if (next) {\n  <div class=\"scroll-arrow forward\">\n    <i class=\"material-icons mat-icon-rtl-mirror\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleRadius]=\"30\" [matRippleColor]=\"accent\"\n       (click)=\"scrollBy(400)\">\n      arrow_forward_ios\n    </i>\n  </div>\n  }\n</div>\n<!--tabs-->\n@if (tabs.length) {\n<div class=\"tabs-separator\" (mousedown)=\"onTabResize($event)\"></div>\n<div class=\"tabs mat-elevation-z18\" #tabsEl [@tabs]=\"tabsAnimation\" (@tabs.done)=\"done()\">\n  <!--title-->\n  <div class=\"row tabs-title\">\n    @if (swapTab) {\n    <button mat-icon-button (click)=\"tabBack()\" [bizdocTooltip]=\"prevGroup || ('Back'|translate)\"><mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon></button>\n    }\n    <h2>{{group}}</h2>\n    @if (!dialog) {\n    <button mat-icon-button (click)=\"expandTab()\" [bizdocTooltip]=\"'Expand'| translate\"><mat-icon class=\"mat-icon-rtl-mirror\" style=\"font-size: 22px\">open_in_full</mat-icon></button>\n    }\n    <span class=\"divider\"></span>\n    <button mat-icon-button (click)=\"collapse()\" bizdocTooltip=\"Esc\"><mat-icon>close</mat-icon></button>\n  </div>\n  <nav mat-tab-nav-bar color=\"accent\" [disablePagination]=\"true\" [tabPanel]=\"tabPanel\">\n    @for (t of tabs; track t; let i = $index) {\n    <a mat-tab-link class=\"mat-tab-link\"\n       (click)=\"selectedTabIndex = i\"\n       [active]=\"selectedTabIndex === i\">\n      <mat-icon [matBadge]=\"t.badge\" [matBadgeHidden]=\"!t.badge\" matBadgeSize=\"small\" matBadgeColor=\"accent\" aria-hidden=\"false\">{{t.icon}}</mat-icon>&nbsp;\n      {{t.title}}\n      @if (t.dismissable) {\n      <mat-icon (click)=\"closeTab(i)\" class=\"tool\">close</mat-icon>\n      }\n      <!--inline=\"true\"-->\n    </a>\n    }\n  </nav>\n  <mat-tab-nav-panel #tabPanel class=\"flex\">\n    @for (t of tabs; track t; let i = $index) {\n    <div [style.display]=\"selectedTabIndex === i ? '': 'none'\" class=\"tab\" [@tab]=\"selectedTabIndex\">\n      <ng-container [cdkPortalOutlet]=\"t._portal\" (attached)=\"t._instance = $event.instance\"></ng-container>\n    </div>\n    }\n  </mat-tab-nav-panel>\n</div>\n}\n", styles: [":host{flex:1;overflow:hidden;display:flex}.scroll-arrow{position:absolute;cursor:pointer;top:50%;z-index:200}.scroll-arrow i{font-size:50px;opacity:.2}.scroll-arrow i:hover{opacity:.9}.scroll-arrow:last-child{right:0}.panes{overflow-x:auto;flex:1;height:100%;display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row}.panes .pane-content{-webkit-flex-grow:1;flex-grow:1;min-width:420px;overflow-y:auto;overflow-x:clip}.panes .pane-content>*{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow-x:hidden;flex-grow:1}.pane-separator,.tabs-separator{cursor:ew-resize;background-repeat:no-repeat;background-position:center;display:table;height:100%;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.pane-separator{width:8px}.tabs-separator{width:12px}::ng-deep [dir=rtl] .scroll-arrow:last-child{right:unset;left:0}::ng-deep .mat-mdc-tab-link-container{overflow-x:auto;border-bottom:1px solid lightgray;-ms-overflow-style:none;scrollbar-width:none}::ng-deep .mat-mdc-tab-link-container::-webkit-scrollbar{display:none}::ng-deep .mat-mdc-tab-nav-panel{overflow-y:auto}.tabs{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;z-index:300;-webkit-flex-grow:0;flex-shrink:1;flex-basis:0}.tabs .tabs-title{align-items:center}.tabs .tabs-title h2{font-size:x-large;margin:9px;font-weight:100}.tabs .tabs-title:hover{opacity:1}.tabs .mat-mdc-tab-link .tool{opacity:0}.tabs .mat-mdc-tab-link:hover .tool{opacity:1}.tabs .tab{overflow-y:auto;overflow-x:hidden;display:flex;height:100%}\n"], dependencies: [{ kind: "directive", type: i5$5.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: i5.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: i2$5.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: i7$3.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["fitInkBarToContent", "mat-stretch-tabs", "animationDuration", "backgroundColor", "disableRipple", "color", "tabPanel"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i7$3.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: i7$3.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["active", "disabled", "disableRipple", "tabIndex", "id"], exportAs: ["matTabLink"] }, { kind: "directive", type: i5$2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i10.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" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: SlotsComponent, selector: "bizdoc-panes-outlet", outputs: { dialogChange: "dialogChange" }, host: { listeners: { "document:keydown": "handleKeydown($event)", "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "_panesContainerRef", first: true, predicate: ["panesEl"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "_tabsElement", first: true, predicate: ["tabsEl"], descendants: true }, { propertyName: "_scrollable", first: true, predicate: CdkScrollable, descendants: true, static: true }], ngImport: i0, template: "<div #panesEl class=\"panes\"\n     cdkScrollable\n     @panes\n     (scroll)=\"enableNavigationArrows($event)\">\n  <!---->\n  @if (prev) {\n  <div class=\"scroll-arrow\" (click)=\"scrollBy(-400)\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleColor]=\"accent\">\n    <i class=\"material-icons mat-icon-rtl-mirror\">\n      arrow_back_ios\n    </i>\n  </div>\n  }\n  <!--panes-->\n  @for (p of panes; track p; let i = $index) {\n  <div (mouseenter)=\"selectedIndex !== i && !dragging && select(i)\"\n       (click)=\"select(i)\"\n       [class.active]=\"selectedIndex === i && panes.length > 1\" class=\"pane-content\" @pane>\n    <ng-container [cdkPortalOutlet]=\"p._portal\" (attached)=\"p._instance = $event.instance\"></ng-container>\n  </div>\n  @if (i < panes.length - 1) {\n  <div class=\"pane-separator\" (mousedown)=\"onPaneResize(p, $event)\"></div>\n  }\n  }\n  <!--dialog-->\n  @if (dialog) {\n  <div class=\"backdrop\" (click)=\"closeTab(0)\"></div>\n  }\n  <!--next-->\n  @if (next) {\n  <div class=\"scroll-arrow forward\">\n    <i class=\"material-icons mat-icon-rtl-mirror\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleRadius]=\"30\" [matRippleColor]=\"accent\"\n       (click)=\"scrollBy(400)\">\n      arrow_forward_ios\n    </i>\n  </div>\n  }\n</div>\n<!--tabs-->\n@if (tabs.length) {\n<div class=\"tabs-separator\" (mousedown)=\"onTabResize($event)\"></div>\n<div class=\"tabs mat-elevation-z18\" #tabsEl [@tabs]=\"tabsAnimation\" (@tabs.done)=\"done()\">\n  <!--title-->\n  <div class=\"row tabs-title\">\n    @if (swapTab) {\n    <button mat-icon-button (click)=\"tabBack()\" [bizdocTooltip]=\"prevGroup || ('Back'|translate)\"><mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon></button>\n    }\n    <h2>{{group}}</h2>\n    @if (!dialog) {\n    <button mat-icon-button (click)=\"expandTab()\" [bizdocTooltip]=\"'Expand'| translate\"><mat-icon class=\"mat-icon-rtl-mirror\" style=\"font-size: 22px\">open_in_full</mat-icon></button>\n    }\n    <span class=\"divider\"></span>\n    <button mat-icon-button (click)=\"collapse()\" bizdocTooltip=\"Esc\"><mat-icon>close</mat-icon></button>\n  </div>\n  <nav mat-tab-nav-bar color=\"accent\" [disablePagination]=\"true\" [tabPanel]=\"tabPanel\">\n    @for (t of tabs; track t; let i = $index) {\n    <a mat-tab-link class=\"mat-tab-link\"\n       (click)=\"selectedTabIndex = i\"\n       [active]=\"selectedTabIndex === i\">\n      <mat-icon [matBadge]=\"t.badge\" [matBadgeHidden]=\"!t.badge\" matBadgeSize=\"small\" matBadgeColor=\"accent\" aria-hidden=\"false\">{{t.icon}}</mat-icon>&nbsp;\n      {{t.title}}\n      @if (t.dismissable) {\n      <mat-icon (click)=\"closeTab(i)\" class=\"tool\">close</mat-icon>\n      }\n      <!--inline=\"true\"-->\n    </a>\n    }\n  </nav>\n  <mat-tab-nav-panel #tabPanel class=\"flex\">\n    @for (t of tabs; track t; let i = $index) {\n    <div [style.display]=\"selectedTabIndex === i ? '': 'none'\" class=\"tab\" [@tab]=\"selectedTabIndex\">\n      <ng-container [cdkPortalOutlet]=\"t._portal\" (attached)=\"t._instance = $event.instance\"></ng-container>\n    </div>\n    }\n  </mat-tab-nav-panel>\n</div>\n}\n", styles: [":host{flex:1;overflow:hidden;display:flex}.scroll-arrow{position:absolute;cursor:pointer;top:50%;z-index:200}.scroll-arrow i{font-size:50px;opacity:.2}.scroll-arrow i:hover{opacity:.9}.scroll-arrow:last-child{right:0}.panes{overflow-x:auto;flex:1;height:100%;display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row}.panes .pane-content{-webkit-flex-grow:1;flex-grow:1;min-width:420px;overflow-y:auto;overflow-x:clip}.panes .pane-content>*{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow-x:hidden;flex-grow:1}.pane-separator,.tabs-separator{cursor:ew-resize;background-repeat:no-repeat;background-position:center;display:table;height:100%;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.pane-separator{width:8px}.tabs-separator{width:12px}::ng-deep [dir=rtl] .scroll-arrow:last-child{right:unset;left:0}::ng-deep .mat-mdc-tab-link-container{overflow-x:auto;border-bottom:1px solid lightgray;-ms-overflow-style:none;scrollbar-width:none}::ng-deep .mat-mdc-tab-link-container::-webkit-scrollbar{display:none}::ng-deep .mat-mdc-tab-nav-panel{overflow-y:auto}.tabs{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;z-index:300;-webkit-flex-grow:0;flex-shrink:1;flex-basis:0;max-width:80vw}.tabs .tabs-title{align-items:center}.tabs .tabs-title h2{font-size:x-large;margin:9px;font-weight:100}.tabs .tabs-title:hover{opacity:1}.tabs .mat-mdc-tab-link .tool{opacity:0}.tabs .mat-mdc-tab-link:hover .tool{opacity:1}.tabs .tab{overflow-y:auto;overflow-x:hidden;display:flex;height:100%}\n"], dependencies: [{ kind: "directive", type: i5$5.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: i5.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: i2$5.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: i7$3.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["fitInkBarToContent", "mat-stretch-tabs", "animationDuration", "backgroundColor", "disableRipple", "color", "tabPanel"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i7$3.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: i7$3.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["active", "disabled", "disableRipple", "tabIndex", "id"], exportAs: ["matTabLink"] }, { kind: "directive", type: i5$2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i10.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" }], animations: [
             panesAnimation,
             paneAnimation,
             paramAnimation,
@@ -19963,7 +19971,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
                         queryAnimation,
                         tabsAnimation,
                         tabAnimation
-                    ], template: "<div #panesEl class=\"panes\"\n     cdkScrollable\n     @panes\n     (scroll)=\"enableNavigationArrows($event)\">\n  <!---->\n  @if (prev) {\n  <div class=\"scroll-arrow\" (click)=\"scrollBy(-400)\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleColor]=\"accent\">\n    <i class=\"material-icons mat-icon-rtl-mirror\">\n      arrow_back_ios\n    </i>\n  </div>\n  }\n  <!--panes-->\n  @for (p of panes; track p; let i = $index) {\n  <div (mouseenter)=\"selectedIndex !== i && !dragging && select(i)\"\n       (click)=\"select(i)\"\n       [class.active]=\"selectedIndex === i && panes.length > 1\" class=\"pane-content\" @pane>\n    <ng-container [cdkPortalOutlet]=\"p._portal\" (attached)=\"p._instance = $event.instance\"></ng-container>\n  </div>\n  @if (i < panes.length - 1) {\n  <div class=\"pane-separator\" (mousedown)=\"onPaneResize(p, $event)\"></div>\n  }\n  }\n  <!--dialog-->\n  @if (dialog) {\n  <div class=\"backdrop\" (click)=\"closeTab(0)\"></div>\n  }\n  <!--next-->\n  @if (next) {\n  <div class=\"scroll-arrow forward\">\n    <i class=\"material-icons mat-icon-rtl-mirror\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleRadius]=\"30\" [matRippleColor]=\"accent\"\n       (click)=\"scrollBy(400)\">\n      arrow_forward_ios\n    </i>\n  </div>\n  }\n</div>\n<!--tabs-->\n@if (tabs.length) {\n<div class=\"tabs-separator\" (mousedown)=\"onTabResize($event)\"></div>\n<div class=\"tabs mat-elevation-z18\" #tabsEl [@tabs]=\"tabsAnimation\" (@tabs.done)=\"done()\">\n  <!--title-->\n  <div class=\"row tabs-title\">\n    @if (swapTab) {\n    <button mat-icon-button (click)=\"tabBack()\" [bizdocTooltip]=\"prevGroup || ('Back'|translate)\"><mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon></button>\n    }\n    <h2>{{group}}</h2>\n    @if (!dialog) {\n    <button mat-icon-button (click)=\"expandTab()\" [bizdocTooltip]=\"'Expand'| translate\"><mat-icon class=\"mat-icon-rtl-mirror\" style=\"font-size: 22px\">open_in_full</mat-icon></button>\n    }\n    <span class=\"divider\"></span>\n    <button mat-icon-button (click)=\"collapse()\" bizdocTooltip=\"Esc\"><mat-icon>close</mat-icon></button>\n  </div>\n  <nav mat-tab-nav-bar color=\"accent\" [disablePagination]=\"true\" [tabPanel]=\"tabPanel\">\n    @for (t of tabs; track t; let i = $index) {\n    <a mat-tab-link class=\"mat-tab-link\"\n       (click)=\"selectedTabIndex = i\"\n       [active]=\"selectedTabIndex === i\">\n      <mat-icon [matBadge]=\"t.badge\" [matBadgeHidden]=\"!t.badge\" matBadgeSize=\"small\" matBadgeColor=\"accent\" aria-hidden=\"false\">{{t.icon}}</mat-icon>&nbsp;\n      {{t.title}}\n      @if (t.dismissable) {\n      <mat-icon (click)=\"closeTab(i)\" class=\"tool\">close</mat-icon>\n      }\n      <!--inline=\"true\"-->\n    </a>\n    }\n  </nav>\n  <mat-tab-nav-panel #tabPanel class=\"flex\">\n    @for (t of tabs; track t; let i = $index) {\n    <div [style.display]=\"selectedTabIndex === i ? '': 'none'\" class=\"tab\" [@tab]=\"selectedTabIndex\">\n      <ng-container [cdkPortalOutlet]=\"t._portal\" (attached)=\"t._instance = $event.instance\"></ng-container>\n    </div>\n    }\n  </mat-tab-nav-panel>\n</div>\n}\n", styles: [":host{flex:1;overflow:hidden;display:flex}.scroll-arrow{position:absolute;cursor:pointer;top:50%;z-index:200}.scroll-arrow i{font-size:50px;opacity:.2}.scroll-arrow i:hover{opacity:.9}.scroll-arrow:last-child{right:0}.panes{overflow-x:auto;flex:1;height:100%;display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row}.panes .pane-content{-webkit-flex-grow:1;flex-grow:1;min-width:420px;overflow-y:auto;overflow-x:clip}.panes .pane-content>*{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow-x:hidden;flex-grow:1}.pane-separator,.tabs-separator{cursor:ew-resize;background-repeat:no-repeat;background-position:center;display:table;height:100%;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.pane-separator{width:8px}.tabs-separator{width:12px}::ng-deep [dir=rtl] .scroll-arrow:last-child{right:unset;left:0}::ng-deep .mat-mdc-tab-link-container{overflow-x:auto;border-bottom:1px solid lightgray;-ms-overflow-style:none;scrollbar-width:none}::ng-deep .mat-mdc-tab-link-container::-webkit-scrollbar{display:none}::ng-deep .mat-mdc-tab-nav-panel{overflow-y:auto}.tabs{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;z-index:300;-webkit-flex-grow:0;flex-shrink:1;flex-basis:0}.tabs .tabs-title{align-items:center}.tabs .tabs-title h2{font-size:x-large;margin:9px;font-weight:100}.tabs .tabs-title:hover{opacity:1}.tabs .mat-mdc-tab-link .tool{opacity:0}.tabs .mat-mdc-tab-link:hover .tool{opacity:1}.tabs .tab{overflow-y:auto;overflow-x:hidden;display:flex;height:100%}\n"] }]
+                    ], template: "<div #panesEl class=\"panes\"\n     cdkScrollable\n     @panes\n     (scroll)=\"enableNavigationArrows($event)\">\n  <!---->\n  @if (prev) {\n  <div class=\"scroll-arrow\" (click)=\"scrollBy(-400)\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleColor]=\"accent\">\n    <i class=\"material-icons mat-icon-rtl-mirror\">\n      arrow_back_ios\n    </i>\n  </div>\n  }\n  <!--panes-->\n  @for (p of panes; track p; let i = $index) {\n  <div (mouseenter)=\"selectedIndex !== i && !dragging && select(i)\"\n       (click)=\"select(i)\"\n       [class.active]=\"selectedIndex === i && panes.length > 1\" class=\"pane-content\" @pane>\n    <ng-container [cdkPortalOutlet]=\"p._portal\" (attached)=\"p._instance = $event.instance\"></ng-container>\n  </div>\n  @if (i < panes.length - 1) {\n  <div class=\"pane-separator\" (mousedown)=\"onPaneResize(p, $event)\"></div>\n  }\n  }\n  <!--dialog-->\n  @if (dialog) {\n  <div class=\"backdrop\" (click)=\"closeTab(0)\"></div>\n  }\n  <!--next-->\n  @if (next) {\n  <div class=\"scroll-arrow forward\">\n    <i class=\"material-icons mat-icon-rtl-mirror\" matRipple [matRippleUnbounded]=\"true\" [matRippleCentered]=\"true\" [matRippleRadius]=\"30\" [matRippleColor]=\"accent\"\n       (click)=\"scrollBy(400)\">\n      arrow_forward_ios\n    </i>\n  </div>\n  }\n</div>\n<!--tabs-->\n@if (tabs.length) {\n<div class=\"tabs-separator\" (mousedown)=\"onTabResize($event)\"></div>\n<div class=\"tabs mat-elevation-z18\" #tabsEl [@tabs]=\"tabsAnimation\" (@tabs.done)=\"done()\">\n  <!--title-->\n  <div class=\"row tabs-title\">\n    @if (swapTab) {\n    <button mat-icon-button (click)=\"tabBack()\" [bizdocTooltip]=\"prevGroup || ('Back'|translate)\"><mat-icon class=\"mat-icon-rtl-mirror\">arrow_back</mat-icon></button>\n    }\n    <h2>{{group}}</h2>\n    @if (!dialog) {\n    <button mat-icon-button (click)=\"expandTab()\" [bizdocTooltip]=\"'Expand'| translate\"><mat-icon class=\"mat-icon-rtl-mirror\" style=\"font-size: 22px\">open_in_full</mat-icon></button>\n    }\n    <span class=\"divider\"></span>\n    <button mat-icon-button (click)=\"collapse()\" bizdocTooltip=\"Esc\"><mat-icon>close</mat-icon></button>\n  </div>\n  <nav mat-tab-nav-bar color=\"accent\" [disablePagination]=\"true\" [tabPanel]=\"tabPanel\">\n    @for (t of tabs; track t; let i = $index) {\n    <a mat-tab-link class=\"mat-tab-link\"\n       (click)=\"selectedTabIndex = i\"\n       [active]=\"selectedTabIndex === i\">\n      <mat-icon [matBadge]=\"t.badge\" [matBadgeHidden]=\"!t.badge\" matBadgeSize=\"small\" matBadgeColor=\"accent\" aria-hidden=\"false\">{{t.icon}}</mat-icon>&nbsp;\n      {{t.title}}\n      @if (t.dismissable) {\n      <mat-icon (click)=\"closeTab(i)\" class=\"tool\">close</mat-icon>\n      }\n      <!--inline=\"true\"-->\n    </a>\n    }\n  </nav>\n  <mat-tab-nav-panel #tabPanel class=\"flex\">\n    @for (t of tabs; track t; let i = $index) {\n    <div [style.display]=\"selectedTabIndex === i ? '': 'none'\" class=\"tab\" [@tab]=\"selectedTabIndex\">\n      <ng-container [cdkPortalOutlet]=\"t._portal\" (attached)=\"t._instance = $event.instance\"></ng-container>\n    </div>\n    }\n  </mat-tab-nav-panel>\n</div>\n}\n", styles: [":host{flex:1;overflow:hidden;display:flex}.scroll-arrow{position:absolute;cursor:pointer;top:50%;z-index:200}.scroll-arrow i{font-size:50px;opacity:.2}.scroll-arrow i:hover{opacity:.9}.scroll-arrow:last-child{right:0}.panes{overflow-x:auto;flex:1;height:100%;display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row}.panes .pane-content{-webkit-flex-grow:1;flex-grow:1;min-width:420px;overflow-y:auto;overflow-x:clip}.panes .pane-content>*{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;overflow-x:hidden;flex-grow:1}.pane-separator,.tabs-separator{cursor:ew-resize;background-repeat:no-repeat;background-position:center;display:table;height:100%;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.pane-separator{width:8px}.tabs-separator{width:12px}::ng-deep [dir=rtl] .scroll-arrow:last-child{right:unset;left:0}::ng-deep .mat-mdc-tab-link-container{overflow-x:auto;border-bottom:1px solid lightgray;-ms-overflow-style:none;scrollbar-width:none}::ng-deep .mat-mdc-tab-link-container::-webkit-scrollbar{display:none}::ng-deep .mat-mdc-tab-nav-panel{overflow-y:auto}.tabs{display:flex;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;z-index:300;-webkit-flex-grow:0;flex-shrink:1;flex-basis:0;max-width:80vw}.tabs .tabs-title{align-items:center}.tabs .tabs-title h2{font-size:x-large;margin:9px;font-weight:100}.tabs .tabs-title:hover{opacity:1}.tabs .mat-mdc-tab-link .tool{opacity:0}.tabs .mat-mdc-tab-link:hover .tool{opacity:1}.tabs .tab{overflow-y:auto;overflow-x:hidden;display:flex;height:100%}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [PANES_DATA]
@@ -22009,7 +22017,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
 RangeNavigator.Inject(AreaSeries, LineSeries, DateTime, RangeTooltip);
 Sparkline.Inject(SparklineTooltip);
 AccumulationChart$1.Inject(PieSeries, PyramidSeries, FunnelSeries, AccumulationDataLabel, AccumulationTooltip, AccumulationAnnotation, AccumulationLegend, AccumulationSelection);
-Chart$1.Inject(Category, DateTime, Tooltip$1, Legend, Selection, Zoom, Crosshair, DataLabel, BarSeries, AreaSeries, BubbleSeries, ColumnSeries, LineSeries, PolarSeries, RadarSeries, SplineSeries, SplineAreaSeries, ScatterSeries, StackingStepAreaSeries, StackingLineSeries, StackingAreaSeries, StackingColumnSeries, StackingBarSeries, StepAreaSeries, StepLineSeries);
+Chart$1.Inject(Category, DateTime, Tooltip$1, Legend, Selection, Zoom, Crosshair, DataLabel, BarSeries, AreaSeries, BubbleSeries, ColumnSeries, LineSeries, PolarSeries, RadarSeries, SplineSeries, SplineAreaSeries, ScatterSeries, StackingStepAreaSeries, StackingLineSeries, StackingAreaSeries, StackingColumnSeries, StackingBarSeries, StepAreaSeries, StepLineSeries, ChartAnnotation);
 
 class SyncfusionDiagramModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: SyncfusionDiagramModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -29486,43 +29494,134 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
         }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: FormRef }] });
 
 let RolesPerformanceComponent = class RolesPerformanceComponent {
-    constructor(_elementRef, _router, _session, _translate, _reportRef) {
+    constructor(_elementRef, _router, _accounts, _session, _translate, _reportRef) {
         this._elementRef = _elementRef;
         this._router = _router;
+        this._accounts = _accounts;
         this._session = _session;
         this._translate = _translate;
         this._reportRef = _reportRef;
-        this.legendSettings = {};
+        this.maxStd = 0;
+        this.maxDuration = 0;
+        this.actions = {};
+        this.legendSettings = {
+            position: 'Left',
+            enableHighlight: true,
+        };
+        this.tooltip = {
+            enable: true,
+        };
+        this.primaryXAxis = { valueType: 'DateTime' };
+        this.primaryYAxis = {};
         const { cube: name } = _reportRef.options;
-        this._cube = name ? this._session.profile.cubes.find(c => c.name === name) : this._session.profile.cubes[0];
+        this._cube = name ?
+            _session.profile.cubes.find(c => c.name === name) :
+            _session.profile.cubes[0];
+        _session.profile.actions.forEach(a => this.actions[a.name] = a);
     }
+    ;
     onBind(data, args) {
-        const roles = [];
-        data.forEach(d => { });
-        const series = [{}];
-        new Chart({
-            series,
-            legendSettings: this.legendSettings,
-            axisLabelRender: this.labelRender.bind(this),
-            palettes: this._session.accentPalette,
-            enableRtl: this._session.inverse,
-            pointClick: this.explore.bind(this)
-        }, this._elementRef.nativeElement);
+        if (!data.length)
+            return;
+        let accumStd = 0, countStd = 0, accumDuration = 0;
+        data.forEach(e => {
+            if (e.standardTime) {
+                if (e.standardTime > this.maxStd)
+                    this.maxStd = e.standardTime;
+                countStd++;
+                accumStd += e.standardTime;
+            }
+            if (e.duration > this.maxDuration)
+                this.maxDuration = e.duration;
+            accumDuration += e.duration;
+            e.yDate = new Date(e.date).valueOf();
+        });
+        let stdAvg = accumStd / countStd, durationAvg = accumDuration / data.length;
+        const ids = data.distinct(e => e.userId);
+        this._accounts.getAll([...ids]).
+            subscribe(users => {
+            const series = [{
+                    name: this._translate.get('Standard'),
+                    xName: 'yDate',
+                    yName: 'standardTime',
+                    type: 'Polar',
+                    drawType: 'Line',
+                    //opacity: .5,
+                    marker: {
+                        visible: true,
+                        shape: 'Triangle',
+                        width: 5,
+                        height: 5
+                    },
+                    dataSource: data.filter(e => e.standardTime).
+                        sort((e1, e2) => e1.standardTime < e2.standardTime ? -1 : 1),
+                },
+                ...users.map(u => ({
+                    dataSource: data.filter(e => e.userId === u.id).
+                        sort((e1, e2) => e1.duration < e2.duration ? -1 : 1),
+                    name: u.name,
+                    type: 'Polar',
+                    drawType: 'Line',
+                    marker: {
+                        visible: true,
+                        width: 5, height: 5,
+                        shape: 'Pentagon',
+                    },
+                    xName: 'yDate',
+                    yName: 'duration',
+                }))];
+            new Chart({
+                title: this._translate.get('AverageValue', dayjs.duration(durationAvg, 'seconds').format('DD:HH:ss')),
+                titleStyle: { fontFamily: FONT_FAMILY },
+                subTitle: stdAvg ?
+                    this._translate.get('StandardValue', dayjs.duration(stdAvg, 'seconds').format('DD:HH:ss')) : null,
+                subTitleStyle: { fontFamily: FONT_FAMILY },
+                //          primaryXAxis: { valueType: 'Double' },
+                primaryYAxis: {
+                //minimum: 0, maximum: Math.max(durationAvg, stdAvg)
+                //interval: 60 * 5,
+                },
+                series,
+                //          pointRender: this.pointRender.bind(this),
+                tooltip: this.tooltip,
+                tooltipRender: this.tooltipRender.bind(this),
+                legendSettings: this.legendSettings,
+                axisLabelRender: this.labelRender.bind(this),
+                palettes: [this._session.getPrimery(), ...this._session.accentPalette],
+                enableRtl: this._session.inverse,
+                height: '100%',
+                highlightMode: 'Cluster',
+                pointClick: this.explore.bind(this)
+            }, this._elementRef.nativeElement);
+        });
+    }
+    tooltipRender(evt) {
+        evt.text = dayjs.duration(evt.data.pointY, 's').format('DD:HH:ss');
+    }
+    pointRender(evt) {
+        //  const action = this.actions[(evt.point.series[evt.point.index] as Model).actionId];
+        // if (action.color) evt.fill = action.color;
+    }
+    labelRender(evt) {
+        switch (evt.axis.name) {
+            case 'primaryYAxis':
+                evt.text = dayjs.duration(evt.value, 's').format('DD:HH:ss');
+                break;
+            case 'primaryXAxis':
+                evt.text = dayjs(evt.value).format('MMM YYYY');
+                break;
+        }
     }
-    labelRender(evt) { }
     explore(evt) {
         const { point: { x, yValue }, series: { name: title } } = evt;
-        const { cube, series } = this._reportRef.options;
-        const axes = {};
-        axes[series] = x;
-        this._router.navigate(['cube', cube, 'explore'], {
-            queryParams: axes,
-        });
-    }
-    ngOnInit() {
+        //const { cube } = this._reportRef.options;
+        //  this._router.navigate(PerformanceExplroeCompinent,
+        //    {
+        //      queryParams: axes,
+        //    });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: RolesPerformanceComponent, deps: [{ token: i0.ElementRef }, { token: RouterImpl }, { token: SessionService }, { token: TranslateService }, { token: ReportRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: RolesPerformanceComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: RolesPerformanceComponent, deps: [{ token: i0.ElementRef }, { token: RouterImpl }, { token: AccountService }, { token: SessionService }, { token: TranslateService }, { token: ReportRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: RolesPerformanceComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true, styles: [":host{flex:1}\n"] }); }
 };
 RolesPerformanceComponent = __decorate([
     BizDoc({
@@ -29531,10 +29630,8 @@ RolesPerformanceComponent = __decorate([
 ], RolesPerformanceComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: RolesPerformanceComponent, decorators: [{
             type: Component,
-            args: [{
-                    template: ''
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: RouterImpl }, { type: SessionService }, { type: TranslateService }, { type: ReportRef }] });
+            args: [{ template: '', styles: [":host{flex:1}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: RouterImpl }, { type: AccountService }, { type: SessionService }, { type: TranslateService }, { type: ReportRef }] });
 
 var DocumentStateWidgetComponent_1;
 let DocumentStateWidgetComponent = class DocumentStateWidgetComponent {
@@ -29738,6 +29835,83 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
             args: [{ selector: 'bizdoc-sticky' }]
         }], ctorParameters: () => [{ type: i0.ViewContainerRef }] });
 
+/** */
+class Tab {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: Tab, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.1", type: Tab, selector: "tab", inputs: { name: "name", title: "title" }, queries: [{ propertyName: "template", first: true, predicate: (TemplateRef), descendants: true }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: Tab, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'tab',
+                }]
+        }], propDecorators: { name: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], template: [{
+                type: ContentChild,
+                args: [(TemplateRef)]
+            }] } });
+/** */
+class VirtualTabs {
+    constructor() {
+        this.selectedIndex = 0;
+    }
+    ngOnInit() {
+        //  if (!this.tabs.length) throw 'no tabs in bizdoc-v-tabs.';
+        //  const tab = this.tabs.find(t => t.name === this.initialName);
+        //  this.change(tab || this.tabs[0]);
+    }
+    change(tab) {
+        this.tabs.forEach((t, i) => {
+            t.active = t == tab;
+            if (t.active)
+                this.selectedIndex = i;
+        });
+        this.activeTab = tab;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: VirtualTabs, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: VirtualTabs, selector: "bizdoc-v-tabs", inputs: { initialName: "initialName" }, queries: [{ propertyName: "tabs", predicate: Tab }], ngImport: i0, template: `
+  <div class="row">
+    <mat-nav-list class="nav-list">
+    @for (t of tabs || []; track t) {
+      <mat-list-item (click)="change(t)" [class.active]="activeTab?.name === t.name">
+        <span matListItemTitle>{{t.title | translate}}</span>
+      </mat-list-item>
+    }
+    </mat-nav-list>
+    <div class="separator"></div>
+    <form autocomplete="off" [@v-swape]="selectedIndex">
+      <ng-container *ngTemplateOutlet="activeTab?.template"></ng-container>
+    </form>
+  </div>
+  `, isInline: true, styles: [".separator{height:280px;width:1px;background-color:#0003}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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2$4.MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "component", type: i2$4.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i2$4.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [verticalSwapAnimation] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: VirtualTabs, decorators: [{
+            type: Component,
+            args: [{ selector: 'bizdoc-v-tabs', template: `
+  <div class="row">
+    <mat-nav-list class="nav-list">
+    @for (t of tabs || []; track t) {
+      <mat-list-item (click)="change(t)" [class.active]="activeTab?.name === t.name">
+        <span matListItemTitle>{{t.title | translate}}</span>
+      </mat-list-item>
+    }
+    </mat-nav-list>
+    <div class="separator"></div>
+    <form autocomplete="off" [@v-swape]="selectedIndex">
+      <ng-container *ngTemplateOutlet="activeTab?.template"></ng-container>
+    </form>
+  </div>
+  `, animations: [verticalSwapAnimation], styles: [".separator{height:280px;width:1px;background-color:#0003}form{padding:20px 8px 0;min-width:320px}\n"] }]
+        }], propDecorators: { initialName: [{
+                type: Input
+            }], tabs: [{
+                type: ContentChildren,
+                args: [Tab]
+            }] } });
+
 class SpContainer {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: SpContainer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.1", type: SpContainer, isStandalone: true, selector: "bizdoc-sp-container", ngImport: i0, template: `<ejs-spreadsheet/>`, isInline: true, dependencies: [{ kind: "ngmodule", type: SyncfusionSpreadsheetModule }, { kind: "component", type: i9$1.SpreadsheetComponent, selector: "ejs-spreadsheet", inputs: ["activeSheetIndex", "allowAutoFill", "allowCellFormatting", "allowChart", "allowConditionalFormat", "allowDataValidation", "allowDelete", "allowEditing", "allowFiltering", "allowFindAndReplace", "allowFreezePane", "allowHyperlink", "allowImage", "allowInsert", "allowMerge", "allowNumberFormatting", "allowOpen", "allowResizing", "allowSave", "allowScrolling", "allowSorting", "allowUndoRedo", "allowWrap", "autoFillSettings", "cellStyle", "cssClass", "currencyCode", "definedNames", "enableClipboard", "enableContextMenu", "enableKeyboardNavigation", "enableKeyboardShortcut", "enablePersistence", "enableRtl", "height", "isProtected", "locale", "openUrl", "password", "saveUrl", "scrollSettings", "selectionSettings", "sheets", "showAggregate", "showFormulaBar", "showRibbon", "showSheetTabs", "width"], outputs: ["actionBegin", "actionComplete", "afterHyperlinkClick", "afterHyperlinkCreate", "beforeCellFormat", "beforeCellRender", "beforeCellSave", "beforeCellUpdate", "beforeConditionalFormat", "beforeDataBound", "beforeHyperlinkClick", "beforeHyperlinkCreate", "beforeOpen", "beforeSave", "beforeSelect", "beforeSort", "cellEdit", "cellEdited", "cellEditing", "cellSave", "contextMenuBeforeClose", "contextMenuBeforeOpen", "contextMenuItemSelect", "created", "dataBound", "dataSourceChanged", "dialogBeforeOpen", "fileMenuBeforeClose", "fileMenuBeforeOpen", "fileMenuItemSelect", "openComplete", "openFailure", "queryCellInfo", "saveComplete", "select", "sortComplete"] }] }); }
@@ -29816,7 +29990,7 @@ class SharedModule {
             AceInput, TimespanInput, AddressInput,
             FileInput,
             TimePicker,
-            LayoutComponent, StickyToolbar,
+            LayoutComponent, StickyToolbar, VirtualTabs, Tab,
             TimeField, SignatureField, AddressField, RadioButtonField, ChecklistField, YesNoField, HtmlField, FileField, NumericField, AutocompleteField, CheckboxField, DateField, DateRangeField, ExpressionField,
             InputField, SelectField, SwitchField, TextareaField, ChipsField, TimespanField,
             ReturnActionComponent, AssignActionComponent, MoveToActionComponent,
@@ -29896,7 +30070,7 @@ class SharedModule {
             TagsComponent, QuickCommentComponent,
             CommentsComponent,
             LayoutComponent,
-            ActionDialog, StickyToolbar,
+            ActionDialog, StickyToolbar, VirtualTabs, Tab,
             BrowseFilterComponent, CubeFilterComponent, ScheduleViewComponent, ReportViewerComponent, WidgetItemComponent, CubeViewComponent,
             ExploreItemsComponent, ComposeFormComponent, BrowseItemsComponent, NotificationsTableComponent,
             ActionPicker, ConversationComponent,
@@ -29996,7 +30170,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
                         AceInput, TimespanInput, AddressInput,
                         FileInput,
                         TimePicker,
-                        LayoutComponent, StickyToolbar,
+                        LayoutComponent, StickyToolbar, VirtualTabs, Tab,
                         TimeField, SignatureField, AddressField, RadioButtonField, ChecklistField, YesNoField, HtmlField, FileField, NumericField, AutocompleteField, CheckboxField, DateField, DateRangeField, ExpressionField,
                         InputField, SelectField, SwitchField, TextareaField, ChipsField, TimespanField,
                         ReturnActionComponent, AssignActionComponent, MoveToActionComponent,
@@ -30097,7 +30271,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImpor
                         TagsComponent, QuickCommentComponent,
                         CommentsComponent,
                         LayoutComponent,
-                        ActionDialog, StickyToolbar,
+                        ActionDialog, StickyToolbar, VirtualTabs, Tab,
                         BrowseFilterComponent, CubeFilterComponent, ScheduleViewComponent, ReportViewerComponent, WidgetItemComponent, CubeViewComponent,
                         ExploreItemsComponent, ComposeFormComponent, BrowseItemsComponent, NotificationsTableComponent,
                         ActionPicker, ConversationComponent,
@@ -35452,19 +35626,18 @@ let PerformanceReportDesignComponent = class PerformanceReportDesignComponent ex
         super(...arguments);
         this.form = this._fb.group({
             cube: null,
-            series: null,
             filters: this._fb.group({}),
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: PerformanceReportDesignComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: PerformanceReportDesignComponent, selector: "ng-component", host: { classAttribute: "column" }, usesInheritance: true, ngImport: i0, template: "@if (mode !== 'widget') {\n<ng-container [formGroup]=\"form\">\n  @if (cubes.length > 1) {\n  <mat-form-field>\n    <mat-label>{{'Cube'|translate}}</mat-label>\n    <mat-select required formControlName=\"cube\" (selectionChange)=\"cubeSelected($event)\">\n      @for (c of cubes; track c) {\n      <mat-option [value]=\"c.name\">{{c.title|localizedString}}</mat-option>\n      }\n    </mat-select>\n  </mat-form-field>\n  }\n  <mat-form-field>\n    <mat-label>{{'Series'|translate}}</mat-label>\n    <mat-select formControlName=\"series\" required>\n      @for (x of cube?.axes; track x) {\n      <mat-option [value]=\"x.name\">{{x.title||x.name}}</mat-option>\n      }\n    </mat-select>\n    @if (form.controls.series.hasError('required')) {\n    <mat-error [innerHTML]=\"'RequiredErr'|translate:('Series'|translate)\"></mat-error>\n    }\n  </mat-form-field>\n  @if (cube) {\n  <bizdoc-designer-cube-filter [cube]=\"cube\" [form]=\"form.controls.filters\"></bizdoc-designer-cube-filter>\n  }\n</ng-container>\n}\n", dependencies: [{ 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.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i4$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: DesignerCubeFilterComponent, selector: "bizdoc-designer-cube-filter", inputs: ["cube", "form"] }, { kind: "pipe", type: LocalizedStringPipe, name: "localizedString" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.1", type: PerformanceReportDesignComponent, selector: "ng-component", host: { classAttribute: "column" }, usesInheritance: true, ngImport: i0, template: "@if (mode !== 'widget') {\n<ng-container [formGroup]=\"form\">\n  @if (cubes.length > 1) {\n  <mat-form-field>\n    <mat-label>{{'Cube'|translate}}</mat-label>\n    <mat-select required formControlName=\"cube\" (selectionChange)=\"cubeSelected($event)\">\n      @for (c of cubes; track c) {\n      <mat-option [value]=\"c.name\">{{c.title|localizedString}}</mat-option>\n      }\n    </mat-select>\n  </mat-form-field>\n  }\n  @if (cube) {\n  <bizdoc-designer-cube-filter [cube]=\"cube\" [form]=\"form.controls.filters\"></bizdoc-designer-cube-filter>\n  }\n</ng-container>\n}\n", dependencies: [{ 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.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { 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: "component", type: i4$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: DesignerCubeFilterComponent, selector: "bizdoc-designer-cube-filter", inputs: ["cube", "form"] }, { kind: "pipe", type: LocalizedStringPipe, name: "localizedString" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 };
 PerformanceReportDesignComponent = __decorate([
     BizDoc({ selector: 'performance-report-designer' })
 ], PerformanceReportDesignComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.1", ngImport: i0, type: PerformanceReportDesignComponent, decorators: [{
             type: Component,
-            args: [{ host: { class: 'column' }, template: "@if (mode !== 'widget') {\n<ng-container [formGroup]=\"form\">\n  @if (cubes.length > 1) {\n  <mat-form-field>\n    <mat-label>{{'Cube'|translate}}</mat-label>\n    <mat-select required formControlName=\"cube\" (selectionChange)=\"cubeSelected($event)\">\n      @for (c of cubes; track c) {\n      <mat-option [value]=\"c.name\">{{c.title|localizedString}}</mat-option>\n      }\n    </mat-select>\n  </mat-form-field>\n  }\n  <mat-form-field>\n    <mat-label>{{'Series'|translate}}</mat-label>\n    <mat-select formControlName=\"series\" required>\n      @for (x of cube?.axes; track x) {\n      <mat-option [value]=\"x.name\">{{x.title||x.name}}</mat-option>\n      }\n    </mat-select>\n    @if (form.controls.series.hasError('required')) {\n    <mat-error [innerHTML]=\"'RequiredErr'|translate:('Series'|translate)\"></mat-error>\n    }\n  </mat-form-field>\n  @if (cube) {\n  <bizdoc-designer-cube-filter [cube]=\"cube\" [form]=\"form.controls.filters\"></bizdoc-designer-cube-filter>\n  }\n</ng-container>\n}\n" }]
+            args: [{ host: { class: 'column' }, template: "@if (mode !== 'widget') {\n<ng-container [formGroup]=\"form\">\n  @if (cubes.length > 1) {\n  <mat-form-field>\n    <mat-label>{{'Cube'|translate}}</mat-label>\n    <mat-select required formControlName=\"cube\" (selectionChange)=\"cubeSelected($event)\">\n      @for (c of cubes; track c) {\n      <mat-option [value]=\"c.name\">{{c.title|localizedString}}</mat-option>\n      }\n    </mat-select>\n  </mat-form-field>\n  }\n  @if (cube) {\n  <bizdoc-designer-cube-filter [cube]=\"cube\" [form]=\"form.controls.filters\"></bizdoc-designer-cube-filter>\n  }\n</ng-container>\n}\n" }]
         }] });
 
 let DocumentStateWidgetDesignComponent = class DocumentStateWidgetDesignComponent extends DesignerCubeElementComponent {
@@ -36303,5 +36476,5 @@ function withRoute(routes) {
  * 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, 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, TagsComponent, TagsControlDesigner, TasksComponent, TextAreaFieldDesigner, TimeAgoPipe, TimeControlDesigner, TimePicker, TimespanControlDesigner, TimespanInput, ToNowPipe, TooltipDirective, TraceViewComponent, TranslatePipe, TranslateService, TypeAutocomplete, TypeSelect, TypeValuePipe, UsageChartComponent, UsagePivotComponent, UsageReportArgs, UserNamePipe, UtilityRef, VersionCompareComponent, WidgetItemComponent, WidgetRef, YesNoControlDesigner, cleanup, getMonthList, isArray, isBoolean, isDate, isFunction, isImage, isMobile, isObject, isPrimitive, isPromise, isString, modelize, 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, 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, programName, registerComponents };
 //# sourceMappingURL=bizdoc-core.mjs.map