@bizdoc/core 2.3.16 → 2.3.17

package/fesm2022/bizdoc-core.mjs

@@ -139,9 +139,9 @@ import * as i4$5 from '@syncfusion/ej2-angular-inputs';
 import { SignatureModule } from '@syncfusion/ej2-angular-inputs';
 import { LinearGaugeModule, AnnotationsService, GaugeTooltipService } from '@syncfusion/ej2-angular-lineargauge';
 import * as i12 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 as Selection$1, 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, Chart as Chart$1, ChartComponent } from '@syncfusion/ej2-angular-charts';
 import * as i8$5 from '@syncfusion/ej2-angular-grids';
-import { GridModule, PagerModule, ExcelExportService, AggregateService, FreezeService, GroupService, PageService, ResizeService, SortService, SelectionService as SelectionService$1, Aggregate, Freeze, ExcelExport, Resize, Grid as Grid$1, GridComponent } from '@syncfusion/ej2-angular-grids';
+import { GridModule, PagerModule, ExcelExportService, AggregateService, FreezeService, GroupService, PageService, ResizeService, SortService, SelectionService as SelectionService$1, ExcelExport, Sort, Group, Page, 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';
 import { PivotViewModule, ExcelExportService as ExcelExportService$1, GroupingBarService, NumberFormattingService, GroupingService, PivotChartService, ConditionalFormattingService, GroupingBar, ExcelExport as ExcelExport$1, PivotChart, PivotView as PivotView$1, PivotViewComponent } from '@syncfusion/ej2-angular-pivotview';
 import * as i9$5 from '@syncfusion/ej2-angular-spreadsheet';
@@ -1974,8 +1974,6 @@ const STRINGS = {
         SaveChangesAsk: 'Are you sure you want to exit without saving?',
         DiscardChanges: 'Discard Changes',
         QuickMail: 'New mail',
-        EmailRequired: 'Email is required.',
-        Required: '{0} is required',
         Copyright: '© Moding ltd.',
         Filter: 'Filter',
         Status: 'Status',
@@ -2012,6 +2010,7 @@ const STRINGS = {
         Title: 'Title',
         Search: 'Search',
         SearchContacts: 'Search contacts',
+        Dates: 'Dates',
         From: 'From',
         To: 'To',
         Duration: 'Duration',
@@ -2088,6 +2087,7 @@ const STRINGS = {
         FillNotificationTill: 'Fill {0} till {1}',
         CompleteNotification: 'Complete {0}',
         CompleteNotificationTill: 'Complete {0} till {1}',
+        AreRequiredErr: '{0} are <strong>required</strong>',
         RequiredErr: '{0} is <strong>required</strong>',
         PatternErr: '{0} pattern <strong>not valid</strong>',
         EmailErr: 'Not a valid <strong>email</strong>',
@@ -2100,6 +2100,7 @@ const STRINGS = {
         MinLengthErr: 'לפחות <strong>{0}</strong> תווים',
         MaxLengthErr: 'עד <strong>{0}</strong> תווים',
         RequiredErr: '<strong>{0}</strong> חובה',
+        AreRequiredErr: '<strong>{0}</strong> חובה',
         FillNotification: 'מלא {0}',
         FillNotificationTill: 'מלא/י {0} עד {1}',
         FillNotificationTillMale: 'מלא {0} עד {1}',
@@ -2167,7 +2168,6 @@ const STRINGS = {
         About: 'אודות',
         Date: 'תאריך',
         Clear: 'נקה/י',
-        Required: 'חובה',
         NewFrom: '{0} מ-{1}',
         SheetN: 'גליון {0}',
         Connect: 'התחבר/י',
@@ -2384,6 +2384,7 @@ const STRINGS = {
         OutOfOfficeTip: 'מנה/י אדם אחר לחתום בהעדרך',
         OutOfOfficeTipMale: 'מנה אדם אחר לחתום בהעדרך',
         OutOfOfficeTipFemale: 'מני אדם אחר לחתום בהעדרך',
+        Dates: 'תאריכים',
         From: 'מ-',
         To: 'עד',
         Users: 'משתמשים',
@@ -10915,7 +10916,7 @@ class CubeSpreadsheetComponent {
         this.explore = new EventEmitter();
         this.loadingChange = new EventEmitter();
         this.id = `cube-spreadsheet-${CubeSpreadsheetComponent.nextId++}`;
-        this.dataSource = [];
+        this.rows = [];
         this.scrollSettings = { isFinite: true };
         this.numberStyle = { textAlign: 'right' };
         this.autoFillSettings = { showFillOptions: false };
@@ -11016,7 +11017,7 @@ class CubeSpreadsheetComponent {
             value: this.yAxis ? this.yAxis.title : this._translate.get('Value'),
             style
         });
-        this.dataSource = [{
+        this.rows = [{
                 cells, height: 25
             }];
         data.forEach(d => {
@@ -11034,14 +11035,14 @@ class CubeSpreadsheetComponent {
                 format: this._numberFormat,
                 value: (d.value || 0),
             });
-            this.dataSource.push({ cells, source: d, height: 25 });
+            this.rows.push({ cells, source: d, height: 25 });
         });
     }
     _dataseries(d) {
         const style = { fontWeight: 'bold', textAlign: 'center' };
         const cells = [{ value: '' }];
         this._xcolumns.forEach(c => cells.push({ value: c.value, style }));
-        this.dataSource = [{ cells, height: 25 }];
+        this.rows = [{ cells, height: 25 }];
         this._cindices?.forEach(i => {
             const cells = [{ value: i.title, style }], series = d.find(s => s.index === i.name), map = {};
             if (series) {
@@ -11051,7 +11052,7 @@ class CubeSpreadsheetComponent {
                     format: this._numberFormat,
                     style: this.numberStyle
                 }));
-                this.dataSource.push({ cells, height: 25 });
+                this.rows.push({ cells, height: 25 });
             }
         });
         this._yrows.forEach(r => {
@@ -11066,7 +11067,7 @@ class CubeSpreadsheetComponent {
             }
             else
                 this._xcolumns.forEach(_ => cells.push({ value: 0 }));
-            this.dataSource.push({ cells, height: 25 });
+            this.rows.push({ cells, height: 25 });
         });
     }
     _draw() {
@@ -11090,12 +11091,17 @@ class CubeSpreadsheetComponent {
                     columns: this.columns,
                     frozenColumns: this._series !== undefined ? 1 : 0,
                     frozenRows: 1,
-                    rows: this.dataSource,
+                    rows: this.rows,
                 }],
             width: this.width,
             height: this.height,
         }, this._elementRef.nativeElement);
     }
+    /**
+     *
+     * @param evt
+     * @returns
+     */
     select(evt) {
         const address = this.spreadsheet.getAddressInfo(evt.range);
         let [y, x, y1, x1] = address.indices;
@@ -11109,9 +11115,9 @@ class CubeSpreadsheetComponent {
         }
         const axes = {};
         let index;
-        if (y > this.dataSource.length - 1 || x > this.dataSource[y].cells.length - 1)
+        if (y > this.rows.length - 1 || x > this.rows[y].cells.length - 1)
             return;
-        if (y === y1 && x === x1 && this.dataSource[y].cells[x].value === 0)
+        if (y === y1 && x === x1 && this.rows[y].cells[x].value === 0)
             return;
         if (this._series) {
             if (y < 1) {
@@ -11139,7 +11145,7 @@ class CubeSpreadsheetComponent {
             let i = y;
             do {
                 this._axes.forEach(a => {
-                    const key = this.dataSource[i].source['_' + a.name];
+                    const key = this.rows[i].source['_' + a.name];
                     if (!axes[a.name])
                         axes[a.name] = key;
                     else if (isString(axes[a.name])) {
@@ -15715,11 +15721,11 @@ class ScheduleViewComponent {
         this._router.navigate(['mailbox/d', evt.documentId.encodeId()]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ScheduleViewComponent, deps: [{ token: SessionService }, { token: MailboxService }, { token: PanesRouter }, { token: PromptService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ScheduleViewComponent, selector: "bizdoc-schedule", inputs: { selectedDate: "selectedDate" }, outputs: { selectedDateChange: "selectedDateChange" }, viewQueries: [{ propertyName: "schedule", first: true, predicate: ["schedule"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\r\n  <button mat-icon-button [bizdocTooltip]=\"'PrevPage'|translate\" (click)=\"prev()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\r\n  <span class=\"mat-body\">{{ starting | dateRange : ending : calendarOptions  }}</span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'NextPage'|translate\" (click)=\"next()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'View'|translate\" [matMenuTriggerFor]=\"view\"><mat-icon>view_agenda</mat-icon></button>\r\n  <mat-menu #view>\r\n    <button mat-menu-item (click)=\"changeView('WorkWeek')\">{{'WorkWeek'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Month')\">{{'Month'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Agenda')\">{{'Agenda'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('MonthAgenda')\">{{'MonthAgenda'|translate}}</button>\r\n    <!--<button mat-menu-item (click)=\"changeView('TimelineMonth')\">{{'TimelineMonth'|translate}}</button>-->\r\n    <button mat-menu-item (click)=\"changeView('Day')\">{{'Day'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Year')\">{{'Year'|translate}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button (click)=\"export()\" bizdocTooltip=\"{{'Download' | translate}}\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<style scoped> \r\n  .e-popup-close {\r\n    display: none\r\n  }\r\n</style>\r\n<ejs-schedule #schedule [eventSettings]=\"eventSettings\" [currentView]=\"currentView\" [selectedDate]=\"selectedDate\"\r\n              [readonly]=\"true\" (navigating)=\"nav($event)\" height=\"100%\" [showHeaderBar]=\"false\"\r\n              (select)=\"select($event)\" class=\"flex\"\r\n              (eventClick)=\"eventClick($event)\" (dragStart)=\"drag($event)\" [@swape]=\"page\">\r\n  <e-views>\r\n    <e-view option=\"Month\"></e-view>\r\n    <e-view option=\"Day\"></e-view>\r\n    <e-view option=\"WorkWeek\"></e-view>\r\n    <e-view option=\"Agenda\"></e-view>\r\n    <e-view option=\"MonthAgenda\"></e-view>\r\n    <e-view option=\"TimelineMonth\"></e-view>\r\n    <e-view option=\"Year\"></e-view>\r\n  </e-views>\r\n</ejs-schedule>\r\n", styles: ["::ng-deep .e-dlg-container{display:none}::ng-deep .e-popup{display:none}:host{display:flex;flex-direction:column}\n", " \n  .e-popup-close {\n    display: none\n  }\n"], dependencies: [{ kind: "component", type: i5$4.ScheduleComponent, selector: "ejs-schedule", inputs: ["agendaDaysCount", "allowDragAndDrop", "allowInline", "allowKeyboardInteraction", "allowMultiCellSelection", "allowMultiDrag", "allowMultiRowSelection", "allowResizing", "allowSwiping", "calendarMode", "cellHeaderTemplate", "cellTemplate", "cssClass", "currentView", "dateFormat", "dateHeaderTemplate", "dateRangeTemplate", "dayHeaderTemplate", "editorFooterTemplate", "editorHeaderTemplate", "editorTemplate", "enableAdaptiveUI", "enableAllDayScroll", "enableHtmlSanitizer", "enablePersistence", "enableRecurrenceValidation", "enableRtl", "endHour", "eventDragArea", "eventSettings", "firstDayOfWeek", "firstMonthOfYear", "group", "headerIndentTemplate", "headerRows", "height", "hideEmptyAgendaDays", "locale", "maxDate", "minDate", "monthHeaderTemplate", "monthsCount", "quickInfoOnSelectionEnd", "quickInfoTemplates", "readonly", "resourceHeaderTemplate", "resources", "rowAutoHeight", "selectedDate", "showHeaderBar", "showQuickInfo", "showTimeIndicator", "showWeekNumber", "showWeekend", "startHour", "timeFormat", "timeScale", "timezone", "timezoneDataSource", "toolbarItems", "views", "weekRule", "width", "workDays", "workHours"], outputs: ["actionBegin", "actionComplete", "actionFailure", "cellClick", "cellDoubleClick", "created", "dataBinding", "dataBound", "destroyed", "drag", "dragStart", "dragStop", "eventClick", "eventDoubleClick", "eventRendered", "hover", "moreEventsClick", "navigating", "popupClose", "popupOpen", "renderCell", "resizeStart", "resizeStop", "resizing", "select", "virtualScrollStart", "virtualScrollStop", "currentViewChange", "selectedDateChange"] }, { kind: "directive", type: i5$4.ViewDirective, selector: "e-views>e-view", inputs: ["allowVirtualScrolling", "cellHeaderTemplate", "cellTemplate", "dateFormat", "dateHeaderTemplate", "dateRangeTemplate", "dayHeaderTemplate", "displayDate", "displayName", "enableLazyLoading", "endHour", "eventTemplate", "firstDayOfWeek", "firstMonthOfYear", "group", "headerIndentTemplate", "headerRows", "interval", "isSelected", "maxEventsPerRow", "monthHeaderTemplate", "monthsCount", "numberOfWeeks", "option", "orientation", "readonly", "resourceHeaderTemplate", "showWeekNumber", "showWeekend", "startHour", "timeFormat", "timeScale", "workDays"] }, { kind: "directive", type: i5$4.ViewsDirective, selector: "ejs-schedule>e-views" }, { kind: "component", type: i9$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i9.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: i11.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: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: DateRangePipe, name: "dateRange" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [swapAnimation] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ScheduleViewComponent, selector: "bizdoc-schedule", inputs: { selectedDate: "selectedDate" }, outputs: { selectedDateChange: "selectedDateChange" }, viewQueries: [{ propertyName: "schedule", first: true, predicate: ["schedule"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-toolbar class=\"nav-toolbar\">\r\n  <button mat-icon-button [bizdocTooltip]=\"'PrevPage'|translate\" (click)=\"prev()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\r\n  <span class=\"mat-body\">{{ starting | dateRange : ending : calendarOptions  }}</span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'NextPage'|translate\" (click)=\"next()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'View'|translate\" [matMenuTriggerFor]=\"view\"><mat-icon>view_agenda</mat-icon></button>\r\n  <mat-menu #view>\r\n    <button mat-menu-item (click)=\"changeView('WorkWeek')\">{{'WorkWeek'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Month')\">{{'Month'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Agenda')\">{{'Agenda'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('MonthAgenda')\">{{'MonthAgenda'|translate}}</button>\r\n    <!--<button mat-menu-item (click)=\"changeView('TimelineMonth')\">{{'TimelineMonth'|translate}}</button>-->\r\n    <button mat-menu-item (click)=\"changeView('Day')\">{{'Day'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Year')\">{{'Year'|translate}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button (click)=\"export()\" bizdocTooltip=\"{{'Download' | translate}}\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<style scoped> \r\n  .e-popup-close {\r\n    display: none\r\n  }\r\n</style>\r\n<ejs-schedule #schedule [eventSettings]=\"eventSettings\" [currentView]=\"currentView\" [selectedDate]=\"selectedDate\"\r\n              [readonly]=\"true\" (navigating)=\"nav($event)\" height=\"100%\" [showHeaderBar]=\"false\"\r\n              (select)=\"select($event)\" class=\"flex\"\r\n              (eventClick)=\"eventClick($event)\" (dragStart)=\"drag($event)\" [@swape]=\"page\" class=\"flex\">\r\n  <e-views>\r\n    <e-view option=\"Month\"></e-view>\r\n    <e-view option=\"Day\"></e-view>\r\n    <e-view option=\"WorkWeek\"></e-view>\r\n    <e-view option=\"Agenda\"></e-view>\r\n    <e-view option=\"MonthAgenda\"></e-view>\r\n    <e-view option=\"TimelineMonth\"></e-view>\r\n    <e-view option=\"Year\"></e-view>\r\n  </e-views>\r\n</ejs-schedule>\r\n", styles: ["::ng-deep .e-dlg-container{display:none}::ng-deep .e-popup{display:none}:host{display:flex;height:100%;flex-direction:column}\n", " \n  .e-popup-close {\n    display: none\n  }\n"], dependencies: [{ kind: "component", type: i5$4.ScheduleComponent, selector: "ejs-schedule", inputs: ["agendaDaysCount", "allowDragAndDrop", "allowInline", "allowKeyboardInteraction", "allowMultiCellSelection", "allowMultiDrag", "allowMultiRowSelection", "allowResizing", "allowSwiping", "calendarMode", "cellHeaderTemplate", "cellTemplate", "cssClass", "currentView", "dateFormat", "dateHeaderTemplate", "dateRangeTemplate", "dayHeaderTemplate", "editorFooterTemplate", "editorHeaderTemplate", "editorTemplate", "enableAdaptiveUI", "enableAllDayScroll", "enableHtmlSanitizer", "enablePersistence", "enableRecurrenceValidation", "enableRtl", "endHour", "eventDragArea", "eventSettings", "firstDayOfWeek", "firstMonthOfYear", "group", "headerIndentTemplate", "headerRows", "height", "hideEmptyAgendaDays", "locale", "maxDate", "minDate", "monthHeaderTemplate", "monthsCount", "quickInfoOnSelectionEnd", "quickInfoTemplates", "readonly", "resourceHeaderTemplate", "resources", "rowAutoHeight", "selectedDate", "showHeaderBar", "showQuickInfo", "showTimeIndicator", "showWeekNumber", "showWeekend", "startHour", "timeFormat", "timeScale", "timezone", "timezoneDataSource", "toolbarItems", "views", "weekRule", "width", "workDays", "workHours"], outputs: ["actionBegin", "actionComplete", "actionFailure", "cellClick", "cellDoubleClick", "created", "dataBinding", "dataBound", "destroyed", "drag", "dragStart", "dragStop", "eventClick", "eventDoubleClick", "eventRendered", "hover", "moreEventsClick", "navigating", "popupClose", "popupOpen", "renderCell", "resizeStart", "resizeStop", "resizing", "select", "virtualScrollStart", "virtualScrollStop", "currentViewChange", "selectedDateChange"] }, { kind: "directive", type: i5$4.ViewDirective, selector: "e-views>e-view", inputs: ["allowVirtualScrolling", "cellHeaderTemplate", "cellTemplate", "dateFormat", "dateHeaderTemplate", "dateRangeTemplate", "dayHeaderTemplate", "displayDate", "displayName", "enableLazyLoading", "endHour", "eventTemplate", "firstDayOfWeek", "firstMonthOfYear", "group", "headerIndentTemplate", "headerRows", "interval", "isSelected", "maxEventsPerRow", "monthHeaderTemplate", "monthsCount", "numberOfWeeks", "option", "orientation", "readonly", "resourceHeaderTemplate", "showWeekNumber", "showWeekend", "startHour", "timeFormat", "timeScale", "workDays"] }, { kind: "directive", type: i5$4.ViewsDirective, selector: "ejs-schedule>e-views" }, { kind: "component", type: i9$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i9.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: i11.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: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: DateRangePipe, name: "dateRange" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [swapAnimation] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ScheduleViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-schedule', animations: [swapAnimation], template: "<mat-toolbar class=\"nav-toolbar\">\r\n  <button mat-icon-button [bizdocTooltip]=\"'PrevPage'|translate\" (click)=\"prev()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\r\n  <span class=\"mat-body\">{{ starting | dateRange : ending : calendarOptions  }}</span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'NextPage'|translate\" (click)=\"next()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'View'|translate\" [matMenuTriggerFor]=\"view\"><mat-icon>view_agenda</mat-icon></button>\r\n  <mat-menu #view>\r\n    <button mat-menu-item (click)=\"changeView('WorkWeek')\">{{'WorkWeek'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Month')\">{{'Month'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Agenda')\">{{'Agenda'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('MonthAgenda')\">{{'MonthAgenda'|translate}}</button>\r\n    <!--<button mat-menu-item (click)=\"changeView('TimelineMonth')\">{{'TimelineMonth'|translate}}</button>-->\r\n    <button mat-menu-item (click)=\"changeView('Day')\">{{'Day'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Year')\">{{'Year'|translate}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button (click)=\"export()\" bizdocTooltip=\"{{'Download' | translate}}\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<style scoped> \r\n  .e-popup-close {\r\n    display: none\r\n  }\r\n</style>\r\n<ejs-schedule #schedule [eventSettings]=\"eventSettings\" [currentView]=\"currentView\" [selectedDate]=\"selectedDate\"\r\n              [readonly]=\"true\" (navigating)=\"nav($event)\" height=\"100%\" [showHeaderBar]=\"false\"\r\n              (select)=\"select($event)\" class=\"flex\"\r\n              (eventClick)=\"eventClick($event)\" (dragStart)=\"drag($event)\" [@swape]=\"page\">\r\n  <e-views>\r\n    <e-view option=\"Month\"></e-view>\r\n    <e-view option=\"Day\"></e-view>\r\n    <e-view option=\"WorkWeek\"></e-view>\r\n    <e-view option=\"Agenda\"></e-view>\r\n    <e-view option=\"MonthAgenda\"></e-view>\r\n    <e-view option=\"TimelineMonth\"></e-view>\r\n    <e-view option=\"Year\"></e-view>\r\n  </e-views>\r\n</ejs-schedule>\r\n", styles: ["::ng-deep .e-dlg-container{display:none}::ng-deep .e-popup{display:none}:host{display:flex;flex-direction:column}\n", " \n  .e-popup-close {\n    display: none\n  }\n"] }]
+            args: [{ selector: 'bizdoc-schedule', animations: [swapAnimation], template: "<mat-toolbar class=\"nav-toolbar\">\r\n  <button mat-icon-button [bizdocTooltip]=\"'PrevPage'|translate\" (click)=\"prev()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_left</mat-icon></button>\r\n  <span class=\"mat-body\">{{ starting | dateRange : ending : calendarOptions  }}</span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'NextPage'|translate\" (click)=\"next()\"><mat-icon class=\"mat-icon-rtl-mirror\">keyboard_arrow_right</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button [bizdocTooltip]=\"'View'|translate\" [matMenuTriggerFor]=\"view\"><mat-icon>view_agenda</mat-icon></button>\r\n  <mat-menu #view>\r\n    <button mat-menu-item (click)=\"changeView('WorkWeek')\">{{'WorkWeek'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Month')\">{{'Month'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Agenda')\">{{'Agenda'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('MonthAgenda')\">{{'MonthAgenda'|translate}}</button>\r\n    <!--<button mat-menu-item (click)=\"changeView('TimelineMonth')\">{{'TimelineMonth'|translate}}</button>-->\r\n    <button mat-menu-item (click)=\"changeView('Day')\">{{'Day'|translate}}</button>\r\n    <button mat-menu-item (click)=\"changeView('Year')\">{{'Year'|translate}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button (click)=\"export()\" bizdocTooltip=\"{{'Download' | translate}}\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<style scoped> \r\n  .e-popup-close {\r\n    display: none\r\n  }\r\n</style>\r\n<ejs-schedule #schedule [eventSettings]=\"eventSettings\" [currentView]=\"currentView\" [selectedDate]=\"selectedDate\"\r\n              [readonly]=\"true\" (navigating)=\"nav($event)\" height=\"100%\" [showHeaderBar]=\"false\"\r\n              (select)=\"select($event)\" class=\"flex\"\r\n              (eventClick)=\"eventClick($event)\" (dragStart)=\"drag($event)\" [@swape]=\"page\" class=\"flex\">\r\n  <e-views>\r\n    <e-view option=\"Month\"></e-view>\r\n    <e-view option=\"Day\"></e-view>\r\n    <e-view option=\"WorkWeek\"></e-view>\r\n    <e-view option=\"Agenda\"></e-view>\r\n    <e-view option=\"MonthAgenda\"></e-view>\r\n    <e-view option=\"TimelineMonth\"></e-view>\r\n    <e-view option=\"Year\"></e-view>\r\n  </e-views>\r\n</ejs-schedule>\r\n", styles: ["::ng-deep .e-dlg-container{display:none}::ng-deep .e-popup{display:none}:host{display:flex;height:100%;flex-direction:column}\n", " \n  .e-popup-close {\n    display: none\n  }\n"] }]
         }], ctorParameters: () => [{ type: SessionService }, { type: MailboxService }, { type: PanesRouter }, { type: PromptService }], propDecorators: { selectedDateChange: [{
                 type: Output
             }], selectedDate: [{
@@ -16359,11 +16365,11 @@ class CubeMatrixComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: CubeMatrixComponent, deps: [{ token: PromptService }, { token: CubeService }, { token: SessionService }, { token: TranslateService }, { token: DatasourceService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: CubeMatrixComponent, selector: "bizdoc-cube-matrix", inputs: { seriesTotalLabel: "seriesTotalLabel", xAxisTotalLabel: "xAxisTotalLabel", _cube: ["cube", "_cube"], _xAxis: ["xAxis", "_xAxis"], _series: ["series", "_series"], _indices: ["indices", "_indices"], indexAt: "indexAt", placeAt: "placeAt", scope: "scope", sum: "sum", filters: "filters", loading: "loading", interactive: "interactive" }, outputs: { onExplore: "explore", loadingChange: "loadingChange" }, viewQueries: [{ propertyName: "tableElement", first: true, predicate: ["table"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<table #table class=\"mat-mdc-table cube-table\" (mouseleave)=\"_move(-1, -1)\" *ngIf=\"data\">\r\n  <thead>\r\n    <!-- headers -->\r\n    <tr class=\"mat-mdc-header-row\">\r\n      <th></th>\r\n      <th *ngFor=\"let column of columns; let x = index\"\r\n          (mouseenter)=\"_move(x + 1, -2)\" class=\"mat-header-cell\">\r\n        {{ column.value }}\r\n      </th>\r\n      <th class=\"mat-mdc-header-cell\">{{xAxisTotalLabel}}</th>\r\n    </tr>\r\n  </thead>\r\n  <tbody>\r\n    <!-- rows -->\r\n    <tr *ngFor=\"let row of rows; let y = index\" class=\"mat-mdc-row\"\r\n        [class.cube-index]=\"row.index\">\r\n      <th class=\"mat-mdc-header-cell\" (mouseenter)=\"_move(-2, y )\">{{ row.value }}</th>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, y )\">\r\n        <span *ngIf=\"data[row.key][column.key] !== '0'; else zero\" \r\n          [class.explorable]=\"interactive && column.explorable !== false && row.explorable !== false\"\r\n          (click)=\"explore(column, row)\">\r\n          {{ data[row.key][column.key] }}\r\n        </span>\r\n      </td>\r\n      <th class=\"mat-mdc-cell figure\" (mouseenter)=\"_move(-1, y )\">\r\n        {{ data[row.key]['_total'] }}\r\n      </th>\r\n    </tr>\r\n  </tbody>\r\n  <tfoot>\r\n    <!-- footer -->\r\n    <tr class=\"mat-mdc-footer-row\">\r\n      <td class=\"mat-mdc-footer-cell\">{{seriesTotalLabel}}</td>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-footer-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, -2)\"\r\n          [class.negative-figure]=\"totals[column.key].startsWith('-')\">\r\n        <ng-container *ngIf=\"totals[column.key] !== undefined\">\r\n          {{ totals[column.key] }}\r\n        </ng-container>\r\n      </td>\r\n      <th class=\"mat-mdc-footer-cell figure\">{{ totals['_grand'] }}</th>\r\n    </tr>\r\n  </tfoot>\r\n</table>\r\n<ng-template #zero>0</ng-template>\r\n", styles: [".explorable{cursor:pointer}.cube-table{width:100%;table-layout:fixed}.cube-table th{cursor:default}.cube-table th.figure{font-weight:500}.cube-table td,.cube-table th{padding-right:8px}.cube-table tfoot tr td{border-bottom:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [matrixAnimation] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: CubeMatrixComponent, selector: "bizdoc-cube-matrix", inputs: { seriesTotalLabel: "seriesTotalLabel", xAxisTotalLabel: "xAxisTotalLabel", _cube: ["cube", "_cube"], _xAxis: ["xAxis", "_xAxis"], _series: ["series", "_series"], _indices: ["indices", "_indices"], indexAt: "indexAt", placeAt: "placeAt", scope: "scope", sum: "sum", filters: "filters", loading: "loading", interactive: "interactive" }, outputs: { onExplore: "explore", loadingChange: "loadingChange" }, viewQueries: [{ propertyName: "tableElement", first: true, predicate: ["table"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<table #table class=\"mat-mdc-table cube-table\" (mouseleave)=\"_move(-1, -1)\" *ngIf=\"data\">\r\n  <thead>\r\n    <!-- headers -->\r\n    <tr class=\"mat-mdc-header-row\">\r\n      <th></th>\r\n      <th *ngFor=\"let column of columns; let x = index\"\r\n          (mouseenter)=\"_move(x + 1, -2)\" class=\"mat-mdc-header-cell\">\r\n        {{ column.value }}\r\n      </th>\r\n      <th class=\"mat-mdc-header-cell\">{{xAxisTotalLabel}}</th>\r\n    </tr>\r\n  </thead>\r\n  <tbody>\r\n    <!-- rows -->\r\n    <tr *ngFor=\"let row of rows; let y = index\" class=\"mat-mdc-row\"\r\n        [class.cube-index]=\"row.index\">\r\n      <th class=\"mat-mdc-header-cell\" (mouseenter)=\"_move(-2, y )\">{{ row.value }}</th>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, y )\">\r\n        <span *ngIf=\"data[row.key][column.key] !== '0'; else zero\" \r\n          [class.explorable]=\"interactive && column.explorable !== false && row.explorable !== false\"\r\n          (click)=\"explore(column, row)\">\r\n          {{ data[row.key][column.key] }}\r\n        </span>\r\n      </td>\r\n      <th class=\"mat-mdc-cell figure\" (mouseenter)=\"_move(-1, y )\">\r\n        {{ data[row.key]['_total'] }}\r\n      </th>\r\n    </tr>\r\n  </tbody>\r\n  <tfoot>\r\n    <!-- footer -->\r\n    <tr class=\"mat-mdc-footer-row\">\r\n      <td class=\"mat-mdc-footer-cell\">{{seriesTotalLabel}}</td>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-footer-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, -2)\"\r\n          [class.negative-figure]=\"totals[column.key].startsWith('-')\">\r\n        <ng-container *ngIf=\"totals[column.key] !== undefined\">\r\n          {{ totals[column.key] }}\r\n        </ng-container>\r\n      </td>\r\n      <th class=\"mat-mdc-footer-cell figure\">{{ totals['_grand'] }}</th>\r\n    </tr>\r\n  </tfoot>\r\n</table>\r\n<ng-template #zero>0</ng-template>\r\n", styles: [".explorable{cursor:pointer}.cube-table{width:100%;table-layout:fixed}.cube-table th{cursor:default}.cube-table th.figure{font-weight:500}.cube-table td,.cube-table th{padding-right:8px}.cube-table tfoot tr td{border-bottom:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [matrixAnimation] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: CubeMatrixComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-cube-matrix', animations: [matrixAnimation], template: "<table #table class=\"mat-mdc-table cube-table\" (mouseleave)=\"_move(-1, -1)\" *ngIf=\"data\">\r\n  <thead>\r\n    <!-- headers -->\r\n    <tr class=\"mat-mdc-header-row\">\r\n      <th></th>\r\n      <th *ngFor=\"let column of columns; let x = index\"\r\n          (mouseenter)=\"_move(x + 1, -2)\" class=\"mat-header-cell\">\r\n        {{ column.value }}\r\n      </th>\r\n      <th class=\"mat-mdc-header-cell\">{{xAxisTotalLabel}}</th>\r\n    </tr>\r\n  </thead>\r\n  <tbody>\r\n    <!-- rows -->\r\n    <tr *ngFor=\"let row of rows; let y = index\" class=\"mat-mdc-row\"\r\n        [class.cube-index]=\"row.index\">\r\n      <th class=\"mat-mdc-header-cell\" (mouseenter)=\"_move(-2, y )\">{{ row.value }}</th>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, y )\">\r\n        <span *ngIf=\"data[row.key][column.key] !== '0'; else zero\" \r\n          [class.explorable]=\"interactive && column.explorable !== false && row.explorable !== false\"\r\n          (click)=\"explore(column, row)\">\r\n          {{ data[row.key][column.key] }}\r\n        </span>\r\n      </td>\r\n      <th class=\"mat-mdc-cell figure\" (mouseenter)=\"_move(-1, y )\">\r\n        {{ data[row.key]['_total'] }}\r\n      </th>\r\n    </tr>\r\n  </tbody>\r\n  <tfoot>\r\n    <!-- footer -->\r\n    <tr class=\"mat-mdc-footer-row\">\r\n      <td class=\"mat-mdc-footer-cell\">{{seriesTotalLabel}}</td>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-footer-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, -2)\"\r\n          [class.negative-figure]=\"totals[column.key].startsWith('-')\">\r\n        <ng-container *ngIf=\"totals[column.key] !== undefined\">\r\n          {{ totals[column.key] }}\r\n        </ng-container>\r\n      </td>\r\n      <th class=\"mat-mdc-footer-cell figure\">{{ totals['_grand'] }}</th>\r\n    </tr>\r\n  </tfoot>\r\n</table>\r\n<ng-template #zero>0</ng-template>\r\n", styles: [".explorable{cursor:pointer}.cube-table{width:100%;table-layout:fixed}.cube-table th{cursor:default}.cube-table th.figure{font-weight:500}.cube-table td,.cube-table th{padding-right:8px}.cube-table tfoot tr td{border-bottom:none}\n"] }]
+            args: [{ selector: 'bizdoc-cube-matrix', animations: [matrixAnimation], template: "<table #table class=\"mat-mdc-table cube-table\" (mouseleave)=\"_move(-1, -1)\" *ngIf=\"data\">\r\n  <thead>\r\n    <!-- headers -->\r\n    <tr class=\"mat-mdc-header-row\">\r\n      <th></th>\r\n      <th *ngFor=\"let column of columns; let x = index\"\r\n          (mouseenter)=\"_move(x + 1, -2)\" class=\"mat-mdc-header-cell\">\r\n        {{ column.value }}\r\n      </th>\r\n      <th class=\"mat-mdc-header-cell\">{{xAxisTotalLabel}}</th>\r\n    </tr>\r\n  </thead>\r\n  <tbody>\r\n    <!-- rows -->\r\n    <tr *ngFor=\"let row of rows; let y = index\" class=\"mat-mdc-row\"\r\n        [class.cube-index]=\"row.index\">\r\n      <th class=\"mat-mdc-header-cell\" (mouseenter)=\"_move(-2, y )\">{{ row.value }}</th>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, y )\">\r\n        <span *ngIf=\"data[row.key][column.key] !== '0'; else zero\" \r\n          [class.explorable]=\"interactive && column.explorable !== false && row.explorable !== false\"\r\n          (click)=\"explore(column, row)\">\r\n          {{ data[row.key][column.key] }}\r\n        </span>\r\n      </td>\r\n      <th class=\"mat-mdc-cell figure\" (mouseenter)=\"_move(-1, y )\">\r\n        {{ data[row.key]['_total'] }}\r\n      </th>\r\n    </tr>\r\n  </tbody>\r\n  <tfoot>\r\n    <!-- footer -->\r\n    <tr class=\"mat-mdc-footer-row\">\r\n      <td class=\"mat-mdc-footer-cell\">{{seriesTotalLabel}}</td>\r\n      <td *ngFor=\"let column of columns; let x = index\" class=\"mat-mdc-footer-cell figure\"\r\n          (mouseenter)=\"_move(x + 1, -2)\"\r\n          [class.negative-figure]=\"totals[column.key].startsWith('-')\">\r\n        <ng-container *ngIf=\"totals[column.key] !== undefined\">\r\n          {{ totals[column.key] }}\r\n        </ng-container>\r\n      </td>\r\n      <th class=\"mat-mdc-footer-cell figure\">{{ totals['_grand'] }}</th>\r\n    </tr>\r\n  </tfoot>\r\n</table>\r\n<ng-template #zero>0</ng-template>\r\n", styles: [".explorable{cursor:pointer}.cube-table{width:100%;table-layout:fixed}.cube-table th{cursor:default}.cube-table th.figure{font-weight:500}.cube-table td,.cube-table th{padding-right:8px}.cube-table tfoot tr td{border-bottom:none}\n"] }]
         }], ctorParameters: () => [{ type: PromptService }, { type: CubeService }, { type: SessionService }, { type: TranslateService }, { type: DatasourceService }], propDecorators: { tableElement: [{
                 type: ViewChild,
                 args: ['table']
@@ -18100,11 +18106,11 @@ class OptionsComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: OptionsComponent, deps: [{ token: OPTION_PANEL }, { token: i1$1.OverlayRef }, { token: i1.FormBuilder }, { token: AccountService }, { token: PromptService }, { token: SessionService }, { token: BIZDOC_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: OptionsComponent, selector: "bizdoc-options", viewQueries: [{ propertyName: "substitueInput", first: true, predicate: ["substitueInput"], descendants: true, read: MatInput }, { propertyName: "grantInput", first: true, predicate: ["grantInput"], descendants: true, read: MatChipInput }, { propertyName: "outOfOffice", first: true, predicate: ["outOfOffice"], descendants: true, read: MatExpansionPanel, static: true }, { propertyName: "notifications", first: true, predicate: ["notifications"], descendants: true, read: MatExpansionPanel, static: true }], ngImport: i0, template: "<form [formGroup]=\"form\" autocomplete=\"off\">\r\n  <mat-accordion>\r\n    <mat-expansion-panel #notifications>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Notifications' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>notifications</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"notifications\" class=\"column\">\r\n        <div class=\"row\">\r\n          <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"toggleSound()\" [bizdocTooltip]=\"'Sound'|translate\"><mat-icon>{{options.notifications.sound ? 'volume_up' : 'volume_off'}}</mat-icon></button>\r\n        </div>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #emails>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Emails' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>alternate_email</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"emails\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #outOfOffice>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'OutOfOffice' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>trending_flat</mat-icon>-->\r\n          <!--{{'OutOfOfficeTip' | translate}}-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"outOfOffice\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field class=\"flex\">\r\n          <input matInput [formControl]=\"substitueId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n                 [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\r\n          <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\r\n                            (optionSelected)=\"setSubstitute($event)\">\r\n            <mat-option *ngFor=\"let u of susers$ | async\" [value]=\"u\">\r\n              <span>{{u.name}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n        <mat-form-field>\r\n          <mat-label>{{'Dates'|translate}}</mat-label>\r\n          <mat-date-range-input [rangePicker]=\"dates\" required>\r\n            <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n            <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n          </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #grantAccess>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'GrantAccess' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>account_circle</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"grantAccess\" class=\"grant-section\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <mat-form-field>\r\n          <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\r\n            <mat-chip-row *ngFor=\"let u of form.value.grantAccess.users || []\"\r\n                          (removed)=\"removeGrant(u)\">\r\n              {{u | userName | async}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [formControl]=\"gusers\" placeholder=\"{{'Users'| translate}}\"\r\n                 #grantInput\r\n                 [matAutocomplete]=\"grantAuto\"\r\n                 [matChipInputFor]=\"grantList\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n          <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n            <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n              {{u.name}}\r\n              <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'GrantTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #preferences>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Preferences' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon></mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div class=\"column\">\r\n        <mat-form-field>\r\n          <mat-chip-grid #chips>\r\n            <mat-chip-row *ngFor=\"let item of form.value.tags\"\r\n                          [removable]=\"true\" (removed)=\"removeTag(item)\">\r\n              {{item}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [placeholder]=\"'Tags'|translate\"\r\n                 [matChipInputFor]=\"chips\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\r\n                 [matChipInputAddOnBlur]=\"true\"\r\n                 (matChipInputTokenEnd)=\"addTag($event)\">\r\n        </mat-form-field>\r\n        <mat-slide-toggle [formControl]=\"aRIA\">{{'ARIA' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n  </mat-accordion>\r\n</form>\r\n", styles: [":host{max-width:80vw}.grant-section{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i5$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i5$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i5$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: i8$4.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i8$4.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i8$4.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i8$4.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i8$4.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: i3$7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i3$7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i3$7.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i3$7.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i3$7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$5.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: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: 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: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.1", type: OptionsComponent, selector: "bizdoc-options", viewQueries: [{ propertyName: "substitueInput", first: true, predicate: ["substitueInput"], descendants: true, read: MatInput }, { propertyName: "grantInput", first: true, predicate: ["grantInput"], descendants: true, read: MatChipInput }, { propertyName: "outOfOffice", first: true, predicate: ["outOfOffice"], descendants: true, read: MatExpansionPanel, static: true }, { propertyName: "notifications", first: true, predicate: ["notifications"], descendants: true, read: MatExpansionPanel, static: true }], ngImport: i0, template: "<form [formGroup]=\"form\" autocomplete=\"off\">\r\n  <mat-accordion>\r\n    <mat-expansion-panel #notifications>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Notifications' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>notifications</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"notifications\" class=\"column\">\r\n        <div class=\"row\">\r\n          <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"toggleSound()\" [bizdocTooltip]=\"'Sound'|translate\"><mat-icon>{{options.notifications.sound ? 'volume_up' : 'volume_off'}}</mat-icon></button>\r\n        </div>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #emails>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Emails' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>alternate_email</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"emails\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #outOfOffice>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'OutOfOffice' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>trending_flat</mat-icon>-->\r\n          <!--{{'OutOfOfficeTip' | translate}}-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"outOfOffice\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field class=\"flex\">\r\n          <input matInput [formControl]=\"substitueId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n                 [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\r\n          <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\r\n                            (optionSelected)=\"setSubstitute($event)\">\r\n            <mat-option *ngFor=\"let u of susers$ | async\" [value]=\"u\">\r\n              <span>{{u.name}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n        <mat-form-field>\r\n          <mat-label>{{'Dates'|translate}}</mat-label>\r\n          <mat-date-range-input [rangePicker]=\"dates\" required>\r\n            <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n            <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n          </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n          @if (form.controls.outOfOffice.controls.from.hasError('required') || form.controls.outOfOffice.controls.to.hasError('required')) {\r\n          <mat-error [innerHTML]=\"'AreRequiredErr'|translate : ('Dates'|translate)\"></mat-error>\r\n          }\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #grantAccess>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'GrantAccess' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>account_circle</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"grantAccess\" class=\"grant-section\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <mat-form-field>\r\n          <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\r\n            <mat-chip-row *ngFor=\"let u of form.value.grantAccess.users || []\"\r\n                          (removed)=\"removeGrant(u)\">\r\n              {{u | userName | async}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [formControl]=\"gusers\" placeholder=\"{{'Users'| translate}}\"\r\n                 #grantInput\r\n                 [matAutocomplete]=\"grantAuto\"\r\n                 [matChipInputFor]=\"grantList\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n          <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n            <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n              {{u.name}}\r\n              <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'GrantTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #preferences>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Preferences' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon></mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div class=\"column\">\r\n        <mat-form-field>\r\n          <mat-chip-grid #chips>\r\n            <mat-chip-row *ngFor=\"let item of form.value.tags\"\r\n                          [removable]=\"true\" (removed)=\"removeTag(item)\">\r\n              {{item}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [placeholder]=\"'Tags'|translate\"\r\n                 [matChipInputFor]=\"chips\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\r\n                 [matChipInputAddOnBlur]=\"true\"\r\n                 (matChipInputTokenEnd)=\"addTag($event)\">\r\n        </mat-form-field>\r\n        <mat-slide-toggle [formControl]=\"aRIA\">{{'ARIA' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n  </mat-accordion>\r\n</form>\r\n", styles: [":host{max-width:80vw}.grant-section{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i5$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i5$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i5$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: i8$4.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i8$4.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i8$4.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i8$4.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i8$4.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: i3$7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i3$7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i3$7.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i3$7.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i3$7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$5.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: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: 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: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: OptionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bizdoc-options', template: "<form [formGroup]=\"form\" autocomplete=\"off\">\r\n  <mat-accordion>\r\n    <mat-expansion-panel #notifications>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Notifications' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>notifications</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"notifications\" class=\"column\">\r\n        <div class=\"row\">\r\n          <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"toggleSound()\" [bizdocTooltip]=\"'Sound'|translate\"><mat-icon>{{options.notifications.sound ? 'volume_up' : 'volume_off'}}</mat-icon></button>\r\n        </div>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #emails>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Emails' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>alternate_email</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"emails\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #outOfOffice>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'OutOfOffice' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>trending_flat</mat-icon>-->\r\n          <!--{{'OutOfOfficeTip' | translate}}-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"outOfOffice\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field class=\"flex\">\r\n          <input matInput [formControl]=\"substitueId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n                 [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\r\n          <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\r\n                            (optionSelected)=\"setSubstitute($event)\">\r\n            <mat-option *ngFor=\"let u of susers$ | async\" [value]=\"u\">\r\n              <span>{{u.name}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n        <mat-form-field>\r\n          <mat-label>{{'Dates'|translate}}</mat-label>\r\n          <mat-date-range-input [rangePicker]=\"dates\" required>\r\n            <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n            <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n          </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #grantAccess>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'GrantAccess' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>account_circle</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"grantAccess\" class=\"grant-section\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <mat-form-field>\r\n          <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\r\n            <mat-chip-row *ngFor=\"let u of form.value.grantAccess.users || []\"\r\n                          (removed)=\"removeGrant(u)\">\r\n              {{u | userName | async}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [formControl]=\"gusers\" placeholder=\"{{'Users'| translate}}\"\r\n                 #grantInput\r\n                 [matAutocomplete]=\"grantAuto\"\r\n                 [matChipInputFor]=\"grantList\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n          <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n            <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n              {{u.name}}\r\n              <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'GrantTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #preferences>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Preferences' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon></mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div class=\"column\">\r\n        <mat-form-field>\r\n          <mat-chip-grid #chips>\r\n            <mat-chip-row *ngFor=\"let item of form.value.tags\"\r\n                          [removable]=\"true\" (removed)=\"removeTag(item)\">\r\n              {{item}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [placeholder]=\"'Tags'|translate\"\r\n                 [matChipInputFor]=\"chips\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\r\n                 [matChipInputAddOnBlur]=\"true\"\r\n                 (matChipInputTokenEnd)=\"addTag($event)\">\r\n        </mat-form-field>\r\n        <mat-slide-toggle [formControl]=\"aRIA\">{{'ARIA' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n  </mat-accordion>\r\n</form>\r\n", styles: [":host{max-width:80vw}.grant-section{display:flex;flex-direction:column}\n"] }]
+            args: [{ selector: 'bizdoc-options', template: "<form [formGroup]=\"form\" autocomplete=\"off\">\r\n  <mat-accordion>\r\n    <mat-expansion-panel #notifications>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Notifications' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>notifications</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"notifications\" class=\"column\">\r\n        <div class=\"row\">\r\n          <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"toggleSound()\" [bizdocTooltip]=\"'Sound'|translate\"><mat-icon>{{options.notifications.sound ? 'volume_up' : 'volume_off'}}</mat-icon></button>\r\n        </div>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"myDocumentStateChange\">{{'MyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"anyDocumentStateChange\">{{'AnyStateChange' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentMyDocument\">{{'CommentMyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"commentAnyDocument\">{{'CommentAnyDocument' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"likes\" [style.display]=\"voating?'':'none'\">{{'LikedComment' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"tagged\">{{'TaggedInComments' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"upcomingEvents\">{{'UpcomingEvents' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"cubeAnomaly\">{{'CubeAnomaly' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #emails>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Emails' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>alternate_email</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"emails\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-slide-toggle formControlName=\"mail\">{{'Mails' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"chat\">{{'Conversations' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"notifications\">{{'EmailNotifications' | translate}}</mat-slide-toggle>\r\n        <mat-slide-toggle formControlName=\"events\">{{'AlarmEvents' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #outOfOffice>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'OutOfOffice' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>trending_flat</mat-icon>-->\r\n          <!--{{'OutOfOfficeTip' | translate}}-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"outOfOffice\" class=\"column\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <br />\r\n        <mat-form-field class=\"flex\">\r\n          <input matInput [formControl]=\"substitueId\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n                 [placeholder]=\"'Associate' | translate\" [required]=\"form.value.outOfOffice.active\" />\r\n          <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"display\"\r\n                            (optionSelected)=\"setSubstitute($event)\">\r\n            <mat-option *ngFor=\"let u of susers$ | async\" [value]=\"u\">\r\n              <span>{{u.name}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'OutOfOfficeTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n        <mat-form-field>\r\n          <mat-label>{{'Dates'|translate}}</mat-label>\r\n          <mat-date-range-input [rangePicker]=\"dates\" required>\r\n            <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n            <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n          </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n          @if (form.controls.outOfOffice.controls.from.hasError('required') || form.controls.outOfOffice.controls.to.hasError('required')) {\r\n          <mat-error [innerHTML]=\"'AreRequiredErr'|translate : ('Dates'|translate)\"></mat-error>\r\n          }\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #grantAccess>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'GrantAccess' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon>account_circle</mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div formGroupName=\"grantAccess\" class=\"grant-section\">\r\n        <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n        <mat-form-field>\r\n          <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!form.value.grantAccess.active\">\r\n            <mat-chip-row *ngFor=\"let u of form.value.grantAccess.users || []\"\r\n                          (removed)=\"removeGrant(u)\">\r\n              {{u | userName | async}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [formControl]=\"gusers\" placeholder=\"{{'Users'| translate}}\"\r\n                 #grantInput\r\n                 [matAutocomplete]=\"grantAuto\"\r\n                 [matChipInputFor]=\"grantList\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n          <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n            <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n              {{u.name}}\r\n              <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n            </mat-option>\r\n          </mat-autocomplete>\r\n          <mat-hint>{{'GrantTip' | translate}}</mat-hint>\r\n        </mat-form-field>\r\n      </div>\r\n    </mat-expansion-panel>\r\n    <mat-expansion-panel #preferences>\r\n      <mat-expansion-panel-header>\r\n        <mat-panel-title>\r\n          {{'Preferences' | translate}}\r\n        </mat-panel-title>\r\n        <mat-panel-description>\r\n          <!--<mat-icon></mat-icon>-->\r\n        </mat-panel-description>\r\n      </mat-expansion-panel-header>\r\n      <div class=\"column\">\r\n        <mat-form-field>\r\n          <mat-chip-grid #chips>\r\n            <mat-chip-row *ngFor=\"let item of form.value.tags\"\r\n                          [removable]=\"true\" (removed)=\"removeTag(item)\">\r\n              {{item}}\r\n              <mat-icon matChipRemove>cancel</mat-icon>\r\n            </mat-chip-row>\r\n          </mat-chip-grid>\r\n          <input [placeholder]=\"'Tags'|translate\"\r\n                 [matChipInputFor]=\"chips\"\r\n                 [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\r\n                 [matChipInputAddOnBlur]=\"true\"\r\n                 (matChipInputTokenEnd)=\"addTag($event)\">\r\n        </mat-form-field>\r\n        <mat-slide-toggle [formControl]=\"aRIA\">{{'ARIA' | translate}}</mat-slide-toggle>\r\n      </div>\r\n    </mat-expansion-panel>\r\n  </mat-accordion>\r\n</form>\r\n", styles: [":host{max-width:80vw}.grant-section{display:flex;flex-direction:column}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [OPTION_PANEL]
@@ -20690,6 +20696,10 @@ class BizDocApp {
             if (meta)
                 meta.content = this._session.getPrimery();
             document.body.classList.value = t.name;
+            if (t.dark)
+                document.body.classList.add('e-dark-mode');
+            else
+                document.body.classList.remove('e-dark-mode');
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: BizDocApp, deps: [{ token: i0.ViewContainerRef }, { token: SessionService }, { token: HubService }], target: i0.ɵɵFactoryTarget.Component }); }
@@ -21610,7 +21620,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.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$1, 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);
 
 class SyncfusionDiagramModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: SyncfusionDiagramModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -21660,7 +21670,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImpor
                     ]
                 }]
         }] });
-Grid$1.Inject(Selection, Aggregate, Freeze, ExcelExport, Resize);
+Grid$1.Inject(ExcelExport, Sort, Group, Page);
 
 CircularGauge.Inject(Annotations, GaugeTooltip, Legend$1);
 class SyncfusionCircularGaugeModule {
@@ -22079,7 +22089,7 @@ let AssignActionComponent = class AssignActionComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: AssignActionComponent, deps: [{ token: i1.FormBuilder }, { token: SessionService }, { token: AccountService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: AssignActionComponent, selector: "ng-component", viewQueries: [{ propertyName: "nameInput", first: true, predicate: ["nameInput"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userId\r\n           cdkFocusInitial matInput\r\n           [matAutocomplete]=\"auto\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected($event)\" [displayWith]=\"displayWith\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'Required'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <div>\r\n    <mat-checkbox formControlName=fyi> {{ 'AssignFYI' | translate }}</mat-checkbox>\r\n    &nbsp;\r\n<!--    <mat-checkbox formControlName=roundtrip> {{ 'AssignRoundtrip' | translate }}</mat-checkbox>-->\r\n  </div>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: AssignActionComponent, selector: "ng-component", viewQueries: [{ propertyName: "nameInput", first: true, predicate: ["nameInput"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userId\r\n           cdkFocusInitial matInput\r\n           [matAutocomplete]=\"auto\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected($event)\" [displayWith]=\"displayWith\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'RequiredErr'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <div>\r\n    <mat-checkbox formControlName=fyi> {{ 'AssignFYI' | translate }}</mat-checkbox>\r\n    &nbsp;\r\n<!--    <mat-checkbox formControlName=roundtrip> {{ 'AssignRoundtrip' | translate }}</mat-checkbox>-->\r\n  </div>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 };
 AssignActionComponent = __decorate([
     BizDoc({
@@ -22088,7 +22098,7 @@ AssignActionComponent = __decorate([
 ], AssignActionComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: AssignActionComponent, decorators: [{
             type: Component,
-            args: [{ template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userId\r\n           cdkFocusInitial matInput\r\n           [matAutocomplete]=\"auto\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected($event)\" [displayWith]=\"displayWith\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'Required'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <div>\r\n    <mat-checkbox formControlName=fyi> {{ 'AssignFYI' | translate }}</mat-checkbox>\r\n    &nbsp;\r\n<!--    <mat-checkbox formControlName=roundtrip> {{ 'AssignRoundtrip' | translate }}</mat-checkbox>-->\r\n  </div>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n" }]
+            args: [{ template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userId\r\n           cdkFocusInitial matInput\r\n           [matAutocomplete]=\"auto\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected($event)\" [displayWith]=\"displayWith\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'RequiredErr'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <div>\r\n    <mat-checkbox formControlName=fyi> {{ 'AssignFYI' | translate }}</mat-checkbox>\r\n    &nbsp;\r\n<!--    <mat-checkbox formControlName=roundtrip> {{ 'AssignRoundtrip' | translate }}</mat-checkbox>-->\r\n  </div>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n" }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: SessionService }, { type: AccountService }], propDecorators: { nameInput: [{
                 type: ViewChild,
                 args: ['nameInput', { static: true, read: ElementRef }]
@@ -22116,7 +22126,7 @@ let ReturnActionComponent = class ReturnActionComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ReturnActionComponent, deps: [{ token: i1.FormBuilder }, { token: ActionRef }, { token: SessionService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ReturnActionComponent, selector: "ng-component", ngImport: i0, template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"recipientId\" cdkFocusInitial [placeholder]=\"'User'|translate\" required>\r\n      <mat-option *ngFor=\"let r of recipients\" [value]=\"r.id\">{{r.userId | userName | async }}</mat-option>\r\n    </mat-select>\r\n    <mat-error *ngIf=\"form.controls.recipientId.hasError('required')\">{{'Required'|translate:('User'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ReturnActionComponent, selector: "ng-component", ngImport: i0, template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"recipientId\" cdkFocusInitial [placeholder]=\"'User'|translate\" required>\r\n      <mat-option *ngFor=\"let r of recipients\" [value]=\"r.id\">{{r.userId | userName | async }}</mat-option>\r\n    </mat-select>\r\n    <mat-error *ngIf=\"form.controls.recipientId.hasError('required')\">{{'RequiredErr'|translate:('User'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }] }); }
 };
 ReturnActionComponent = __decorate([
     BizDoc({
@@ -22125,7 +22135,7 @@ ReturnActionComponent = __decorate([
 ], ReturnActionComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ReturnActionComponent, decorators: [{
             type: Component,
-            args: [{ template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"recipientId\" cdkFocusInitial [placeholder]=\"'User'|translate\" required>\r\n      <mat-option *ngFor=\"let r of recipients\" [value]=\"r.id\">{{r.userId | userName | async }}</mat-option>\r\n    </mat-select>\r\n    <mat-error *ngIf=\"form.controls.recipientId.hasError('required')\">{{'Required'|translate:('User'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n" }]
+            args: [{ template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"recipientId\" cdkFocusInitial [placeholder]=\"'User'|translate\" required>\r\n      <mat-option *ngFor=\"let r of recipients\" [value]=\"r.id\">{{r.userId | userName | async }}</mat-option>\r\n    </mat-select>\r\n    <mat-error *ngIf=\"form.controls.recipientId.hasError('required')\">{{'RequiredErr'|translate:('User'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n" }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: ActionRef }, { type: SessionService }] });
 
 /** component */
@@ -28941,7 +28951,7 @@ let MoveToActionComponent = class MoveToActionComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: MoveToActionComponent, deps: [{ token: i1.FormBuilder }, { token: SessionService }, { token: AccountService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: MoveToActionComponent, selector: "ng-component", viewQueries: [{ propertyName: "nameInput", first: true, predicate: ["nameInput"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-chip-grid #chipList [attr.aria-label]=\"'AssignTo'|translate\">\r\n      <mat-chip-row *ngFor=\"let u of form.value.userIds\"\r\n                    [selectable]=\"true\"\r\n                    [removable]=\"true\"\r\n                    (removed)=\"removed(u)\">\r\n        {{u | userName | async }}\r\n        <mat-icon matChipRemove>cancel</mat-icon>\r\n      </mat-chip-row>\r\n    </mat-chip-grid>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userIds\r\n           cdkFocusInitial\r\n           #nameInput\r\n           [matAutocomplete]=\"auto\"\r\n           [matChipInputFor]=\"chipList\"\r\n           [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected(nameInput, $event)\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u.id\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'Required'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i5$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i5$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: MoveToActionComponent, selector: "ng-component", viewQueries: [{ propertyName: "nameInput", first: true, predicate: ["nameInput"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-chip-grid #chipList [attr.aria-label]=\"'AssignTo'|translate\">\r\n      <mat-chip-row *ngFor=\"let u of form.value.userIds\"\r\n                    [selectable]=\"true\"\r\n                    [removable]=\"true\"\r\n                    (removed)=\"removed(u)\">\r\n        {{u | userName | async }}\r\n        <mat-icon matChipRemove>cancel</mat-icon>\r\n      </mat-chip-row>\r\n    </mat-chip-grid>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userIds\r\n           cdkFocusInitial\r\n           #nameInput\r\n           [matAutocomplete]=\"auto\"\r\n           [matChipInputFor]=\"chipList\"\r\n           [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected(nameInput, $event)\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u.id\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'RequiredErr'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i5$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i5$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UserNamePipe, name: "userName" }] }); }
 };
 MoveToActionComponent = __decorate([
     BizDoc({
@@ -28950,7 +28960,7 @@ MoveToActionComponent = __decorate([
 ], MoveToActionComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: MoveToActionComponent, decorators: [{
             type: Component,
-            args: [{ template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-chip-grid #chipList [attr.aria-label]=\"'AssignTo'|translate\">\r\n      <mat-chip-row *ngFor=\"let u of form.value.userIds\"\r\n                    [selectable]=\"true\"\r\n                    [removable]=\"true\"\r\n                    (removed)=\"removed(u)\">\r\n        {{u | userName | async }}\r\n        <mat-icon matChipRemove>cancel</mat-icon>\r\n      </mat-chip-row>\r\n    </mat-chip-grid>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userIds\r\n           cdkFocusInitial\r\n           #nameInput\r\n           [matAutocomplete]=\"auto\"\r\n           [matChipInputFor]=\"chipList\"\r\n           [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected(nameInput, $event)\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u.id\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'Required'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n" }]
+            args: [{ template: "<form autocomplete=\"off\" class=\"column\" [formGroup]=\"form\">\r\n  <mat-form-field>\r\n    <mat-chip-grid #chipList [attr.aria-label]=\"'AssignTo'|translate\">\r\n      <mat-chip-row *ngFor=\"let u of form.value.userIds\"\r\n                    [selectable]=\"true\"\r\n                    [removable]=\"true\"\r\n                    (removed)=\"removed(u)\">\r\n        {{u | userName | async }}\r\n        <mat-icon matChipRemove>cancel</mat-icon>\r\n      </mat-chip-row>\r\n    </mat-chip-grid>\r\n    <input required [placeholder]=\"'AssignTo'|translate\"\r\n           [formControl]=userIds\r\n           cdkFocusInitial\r\n           #nameInput\r\n           [matAutocomplete]=\"auto\"\r\n           [matChipInputFor]=\"chipList\"\r\n           [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"userSelected(nameInput, $event)\">\r\n      <mat-option *ngFor=\"let u of users$ | async\" [value]=\"u.id\">\r\n        {{u.name}}\r\n        <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n      </mat-option>\r\n    </mat-autocomplete>\r\n    <mat-error *ngIf=\"form.controls.userIds.hasError('required')\">{{'RequiredErr'|translate:('AssignTo'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <textarea matInput cdkTextareaAutosize formControlName=\"note\" [placeholder]=\"'Note'|translate\" maxlength=\"200\">\r\n    </textarea>\r\n    <mat-hint align=\"end\">{{form.controls.note.value?.length || 0}} / {{200}}</mat-hint>\r\n    <mat-hint>{{'AssignNoteHint'| translate}}</mat-hint>\r\n  </mat-form-field>\r\n</form>\r\n" }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: SessionService }, { type: AccountService }], propDecorators: { nameInput: [{
                 type: ViewChild,
                 args: ['nameInput', { static: true, read: ElementRef }]
@@ -31236,7 +31246,7 @@ let RoleNodeComponent = class RoleNodeComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: RoleNodeComponent, deps: [{ token: NodeRef }, { token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: RoleNodeComponent, selector: "ng-component", viewQueries: [{ propertyName: "input", first: true, predicate: TypeSelect, descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"roleName\" cdkFocusInitial [placeholder]=\"'Role'|translate\" required [type]=\"roles\"></bizdoc-select>\r\n    <mat-error *ngIf=\"form.controls.roleName.hasError('required')\">{{'Required'|translate:('Roles'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"condition\" [placeholder]=\"'Requirments'|translate\">\r\n      <mat-option value=\"Anyone\">{{'Anyone'|translate}}</mat-option>\r\n      <mat-option value=\"Everyone\">{{'Everyone'|translate}}</mat-option>\r\n      <mat-option value=\"Count\">{{'Minimum'|translate}}</mat-option>\r\n      <mat-option value=\"Percent\">{{'Percent'|translate}}</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field [style.display]=\"form.value.condition === 'Count' || form.value.condition === 'Percent' ? '' : 'none'\">\r\n    <input matInput formControlName=\"minimum\" [placeholder]=\"'RequirmentsValue'|translate\" type=\"number\" required />\r\n    <span matSuffix *ngIf=\"form.value.condition === 'Percent'\">%</span>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"optional\" required>{{'OptionalRole'|translate}}</mat-checkbox>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input formControlName=\"message\" [placeholder]=\"'Message'|translate\"></bizdoc-ace-input>\r\n    <mat-hint>{{'ProgrammableExpression'|translate}}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"fyi\" required>{{'FYI'|translate}}</mat-checkbox><mat-form-field>\r\n    <bizdoc-timespan-input formControlName=\"standardTime\" [placeholder]=\"'StandardTime'|translate\"></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"escalateRole\" [placeholder]=\"'EscalateRole'|translate\" [type]=\"roles\"></bizdoc-select>\r\n  </mat-form-field>\r\n  <mat-form-field *ngIf=\"form.controls.escalateRole.value\">\r\n    <bizdoc-timespan-input formControlName=\"escalateTime\" [placeholder]=\"'EscalateIn'|translate\"\r\n                           required></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input [placeholder]=\"'Condition'|translate\" formControlName=\"if\"></bizdoc-ace-input>\r\n    <mat-hint> {{ 'ProgrammableExpression'|translate }}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"skipInRoute\" required>{{'SkipInRoute'|translate}}</mat-checkbox>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5.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: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TimespanInput, selector: "bizdoc-timespan-input", inputs: ["placeholder", "required", "disabled", "value"] }, { kind: "component", type: AceInput, selector: "bizdoc-ace-input", inputs: ["params", "placeholder", "required", "disabled", "value"] }, { kind: "component", type: TypeSelect, selector: "bizdoc-select", inputs: ["type", "scope", "multiple", "placeholder", "required", "disabled", "text", "value"], outputs: ["selectionChange", "textChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: RoleNodeComponent, selector: "ng-component", viewQueries: [{ propertyName: "input", first: true, predicate: TypeSelect, descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"roleName\" cdkFocusInitial [placeholder]=\"'Role'|translate\" required [type]=\"roles\"></bizdoc-select>\r\n    <mat-error *ngIf=\"form.controls.roleName.hasError('required')\">{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"condition\" [placeholder]=\"'Requirments'|translate\">\r\n      <mat-option value=\"Anyone\">{{'Anyone'|translate}}</mat-option>\r\n      <mat-option value=\"Everyone\">{{'Everyone'|translate}}</mat-option>\r\n      <mat-option value=\"Count\">{{'Minimum'|translate}}</mat-option>\r\n      <mat-option value=\"Percent\">{{'Percent'|translate}}</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field [style.display]=\"form.value.condition === 'Count' || form.value.condition === 'Percent' ? '' : 'none'\">\r\n    <input matInput formControlName=\"minimum\" [placeholder]=\"'RequirmentsValue'|translate\" type=\"number\" required />\r\n    <span matSuffix *ngIf=\"form.value.condition === 'Percent'\">%</span>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"optional\" required>{{'OptionalRole'|translate}}</mat-checkbox>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input formControlName=\"message\" [placeholder]=\"'Message'|translate\"></bizdoc-ace-input>\r\n    <mat-hint>{{'ProgrammableExpression'|translate}}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"fyi\" required>{{'FYI'|translate}}</mat-checkbox><mat-form-field>\r\n    <bizdoc-timespan-input formControlName=\"standardTime\" [placeholder]=\"'StandardTime'|translate\"></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"escalateRole\" [placeholder]=\"'EscalateRole'|translate\" [type]=\"roles\"></bizdoc-select>\r\n  </mat-form-field>\r\n  <mat-form-field *ngIf=\"form.controls.escalateRole.value\">\r\n    <bizdoc-timespan-input formControlName=\"escalateTime\" [placeholder]=\"'EscalateIn'|translate\"\r\n                           required></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input [placeholder]=\"'Condition'|translate\" formControlName=\"if\"></bizdoc-ace-input>\r\n    <mat-hint> {{ 'ProgrammableExpression'|translate }}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"skipInRoute\" required>{{'SkipInRoute'|translate}}</mat-checkbox>\r\n</form>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5.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: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TimespanInput, selector: "bizdoc-timespan-input", inputs: ["placeholder", "required", "disabled", "value"] }, { kind: "component", type: AceInput, selector: "bizdoc-ace-input", inputs: ["params", "placeholder", "required", "disabled", "value"] }, { kind: "component", type: TypeSelect, selector: "bizdoc-select", inputs: ["type", "scope", "multiple", "placeholder", "required", "disabled", "text", "value"], outputs: ["selectionChange", "textChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 };
 RoleNodeComponent = __decorate([
     BizDoc({
@@ -31245,7 +31255,7 @@ RoleNodeComponent = __decorate([
 ], RoleNodeComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: RoleNodeComponent, decorators: [{
             type: Component,
-            args: [{ template: "<form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"roleName\" cdkFocusInitial [placeholder]=\"'Role'|translate\" required [type]=\"roles\"></bizdoc-select>\r\n    <mat-error *ngIf=\"form.controls.roleName.hasError('required')\">{{'Required'|translate:('Roles'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"condition\" [placeholder]=\"'Requirments'|translate\">\r\n      <mat-option value=\"Anyone\">{{'Anyone'|translate}}</mat-option>\r\n      <mat-option value=\"Everyone\">{{'Everyone'|translate}}</mat-option>\r\n      <mat-option value=\"Count\">{{'Minimum'|translate}}</mat-option>\r\n      <mat-option value=\"Percent\">{{'Percent'|translate}}</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field [style.display]=\"form.value.condition === 'Count' || form.value.condition === 'Percent' ? '' : 'none'\">\r\n    <input matInput formControlName=\"minimum\" [placeholder]=\"'RequirmentsValue'|translate\" type=\"number\" required />\r\n    <span matSuffix *ngIf=\"form.value.condition === 'Percent'\">%</span>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"optional\" required>{{'OptionalRole'|translate}}</mat-checkbox>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input formControlName=\"message\" [placeholder]=\"'Message'|translate\"></bizdoc-ace-input>\r\n    <mat-hint>{{'ProgrammableExpression'|translate}}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"fyi\" required>{{'FYI'|translate}}</mat-checkbox><mat-form-field>\r\n    <bizdoc-timespan-input formControlName=\"standardTime\" [placeholder]=\"'StandardTime'|translate\"></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"escalateRole\" [placeholder]=\"'EscalateRole'|translate\" [type]=\"roles\"></bizdoc-select>\r\n  </mat-form-field>\r\n  <mat-form-field *ngIf=\"form.controls.escalateRole.value\">\r\n    <bizdoc-timespan-input formControlName=\"escalateTime\" [placeholder]=\"'EscalateIn'|translate\"\r\n                           required></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input [placeholder]=\"'Condition'|translate\" formControlName=\"if\"></bizdoc-ace-input>\r\n    <mat-hint> {{ 'ProgrammableExpression'|translate }}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"skipInRoute\" required>{{'SkipInRoute'|translate}}</mat-checkbox>\r\n</form>\r\n" }]
+            args: [{ template: "<form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"roleName\" cdkFocusInitial [placeholder]=\"'Role'|translate\" required [type]=\"roles\"></bizdoc-select>\r\n    <mat-error *ngIf=\"form.controls.roleName.hasError('required')\">{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <mat-select formControlName=\"condition\" [placeholder]=\"'Requirments'|translate\">\r\n      <mat-option value=\"Anyone\">{{'Anyone'|translate}}</mat-option>\r\n      <mat-option value=\"Everyone\">{{'Everyone'|translate}}</mat-option>\r\n      <mat-option value=\"Count\">{{'Minimum'|translate}}</mat-option>\r\n      <mat-option value=\"Percent\">{{'Percent'|translate}}</mat-option>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <mat-form-field [style.display]=\"form.value.condition === 'Count' || form.value.condition === 'Percent' ? '' : 'none'\">\r\n    <input matInput formControlName=\"minimum\" [placeholder]=\"'RequirmentsValue'|translate\" type=\"number\" required />\r\n    <span matSuffix *ngIf=\"form.value.condition === 'Percent'\">%</span>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"optional\" required>{{'OptionalRole'|translate}}</mat-checkbox>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input formControlName=\"message\" [placeholder]=\"'Message'|translate\"></bizdoc-ace-input>\r\n    <mat-hint>{{'ProgrammableExpression'|translate}}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"fyi\" required>{{'FYI'|translate}}</mat-checkbox><mat-form-field>\r\n    <bizdoc-timespan-input formControlName=\"standardTime\" [placeholder]=\"'StandardTime'|translate\"></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-select formControlName=\"escalateRole\" [placeholder]=\"'EscalateRole'|translate\" [type]=\"roles\"></bizdoc-select>\r\n  </mat-form-field>\r\n  <mat-form-field *ngIf=\"form.controls.escalateRole.value\">\r\n    <bizdoc-timespan-input formControlName=\"escalateTime\" [placeholder]=\"'EscalateIn'|translate\"\r\n                           required></bizdoc-timespan-input>\r\n    <mat-icon matSuffix>timer</mat-icon>\r\n  </mat-form-field>\r\n  <mat-form-field>\r\n    <bizdoc-ace-input [placeholder]=\"'Condition'|translate\" formControlName=\"if\"></bizdoc-ace-input>\r\n    <mat-hint> {{ 'ProgrammableExpression'|translate }}</mat-hint>\r\n  </mat-form-field>\r\n  <mat-checkbox formControlName=\"skipInRoute\" required>{{'SkipInRoute'|translate}}</mat-checkbox>\r\n</form>\r\n" }]
         }], ctorParameters: () => [{ type: NodeRef, decorators: [{
                     type: Inject,
                     args: [NodeRef]
@@ -31372,7 +31382,7 @@ let PatternsComponent = class PatternsComponent {
         this._destroy.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: PatternsComponent, deps: [{ token: SessionService }, { token: i3.Directionality }, { token: i1.FormBuilder }, { token: UtilityRef }, { token: DatasourceService }, { token: SystemService }, { token: PromptService }, { token: i2$4.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: PatternsComponent, selector: "ng-component", viewQueries: [{ propertyName: "properties", first: true, predicate: ["properties"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\r\n</mat-toolbar>\r\n<table mat-table [dataSource]=\"dataSource\" matSort>\r\n  <ng-container matColumnDef=\"title\" sticky>\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let r of roles\" [matColumnDef]=\"r.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"options\">\r\n    <th mat-header-cell *matHeaderCellDef></th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\r\n        <mat-divider></mat-divider>\r\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\r\n</table>\r\n<mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons *ngIf=\"paging\"></mat-paginator>\r\n<!-- dialog -->\r\n<ng-template #properties>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\r\n      </mat-form-field>\r\n      <div formGroupName=\"axes\" *ngIf=\"cube\" class=\"row wrap sm-column\">\r\n        <ng-container *ngFor=\"let a of cube?.axes\">\r\n          <mat-form-field *ngIf=\"include.indexOf(a.name)>-1\" class=\"flex\">\r\n            <input matInput\r\n                   [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\r\n                   [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\r\n            <mat-autocomplete #segment>\r\n              <mat-option *ngFor=\"let o of segments[a.name] | async\" [value]=\"o.key\">{{o.value}}</mat-option>\r\n            </mat-autocomplete>\r\n            <mat-error *ngIf=\"axes.controls[a.name].invalid\">{{'SystemAxisPatternErr' |translate}}</mat-error>\r\n          </mat-form-field>\r\n          &nbsp;\r\n        </ng-container>\r\n      </div>\r\n      <mat-form-field>\r\n        <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\r\n          <mat-option *ngFor=\"let r of roles\" [value]=\"r.name\">{{r.title}}</mat-option>\r\n        </mat-select>\r\n        <mat-error *ngIf=\"form.controls.roles.hasError('required')\">{{'Required'|translate:('Roles'|translate)}}</mat-error>\r\n      </mat-form-field>\r\n    </form>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<style scoped>\r\n  table {\r\n    width: 100%\r\n  }\r\n</style>\r\n", styles: ["\n  table {\n    width: 100%\n  }\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i4$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i4$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i5$3.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5$3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i8$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: i2$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i7$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i9$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i5.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: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11.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: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: PatternsComponent, selector: "ng-component", viewQueries: [{ propertyName: "properties", first: true, predicate: ["properties"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\r\n</mat-toolbar>\r\n<table mat-table [dataSource]=\"dataSource\" matSort>\r\n  <ng-container matColumnDef=\"title\" sticky>\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let r of roles\" [matColumnDef]=\"r.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"options\">\r\n    <th mat-header-cell *matHeaderCellDef></th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\r\n        <mat-divider></mat-divider>\r\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\r\n</table>\r\n<mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons *ngIf=\"paging\"></mat-paginator>\r\n<!-- dialog -->\r\n<ng-template #properties>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\r\n      </mat-form-field>\r\n      <div formGroupName=\"axes\" *ngIf=\"cube\" class=\"row wrap sm-column\">\r\n        <ng-container *ngFor=\"let a of cube?.axes\">\r\n          <mat-form-field *ngIf=\"include.indexOf(a.name)>-1\" class=\"flex\">\r\n            <input matInput\r\n                   [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\r\n                   [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\r\n            <mat-autocomplete #segment>\r\n              <mat-option *ngFor=\"let o of segments[a.name] | async\" [value]=\"o.key\">{{o.value}}</mat-option>\r\n            </mat-autocomplete>\r\n            <mat-error *ngIf=\"axes.controls[a.name].invalid\">{{'SystemAxisPatternErr' |translate}}</mat-error>\r\n          </mat-form-field>\r\n          &nbsp;\r\n        </ng-container>\r\n      </div>\r\n      <mat-form-field>\r\n        <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\r\n          <mat-option *ngFor=\"let r of roles\" [value]=\"r.name\">{{r.title}}</mat-option>\r\n        </mat-select>\r\n        <mat-error *ngIf=\"form.controls.roles.hasError('required')\">{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\r\n      </mat-form-field>\r\n    </form>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<style scoped>\r\n  table {\r\n    width: 100%\r\n  }\r\n</style>\r\n", styles: ["\n  table {\n    width: 100%\n  }\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i4$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i4$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i5$3.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5$3.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i8$1.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: i2$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i7$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i9$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i5.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: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11.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: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 };
 PatternsComponent = __decorate([
     BizDoc({
@@ -31381,7 +31391,7 @@ PatternsComponent = __decorate([
 ], PatternsComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: PatternsComponent, decorators: [{
             type: Component,
-            args: [{ template: "<mat-toolbar>\r\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\r\n</mat-toolbar>\r\n<table mat-table [dataSource]=\"dataSource\" matSort>\r\n  <ng-container matColumnDef=\"title\" sticky>\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let r of roles\" [matColumnDef]=\"r.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"options\">\r\n    <th mat-header-cell *matHeaderCellDef></th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\r\n        <mat-divider></mat-divider>\r\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\r\n</table>\r\n<mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons *ngIf=\"paging\"></mat-paginator>\r\n<!-- dialog -->\r\n<ng-template #properties>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\r\n      </mat-form-field>\r\n      <div formGroupName=\"axes\" *ngIf=\"cube\" class=\"row wrap sm-column\">\r\n        <ng-container *ngFor=\"let a of cube?.axes\">\r\n          <mat-form-field *ngIf=\"include.indexOf(a.name)>-1\" class=\"flex\">\r\n            <input matInput\r\n                   [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\r\n                   [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\r\n            <mat-autocomplete #segment>\r\n              <mat-option *ngFor=\"let o of segments[a.name] | async\" [value]=\"o.key\">{{o.value}}</mat-option>\r\n            </mat-autocomplete>\r\n            <mat-error *ngIf=\"axes.controls[a.name].invalid\">{{'SystemAxisPatternErr' |translate}}</mat-error>\r\n          </mat-form-field>\r\n          &nbsp;\r\n        </ng-container>\r\n      </div>\r\n      <mat-form-field>\r\n        <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\r\n          <mat-option *ngFor=\"let r of roles\" [value]=\"r.name\">{{r.title}}</mat-option>\r\n        </mat-select>\r\n        <mat-error *ngIf=\"form.controls.roles.hasError('required')\">{{'Required'|translate:('Roles'|translate)}}</mat-error>\r\n      </mat-form-field>\r\n    </form>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<style scoped>\r\n  table {\r\n    width: 100%\r\n  }\r\n</style>\r\n" }]
+            args: [{ template: "<mat-toolbar>\r\n  <button mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"create()\" [bizdocTooltip]=\"'Add'|translate\" data-guide=\"create\"><mat-icon>add</mat-icon></button>\r\n</mat-toolbar>\r\n<table mat-table [dataSource]=\"dataSource\" matSort>\r\n  <ng-container matColumnDef=\"title\" sticky>\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{'Title'|translate}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element.title}} </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let r of roles\" [matColumnDef]=\"r.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{r.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <mat-checkbox [checked]=\"element.roles && element.roles.indexOf(r.name) > -1\" (change)=\"toggle(element, r.name, $event)\"></mat-checkbox>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"options\">\r\n    <th mat-header-cell *matHeaderCellDef></th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <button mat-icon-button [matMenuTriggerFor]=\"options\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <button mat-menu-item (click)=\"edit(element)\">{{'Edit'|translate}}</button>\r\n        <mat-divider></mat-divider>\r\n        <button mat-menu-item (click)=\"delete(element)\">{{'Discard'|translate}}</button>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns;\"></tr>\r\n</table>\r\n<mat-paginator [pageSize]=\"PAGE_SIZE\" hidePageSize showFirstLastButtons *ngIf=\"paging\"></mat-paginator>\r\n<!-- dialog -->\r\n<ng-template #properties>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"form\" autocomplete=\"off\" class=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'|translate\" required />\r\n      </mat-form-field>\r\n      <div formGroupName=\"axes\" *ngIf=\"cube\" class=\"row wrap sm-column\">\r\n        <ng-container *ngFor=\"let a of cube?.axes\">\r\n          <mat-form-field *ngIf=\"include.indexOf(a.name)>-1\" class=\"flex\">\r\n            <input matInput\r\n                   [matAutocomplete]=\"segment\" [pattern]=\"pattern\"\r\n                   [formControlName]=\"a.name\" [placeholder]=\"a.title\" />\r\n            <mat-autocomplete #segment>\r\n              <mat-option *ngFor=\"let o of segments[a.name] | async\" [value]=\"o.key\">{{o.value}}</mat-option>\r\n            </mat-autocomplete>\r\n            <mat-error *ngIf=\"axes.controls[a.name].invalid\">{{'SystemAxisPatternErr' |translate}}</mat-error>\r\n          </mat-form-field>\r\n          &nbsp;\r\n        </ng-container>\r\n      </div>\r\n      <mat-form-field>\r\n        <mat-select formControlName=\"roles\" [placeholder]=\"'Roles'|translate\" multiple required>\r\n          <mat-option *ngFor=\"let r of roles\" [value]=\"r.name\">{{r.title}}</mat-option>\r\n        </mat-select>\r\n        <mat-error *ngIf=\"form.controls.roles.hasError('required')\">{{'AreRequiredErr'|translate:('Roles'|translate)}}</mat-error>\r\n      </mat-form-field>\r\n    </form>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"form.value\" [disabled]=\"!form.valid\">{{'OK'| translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel'| translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<style scoped>\r\n  table {\r\n    width: 100%\r\n  }\r\n</style>\r\n" }]
         }], ctorParameters: () => [{ type: SessionService }, { type: i3.Directionality }, { type: i1.FormBuilder }, { type: UtilityRef, decorators: [{
                     type: Inject,
                     args: [UtilityRef]
@@ -31934,11 +31944,11 @@ class ProfileSettingsDialog {
         this.form.patchValue({});
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ProfileSettingsDialog, deps: [{ token: AccountService }, { token: i2$4.MatDialogRef }, { token: i1.FormBuilder }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ProfileSettingsDialog, selector: "ng-component", viewQueries: [{ propertyName: "substitueInput", first: true, predicate: ["substitueInput"], descendants: true, read: MatInput }, { propertyName: "grantInput", first: true, predicate: ["grantInput"], descendants: true, read: MatChipInput }], ngImport: i0, template: "<h2 mat-dialog-title>{{'Settings' | translate }}</h2>\r\n<mat-dialog-content>\r\n  <form autocomplete=\"off\" [formGroup]=\"form\">\r\n    <div class=\"column gap\" formGroupName=\"outOfOffice\">\r\n      <h4 class=\"\">{{'OutOfOffice'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <br />\r\n      <mat-form-field class=\"flex\">\r\n        <input matInput [formControl]=\"substitute\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n               [placeholder]=\"'Associate' | translate\" [required]=\"outOfOffice.value.active\" />\r\n        <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"userDisplay\"\r\n                          (optionSelected)=\"setId($event)\">\r\n          <mat-option *ngFor=\"let u of ousers$ | async\" [value]=\"u\">\r\n            <span>{{u.name}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-label>{{'Dates'|translate}}</mat-label>\r\n        <mat-date-range-input [rangePicker]=\"dates\" required>\r\n          <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n          <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n        </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n      </mat-form-field>\r\n      </div>\r\n    <!--<hr />-->\r\n    <div class=\"column\" formGroupName=\"grantAccess\">\r\n      <h4 class=\"\">{{'GrantAccess'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <mat-form-field>\r\n        <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!grantAccess.value.active\">\r\n          <mat-chip-row *ngFor=\"let u of grantAccess.value.users || []\"\r\n                        [removable]=\"grantAccess.value.active\"\r\n                        (removed)=\"removeGrant(u)\">\r\n            {{u | userName | async}}\r\n            <mat-icon matChipRemove>cancel</mat-icon>\r\n          </mat-chip-row>\r\n        </mat-chip-grid>\r\n        <input [formControl]=\"grants\" placeholder=\"{{'Users'| translate}}\"\r\n               [required]=\"grantAccess.value.active\"\r\n               [matAutocomplete]=\"grantAuto\"\r\n               #grantInput\r\n               [matChipInputFor]=\"grantList\"\r\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n        <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n          <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n            {{u.name}}\r\n            <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n    </div>\r\n  </form>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button [mat-dialog-close]=\"form.value\" color=\"primary\" [disabled]=\"!form.valid\">{{'OK' | translate}}</button>\r\n  <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n</mat-dialog-actions>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i5$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i5$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i5$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i3$7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i3$7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i3$7.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i3$7.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i3$7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: i2$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$5.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: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: UserNamePipe, name: "userName" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ProfileSettingsDialog, selector: "ng-component", viewQueries: [{ propertyName: "substitueInput", first: true, predicate: ["substitueInput"], descendants: true, read: MatInput }, { propertyName: "grantInput", first: true, predicate: ["grantInput"], descendants: true, read: MatChipInput }], ngImport: i0, template: "<h2 mat-dialog-title>{{'Settings' | translate }}</h2>\r\n<mat-dialog-content>\r\n  <form autocomplete=\"off\" [formGroup]=\"form\">\r\n    <div class=\"column gap\" formGroupName=\"outOfOffice\">\r\n      <h4 class=\"\">{{'OutOfOffice'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <br />\r\n      <mat-form-field class=\"flex\">\r\n        <input matInput [formControl]=\"substitute\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n               [placeholder]=\"'Associate' | translate\" [required]=\"outOfOffice.value.active\" />\r\n        <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"userDisplay\"\r\n                          (optionSelected)=\"setId($event)\">\r\n          <mat-option *ngFor=\"let u of ousers$ | async\" [value]=\"u\">\r\n            <span>{{u.name}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-label>{{'Dates'|translate}}</mat-label>\r\n        <mat-date-range-input [formGroup]=\"form\" [rangePicker]=\"dates\" required>\r\n          <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n          <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n        </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n      </mat-form-field>\r\n      </div>\r\n    <!--<hr />-->\r\n    <div class=\"column\" formGroupName=\"grantAccess\">\r\n      <h4 class=\"\">{{'GrantAccess'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <mat-form-field>\r\n        <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!grantAccess.value.active\">\r\n          <mat-chip-row *ngFor=\"let u of grantAccess.value.users || []\"\r\n                        [removable]=\"grantAccess.value.active\"\r\n                        (removed)=\"removeGrant(u)\">\r\n            {{u | userName | async}}\r\n            <mat-icon matChipRemove>cancel</mat-icon>\r\n          </mat-chip-row>\r\n        </mat-chip-grid>\r\n        <input [formControl]=\"grants\" placeholder=\"{{'Users'| translate}}\"\r\n               [required]=\"grantAccess.value.active\"\r\n               [matAutocomplete]=\"grantAuto\"\r\n               #grantInput\r\n               [matChipInputFor]=\"grantList\"\r\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n        <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n          <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n            {{u.name}}\r\n            <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n    </div>\r\n  </form>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button [mat-dialog-close]=\"form.value\" color=\"primary\" [disabled]=\"!form.valid\">{{'OK' | translate}}</button>\r\n  <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n</mat-dialog-actions>\r\n", dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i5$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i5$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i5$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i3$7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i3$7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i3$7.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i3$7.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i3$7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: i2$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2$4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i5$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: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i3$5.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: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: UserNamePipe, name: "userName" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ProfileSettingsDialog, decorators: [{
             type: Component,
-            args: [{ template: "<h2 mat-dialog-title>{{'Settings' | translate }}</h2>\r\n<mat-dialog-content>\r\n  <form autocomplete=\"off\" [formGroup]=\"form\">\r\n    <div class=\"column gap\" formGroupName=\"outOfOffice\">\r\n      <h4 class=\"\">{{'OutOfOffice'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <br />\r\n      <mat-form-field class=\"flex\">\r\n        <input matInput [formControl]=\"substitute\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n               [placeholder]=\"'Associate' | translate\" [required]=\"outOfOffice.value.active\" />\r\n        <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"userDisplay\"\r\n                          (optionSelected)=\"setId($event)\">\r\n          <mat-option *ngFor=\"let u of ousers$ | async\" [value]=\"u\">\r\n            <span>{{u.name}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-label>{{'Dates'|translate}}</mat-label>\r\n        <mat-date-range-input [rangePicker]=\"dates\" required>\r\n          <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n          <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n        </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n      </mat-form-field>\r\n      </div>\r\n    <!--<hr />-->\r\n    <div class=\"column\" formGroupName=\"grantAccess\">\r\n      <h4 class=\"\">{{'GrantAccess'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <mat-form-field>\r\n        <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!grantAccess.value.active\">\r\n          <mat-chip-row *ngFor=\"let u of grantAccess.value.users || []\"\r\n                        [removable]=\"grantAccess.value.active\"\r\n                        (removed)=\"removeGrant(u)\">\r\n            {{u | userName | async}}\r\n            <mat-icon matChipRemove>cancel</mat-icon>\r\n          </mat-chip-row>\r\n        </mat-chip-grid>\r\n        <input [formControl]=\"grants\" placeholder=\"{{'Users'| translate}}\"\r\n               [required]=\"grantAccess.value.active\"\r\n               [matAutocomplete]=\"grantAuto\"\r\n               #grantInput\r\n               [matChipInputFor]=\"grantList\"\r\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n        <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n          <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n            {{u.name}}\r\n            <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n    </div>\r\n  </form>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button [mat-dialog-close]=\"form.value\" color=\"primary\" [disabled]=\"!form.valid\">{{'OK' | translate}}</button>\r\n  <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n</mat-dialog-actions>\r\n" }]
+            args: [{ template: "<h2 mat-dialog-title>{{'Settings' | translate }}</h2>\r\n<mat-dialog-content>\r\n  <form autocomplete=\"off\" [formGroup]=\"form\">\r\n    <div class=\"column gap\" formGroupName=\"outOfOffice\">\r\n      <h4 class=\"\">{{'OutOfOffice'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <br />\r\n      <mat-form-field class=\"flex\">\r\n        <input matInput [formControl]=\"substitute\" type=\"search\" [matAutocomplete]=\"sauto\" #substitueInput\r\n               [placeholder]=\"'Associate' | translate\" [required]=\"outOfOffice.value.active\" />\r\n        <mat-autocomplete #sauto=\"matAutocomplete\" [displayWith]=\"userDisplay\"\r\n                          (optionSelected)=\"setId($event)\">\r\n          <mat-option *ngFor=\"let u of ousers$ | async\" [value]=\"u\">\r\n            <span>{{u.name}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-label>{{'Dates'|translate}}</mat-label>\r\n        <mat-date-range-input [formGroup]=\"form\" [rangePicker]=\"dates\" required>\r\n          <input matStartDate formControlName=\"from\" [placeholder]=\"'From'|translate\" [min]=\"today\">\r\n          <input matEndDate formControlName=\"to\" [placeholder]=\"'To'|translate\">\r\n        </mat-date-range-input>\r\n          <mat-datepicker-toggle matSuffix [for]=\"dates\"></mat-datepicker-toggle>\r\n          <mat-date-range-picker #dates [touchUi]=\"isMobile\"></mat-date-range-picker>\r\n      </mat-form-field>\r\n      </div>\r\n    <!--<hr />-->\r\n    <div class=\"column\" formGroupName=\"grantAccess\">\r\n      <h4 class=\"\">{{'GrantAccess'|translate}}</h4>\r\n      <mat-slide-toggle formControlName=\"active\">{{'Active' | translate}}</mat-slide-toggle>\r\n      <mat-form-field>\r\n        <mat-chip-grid #grantList [attr.aria-label]=\"\" [disabled]=\"!grantAccess.value.active\">\r\n          <mat-chip-row *ngFor=\"let u of grantAccess.value.users || []\"\r\n                        [removable]=\"grantAccess.value.active\"\r\n                        (removed)=\"removeGrant(u)\">\r\n            {{u | userName | async}}\r\n            <mat-icon matChipRemove>cancel</mat-icon>\r\n          </mat-chip-row>\r\n        </mat-chip-grid>\r\n        <input [formControl]=\"grants\" placeholder=\"{{'Users'| translate}}\"\r\n               [required]=\"grantAccess.value.active\"\r\n               [matAutocomplete]=\"grantAuto\"\r\n               #grantInput\r\n               [matChipInputFor]=\"grantList\"\r\n               [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n        <mat-autocomplete #grantAuto=\"matAutocomplete\" (optionSelected)=\"addGrant(grantInput, $event)\">\r\n          <mat-option *ngFor=\"let u of gusers$ | async\" [value]=\"u.id\">\r\n            {{u.name}}\r\n            <span *ngIf=\"u.email\">&nbsp; - {{u.email}}</span>\r\n          </mat-option>\r\n        </mat-autocomplete>\r\n      </mat-form-field>\r\n    </div>\r\n  </form>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button [mat-dialog-close]=\"form.value\" color=\"primary\" [disabled]=\"!form.valid\">{{'OK' | translate}}</button>\r\n  <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n</mat-dialog-actions>\r\n" }]
         }], ctorParameters: () => [{ type: AccountService }, { type: i2$4.MatDialogRef }, { type: i1.FormBuilder }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -33060,7 +33070,7 @@ class CubeDesignComponent extends DesignerTypeElementComponent {
                     r.jobInfo && r.jobInfo.nextExecution && this._schedule(r.jobInfo.nextExecution);
                 });
                 break;
-            case 'edit':
+            default:
                 this._form();
                 break;
         }
@@ -33073,10 +33083,10 @@ class CubeDesignComponent extends DesignerTypeElementComponent {
         }, ms + 600000);
     }
     _form() {
-        this.datatypes = super._typegroups;
+        this.typegroups = super._typegroups;
         this.guides = this._ref.designer.guides;
         this.currencies = this._ref.designer.currencies;
-        this.model.axes.forEach(a => {
+        this.model.axes?.forEach(a => {
             this.axes.push(this.newAxis(a), { emitEvent: false });
         });
         this.model.indices?.forEach(i => this.indices.push(this.newIndex(i), { emitEvent: false }));
@@ -33089,12 +33099,11 @@ class CubeDesignComponent extends DesignerTypeElementComponent {
                 v.indices = coerceArray(v.indices);
             this.views.push(this.newView(v), { emitEvent: false });
         });
-    }
-    complete() {
-        this._form();
         if (!this.model.privileges)
             this.model.privileges = {};
     }
+    complete() {
+    }
     nameOf(axis) { return this.model.axes.filter(a => isArray(axis) ? axis.indexOf(a.name) > -1 : a.name === axis).join(', '); }
     newView(model) {
         const name = this._fb.control(model?.name, Validators.required), title = this._fb.control(model?.title, Validators.required), xAxis = this._fb.control(model?.xAxis, Validators.required), chartType = this._fb.control(model?.chartType || null), indicesChartType = this._fb.control(model?.indicesChartType || null), series = this._fb.control(model?.series), indices = this._fb.control(model?.indices), guide = this._fb.control(model?.guide), type = this._fb.control(model?.type || 'Chart');
@@ -33135,6 +33144,7 @@ class CubeDesignComponent extends DesignerTypeElementComponent {
             indices,
             type,
             chartType,
+            guide,
             indicesChartType,
             filters: this._fb.group({}),
             privileges: this._fb.group({
@@ -33146,6 +33156,7 @@ class CubeDesignComponent extends DesignerTypeElementComponent {
             switch (v) {
                 case 'Spreadsheet':
                 case 'Grid':
+                case 'Pivot':
                     series.addValidators(Validators.required);
                     chartType.disable({ emitEvent: false });
                     break;
@@ -33210,11 +33221,11 @@ class CubeDesignComponent extends DesignerTypeElementComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: CubeDesignComponent, deps: [{ token: i1.FormBuilder }, { token: SystemService }, { token: PromptService }, { token: i0.ElementRef }, { token: DesignerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.1", type: CubeDesignComponent, selector: "ng-component", viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<bizdoc-designer-element [form]=\"form\" [privileges]=\"true\" (continue)=\"complete()\" [view]=\"view\" (back)=\"view = null\" [context]=\"context\">\r\n  <!-- widget -->\r\n  <ng-template bizdocContent>\r\n    <dl *ngIf=\"jobInfo\">\r\n      <ng-container *ngIf=\"jobInfo.lastExecution\">\r\n        <dt>{{'LastExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.lastExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.nextExecution\">\r\n        <dt>{{'NextExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.nextExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.lastJobState\">\r\n        <dt>{{'LastJobState'|translate}}</dt>\r\n        <dd>\r\n          <mat-icon *ngIf=\"jobInfo.error\" [bizdocTooltip]=\"jobInfo.error\">report</mat-icon>\r\n          <span class=\"job-state\">{{jobInfo.lastJobState| translate}}</span>\r\n        </dd>\r\n      </ng-container>\r\n    </dl>\r\n    <div class=\"row start center\">\r\n      <button mat-stroked-button (click)=\"sync()\" [disabled]=\"model.draft || syncing\">\r\n        <span> {{'Synchronize'|translate}}</span>\r\n      </button>\r\n      &nbsp;\r\n      <mat-spinner *ngIf=\"syncing\" diameter=\"22\"></mat-spinner>\r\n    </div>\r\n    <div class=\"row\">\r\n      @if(model.axes?.length)\r\n      {\r\n      <mat-chip-set>\r\n        @for(axis of model.axes || []; track axis){\r\n        <mat-chip>{{axis.title}}</mat-chip>\r\n        }\r\n        @for(index of model.indices || []; track index){\r\n        <mat-chip>{{index.title}}</mat-chip>\r\n        }\r\n      </mat-chip-set>\r\n      }\r\n    </div>\r\n  </ng-template>\r\n  <!-- edit -->\r\n  <ng-template bizdocEditContent>\r\n    <div [formGroup]=\"form\" class=\"column\">\r\n      <mat-label>{{'SecurityLevel'|translate}}</mat-label>\r\n      <mat-radio-group formControlName=\"scope\">\r\n        <p></p>\r\n        <mat-radio-button color=\"warn\">{{'Global'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityGlobalHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Positions\">{{'Positions'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPositionsHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Patterns\">{{'Patterns'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPatternsHelp'|translate}}</p>\r\n      </mat-radio-group>\r\n      <ng-container formGroupName=\"yAxis\">\r\n        <mat-form-field class=\"flex\">\r\n          <mat-label>{{'Type'|translate}}</mat-label>\r\n          <mat-select formControlName=\"type\">\r\n            <mat-option value=\"Currency\">{{'Currency'|translate}}</mat-option>\r\n            <mat-option value=\"Number\">{{'Numeric'|translate}}</mat-option>\r\n            <mat-option value=\"Count\">{{'Accumulative'|translate}}</mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </ng-container>\r\n      <mat-form-field>\r\n        <mat-label>{{'Currency'|translate}}</mat-label>\r\n        <mat-select formControlName=\"currencyCode\" [sortComparator]=\"sortComparator\">\r\n          <mat-option *ngFor=\"let c of currencies\" [value]=\"c.name\">{{c.title}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Axes-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Axes'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(axes, newAxis(), 'Axis', axisform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"axes\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, axes)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let a of axes.controls; index as index\" [formGroup]=\"a\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{a.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(a, 'Axis', axisform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"axes.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Indices-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Indices'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(indices, newIndex(), 'Index', indexform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, indices)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let i of indices.controls; index as index\" [formGroup]=\"i\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{i.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(i, 'Index', indexform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"indices.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field *ngIf=\"indices.controls.length\">\r\n        <mat-label>{{'AnomalyNotification'|translate}}</mat-label>\r\n        <mat-select formControlName=\"anomaly\">\r\n          <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n          <mat-option value=\"Positions\">{{'Positions'|translate}}</mat-option>\r\n          <mat-option value=\"Recipients\">{{'Everyone'|translate}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Patterns-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Patterns'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(patterns, newPattern(), 'Pattern', patternform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, patterns)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let p of patterns.controls; index as index\" [formGroup]=\"p\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{p.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(p, 'Pattern', patternform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"patterns.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Views-->\r\n      <h2 class=\"row mat-h2\">\r\n        {{'CubeViews'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(views, newView(), 'CubeView', viewform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"views\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, views)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let v of views.controls; index as index\" [formGroup]=\"v\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{v.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(v, 'View', viewform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"views.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field>\r\n        <mat-label>{{'Schedule'|translate}}</mat-label>\r\n        <bizdoc-timespan-input formControlName=\"schedule\"></bizdoc-timespan-input>\r\n        <mat-icon matSuffix>timer</mat-icon>\r\n        <mat-hint></mat-hint>\r\n      </mat-form-field>\r\n    </div>\r\n  </ng-template>\r\n</bizdoc-designer-element>\r\n<!--idx-->\r\n<ng-template #indexform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    &nbsp;\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Name'|translate}}</mat-label>\r\n      <input matInput formControlName=\"name\" required />\r\n      <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n</ng-template>\r\n<!-- pattern-->\r\n<ng-template #patternform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter [cube]=\"model\" [form]=\"form.get('axes')\"></bizdoc-designer-cube-filter>\r\n    <bizdoc-designer-privileges [form]=\"form\"></bizdoc-designer-privileges>\r\n  </div>\r\n</ng-template>\r\n<!-- view -->\r\n<ng-template #viewform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Type'|translate}}</mat-label>\r\n      <mat-select formControlName=\"type\">\r\n        <mat-option value=\"Chart\">{{'Chart'|translate}}</mat-option>\r\n        <mat-option value=\"Pivot\">{{'Pivot'|translate}}</mat-option>\r\n        <mat-option value=\"Grid\">{{'Grid'|translate}}</mat-option>\r\n        <mat-option value=\"Spreadsheet\">{{'Spreadsheet'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'XAxis'|translate}}</mat-label>\r\n      <mat-select formControlName=\"xAxis\" required multiple [sortComparator]=\"sortComparator\">\r\n        <mat-option *ngFor=\"let a of axes.controls\" [value]=\"a.get('name').value\">{{a.get('title').value || a.get('name').value}}</mat-option>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('xAxis').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('XAxis'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Series'|translate}}</mat-label>\r\n      <mat-select formControlName=\"series\" multiple [sortComparator]=\"sortComparator\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"form.get('xAxis').value?.indexOf(a.get('name').value)<0\">{{a.get('title').value|| a.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('series').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Series'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Indices'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indices\" multiple>\r\n        <ng-container *ngFor=\"let i of indices.controls\">\r\n          <mat-option [value]=\"i.get('name').value\">{{i.get('title').value|| i.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'ChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"chartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Pie\" [disabled]=\"form.get('series').value?.length>0\">{{'Pie'|translate}}</mat-option>\r\n            <mat-option value=\"Doughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'Doughnut'|translate}}</mat-option>\r\n            <mat-option value=\"HalfDoughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'HalfDoughnut'|translate}}</mat-option>\r\n            <mat-option value=\"Funnel\" [disabled]=\"form.get('series').value?.length>0\">{{'Funnel'|translate}}</mat-option>\r\n            <mat-option value=\"Pyramid\" [disabled]=\"form.get('series').value?.length>0\">{{'Pyramid'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'IndicesChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indicesChartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Guide'|translate}}</mat-label>\r\n      <mat-select formControlName=\"guide\">\r\n        <mat-option>{{'None'|translate}}</mat-option>\r\n        <mat-option *ngFor=\"let g of guides\" [value]=\"g.name\">{{g.title |localizedString}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter *ngIf=\"cube\" [cube]=\"cube\" [form]=\"form.get('filters')\"></bizdoc-designer-cube-filter>\r\n  </div>\r\n</ng-template>\r\n<!-- Axis -->\r\n<ng-template #axisform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <div class=\"row\">\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Title'|translate}}</mat-label>\r\n        <input matInput formControlName=\"title\" required />\r\n        <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n      &nbsp;\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Name'|translate}}</mat-label>\r\n        <input matInput formControlName=\"name\" required />\r\n        <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n    </div>\r\n    <mat-form-field>\r\n      <mat-label>{{'DataType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"dataType\" required>\r\n        <mat-option *ngFor=\"let t of datatypes['_'].elements|sort: 'title'\" [value]=\"t.name\">\r\n          {{t.title}}\r\n        </mat-option>\r\n        <mat-optgroup *ngFor=\"let g of datatypes|sort: 'title'\" [label]=\"g.title\">\r\n          <mat-option *ngFor=\"let t of g.elements|sort: 'title'\" [value]=\"t.name\">\r\n            {{t.title}}\r\n          </mat-option>\r\n        </mat-optgroup>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('DataType'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"combination\">{{'Combination'|translate}}</mat-checkbox></div>\r\n    <div><mat-checkbox formControlName=\"sensitive\">{{'Sensitive'|translate}}</mat-checkbox></div>\r\n    <mat-form-field>\r\n      <mat-label>{{'SelectionMode'|translate}}</mat-label>\r\n      <mat-select formControlName=\"selectionMode\">\r\n        <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n        <mat-option>{{'OneMode'|translate}}</mat-option>\r\n        <mat-option value=\"Multiple\">{{'Multiple'|translate}}</mat-option>\r\n        <mat-option value=\"Search\">{{'Autocomplete'|translate}}</mat-option>\r\n        <mat-option value=\"Pattern\">{{'Pattern'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'DescendentOf'|translate}}</mat-label>\r\n      <mat-select formControlName=\"descendentOf\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"a!=form\">{{a.get('title').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"indexable\">{{'Indexable'|translate}}</mat-checkbox></div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep form{min-width:350px}:host ::ng-deep .mat-mdc-radio-group p{margin-inline-start:8px}.mat-mdc-table{width:100%}.mat-mdc-table .mat-mdc-cell:last-child{width:80px}.flex{flex:1}table tr td:first-child{width:26px}dl{width:100%;overflow:hidden;padding:0;margin:0}dt{padding:0;margin:0;clear:both}dd{float:left;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i5$2.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: i5$2.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: i3$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i3$8.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$8.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: i8.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i3$2.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5.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: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: 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: "component", type: TimespanInput, selector: "bizdoc-timespan-input", inputs: ["placeholder", "required", "disabled", "value"] }, { kind: "component", type: DesignerPrivilegesComponent, selector: "bizdoc-designer-privileges", inputs: ["form"] }, { kind: "directive", type: EditContentDirective, selector: "[bizdocEditContent]" }, { kind: "directive", type: WidgetContentDirective, selector: "[bizdocContent]" }, { kind: "component", type: DesignerCubeFilterComponent, selector: "bizdoc-designer-cube-filter", inputs: ["cube", "form"] }, { kind: "component", type: DesignerItemComponent, selector: "bizdoc-designer-element", inputs: ["privileges", "icon", "form", "view", "context"], outputs: ["continue", "back", "save"] }, { kind: "pipe", type: LocalizedStringPipe, name: "localizedString" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.1", type: CubeDesignComponent, selector: "ng-component", viewQueries: [{ propertyName: "element", first: true, predicate: ["element"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<bizdoc-designer-element [form]=\"form\" [privileges]=\"true\" (continue)=\"complete()\" [view]=\"view\" (back)=\"view = null\" [context]=\"context\">\r\n  <!-- widget -->\r\n  <ng-template bizdocContent>\r\n    <dl *ngIf=\"jobInfo\">\r\n      <ng-container *ngIf=\"jobInfo.lastExecution\">\r\n        <dt>{{'LastExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.lastExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.nextExecution\">\r\n        <dt>{{'NextExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.nextExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.lastJobState\">\r\n        <dt>{{'LastJobState'|translate}}</dt>\r\n        <dd>\r\n          <mat-icon *ngIf=\"jobInfo.error\" [bizdocTooltip]=\"jobInfo.error\">report</mat-icon>\r\n          <span class=\"job-state\">{{jobInfo.lastJobState| translate}}</span>\r\n        </dd>\r\n      </ng-container>\r\n    </dl>\r\n    <div class=\"row start center\">\r\n      <button mat-stroked-button (click)=\"sync()\" [disabled]=\"model.draft || syncing\">\r\n        <span> {{'Synchronize'|translate}}</span>\r\n      </button>\r\n      &nbsp;\r\n      <mat-spinner *ngIf=\"syncing\" diameter=\"22\"></mat-spinner>\r\n    </div>\r\n    <div class=\"row\">\r\n      @if(model.axes?.length)\r\n      {\r\n      <mat-chip-set>\r\n        @for(axis of model.axes; track axis){\r\n        <mat-chip>{{axis.title}}</mat-chip>\r\n        }\r\n        @for(index of model.indices || []; track index){\r\n        <mat-chip>{{index.title}}</mat-chip>\r\n        }\r\n      </mat-chip-set>\r\n      }\r\n    </div>\r\n  </ng-template>\r\n  <!-- edit -->\r\n  <ng-template bizdocEditContent>\r\n    <div [formGroup]=\"form\" class=\"column\">\r\n      <mat-label>{{'SecurityLevel'|translate}}</mat-label>\r\n      <mat-radio-group formControlName=\"scope\">\r\n        <p></p>\r\n        <mat-radio-button color=\"warn\">{{'Global'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityGlobalHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Positions\">{{'Positions'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPositionsHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Patterns\">{{'Patterns'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPatternsHelp'|translate}}</p>\r\n      </mat-radio-group>\r\n      <ng-container formGroupName=\"yAxis\">\r\n        <mat-form-field class=\"flex\">\r\n          <mat-label>{{'Type'|translate}}</mat-label>\r\n          <mat-select formControlName=\"type\">\r\n            <mat-option value=\"Currency\">{{'Currency'|translate}}</mat-option>\r\n            <mat-option value=\"Number\">{{'Numeric'|translate}}</mat-option>\r\n            <mat-option value=\"Count\">{{'Accumulative'|translate}}</mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </ng-container>\r\n      <mat-form-field>\r\n        <mat-label>{{'Currency'|translate}}</mat-label>\r\n        <mat-select formControlName=\"currencyCode\" [sortComparator]=\"sortComparator\">\r\n          <mat-option *ngFor=\"let c of currencies\" [value]=\"c.name\">{{c.title}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Axes-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Axes'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(axes, newAxis(), 'Axis', axisform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"axes\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, axes)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let a of axes.controls; index as index\" [formGroup]=\"a\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{a.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(a, 'Axis', axisform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"axes.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Indices-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Indices'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(indices, newIndex(), 'Index', indexform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, indices)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let i of indices.controls; index as index\" [formGroup]=\"i\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{i.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(i, 'Index', indexform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"indices.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field *ngIf=\"indices.controls.length\">\r\n        <mat-label>{{'AnomalyNotification'|translate}}</mat-label>\r\n        <mat-select formControlName=\"anomaly\">\r\n          <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n          <mat-option value=\"Positions\">{{'Positions'|translate}}</mat-option>\r\n          <mat-option value=\"Recipients\">{{'Everyone'|translate}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Patterns-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Patterns'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(patterns, newPattern(), 'Pattern', patternform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, patterns)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let p of patterns.controls; index as index\" [formGroup]=\"p\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{p.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(p, 'Pattern', patternform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"patterns.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Views-->\r\n      <h2 class=\"row mat-h2\">\r\n        {{'CubeViews'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(views, newView(), 'CubeView', viewform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"views\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, views)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let v of views.controls; index as index\" [formGroup]=\"v\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{v.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(v, 'View', viewform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"views.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field>\r\n        <mat-label>{{'Schedule'|translate}}</mat-label>\r\n        <bizdoc-timespan-input formControlName=\"schedule\"></bizdoc-timespan-input>\r\n        <mat-icon matSuffix>timer</mat-icon>\r\n        <mat-hint></mat-hint>\r\n      </mat-form-field>\r\n    </div>\r\n  </ng-template>\r\n</bizdoc-designer-element>\r\n<!--idx-->\r\n<ng-template #indexform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    &nbsp;\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Name'|translate}}</mat-label>\r\n      <input matInput formControlName=\"name\" required />\r\n      <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n</ng-template>\r\n<!-- pattern-->\r\n<ng-template #patternform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter [cube]=\"model\" [form]=\"form.get('axes')\"></bizdoc-designer-cube-filter>\r\n    <bizdoc-designer-privileges [form]=\"form\"></bizdoc-designer-privileges>\r\n  </div>\r\n</ng-template>\r\n<!-- view -->\r\n<ng-template #viewform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Type'|translate}}</mat-label>\r\n      <mat-select formControlName=\"type\">\r\n        <mat-option value=\"Chart\">{{'Chart'|translate}}</mat-option>\r\n        <mat-option value=\"Pivot\">{{'Pivot'|translate}}</mat-option>\r\n        <mat-option value=\"Grid\">{{'Grid'|translate}}</mat-option>\r\n        <mat-option value=\"Spreadsheet\">{{'Spreadsheet'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'XAxis'|translate}}</mat-label>\r\n      <mat-select formControlName=\"xAxis\" required multiple [sortComparator]=\"sortComparator\">\r\n        <mat-option *ngFor=\"let a of axes.controls\" [value]=\"a.get('name').value\">{{a.get('title').value || a.get('name').value}}</mat-option>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('xAxis').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('XAxis'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Series'|translate}}</mat-label>\r\n      <mat-select formControlName=\"series\" multiple [sortComparator]=\"sortComparator\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"form.get('xAxis').value?.indexOf(a.get('name').value)<0\">{{a.get('title').value|| a.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('series').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Series'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Indices'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indices\" multiple>\r\n        <ng-container *ngFor=\"let i of indices.controls\">\r\n          <mat-option [value]=\"i.get('name').value\">{{i.get('title').value|| i.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'ChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"chartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Pie\" [disabled]=\"form.get('series').value?.length>0\">{{'Pie'|translate}}</mat-option>\r\n            <mat-option value=\"Doughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'Doughnut'|translate}}</mat-option>\r\n            <mat-option value=\"HalfDoughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'HalfDoughnut'|translate}}</mat-option>\r\n            <mat-option value=\"Funnel\" [disabled]=\"form.get('series').value?.length>0\">{{'Funnel'|translate}}</mat-option>\r\n            <mat-option value=\"Pyramid\" [disabled]=\"form.get('series').value?.length>0\">{{'Pyramid'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'IndicesChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indicesChartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Guide'|translate}}</mat-label>\r\n      <mat-select formControlName=\"guide\">\r\n        <mat-option>{{'None'|translate}}</mat-option>\r\n        <mat-option *ngFor=\"let g of guides\" [value]=\"g.name\">{{g.title |localizedString}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter *ngIf=\"cube\" [cube]=\"cube\" [form]=\"form.get('filters')\"></bizdoc-designer-cube-filter>\r\n  </div>\r\n</ng-template>\r\n<!-- Axis -->\r\n<ng-template #axisform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <div class=\"row\">\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Title'|translate}}</mat-label>\r\n        <input matInput formControlName=\"title\" required />\r\n        <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n      &nbsp;\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Name'|translate}}</mat-label>\r\n        <input matInput formControlName=\"name\" required />\r\n        <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n    </div>\r\n    <mat-form-field>\r\n      <mat-label>{{'DataType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"dataType\" required>\r\n        <mat-option *ngFor=\"let t of typegroups['_'].elements|sort: 'title'\" [value]=\"t.name\">\r\n          {{t.title}}\r\n        </mat-option>\r\n        <mat-optgroup *ngFor=\"let g of typegroups|sort: 'title'\" [label]=\"g.title\">\r\n          <mat-option *ngFor=\"let t of g.elements|sort: 'title'\" [value]=\"t.name\">\r\n            {{t.title}}\r\n          </mat-option>\r\n        </mat-optgroup>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('DataType'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"combination\">{{'Combination'|translate}}</mat-checkbox></div>\r\n    <div><mat-checkbox formControlName=\"sensitive\">{{'Sensitive'|translate}}</mat-checkbox></div>\r\n    <mat-form-field>\r\n      <mat-label>{{'SelectionMode'|translate}}</mat-label>\r\n      <mat-select formControlName=\"selectionMode\">\r\n        <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n        <mat-option>{{'OneMode'|translate}}</mat-option>\r\n        <mat-option value=\"Multiple\">{{'Multiple'|translate}}</mat-option>\r\n        <mat-option value=\"Search\">{{'Autocomplete'|translate}}</mat-option>\r\n        <mat-option value=\"Pattern\">{{'Pattern'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'DescendentOf'|translate}}</mat-label>\r\n      <mat-select formControlName=\"descendentOf\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"a!=form\">{{a.get('title').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"indexable\">{{'Indexable'|translate}}</mat-checkbox></div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep form{min-width:350px}:host ::ng-deep .mat-mdc-radio-group p{margin-inline-start:8px}.mat-mdc-table{width:100%}.mat-mdc-table .mat-mdc-cell:last-child{width:80px}.flex{flex:1}table tr td:first-child{width:26px}dl{width:100%;overflow:hidden;padding:0;margin:0}dt{padding:0;margin:0;clear:both}dd{float:left;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i5$2.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: i5$2.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: i3$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3$1.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i3$8.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$8.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: i8.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i3$2.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5.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: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i9.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: 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: "component", type: TimespanInput, selector: "bizdoc-timespan-input", inputs: ["placeholder", "required", "disabled", "value"] }, { kind: "component", type: DesignerPrivilegesComponent, selector: "bizdoc-designer-privileges", inputs: ["form"] }, { kind: "directive", type: EditContentDirective, selector: "[bizdocEditContent]" }, { kind: "directive", type: WidgetContentDirective, selector: "[bizdocContent]" }, { kind: "component", type: DesignerCubeFilterComponent, selector: "bizdoc-designer-cube-filter", inputs: ["cube", "form"] }, { kind: "component", type: DesignerItemComponent, selector: "bizdoc-designer-element", inputs: ["privileges", "icon", "form", "view", "context"], outputs: ["continue", "back", "save"] }, { kind: "pipe", type: LocalizedStringPipe, name: "localizedString" }, { kind: "pipe", type: TimeAgoPipe, name: "amTimeAgo" }, { kind: "pipe", type: ArraySortPipe, name: "sort" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: CubeDesignComponent, decorators: [{
             type: Component,
-            args: [{ template: "<bizdoc-designer-element [form]=\"form\" [privileges]=\"true\" (continue)=\"complete()\" [view]=\"view\" (back)=\"view = null\" [context]=\"context\">\r\n  <!-- widget -->\r\n  <ng-template bizdocContent>\r\n    <dl *ngIf=\"jobInfo\">\r\n      <ng-container *ngIf=\"jobInfo.lastExecution\">\r\n        <dt>{{'LastExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.lastExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.nextExecution\">\r\n        <dt>{{'NextExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.nextExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.lastJobState\">\r\n        <dt>{{'LastJobState'|translate}}</dt>\r\n        <dd>\r\n          <mat-icon *ngIf=\"jobInfo.error\" [bizdocTooltip]=\"jobInfo.error\">report</mat-icon>\r\n          <span class=\"job-state\">{{jobInfo.lastJobState| translate}}</span>\r\n        </dd>\r\n      </ng-container>\r\n    </dl>\r\n    <div class=\"row start center\">\r\n      <button mat-stroked-button (click)=\"sync()\" [disabled]=\"model.draft || syncing\">\r\n        <span> {{'Synchronize'|translate}}</span>\r\n      </button>\r\n      &nbsp;\r\n      <mat-spinner *ngIf=\"syncing\" diameter=\"22\"></mat-spinner>\r\n    </div>\r\n    <div class=\"row\">\r\n      @if(model.axes?.length)\r\n      {\r\n      <mat-chip-set>\r\n        @for(axis of model.axes || []; track axis){\r\n        <mat-chip>{{axis.title}}</mat-chip>\r\n        }\r\n        @for(index of model.indices || []; track index){\r\n        <mat-chip>{{index.title}}</mat-chip>\r\n        }\r\n      </mat-chip-set>\r\n      }\r\n    </div>\r\n  </ng-template>\r\n  <!-- edit -->\r\n  <ng-template bizdocEditContent>\r\n    <div [formGroup]=\"form\" class=\"column\">\r\n      <mat-label>{{'SecurityLevel'|translate}}</mat-label>\r\n      <mat-radio-group formControlName=\"scope\">\r\n        <p></p>\r\n        <mat-radio-button color=\"warn\">{{'Global'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityGlobalHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Positions\">{{'Positions'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPositionsHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Patterns\">{{'Patterns'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPatternsHelp'|translate}}</p>\r\n      </mat-radio-group>\r\n      <ng-container formGroupName=\"yAxis\">\r\n        <mat-form-field class=\"flex\">\r\n          <mat-label>{{'Type'|translate}}</mat-label>\r\n          <mat-select formControlName=\"type\">\r\n            <mat-option value=\"Currency\">{{'Currency'|translate}}</mat-option>\r\n            <mat-option value=\"Number\">{{'Numeric'|translate}}</mat-option>\r\n            <mat-option value=\"Count\">{{'Accumulative'|translate}}</mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </ng-container>\r\n      <mat-form-field>\r\n        <mat-label>{{'Currency'|translate}}</mat-label>\r\n        <mat-select formControlName=\"currencyCode\" [sortComparator]=\"sortComparator\">\r\n          <mat-option *ngFor=\"let c of currencies\" [value]=\"c.name\">{{c.title}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Axes-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Axes'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(axes, newAxis(), 'Axis', axisform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"axes\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, axes)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let a of axes.controls; index as index\" [formGroup]=\"a\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{a.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(a, 'Axis', axisform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"axes.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Indices-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Indices'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(indices, newIndex(), 'Index', indexform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, indices)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let i of indices.controls; index as index\" [formGroup]=\"i\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{i.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(i, 'Index', indexform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"indices.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field *ngIf=\"indices.controls.length\">\r\n        <mat-label>{{'AnomalyNotification'|translate}}</mat-label>\r\n        <mat-select formControlName=\"anomaly\">\r\n          <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n          <mat-option value=\"Positions\">{{'Positions'|translate}}</mat-option>\r\n          <mat-option value=\"Recipients\">{{'Everyone'|translate}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Patterns-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Patterns'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(patterns, newPattern(), 'Pattern', patternform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, patterns)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let p of patterns.controls; index as index\" [formGroup]=\"p\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{p.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(p, 'Pattern', patternform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"patterns.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Views-->\r\n      <h2 class=\"row mat-h2\">\r\n        {{'CubeViews'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(views, newView(), 'CubeView', viewform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"views\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, views)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let v of views.controls; index as index\" [formGroup]=\"v\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{v.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(v, 'View', viewform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"views.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field>\r\n        <mat-label>{{'Schedule'|translate}}</mat-label>\r\n        <bizdoc-timespan-input formControlName=\"schedule\"></bizdoc-timespan-input>\r\n        <mat-icon matSuffix>timer</mat-icon>\r\n        <mat-hint></mat-hint>\r\n      </mat-form-field>\r\n    </div>\r\n  </ng-template>\r\n</bizdoc-designer-element>\r\n<!--idx-->\r\n<ng-template #indexform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    &nbsp;\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Name'|translate}}</mat-label>\r\n      <input matInput formControlName=\"name\" required />\r\n      <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n</ng-template>\r\n<!-- pattern-->\r\n<ng-template #patternform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter [cube]=\"model\" [form]=\"form.get('axes')\"></bizdoc-designer-cube-filter>\r\n    <bizdoc-designer-privileges [form]=\"form\"></bizdoc-designer-privileges>\r\n  </div>\r\n</ng-template>\r\n<!-- view -->\r\n<ng-template #viewform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Type'|translate}}</mat-label>\r\n      <mat-select formControlName=\"type\">\r\n        <mat-option value=\"Chart\">{{'Chart'|translate}}</mat-option>\r\n        <mat-option value=\"Pivot\">{{'Pivot'|translate}}</mat-option>\r\n        <mat-option value=\"Grid\">{{'Grid'|translate}}</mat-option>\r\n        <mat-option value=\"Spreadsheet\">{{'Spreadsheet'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'XAxis'|translate}}</mat-label>\r\n      <mat-select formControlName=\"xAxis\" required multiple [sortComparator]=\"sortComparator\">\r\n        <mat-option *ngFor=\"let a of axes.controls\" [value]=\"a.get('name').value\">{{a.get('title').value || a.get('name').value}}</mat-option>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('xAxis').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('XAxis'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Series'|translate}}</mat-label>\r\n      <mat-select formControlName=\"series\" multiple [sortComparator]=\"sortComparator\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"form.get('xAxis').value?.indexOf(a.get('name').value)<0\">{{a.get('title').value|| a.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('series').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Series'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Indices'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indices\" multiple>\r\n        <ng-container *ngFor=\"let i of indices.controls\">\r\n          <mat-option [value]=\"i.get('name').value\">{{i.get('title').value|| i.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'ChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"chartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Pie\" [disabled]=\"form.get('series').value?.length>0\">{{'Pie'|translate}}</mat-option>\r\n            <mat-option value=\"Doughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'Doughnut'|translate}}</mat-option>\r\n            <mat-option value=\"HalfDoughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'HalfDoughnut'|translate}}</mat-option>\r\n            <mat-option value=\"Funnel\" [disabled]=\"form.get('series').value?.length>0\">{{'Funnel'|translate}}</mat-option>\r\n            <mat-option value=\"Pyramid\" [disabled]=\"form.get('series').value?.length>0\">{{'Pyramid'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'IndicesChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indicesChartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Guide'|translate}}</mat-label>\r\n      <mat-select formControlName=\"guide\">\r\n        <mat-option>{{'None'|translate}}</mat-option>\r\n        <mat-option *ngFor=\"let g of guides\" [value]=\"g.name\">{{g.title |localizedString}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter *ngIf=\"cube\" [cube]=\"cube\" [form]=\"form.get('filters')\"></bizdoc-designer-cube-filter>\r\n  </div>\r\n</ng-template>\r\n<!-- Axis -->\r\n<ng-template #axisform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <div class=\"row\">\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Title'|translate}}</mat-label>\r\n        <input matInput formControlName=\"title\" required />\r\n        <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n      &nbsp;\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Name'|translate}}</mat-label>\r\n        <input matInput formControlName=\"name\" required />\r\n        <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n    </div>\r\n    <mat-form-field>\r\n      <mat-label>{{'DataType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"dataType\" required>\r\n        <mat-option *ngFor=\"let t of datatypes['_'].elements|sort: 'title'\" [value]=\"t.name\">\r\n          {{t.title}}\r\n        </mat-option>\r\n        <mat-optgroup *ngFor=\"let g of datatypes|sort: 'title'\" [label]=\"g.title\">\r\n          <mat-option *ngFor=\"let t of g.elements|sort: 'title'\" [value]=\"t.name\">\r\n            {{t.title}}\r\n          </mat-option>\r\n        </mat-optgroup>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('DataType'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"combination\">{{'Combination'|translate}}</mat-checkbox></div>\r\n    <div><mat-checkbox formControlName=\"sensitive\">{{'Sensitive'|translate}}</mat-checkbox></div>\r\n    <mat-form-field>\r\n      <mat-label>{{'SelectionMode'|translate}}</mat-label>\r\n      <mat-select formControlName=\"selectionMode\">\r\n        <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n        <mat-option>{{'OneMode'|translate}}</mat-option>\r\n        <mat-option value=\"Multiple\">{{'Multiple'|translate}}</mat-option>\r\n        <mat-option value=\"Search\">{{'Autocomplete'|translate}}</mat-option>\r\n        <mat-option value=\"Pattern\">{{'Pattern'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'DescendentOf'|translate}}</mat-label>\r\n      <mat-select formControlName=\"descendentOf\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"a!=form\">{{a.get('title').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"indexable\">{{'Indexable'|translate}}</mat-checkbox></div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep form{min-width:350px}:host ::ng-deep .mat-mdc-radio-group p{margin-inline-start:8px}.mat-mdc-table{width:100%}.mat-mdc-table .mat-mdc-cell:last-child{width:80px}.flex{flex:1}table tr td:first-child{width:26px}dl{width:100%;overflow:hidden;padding:0;margin:0}dt{padding:0;margin:0;clear:both}dd{float:left;padding:0;margin:0}\n"] }]
+            args: [{ template: "<bizdoc-designer-element [form]=\"form\" [privileges]=\"true\" (continue)=\"complete()\" [view]=\"view\" (back)=\"view = null\" [context]=\"context\">\r\n  <!-- widget -->\r\n  <ng-template bizdocContent>\r\n    <dl *ngIf=\"jobInfo\">\r\n      <ng-container *ngIf=\"jobInfo.lastExecution\">\r\n        <dt>{{'LastExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.lastExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.nextExecution\">\r\n        <dt>{{'NextExecution'|translate}}</dt>\r\n        <dd>{{jobInfo.nextExecution|amTimeAgo}}</dd>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"jobInfo.lastJobState\">\r\n        <dt>{{'LastJobState'|translate}}</dt>\r\n        <dd>\r\n          <mat-icon *ngIf=\"jobInfo.error\" [bizdocTooltip]=\"jobInfo.error\">report</mat-icon>\r\n          <span class=\"job-state\">{{jobInfo.lastJobState| translate}}</span>\r\n        </dd>\r\n      </ng-container>\r\n    </dl>\r\n    <div class=\"row start center\">\r\n      <button mat-stroked-button (click)=\"sync()\" [disabled]=\"model.draft || syncing\">\r\n        <span> {{'Synchronize'|translate}}</span>\r\n      </button>\r\n      &nbsp;\r\n      <mat-spinner *ngIf=\"syncing\" diameter=\"22\"></mat-spinner>\r\n    </div>\r\n    <div class=\"row\">\r\n      @if(model.axes?.length)\r\n      {\r\n      <mat-chip-set>\r\n        @for(axis of model.axes; track axis){\r\n        <mat-chip>{{axis.title}}</mat-chip>\r\n        }\r\n        @for(index of model.indices || []; track index){\r\n        <mat-chip>{{index.title}}</mat-chip>\r\n        }\r\n      </mat-chip-set>\r\n      }\r\n    </div>\r\n  </ng-template>\r\n  <!-- edit -->\r\n  <ng-template bizdocEditContent>\r\n    <div [formGroup]=\"form\" class=\"column\">\r\n      <mat-label>{{'SecurityLevel'|translate}}</mat-label>\r\n      <mat-radio-group formControlName=\"scope\">\r\n        <p></p>\r\n        <mat-radio-button color=\"warn\">{{'Global'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityGlobalHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Positions\">{{'Positions'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPositionsHelp'|translate}}</p>\r\n        <mat-radio-button value=\"Patterns\">{{'Patterns'|translate}}</mat-radio-button>\r\n        <p>{{'SecurityPatternsHelp'|translate}}</p>\r\n      </mat-radio-group>\r\n      <ng-container formGroupName=\"yAxis\">\r\n        <mat-form-field class=\"flex\">\r\n          <mat-label>{{'Type'|translate}}</mat-label>\r\n          <mat-select formControlName=\"type\">\r\n            <mat-option value=\"Currency\">{{'Currency'|translate}}</mat-option>\r\n            <mat-option value=\"Number\">{{'Numeric'|translate}}</mat-option>\r\n            <mat-option value=\"Count\">{{'Accumulative'|translate}}</mat-option>\r\n          </mat-select>\r\n        </mat-form-field>\r\n      </ng-container>\r\n      <mat-form-field>\r\n        <mat-label>{{'Currency'|translate}}</mat-label>\r\n        <mat-select formControlName=\"currencyCode\" [sortComparator]=\"sortComparator\">\r\n          <mat-option *ngFor=\"let c of currencies\" [value]=\"c.name\">{{c.title}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Axes-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Axes'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(axes, newAxis(), 'Axis', axisform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"axes\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, axes)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let a of axes.controls; index as index\" [formGroup]=\"a\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{a.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(a, 'Axis', axisform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"axes.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Indices-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Indices'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(indices, newIndex(), 'Index', indexform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, indices)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let i of indices.controls; index as index\" [formGroup]=\"i\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{i.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(i, 'Index', indexform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"indices.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field *ngIf=\"indices.controls.length\">\r\n        <mat-label>{{'AnomalyNotification'|translate}}</mat-label>\r\n        <mat-select formControlName=\"anomaly\">\r\n          <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n          <mat-option value=\"Positions\">{{'Positions'|translate}}</mat-option>\r\n          <mat-option value=\"Recipients\">{{'Everyone'|translate}}</mat-option>\r\n        </mat-select>\r\n      </mat-form-field>\r\n      <!--Patterns-->\r\n      <h2 class=\"mat-h2 row\">\r\n        {{'Patterns'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(patterns, newPattern(), 'Pattern', patternform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"indices\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, patterns)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let p of patterns.controls; index as index\" [formGroup]=\"p\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{p.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(p, 'Pattern', patternform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"patterns.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <!--Views-->\r\n      <h2 class=\"row mat-h2\">\r\n        {{'CubeViews'|translate}}\r\n        <span class=\"divider\"></span>\r\n        <button mat-icon-button (click)=\"add(views, newView(), 'CubeView', viewform)\" [bizdocTooltip]=\"'Add'|translate\" type=\"button\"><mat-icon>add_circle_outline</mat-icon></button>\r\n      </h2>\r\n      <table formArrayName=\"views\" class=\"mat-mdc-table\" cdkDropList (cdkDropListDropped)=\"drop($event, views)\">\r\n        <tr class=\"mat-mdc-row\" *ngFor=\"let v of views.controls; index as index\" [formGroup]=\"v\" cdkDrag>\r\n          <td class=\"mat-mdc-cell\">\r\n            <mat-icon cdkDragHandle>drag_indicator</mat-icon>\r\n          </td>\r\n          <td class=\"mat-mdc-cell flex\">\r\n            {{v.get('title').value}}\r\n          </td>\r\n          <td class=\"mat-mdc-cell nowrap\">\r\n            <button mat-icon-button (click)=\"edit(v, 'View', viewform)\" [bizdocTooltip]=\"'Edit'|translate\" type=\"button\"><mat-icon>edit</mat-icon></button>\r\n            <button mat-icon-button (click)=\"views.removeAt(index)\" [bizdocTooltip]=\"'Remove'|translate\" type=\"button\"><mat-icon>delete</mat-icon></button>\r\n          </td>\r\n        </tr>\r\n      </table>\r\n      <mat-form-field>\r\n        <mat-label>{{'Schedule'|translate}}</mat-label>\r\n        <bizdoc-timespan-input formControlName=\"schedule\"></bizdoc-timespan-input>\r\n        <mat-icon matSuffix>timer</mat-icon>\r\n        <mat-hint></mat-hint>\r\n      </mat-form-field>\r\n    </div>\r\n  </ng-template>\r\n</bizdoc-designer-element>\r\n<!--idx-->\r\n<ng-template #indexform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    &nbsp;\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Name'|translate}}</mat-label>\r\n      <input matInput formControlName=\"name\" required />\r\n      <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n</ng-template>\r\n<!-- pattern-->\r\n<ng-template #patternform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter [cube]=\"model\" [form]=\"form.get('axes')\"></bizdoc-designer-cube-filter>\r\n    <bizdoc-designer-privileges [form]=\"form\"></bizdoc-designer-privileges>\r\n  </div>\r\n</ng-template>\r\n<!-- view -->\r\n<ng-template #viewform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <mat-form-field class=\"flex\">\r\n      <mat-label>{{'Title'|translate}}</mat-label>\r\n      <input matInput formControlName=\"title\" required />\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Type'|translate}}</mat-label>\r\n      <mat-select formControlName=\"type\">\r\n        <mat-option value=\"Chart\">{{'Chart'|translate}}</mat-option>\r\n        <mat-option value=\"Pivot\">{{'Pivot'|translate}}</mat-option>\r\n        <mat-option value=\"Grid\">{{'Grid'|translate}}</mat-option>\r\n        <mat-option value=\"Spreadsheet\">{{'Spreadsheet'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'XAxis'|translate}}</mat-label>\r\n      <mat-select formControlName=\"xAxis\" required multiple [sortComparator]=\"sortComparator\">\r\n        <mat-option *ngFor=\"let a of axes.controls\" [value]=\"a.get('name').value\">{{a.get('title').value || a.get('name').value}}</mat-option>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('xAxis').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('XAxis'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Series'|translate}}</mat-label>\r\n      <mat-select formControlName=\"series\" multiple [sortComparator]=\"sortComparator\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"form.get('xAxis').value?.indexOf(a.get('name').value)<0\">{{a.get('title').value|| a.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('series').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Series'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Indices'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indices\" multiple>\r\n        <ng-container *ngFor=\"let i of indices.controls\">\r\n          <mat-option [value]=\"i.get('name').value\">{{i.get('title').value|| i.get('name').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'ChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"chartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Pie\" [disabled]=\"form.get('series').value?.length>0\">{{'Pie'|translate}}</mat-option>\r\n            <mat-option value=\"Doughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'Doughnut'|translate}}</mat-option>\r\n            <mat-option value=\"HalfDoughnut\" [disabled]=\"form.get('series').value?.length>0\">{{'HalfDoughnut'|translate}}</mat-option>\r\n            <mat-option value=\"Funnel\" [disabled]=\"form.get('series').value?.length>0\">{{'Funnel'|translate}}</mat-option>\r\n            <mat-option value=\"Pyramid\" [disabled]=\"form.get('series').value?.length>0\">{{'Pyramid'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"!form.get('series').value?.length\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"!form.get('series').value?.length\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'IndicesChartType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"indicesChartType\">\r\n        <ng-container [ngSwitch]=\"form.get('type').value\">\r\n          <ng-container *ngSwitchCase=\"'Chart'\">\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('indices').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n          </ng-container>\r\n          <ng-container *ngSwitchCase=\"'Pivot'\">\r\n            <mat-option>{{'None'|translate}}</mat-option>\r\n            <mat-option value=\"Column\">{{'Column'|translate}}</mat-option>\r\n            <mat-option value=\"Bar\">{{'Bar'|translate}}</mat-option>\r\n            <mat-option value=\"Bubble\">{{'Bubble'|translate}}</mat-option>\r\n            <mat-option value=\"Line\">{{'Line'|translate}}</mat-option>\r\n            <mat-option value=\"Spline\">{{'Spline'|translate}}</mat-option>\r\n            <mat-option value=\"SplineArea\">{{'SplineArea'|translate}}</mat-option>\r\n            <mat-option value=\"Area\">{{'Area'|translate}}</mat-option>\r\n            <mat-option value=\"Scatter\">{{'Scatter'|translate}}</mat-option>\r\n            <mat-option value=\"Polar\">{{'Polar'|translate}}</mat-option>\r\n            <mat-option value=\"Radar\">{{'Radar'|translate}}</mat-option>\r\n            <mat-option value=\"StepLine\">{{'StepLine'|translate}}</mat-option>\r\n            <mat-option value=\"StepArea\">{{'StepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar'|translate}}</mat-option>\r\n            <mat-option value=\"StackingBar100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingBar100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingArea100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingArea100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn'|translate}}</mat-option>\r\n            <mat-option value=\"StackingColumn100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingColumn100'|translate}}</mat-option>\r\n            <mat-option value=\"StackingStepArea\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingStepArea'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine'|translate}}</mat-option>\r\n            <mat-option value=\"StackingLine100\" [disabled]=\"form.get('series').value?.length<2\">{{'StackingLine100'|translate}}</mat-option>\r\n          </ng-container>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'Guide'|translate}}</mat-label>\r\n      <mat-select formControlName=\"guide\">\r\n        <mat-option>{{'None'|translate}}</mat-option>\r\n        <mat-option *ngFor=\"let g of guides\" [value]=\"g.name\">{{g.title |localizedString}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <bizdoc-designer-cube-filter *ngIf=\"cube\" [cube]=\"cube\" [form]=\"form.get('filters')\"></bizdoc-designer-cube-filter>\r\n  </div>\r\n</ng-template>\r\n<!-- Axis -->\r\n<ng-template #axisform let-form>\r\n  <div [formGroup]=\"form\" class=\"column\">\r\n    <div class=\"row\">\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Title'|translate}}</mat-label>\r\n        <input matInput formControlName=\"title\" required />\r\n        <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Title'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n      &nbsp;\r\n      <mat-form-field class=\"flex\">\r\n        <mat-label>{{'Name'|translate}}</mat-label>\r\n        <input matInput formControlName=\"name\" required />\r\n        <mat-error *ngIf=\"form.get('name').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('Name'|translate)\"></mat-error>\r\n      </mat-form-field>\r\n    </div>\r\n    <mat-form-field>\r\n      <mat-label>{{'DataType'|translate}}</mat-label>\r\n      <mat-select formControlName=\"dataType\" required>\r\n        <mat-option *ngFor=\"let t of typegroups['_'].elements|sort: 'title'\" [value]=\"t.name\">\r\n          {{t.title}}\r\n        </mat-option>\r\n        <mat-optgroup *ngFor=\"let g of typegroups|sort: 'title'\" [label]=\"g.title\">\r\n          <mat-option *ngFor=\"let t of g.elements|sort: 'title'\" [value]=\"t.name\">\r\n            {{t.title}}\r\n          </mat-option>\r\n        </mat-optgroup>\r\n      </mat-select>\r\n      <mat-error *ngIf=\"form.get('title').hasError('required')\" [innerHTML]=\"'RequiredErr'|translate:('DataType'|translate)\"></mat-error>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"combination\">{{'Combination'|translate}}</mat-checkbox></div>\r\n    <div><mat-checkbox formControlName=\"sensitive\">{{'Sensitive'|translate}}</mat-checkbox></div>\r\n    <mat-form-field>\r\n      <mat-label>{{'SelectionMode'|translate}}</mat-label>\r\n      <mat-select formControlName=\"selectionMode\">\r\n        <mat-option value=\"None\">{{'None'|translate}}</mat-option>\r\n        <mat-option>{{'OneMode'|translate}}</mat-option>\r\n        <mat-option value=\"Multiple\">{{'Multiple'|translate}}</mat-option>\r\n        <mat-option value=\"Search\">{{'Autocomplete'|translate}}</mat-option>\r\n        <mat-option value=\"Pattern\">{{'Pattern'|translate}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <mat-form-field>\r\n      <mat-label>{{'DescendentOf'|translate}}</mat-label>\r\n      <mat-select formControlName=\"descendentOf\">\r\n        <ng-container *ngFor=\"let a of axes.controls\">\r\n          <mat-option [value]=\"a.get('name').value\" *ngIf=\"a!=form\">{{a.get('title').value}}</mat-option>\r\n        </ng-container>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <div><mat-checkbox formControlName=\"indexable\">{{'Indexable'|translate}}</mat-checkbox></div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep form{min-width:350px}:host ::ng-deep .mat-mdc-radio-group p{margin-inline-start:8px}.mat-mdc-table{width:100%}.mat-mdc-table .mat-mdc-cell:last-child{width:80px}.flex{flex:1}table tr td:first-child{width:26px}dl{width:100%;overflow:hidden;padding:0;margin:0}dt{padding:0;margin:0;clear:both}dd{float:left;padding:0;margin:0}\n"] }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: SystemService }, { type: PromptService }, { type: i0.ElementRef }, { type: DesignerRef, decorators: [{
                     type: Inject,
                     args: [DesignerRef]
@@ -34022,14 +34033,14 @@ let ConfigurationDesignerComponent = class ConfigurationDesignerComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ConfigurationDesignerComponent, deps: [{ token: PanesRouter }, { token: TranslateService }, { token: PromptService }, { token: SessionService }, { token: i0.ElementRef }, { token: i0.Injector }, { token: UtilityRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ConfigurationDesignerComponent, selector: "ng-component", host: { attributes: { "tabindex": "0" }, listeners: { "keydown": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"save()\" [disabled]=\"!dirty || loading || saving\" [bizdocTooltip]=\"'Save'|translate\"><mat-icon>save</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"clearSearch()\" [disabled]=\"!searchBy\" [bizdocTooltip]=\"'Clear'|translate\"><mat-icon>search_off</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading ? 'buffer' : 'indeterminate'\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<bizdoc-none *ngIf=\"loading\" title=\"SettingThingsUp\" [subtitle]=\"PleaseWait\" icon=\"architecture\"></bizdoc-none>\r\n<div>\r\n  <section *ngFor=\"let s of sections | filterBy:'hide': false: searchBy\">\r\n    <h2 class=\"mat-h2\">{{s.title}}</h2>\r\n    <!--<hr />-->\r\n    <div class=\"elements\" cdkDropList cdkDropListOrientation=\"horizontal\" [cdkDropListData]=\"s.elements\" (cdkDropListDropped)=\"drop($event)\">\r\n      <mat-card *ngFor=\"let e of s.elements | filterBy:'hide': false: searchBy\" [class.disabled]=\"e.disabled\" cdkDrag cdkDragRootElement=\".mat-mdc-card-title\">\r\n        <!-- @item-->\r\n        <mat-card-header>\r\n          <mat-card-title>\r\n            {{e.title|localizedString}}\r\n            <span class=\"divider\"></span>\r\n            <mat-icon [bizdocTooltip]=\"e.help\" [bizdocTooltipDuration]=\"6000\" *ngIf=\"e.help\">help_outline</mat-icon>\r\n          </mat-card-title>\r\n          <mat-card-subtitle>\r\n            {{e.name}}\r\n          </mat-card-subtitle>\r\n        </mat-card-header>\r\n        <mat-card-content>\r\n          <ng-container *ngComponentOutlet=\"s.comp; injector: e.injector\"></ng-container>\r\n        </mat-card-content>\r\n        <mat-card-actions class=\"row\">\r\n          <button mat-icon-button (click)=\"copy(s, e)\" *ngIf=\"!e.copyOf\" [bizdocTooltip]=\"'Copy'|translate\"><mat-icon>file_copy</mat-icon></button>\r\n          <button mat-icon-button (click)=\"remove(s, e)\" *ngIf=\"e.draft || e.empty\" [bizdocTooltip]=\"'Discard'|translate\"><mat-icon>delete</mat-icon></button>\r\n          <button mat-icon-button (click)=\"toggleDisabled(e)\" [bizdocTooltip]=\"(e.disabled ? 'Enable' : 'Disable')|translate\"><mat-icon>{{e.disabled ? 'visibility' : 'visibility_off'}}</mat-icon></button>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"edit(s, e)\" [bizdocTooltip]=\"'Settings'|translate\"><mat-icon>settings</mat-icon></button>\r\n        </mat-card-actions>\r\n      </mat-card>\r\n      <div class=\"add-element\" matRipple (click)=\"add(s, menuTrigger, $event)\" *ngIf=\"s.templates?.length\">\r\n        <span [matMenuTriggerFor]=\"templateMenu\" #menuTrigger=\"matMenuTrigger\"></span>\r\n        <button mat-icon-button><mat-icon [bizdocTooltip]=\"'New'|translate\" disableRipple=\"true\">add</mat-icon></button>\r\n        <mat-menu #templateMenu>\r\n          <button mat-menu-item *ngFor=\"let t of s.templates\" (click)=\"create(s, t)\">\r\n            <span *ngIf=\"t.family\">\r\n              {{t.family}}\r\n              &nbsp;-&nbsp;\r\n            </span>\r\n            <span>\r\n              {{t.title}}\r\n            </span>\r\n          </button>\r\n        </mat-menu>\r\n      </div>\r\n    </div>\r\n  </section>\r\n</div>\r\n", styles: [":host{outline:none}section h2{margin:10px;top:0;position:sticky}section .elements{display:flex;flex-wrap:wrap}section .elements .disabled{opacity:.5;background-color:transparent}section .add-element{border:2px dashed gray;min-width:126px;min-height:126px;border-radius:3px;margin:1px 0 6px;text-align:center}section .add-element button{top:50%;transform:translateY(-50%)}:host ::ng-deep .mat-mdc-card{margin:6px;display:flex;flex-direction:column}:host ::ng-deep .mat-mdc-card button{opacity:.1}:host ::ng-deep .mat-mdc-card:hover button{opacity:1}:host ::ng-deep .mat-mdc-card-header-text{width:100%}:host ::ng-deep .mat-mdc-card-title{display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row;align-items:center}.divider{min-width:3px}:host ::ng-deep .mat-mdc-card-content{flex:1}\n"], dependencies: [{ kind: "directive", type: i1$2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i8$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i8$3.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i8$3.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i8$3.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8$3.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i8$3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i3$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: i8$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i9$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i9.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: i11.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: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: LocalizedStringPipe, name: "localizedString" }, { kind: "pipe", type: FilterPipe, name: "filterBy" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [itemAnimation] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ConfigurationDesignerComponent, selector: "ng-component", host: { attributes: { "tabindex": "0" }, listeners: { "keydown": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"save()\" [disabled]=\"!dirty || loading || saving\" [bizdocTooltip]=\"'Save'|translate\"><mat-icon>save</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"clearSearch()\" [disabled]=\"!searchBy\" [bizdocTooltip]=\"'Clear'|translate\"><mat-icon>search_off</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading ? 'buffer' : 'indeterminate'\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<bizdoc-none *ngIf=\"loading\" title=\"SettingThingsUp\" [subtitle]=\"PleaseWait\" icon=\"architecture\"></bizdoc-none>\r\n<div>\r\n  <section *ngFor=\"let s of sections | filterBy:'hide': false: searchBy\">\r\n    <h2 class=\"mat-h1\">{{s.title}}</h2>\r\n    <!--<hr />-->\r\n    <div class=\"elements\" cdkDropList cdkDropListOrientation=\"horizontal\" [cdkDropListData]=\"s.elements\" (cdkDropListDropped)=\"drop($event)\">\r\n      <mat-card *ngFor=\"let e of s.elements | filterBy:'hide': false: searchBy\" [class.disabled]=\"e.disabled\" cdkDrag cdkDragRootElement=\".mat-mdc-card-title\">\r\n        <!-- @item-->\r\n        <mat-card-header>\r\n          <mat-card-title>\r\n            {{e.title|localizedString}}\r\n            <span class=\"divider\"></span>\r\n            <mat-icon [bizdocTooltip]=\"e.help\" [bizdocTooltipDuration]=\"6000\" *ngIf=\"e.help\">help_outline</mat-icon>\r\n          </mat-card-title>\r\n          <mat-card-subtitle>\r\n            {{e.name}}\r\n          </mat-card-subtitle>\r\n        </mat-card-header>\r\n        <mat-card-content>\r\n          <ng-container *ngComponentOutlet=\"s.comp; injector: e.injector\"></ng-container>\r\n        </mat-card-content>\r\n        <mat-card-actions class=\"row\">\r\n          <button mat-icon-button (click)=\"copy(s, e)\" *ngIf=\"!e.copyOf\" [bizdocTooltip]=\"'Copy'|translate\"><mat-icon>file_copy</mat-icon></button>\r\n          <button mat-icon-button (click)=\"remove(s, e)\" *ngIf=\"e.draft || e.empty\" [bizdocTooltip]=\"'Discard'|translate\"><mat-icon>delete</mat-icon></button>\r\n          <button mat-icon-button (click)=\"toggleDisabled(e)\" [bizdocTooltip]=\"(e.disabled ? 'Enable' : 'Disable')|translate\"><mat-icon>{{e.disabled ? 'visibility' : 'visibility_off'}}</mat-icon></button>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"edit(s, e)\" [bizdocTooltip]=\"'Settings'|translate\"><mat-icon>settings</mat-icon></button>\r\n        </mat-card-actions>\r\n      </mat-card>\r\n      <div class=\"add-element\" matRipple (click)=\"add(s, menuTrigger, $event)\" *ngIf=\"s.templates?.length\">\r\n        <span [matMenuTriggerFor]=\"templateMenu\" #menuTrigger=\"matMenuTrigger\"></span>\r\n        <button mat-icon-button><mat-icon [bizdocTooltip]=\"'New'|translate\" disableRipple=\"true\">add</mat-icon></button>\r\n        <mat-menu #templateMenu>\r\n          <button mat-menu-item *ngFor=\"let t of s.templates\" (click)=\"create(s, t)\">\r\n            <span *ngIf=\"t.family\">\r\n              {{t.family}}\r\n              &nbsp;-&nbsp;\r\n            </span>\r\n            <span>\r\n              {{t.title}}\r\n            </span>\r\n          </button>\r\n        </mat-menu>\r\n      </div>\r\n    </div>\r\n  </section>\r\n</div>\r\n", styles: [":host{outline:none}section h2{margin:10px;top:0;position:sticky}section .elements{display:flex;flex-wrap:wrap}section .elements .disabled{opacity:.5;background-color:transparent}section .add-element{border:2px dashed gray;min-width:126px;min-height:126px;border-radius:3px;margin:1px 0 6px;text-align:center}section .add-element button{top:50%;transform:translateY(-50%)}:host ::ng-deep .mat-mdc-card{margin:6px;display:flex;flex-direction:column}:host ::ng-deep .mat-mdc-card button{opacity:.1}:host ::ng-deep .mat-mdc-card:hover button{opacity:1}:host ::ng-deep .mat-mdc-card-header-text{width:100%}:host ::ng-deep .mat-mdc-card-title{display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row;align-items:center}.divider{min-width:3px}:host ::ng-deep .mat-mdc-card-content{flex:1}\n"], dependencies: [{ kind: "directive", type: i1$2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i8$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i8$3.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i8$3.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i8$3.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8$3.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i8$3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i3$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: i8$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i9$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i9.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: i11.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: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { kind: "pipe", type: LocalizedStringPipe, name: "localizedString" }, { kind: "pipe", type: FilterPipe, name: "filterBy" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [itemAnimation] }); }
 };
 ConfigurationDesignerComponent = __decorate([
     BizDoc({ selector: 'bizdoc-configuration-designer' })
 ], ConfigurationDesignerComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ConfigurationDesignerComponent, decorators: [{
             type: Component,
-            args: [{ animations: [itemAnimation], host: { tabindex: '0' }, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"save()\" [disabled]=\"!dirty || loading || saving\" [bizdocTooltip]=\"'Save'|translate\"><mat-icon>save</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"clearSearch()\" [disabled]=\"!searchBy\" [bizdocTooltip]=\"'Clear'|translate\"><mat-icon>search_off</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading ? 'buffer' : 'indeterminate'\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<bizdoc-none *ngIf=\"loading\" title=\"SettingThingsUp\" [subtitle]=\"PleaseWait\" icon=\"architecture\"></bizdoc-none>\r\n<div>\r\n  <section *ngFor=\"let s of sections | filterBy:'hide': false: searchBy\">\r\n    <h2 class=\"mat-h2\">{{s.title}}</h2>\r\n    <!--<hr />-->\r\n    <div class=\"elements\" cdkDropList cdkDropListOrientation=\"horizontal\" [cdkDropListData]=\"s.elements\" (cdkDropListDropped)=\"drop($event)\">\r\n      <mat-card *ngFor=\"let e of s.elements | filterBy:'hide': false: searchBy\" [class.disabled]=\"e.disabled\" cdkDrag cdkDragRootElement=\".mat-mdc-card-title\">\r\n        <!-- @item-->\r\n        <mat-card-header>\r\n          <mat-card-title>\r\n            {{e.title|localizedString}}\r\n            <span class=\"divider\"></span>\r\n            <mat-icon [bizdocTooltip]=\"e.help\" [bizdocTooltipDuration]=\"6000\" *ngIf=\"e.help\">help_outline</mat-icon>\r\n          </mat-card-title>\r\n          <mat-card-subtitle>\r\n            {{e.name}}\r\n          </mat-card-subtitle>\r\n        </mat-card-header>\r\n        <mat-card-content>\r\n          <ng-container *ngComponentOutlet=\"s.comp; injector: e.injector\"></ng-container>\r\n        </mat-card-content>\r\n        <mat-card-actions class=\"row\">\r\n          <button mat-icon-button (click)=\"copy(s, e)\" *ngIf=\"!e.copyOf\" [bizdocTooltip]=\"'Copy'|translate\"><mat-icon>file_copy</mat-icon></button>\r\n          <button mat-icon-button (click)=\"remove(s, e)\" *ngIf=\"e.draft || e.empty\" [bizdocTooltip]=\"'Discard'|translate\"><mat-icon>delete</mat-icon></button>\r\n          <button mat-icon-button (click)=\"toggleDisabled(e)\" [bizdocTooltip]=\"(e.disabled ? 'Enable' : 'Disable')|translate\"><mat-icon>{{e.disabled ? 'visibility' : 'visibility_off'}}</mat-icon></button>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"edit(s, e)\" [bizdocTooltip]=\"'Settings'|translate\"><mat-icon>settings</mat-icon></button>\r\n        </mat-card-actions>\r\n      </mat-card>\r\n      <div class=\"add-element\" matRipple (click)=\"add(s, menuTrigger, $event)\" *ngIf=\"s.templates?.length\">\r\n        <span [matMenuTriggerFor]=\"templateMenu\" #menuTrigger=\"matMenuTrigger\"></span>\r\n        <button mat-icon-button><mat-icon [bizdocTooltip]=\"'New'|translate\" disableRipple=\"true\">add</mat-icon></button>\r\n        <mat-menu #templateMenu>\r\n          <button mat-menu-item *ngFor=\"let t of s.templates\" (click)=\"create(s, t)\">\r\n            <span *ngIf=\"t.family\">\r\n              {{t.family}}\r\n              &nbsp;-&nbsp;\r\n            </span>\r\n            <span>\r\n              {{t.title}}\r\n            </span>\r\n          </button>\r\n        </mat-menu>\r\n      </div>\r\n    </div>\r\n  </section>\r\n</div>\r\n", styles: [":host{outline:none}section h2{margin:10px;top:0;position:sticky}section .elements{display:flex;flex-wrap:wrap}section .elements .disabled{opacity:.5;background-color:transparent}section .add-element{border:2px dashed gray;min-width:126px;min-height:126px;border-radius:3px;margin:1px 0 6px;text-align:center}section .add-element button{top:50%;transform:translateY(-50%)}:host ::ng-deep .mat-mdc-card{margin:6px;display:flex;flex-direction:column}:host ::ng-deep .mat-mdc-card button{opacity:.1}:host ::ng-deep .mat-mdc-card:hover button{opacity:1}:host ::ng-deep .mat-mdc-card-header-text{width:100%}:host ::ng-deep .mat-mdc-card-title{display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row;align-items:center}.divider{min-width:3px}:host ::ng-deep .mat-mdc-card-content{flex:1}\n"] }]
+            args: [{ animations: [itemAnimation], host: { tabindex: '0' }, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"save()\" [disabled]=\"!dirty || loading || saving\" [bizdocTooltip]=\"'Save'|translate\"><mat-icon>save</mat-icon></button>\r\n  <span class=\"divider\"></span>\r\n  <button mat-icon-button (click)=\"clearSearch()\" [disabled]=\"!searchBy\" [bizdocTooltip]=\"'Clear'|translate\"><mat-icon>search_off</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading ? 'buffer' : 'indeterminate'\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<bizdoc-none *ngIf=\"loading\" title=\"SettingThingsUp\" [subtitle]=\"PleaseWait\" icon=\"architecture\"></bizdoc-none>\r\n<div>\r\n  <section *ngFor=\"let s of sections | filterBy:'hide': false: searchBy\">\r\n    <h2 class=\"mat-h1\">{{s.title}}</h2>\r\n    <!--<hr />-->\r\n    <div class=\"elements\" cdkDropList cdkDropListOrientation=\"horizontal\" [cdkDropListData]=\"s.elements\" (cdkDropListDropped)=\"drop($event)\">\r\n      <mat-card *ngFor=\"let e of s.elements | filterBy:'hide': false: searchBy\" [class.disabled]=\"e.disabled\" cdkDrag cdkDragRootElement=\".mat-mdc-card-title\">\r\n        <!-- @item-->\r\n        <mat-card-header>\r\n          <mat-card-title>\r\n            {{e.title|localizedString}}\r\n            <span class=\"divider\"></span>\r\n            <mat-icon [bizdocTooltip]=\"e.help\" [bizdocTooltipDuration]=\"6000\" *ngIf=\"e.help\">help_outline</mat-icon>\r\n          </mat-card-title>\r\n          <mat-card-subtitle>\r\n            {{e.name}}\r\n          </mat-card-subtitle>\r\n        </mat-card-header>\r\n        <mat-card-content>\r\n          <ng-container *ngComponentOutlet=\"s.comp; injector: e.injector\"></ng-container>\r\n        </mat-card-content>\r\n        <mat-card-actions class=\"row\">\r\n          <button mat-icon-button (click)=\"copy(s, e)\" *ngIf=\"!e.copyOf\" [bizdocTooltip]=\"'Copy'|translate\"><mat-icon>file_copy</mat-icon></button>\r\n          <button mat-icon-button (click)=\"remove(s, e)\" *ngIf=\"e.draft || e.empty\" [bizdocTooltip]=\"'Discard'|translate\"><mat-icon>delete</mat-icon></button>\r\n          <button mat-icon-button (click)=\"toggleDisabled(e)\" [bizdocTooltip]=\"(e.disabled ? 'Enable' : 'Disable')|translate\"><mat-icon>{{e.disabled ? 'visibility' : 'visibility_off'}}</mat-icon></button>\r\n          <span class=\"divider\"></span>\r\n          <button mat-icon-button (click)=\"edit(s, e)\" [bizdocTooltip]=\"'Settings'|translate\"><mat-icon>settings</mat-icon></button>\r\n        </mat-card-actions>\r\n      </mat-card>\r\n      <div class=\"add-element\" matRipple (click)=\"add(s, menuTrigger, $event)\" *ngIf=\"s.templates?.length\">\r\n        <span [matMenuTriggerFor]=\"templateMenu\" #menuTrigger=\"matMenuTrigger\"></span>\r\n        <button mat-icon-button><mat-icon [bizdocTooltip]=\"'New'|translate\" disableRipple=\"true\">add</mat-icon></button>\r\n        <mat-menu #templateMenu>\r\n          <button mat-menu-item *ngFor=\"let t of s.templates\" (click)=\"create(s, t)\">\r\n            <span *ngIf=\"t.family\">\r\n              {{t.family}}\r\n              &nbsp;-&nbsp;\r\n            </span>\r\n            <span>\r\n              {{t.title}}\r\n            </span>\r\n          </button>\r\n        </mat-menu>\r\n      </div>\r\n    </div>\r\n  </section>\r\n</div>\r\n", styles: [":host{outline:none}section h2{margin:10px;top:0;position:sticky}section .elements{display:flex;flex-wrap:wrap}section .elements .disabled{opacity:.5;background-color:transparent}section .add-element{border:2px dashed gray;min-width:126px;min-height:126px;border-radius:3px;margin:1px 0 6px;text-align:center}section .add-element button{top:50%;transform:translateY(-50%)}:host ::ng-deep .mat-mdc-card{margin:6px;display:flex;flex-direction:column}:host ::ng-deep .mat-mdc-card button{opacity:.1}:host ::ng-deep .mat-mdc-card:hover button{opacity:1}:host ::ng-deep .mat-mdc-card-header-text{width:100%}:host ::ng-deep .mat-mdc-card-title{display:flex;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row;align-items:center}.divider{min-width:3px}:host ::ng-deep .mat-mdc-card-content{flex:1}\n"] }]
         }], ctorParameters: () => [{ type: PanesRouter }, { type: TranslateService }, { type: PromptService }, { type: SessionService }, { type: i0.ElementRef }, { type: i0.Injector }, { type: UtilityRef }], propDecorators: { handleKeyboardEvent: [{
                 type: HostListener,
                 args: ['keydown', ['$event']]