@bizdoc/core 1.10.2 → 1.10.3

package/fesm2020/bizdoc-core.mjs

@@ -18,7 +18,7 @@ import { MatIconModule } from '@angular/material/icon';
 import * as i10 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import * as i10$1 from '@angular/common';
-import { CommonModule, getCurrencySymbol, formatNumber, formatPercent, formatCurrency } from '@angular/common';
+import { CommonModule, getCurrencySymbol, getLocaleNumberFormat, NumberFormatStyle, formatNumber, formatPercent, formatCurrency } from '@angular/common';
 import * as i6 from '@angular/flex-layout/flex';
 import { ESCAPE, ENTER, COMMA, RIGHT_ARROW, LEFT_ARROW, UP_ARROW, DOWN_ARROW } from '@angular/cdk/keycodes';
 import { HubConnectionBuilder, HubConnectionState } from '@microsoft/signalr';
@@ -115,7 +115,7 @@ import { SelectionModel } from '@angular/cdk/collections';
 import * as i24 from '@angular/flex-layout/extended';
 import * as i8$2 from '@syncfusion/ej2-angular-charts';
 import { AccumulationChart, PyramidSeries, FunnelSeries, AccumulationDataLabel, AccumulationTooltip, AccumulationLegend, Export, PieSeries, Chart as Chart$1, Category, DateTime, Tooltip, Legend, BarSeries, AreaSeries, BubbleSeries, ColumnSeries, LineSeries, PolarSeries, RadarSeries, SplineSeries, SplineAreaSeries, ScatterSeries, StackingLineSeries, StackingAreaSeries, StackingColumnSeries, StackingBarSeries, StepAreaSeries, StepLineSeries, ChartModule, AccumulationChartAllModule, SparklineAllModule, 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, ExportService, AccumulationAnnotationService, AccumulationDataLabelService, AccumulationLegendService, AccumulationSelectionService, AccumulationTooltipService, AccumulationChartComponent, ChartComponent } from '@syncfusion/ej2-angular-charts';
-import * as XLSX from 'xlsx';
+import { Workbook } from '@syncfusion/ej2-excel-export';
 import { Chart } from '@syncfusion/ej2-charts';
 import * as i6$5 from '@syncfusion/ej2-angular-grids';
 import { Grid, Selection, Aggregate, Freeze, ExcelExport, Resize, GridModule, PagerModule, ExcelExportService, AggregateService, FreezeService, GroupService, PageService, ResizeService, SortService, SelectionService as SelectionService$1, GridComponent } from '@syncfusion/ej2-angular-grids';
@@ -1095,6 +1095,9 @@ class SessionService {
     get userId() {
         return this._profile.byId || this.profile.userId;
     }
+    get locale() {
+        return this.language.split('-')[0];
+    }
     get language() {
         if (!this._lang) {
             this._lang = this._cookies.get('lang');
@@ -5468,11 +5471,12 @@ class CubeService {
         return currencyCode || DEFAULT_CURRENCY;
     }
     get digitsInfo() {
-        return (this.fractionDigits === 0 ? '1' : `1.${this.fractionDigits}-${this.fractionDigits}`);
+        const { fractionDigits } = this;
+        return `1.${fractionDigits}-${fractionDigits}`;
     }
     get fractionDigits() {
-        const { formats } = this._config || {}, { fractionDigits } = formats || {};
-        return fractionDigits || 2;
+        const { formats } = this._config, { fractionDigits } = formats || {};
+        return fractionDigits !== undefined ? fractionDigits : 2;
     }
     /**
      * query cube by axes, series and indices
@@ -8618,7 +8622,12 @@ class CubeAccumulationChartComponent {
             this.palettes = _session.accentPalette;
         });
     }
+    set xAxis(val) {
+        this._xAxis = isArray(val) ? val : [val];
+    }
     ngOnInit() {
+        this._cube = this._session.profile.cubes.find(c => c.name === this.cube) || this._session.profile.cubes[0];
+        this.currencyCode = this._cube.currencyCode;
         switch (this.chartType) {
             case 'Doughnut':
                 this.innerRadius = '10%';
@@ -8650,8 +8659,8 @@ class CubeAccumulationChartComponent {
     pointClick(evt) {
         const axes = {};
         const x = evt.series.dataSource[evt.pointIndex].x.split(AXES_CODE_DIVIDER);
-        for (let i = 0; i < this.xAxis.length; i++)
-            axes[this.xAxis[i]] = x[i];
+        for (let i = 0; i < this._xAxis.length; i++)
+            axes[this._xAxis[i]] = x[i];
         this.explore.emit({ axes });
     }
     /**
@@ -8668,7 +8677,7 @@ class CubeAccumulationChartComponent {
     }
     execute() {
         this.loadingChange.emit(true);
-        this._service.series(this.cube, this.xAxis, {
+        this._service.series(this.cube, this._xAxis, {
             filters: this.filters,
             scope: this.scope
         }).subscribe(r => {
@@ -8710,12 +8719,59 @@ class CubeAccumulationChartComponent {
         }, this._elementRef.nativeElement);
     }
     exportToExcel(title) {
-        const ws = XLSX.utils.json_to_sheet(this.dataSource);
-        const wb = XLSX.utils.book_new();
-        const name = this._translate.get('SheetN', 1);
-        wb.Sheets[name] = ws;
-        wb.SheetNames.push(name);
-        XLSX.writeFile(wb, `${title}.xlsx`);
+        const numberFormat = this._cube.currencyCode ?
+            getCurrencySymbol(this._cube.currencyCode, 'narrow') +
+                getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Currency)
+            : getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Decimal), rows = [{
+                index: 1,
+                cells: this._xAxis.map((x, i) => ({
+                    index: i + 1,
+                    value: this._cube.axes.find(a => a.name === x).title,
+                    cellStyle: {
+                        bold: true
+                    }
+                }))
+            }];
+        rows[0].cells.push({
+            index: this._xAxis.length + 1,
+            value: this._translate.get('Value'),
+            cellStyle: {
+                bold: true
+            }
+        });
+        this.dataSource.forEach((p, i) => {
+            const cells = this._xAxis.map((_, j) => {
+                return {
+                    index: j + 1,
+                    value: p.name.split(AXES_LABEL_DIVIDER)[j]
+                };
+            });
+            cells.push({
+                type: 'number',
+                index: this._xAxis.length + 1,
+                cellStyle: {
+                    numberFormat,
+                    hAlign: 'right'
+                },
+                value: p.y
+            });
+            rows.push({
+                index: i + 2,
+                cells
+            });
+        });
+        const book = new Workbook({
+            worksheets: [
+                {
+                    enableRtl: this._session.inverse,
+                    name: this._translate.get('SheetN', 1),
+                    columns: [...this._xAxis.map((_, i) => ({ index: i + 1, width: 250 })),
+                        { index: this._xAxis.length + 1 },],
+                    rows
+                }
+            ],
+        }, 'xlsx');
+        book.save(`${title}.xlsx`);
     }
     ngOnDestroy() {
         this.accumchart && this.accumchart.destroy();
@@ -8725,7 +8781,7 @@ class CubeAccumulationChartComponent {
 }
 CubeAccumulationChartComponent.nextId = 0;
 CubeAccumulationChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeAccumulationChartComponent, deps: [{ token: CubeService }, { token: PromptService }, { token: TranslateService }, { token: i0.ElementRef }, { token: SessionService }], target: i0.ɵɵFactoryTarget.Component });
-CubeAccumulationChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeAccumulationChartComponent, selector: "bizdoc-cube-accum", inputs: { height: "height", width: "width", cube: "cube", xAxis: "xAxis", indices: "indices", filters: "filters", chartType: "chartType", scope: "scope", loading: "loading" }, outputs: { loadingChange: "loadingChange", explore: "explore" }, host: { properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
+CubeAccumulationChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeAccumulationChartComponent, selector: "bizdoc-cube-accum", inputs: { height: "height", width: "width", cube: "cube", xAxis: "xAxis", filters: "filters", chartType: "chartType", scope: "scope", loading: "loading" }, outputs: { loadingChange: "loadingChange", explore: "explore" }, host: { properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeAccumulationChartComponent, decorators: [{
             type: Component,
             args: [{
@@ -8745,8 +8801,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                 type: Input
             }], xAxis: [{
                 type: Input
-            }], indices: [{
-                type: Input
             }], filters: [{
                 type: Input
             }], chartType: [{
@@ -8850,6 +8904,8 @@ class CubeChartComponent {
             this._indices = null;
     }
     ngOnInit() {
+        this._cube = this._session.profile.cubes.find(c => c.name === this.cube) || this._session.profile.cubes[0];
+        this.currencyCode = this._cube.currencyCode;
         if (this.chartType === 'Line' || this.chartType === 'Spline')
             this.crosshair.enable = true;
         this.primaryYAxis.labelFormat = this.currencyCode ? 'c0' : 'n0';
@@ -8961,14 +9017,62 @@ class CubeChartComponent {
         this.explore.emit({ axes, index });
     }
     exportToExcel(title) {
-        const wb = XLSX.utils.book_new();
-        this._data.forEach((s, i) => {
-            const ws = XLSX.utils.json_to_sheet(s.points);
-            const name = s.title || this._translate.get('SheetN', i + 1);
-            wb.Sheets[name] = ws;
-            wb.SheetNames.push(name);
+        const numberFormat = this._cube.currencyCode ?
+            getCurrencySymbol(this._cube.currencyCode, 'narrow') +
+                getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Currency)
+            : getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Decimal), worksheets = [];
+        this._data.forEach(s => {
+            const cells = this._xAxis.map((x, i) => ({
+                index: i + 1,
+                value: this._cube.axes.find(a => a.name === x).title,
+                cellStyle: {
+                    bold: true
+                }
+            }));
+            cells.push({
+                index: this._xAxis.length + 1,
+                value: this._translate.get('Value'),
+                cellStyle: {
+                    bold: true
+                }
+            });
+            const rows = [{
+                    index: 1,
+                    cells
+                }];
+            s.points.forEach((p, i) => {
+                const cells = this._xAxis.map((_, j) => {
+                    return {
+                        index: j + 1,
+                        value: p.name.split(AXES_LABEL_DIVIDER)[j]
+                    };
+                });
+                cells.push({
+                    type: 'number',
+                    index: this._xAxis.length + 1,
+                    cellStyle: {
+                        numberFormat,
+                        hAlign: 'right'
+                    },
+                    value: p.y
+                });
+                rows.push({
+                    index: i + 2,
+                    cells
+                });
+            });
+            worksheets.push({
+                enableRtl: this.enableRtl,
+                name: s.title,
+                columns: [...this._xAxis.map((_, i) => ({ index: i + 1, width: 250 })),
+                    { index: this._xAxis.length + 1 },],
+                rows
+            });
         });
-        XLSX.writeFile(wb, `${title}.xlsx`);
+        const book = new Workbook({
+            worksheets,
+        }, 'xlsx');
+        book.save(`${title}.xlsx`);
     }
     ngOnDestroy() {
         this.chart && this.chart.destroy();
@@ -8978,7 +9082,7 @@ class CubeChartComponent {
 }
 CubeChartComponent.nextId = 0;
 CubeChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeChartComponent, deps: [{ token: CubeService }, { token: PromptService }, { token: TranslateService }, { token: SessionService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-CubeChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeChartComponent, selector: "bizdoc-cube-chart", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", series: "series", indices: "indices", filters: "filters", yAxis: "yAxis", chartType: "chartType", indicesChartType: "indicesChartType", scope: "scope", currencyCode: "currencyCode", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { attributes: { "dir": "ltr" }, properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
+CubeChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeChartComponent, selector: "bizdoc-cube-chart", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", series: "series", indices: "indices", filters: "filters", yAxis: "yAxis", chartType: "chartType", indicesChartType: "indicesChartType", scope: "scope", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { attributes: { "dir": "ltr" }, properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeChartComponent, decorators: [{
             type: Component,
             args: [{
@@ -9011,8 +9115,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                 type: Input
             }], scope: [{
                 type: Input
-            }], currencyCode: [{
-                type: Input
             }], explore: [{
                 type: Output
             }], loading: [{
@@ -9053,6 +9155,7 @@ class CubeGridComponent {
     }
     ngOnInit() {
         this._cube = this.cube ? this._session.profile.cubes.find(c => c.name === this.cube) : this._session.profile.cubes[0];
+        this.currencyCode = this._cube.currencyCode;
         const x = this._cube.axes.find(a => a.name === this._xAxis[0]), y = this._cube.axes.find(a => a.name === this._series[0]);
         const promises = [];
         // aquire columns source
@@ -9199,7 +9302,7 @@ class CubeGridComponent {
 }
 CubeGridComponent.nextId = 0;
 CubeGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeGridComponent, deps: [{ token: SessionService }, { token: PromptService }, { token: DatasourceService }, { token: CubeService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-CubeGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeGridComponent, selector: "bizdoc-cube-grid", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", series: "series", indices: "indices", filters: "filters", currencyCode: "currencyCode", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: [".nowrap{white-space:nowrap;word-wrap:normal}::ng-deep .e-rowcell:not(.e-headertext){cursor:pointer}::ng-deep .e-grid td.e-cellselectionbackground{background-color:none}\n"] });
+CubeGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeGridComponent, selector: "bizdoc-cube-grid", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", series: "series", indices: "indices", filters: "filters", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: [".nowrap{white-space:nowrap;word-wrap:normal}::ng-deep .e-rowcell:not(.e-headertext){cursor:pointer}::ng-deep .e-grid td.e-cellselectionbackground{background-color:none}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeGridComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bizdoc-cube-grid', template: '', host: {
@@ -9219,8 +9322,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                 type: Input
             }], filters: [{
                 type: Input
-            }], currencyCode: [{
-                type: Input
             }], explore: [{
                 type: Output
             }], loading: [{
@@ -9294,6 +9395,7 @@ class CubePivotComponent {
     }
     ngOnInit() {
         this._cube = this._session.profile.cubes.find(c => c.name === this.cube) || this._session.profile.cubes[0];
+        this.currencyCode = this._cube.currencyCode;
         this.dir = this.chartType ? 'ltr' : this._session.direction;
         this.formatSettings[0].currency = this.currencyCode,
             this.formatSettings[0].format = (this.currencyCode ? 'c' : 'n') + this._service.fractionDigits;
@@ -9536,18 +9638,84 @@ class CubePivotComponent {
         this.explore.emit({ axes });
     }
     exportToExcel(title) {
-        const fileName = `${title}.xlsx`;
         const task = () => {
             if (this.chartType) {
-                const wb = XLSX.utils.book_new();
-                const ws = XLSX.utils.json_to_sheet(this._data);
-                const name = this._translate.get('SheetN', 1);
-                wb.Sheets[name] = ws;
-                wb.SheetNames.push(name);
-                XLSX.writeFile(wb, fileName);
+                const numberFormat = this._cube.currencyCode ?
+                    getCurrencySymbol(this._cube.currencyCode, 'narrow') +
+                        getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Currency)
+                    : getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Decimal), columns = this._cube.axes.filter(a => this._xAxis.indexOf(a.name) > -1 ||
+                    this._series.indexOf(a.name) > -1), rows = [{
+                        index: 1,
+                        cells: columns.map((c, i) => ({
+                            index: i + 1, value: c.title,
+                            cellStyle: {
+                                bold: true
+                            }
+                        }))
+                    }];
+                rows[0].cells.push({
+                    index: columns.length + 1,
+                    value: this.yAxis ? this.yAxis.title :
+                        this._translate.get('Value'),
+                    cellStyle: {
+                        bold: true
+                    }
+                });
+                this._indices && this._indices.forEach((x, i) => rows[0].cells.push({
+                    index: columns.length + i + 2,
+                    value: this._getIndexTitle(x),
+                    cellStyle: {
+                        bold: true
+                    }
+                }));
+                this._data.forEach((r, i) => {
+                    const cells = columns.map((c, j) => {
+                        return {
+                            index: j + 1, value: r[c.name],
+                            cellStyle: {}
+                        };
+                    });
+                    cells.push({
+                        type: 'number',
+                        index: columns.length + 1,
+                        cellStyle: {
+                            numberFormat,
+                            hAlign: 'right'
+                        },
+                        value: r['value']
+                    });
+                    this._indices && this._indices.forEach((x, i) => cells.push({
+                        type: 'number',
+                        index: columns.length + i + 2,
+                        cellStyle: {
+                            numberFormat,
+                            hAlign: 'right'
+                        },
+                        value: r[x]
+                    }));
+                    rows.push({
+                        index: i + 2,
+                        cells
+                    });
+                });
+                const book = new Workbook({
+                    worksheets: [
+                        {
+                            enableRtl: this._session.inverse,
+                            name: this._translate.get('SheetN', 1),
+                            columns: [...columns.map((_, i) => ({ index: i + 1, width: 250 })),
+                                { index: columns.length + 1 },
+                                ...(this._indices ? this._indices.map((_, i) => ({
+                                    index: columns.length + i + 2
+                                })) : [])],
+                            rows
+                        }
+                    ],
+                }, 'xlsx');
+                book.save(`${title}.xlsx`);
             }
             else
-                this.pivot.excelExport({ fileName, hierarchyExportMode: 'All', });
+                this.pivot.excelExport({ fileName: `${title}.xlsx`, hierarchyExportMode: 'All', });
         };
         if (this.currencyCode && this.currencyCode !== DEFAULT_CURRENCY)
             this._translate.cldr(this._session.language, CLDR_FILES).then(() => task());
@@ -9590,7 +9758,7 @@ class CubePivotComponent {
 }
 CubePivotComponent.nextId = 0;
 CubePivotComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubePivotComponent, deps: [{ token: CubeService }, { token: SessionService }, { token: TranslateService }, { token: PromptService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-CubePivotComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubePivotComponent, selector: "bizdoc-cube-pivot", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", yAxis: "yAxis", series: "series", indices: "indices", filters: "filters", chartType: "chartType", indicesChartType: "indicesChartType", currencyCode: "currencyCode", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { properties: { "style.direction": "dir", "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: ["::ng-deep .e-cellvalue{cursor:pointer}\n"] });
+CubePivotComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubePivotComponent, selector: "bizdoc-cube-pivot", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", yAxis: "yAxis", series: "series", indices: "indices", filters: "filters", chartType: "chartType", indicesChartType: "indicesChartType", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { properties: { "style.direction": "dir", "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: ["::ng-deep .e-cellvalue{cursor:pointer}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubePivotComponent, decorators: [{
             type: Component,
             args: [{
@@ -9622,8 +9790,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                 type: Input
             }], indicesChartType: [{
                 type: Input
-            }], currencyCode: [{
-                type: Input
             }], explore: [{
                 type: Output
             }], loading: [{
@@ -9664,14 +9830,14 @@ class CubeSpreadsheetComponent {
             this._indices = isArray(val) ? val : [val];
     }
     ngOnInit() {
+        this._cube = this.cube ? this._session.profile.cubes.find(c => c.name === this.cube) : this._session.profile.cubes[0];
         this._numberFormat = this._intl.getNumberPattern({
-            currency: this.currencyCode,
-            format: this.currencyCode ? 'c' : 'n',
+            currency: this._cube.currencyCode,
+            format: this._cube.currencyCode ? 'c' : 'n',
             useGrouping: true,
             maximumFractionDigits: this._service.fractionDigits,
             minimumFractionDigits: this._service.fractionDigits
         });
-        this._cube = this.cube ? this._session.profile.cubes.find(c => c.name === this.cube) : this._session.profile.cubes[0];
         if (!this._series) {
             this._axes = this._xAxis.map(c => this._cube.axes.find(a => a.name == c));
             if (this._indices)
@@ -9770,12 +9936,12 @@ class CubeSpreadsheetComponent {
             this._indices && this._indices.forEach(i => cells.push({
                 style: this.numberStyle,
                 format: this._numberFormat,
-                value: (d[i] || 0).toString(),
+                value: (d[i] || 0),
             }));
             cells.push({
                 style: this.numberStyle,
                 format: this._numberFormat,
-                value: (d.value || 0).toString(),
+                value: (d.value || 0),
             });
             this.dataSource.push({ cells, source: d, height: 25 });
         });
@@ -9791,7 +9957,7 @@ class CubeSpreadsheetComponent {
             if (serie) {
                 serie.points.forEach(p => map[p.x] = p.y);
                 this._xcolumns.forEach(c => cells.push({
-                    value: (map[c.key] || 0).toString(),
+                    value: (map[c.key] || 0),
                     format: this._numberFormat,
                     style: this.numberStyle
                 }));
@@ -9803,13 +9969,13 @@ class CubeSpreadsheetComponent {
             if (serie) {
                 serie.points.forEach(p => map[p.x] = p.y);
                 this._xcolumns.forEach(c => cells.push({
-                    value: (map[c.key] || 0).toString(),
+                    value: (map[c.key] || 0),
                     format: this._numberFormat,
                     style: this.numberStyle
                 }));
             }
             else
-                this._xcolumns.forEach(_ => cells.push({ value: '0' }));
+                this._xcolumns.forEach(_ => cells.push({ value: 0 }));
             this.dataSource.push({ cells, height: 25 });
         });
     }
@@ -9924,13 +10090,33 @@ class CubeSpreadsheetComponent {
         }
     }
     exportToExcel(title) {
-        const wb = XLSX.utils.book_new();
-        const rows = this.spreadsheet.sheets[0].rows.map(r => r.cells.map(c => c.value));
-        const ws = XLSX.utils.aoa_to_sheet(rows);
-        const name = this._translate.get('SheetN', 1);
-        wb.Sheets[name] = ws;
-        wb.SheetNames.push(name);
-        XLSX.writeFile(wb, `${title}.xlsx`);
+        const { rows } = this.spreadsheet.sheets[0], numberFormat = this._cube.currencyCode ?
+            getCurrencySymbol(this._cube.currencyCode, 'narrow') +
+                getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Currency)
+            : getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Decimal), book = new Workbook({
+            worksheets: [
+                {
+                    name: this._translate.get('SheetN', 1),
+                    columns: rows[0].cells.map((_, i) => ({ index: i + 1, width: 150 })),
+                    rows: rows.map((r, i) => ({
+                        index: i + 1,
+                        cells: r.cells.map((c, j) => {
+                            const header = i === 0 || (this.series && j === 0);
+                            return {
+                                type: header ? 'text' : 'number',
+                                index: j + 1, value: c.value,
+                                cellStyle: {
+                                    numberFormat,
+                                    hAlign: header ? 'right' : 'center ',
+                                    bold: header
+                                }
+                            };
+                        })
+                    })),
+                },
+            ],
+        }, 'xlsx');
+        book.save(`${title}.xlsx`);
     }
     ngOnDestroy() {
         this.spreadsheet && this.spreadsheet.destroy();
@@ -9938,7 +10124,7 @@ class CubeSpreadsheetComponent {
 }
 CubeSpreadsheetComponent.nextId = 0;
 CubeSpreadsheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeSpreadsheetComponent, deps: [{ token: SessionService }, { token: PromptService }, { token: CubeService }, { token: TranslateService }, { token: DatasourceService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-CubeSpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeSpreadsheetComponent, selector: "bizdoc-cube-spreadsheet", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", yAxis: "yAxis", series: "series", indices: "indices", filters: "filters", currencyCode: "currencyCode", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
+CubeSpreadsheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeSpreadsheetComponent, selector: "bizdoc-cube-spreadsheet", inputs: { width: "width", height: "height", cube: "cube", xAxis: "xAxis", yAxis: "yAxis", series: "series", indices: "indices", filters: "filters", loading: "loading" }, outputs: { explore: "explore", loadingChange: "loadingChange" }, host: { properties: { "id": "this.id" }, classAttribute: "cube-view" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeSpreadsheetComponent, decorators: [{
             type: Component,
             args: [{
@@ -9964,8 +10150,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
                 type: Input
             }], filters: [{
                 type: Input
-            }], currencyCode: [{
-                type: Input
             }], explore: [{
                 type: Output
             }], loading: [{
@@ -10094,7 +10278,6 @@ class CubeViewComponent {
         });
         instance.cube = this.cube.name;
         instance.xAxis = this.view.xAxis;
-        instance.currencyCode = this.cube.currencyCode;
         instance.filters = { ...this.view.filters, ...this.filters };
         instance.loadingChange.pipe(takeUntil(this._viewDestroy), debounceTime(150)).subscribe(e => this.loadingChange.emit(this.loading = e));
         return instance;
@@ -11378,7 +11561,7 @@ class ExploreItemsComponent {
         this._loading$.unsubscribe();
     }
     refresh() { this.ngOnChanges(null); }
-    ngOnChanges(changes) {
+    ngOnChanges(_) {
         this._cube = this._session.profile.cubes.find(c => c.name === this.cube);
         this.currencyCode = this._cube.currencyCode;
         if (this.index)
@@ -11443,13 +11626,43 @@ class ExploreItemsComponent {
         this.explore.emit({ keys, template: this._template });
     }
     exportExcel() {
-        const ws = XLSX.utils.json_to_sheet(this.dataSource.data);
-        const wb = XLSX.utils.book_new();
-        const name = this._translate.get('SheetN', 1);
-        wb.Sheets[name] = ws;
-        wb.SheetNames.push(name);
+        const numberFormat = this._cube.currencyCode ?
+            getCurrencySymbol(this._cube.currencyCode, 'narrow') +
+                getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Currency)
+            : getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Decimal), rows = [{
+                index: 1,
+                cells: this.columns.map((c, i) => ({
+                    index: i + 1, value: c.label,
+                    cellStyle: {
+                        bold: true
+                    }
+                }))
+            }];
+        this.dataSource.data.forEach((r, i) => rows.push({
+            index: i + 2,
+            cells: this.columns.map((c, j) => {
+                const isnumber = c.type === 'Currency' || c.type === 'Number';
+                return {
+                    type: isnumber ? 'text' : 'number',
+                    index: j + 1, value: r[c.name],
+                    cellStyle: {
+                        numberFormat,
+                        hAlign: isnumber ? 'right' : 'general'
+                    }
+                };
+            })
+        }));
+        const book = new Workbook({
+            worksheets: [
+                {
+                    name: this._translate.get('SheetN', 1),
+                    columns: this.columns.map((_, i) => ({ index: i + 1, width: 250 })),
+                    rows
+                }
+            ],
+        }, 'xlsx');
         this._service.nameOf(this.axes, this.cube).
-            subscribe(o => XLSX.writeFile(wb, `${this._cube.title} ${o}.xlsx`));
+            subscribe(o => book.save(`${this._cube.title} ${o}.xlsx`));
     }
 }
 ExploreItemsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ExploreItemsComponent, deps: [{ token: CubeService }, { token: PromptService }, { token: SessionService }, { token: TranslateService }], target: i0.ɵɵFactoryTarget.Component });
@@ -11608,12 +11821,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImpor
 /** reportviewer component*/
 class ReportViewerComponent {
     /** reportviewer ctor */
-    constructor(_http, _sb, _injector, _hub, _translate, _factoryResolver) {
+    constructor(_http, _sb, _injector, _hub, _translate, _session, _factoryResolver) {
         this._http = _http;
         this._sb = _sb;
         this._injector = _injector;
         this._hub = _hub;
         this._translate = _translate;
+        this._session = _session;
         this._factoryResolver = _factoryResolver;
         this.progress = 0;
         this._processing = false;
@@ -11686,12 +11900,36 @@ class ReportViewerComponent {
         this._reportRef._exporting.next(args);
         if (args.cancel)
             return;
-        const ws = XLSX.utils.json_to_sheet(args.data);
-        const wb = XLSX.utils.book_new();
-        const name = this._translate.get('SheetN', 1);
-        wb.Sheets[name] = ws;
-        wb.SheetNames.push(name);
-        XLSX.writeFile(wb, `${this.report.title}.xlsx`);
+        const rows = [{
+                index: 1,
+                cells: this.report.columns.map((c, j) => ({
+                    index: j + 1, value: c.label,
+                    cellStyle: {
+                        bold: true,
+                        hAlign: c.type === 'Number' || c.type === 'Currency' ? 'right' : 'general'
+                    }
+                }))
+            }];
+        args.data.forEach((r, i) => rows.push({
+            index: i + 2,
+            cells: this.report.columns.map((c, j) => ({
+                index: j + 1, value: r[c.name],
+                cellStyle: {
+                    hAlign: c.type === 'Number' || c.type === 'Currency' ? 'right' : 'general'
+                }
+            }))
+        }));
+        const book = new Workbook({
+            worksheets: [
+                {
+                    enableRtl: this._session.inverse,
+                    name: this._translate.get('SheetN', 1),
+                    columns: this.report.columns.map((_, i) => ({ index: i + 1, width: 250 })),
+                    rows
+                }
+            ],
+        }, 'xlsx');
+        book.save(`${this.report.title}.xlsx`);
     }
     ngOnDestroy() {
         this._reportRef._destroy();
@@ -11700,12 +11938,12 @@ class ReportViewerComponent {
         this._destroy.complete();
     }
 }
-ReportViewerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ReportViewerComponent, deps: [{ token: i1.HttpClient }, { token: PromptService }, { token: i0.Injector }, { token: HubService }, { token: TranslateService }, { token: BizDocComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+ReportViewerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ReportViewerComponent, deps: [{ token: i1.HttpClient }, { token: PromptService }, { token: i0.Injector }, { token: HubService }, { token: TranslateService }, { token: SessionService }, { token: BizDocComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
 ReportViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: ReportViewerComponent, selector: "bizdoc-report-viewer", inputs: { report: "report", args: "args" }, host: { listeners: { "window:resize": "resize()" } }, viewQueries: [{ propertyName: "viewContainer", first: true, predicate: ["vc"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "table", first: true, predicate: TableViewComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-progress-bar mode=\"buffer\" [value]=progress [bufferValue]=0 [style.visibility]=\"progress > 0 && progress < 100 ? 'visible':'hidden'\"></mat-progress-bar>\r\n<ng-container #vc></ng-container>\r\n", styles: [":host{display:flex;flex-direction:column}:host :last-child{flex:1 auto}\n"], components: [{ type: i11$1.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: ReportViewerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bizdoc-report-viewer', template: "<mat-progress-bar mode=\"buffer\" [value]=progress [bufferValue]=0 [style.visibility]=\"progress > 0 && progress < 100 ? 'visible':'hidden'\"></mat-progress-bar>\r\n<ng-container #vc></ng-container>\r\n", styles: [":host{display:flex;flex-direction:column}:host :last-child{flex:1 auto}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: PromptService }, { type: i0.Injector }, { type: HubService }, { type: TranslateService }, { type: BizDocComponentFactoryResolver }]; }, propDecorators: { report: [{
+        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: PromptService }, { type: i0.Injector }, { type: HubService }, { type: TranslateService }, { type: SessionService }, { type: BizDocComponentFactoryResolver }]; }, propDecorators: { report: [{
                 type: Input
             }], args: [{
                 type: Input
@@ -14045,13 +14283,13 @@ class CubeMatrixComponent {
                 else if (sum.calculate)
                     switch (sum.calculate) {
                         case 'month':
-                            value = 'M' + ('0' + new Date().getMonth().toString()).slice(-2);
+                            value = 'M' + ('0' + (new Date().getMonth() + 1).toString()).slice(-2);
                             break;
                         case 'year':
                             value = new Date().getFullYear().toString();
                             break;
                         case 'quarter':
-                            value = Math.ceil(new Date().getMonth() / 3).toString();
+                            value = Math.ceil((new Date().getMonth() + 1) / 3).toString();
                             break;
                     }
                 return {
@@ -14097,7 +14335,7 @@ class CubeMatrixComponent {
                 value: s.title,
                 explorable: !isFunction(s.calculate),
                 accumulate: s.accumulate,
-                precision: s.precision,
+                precision: s.precision || this.PRECISION,
                 format: s.format,
                 index: i
             };
@@ -21685,14 +21923,79 @@ let UsageChartComponent = class UsageChartComponent extends UsageReportBase {
             this.pivot.chart.chartResize();
         }
     }
-    onExport(name) {
-        //this.pivot.excelExport({ fileName: `${name}.xlsx`, hierarchyExportMode: 'All' });
-        const ws = XLSX.utils.json_to_sheet(this._data);
-        const wb = XLSX.utils.book_new();
-        const sname = this._translate.get('SheetN', 1);
-        wb.Sheets[sname] = ws;
-        wb.SheetNames.push(sname);
-        XLSX.writeFile(wb, `${name}.xlsx`);
+    onExport(title) {
+        const numberFormat = this._cube.currencyCode ?
+            getCurrencySymbol(this._cube.currencyCode, 'narrow') +
+                getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Currency)
+            : getLocaleNumberFormat(this._session.locale, NumberFormatStyle.Decimal), columns = this._cube.axes.filter(a => this._options.series.indexOf(a.name) > -1), rows = [{
+                index: 1,
+                cells: columns.map((c, i) => ({
+                    index: i + 1, value: c.title,
+                    cellStyle: {
+                        bold: true
+                    }
+                }))
+            }];
+        rows[0].cells.push({
+            index: columns.length + 1,
+            value: this._cube.yAxis ? this._cube.yAxis.title :
+                this._translate.get('Value'),
+            cellStyle: {
+                bold: true
+            }
+        });
+        this._indices && this._indices.forEach((x, i) => rows[0].cells.push({
+            index: columns.length + i + 2,
+            value: x.title,
+            cellStyle: {
+                bold: true
+            }
+        }));
+        this._data.forEach((r, i) => {
+            const cells = columns.map((c, j) => {
+                return {
+                    index: j + 1, value: r[c.name],
+                    cellStyle: {}
+                };
+            });
+            cells.push({
+                type: 'number',
+                index: columns.length + 1,
+                cellStyle: {
+                    numberFormat,
+                    hAlign: 'right'
+                },
+                value: r['value']
+            });
+            this._indices && this._indices.forEach((x, i) => cells.push({
+                type: 'number',
+                index: columns.length + i + 2,
+                cellStyle: {
+                    numberFormat,
+                    hAlign: 'right'
+                },
+                value: r[x.name]
+            }));
+            rows.push({
+                index: i + 2,
+                cells
+            });
+        });
+        const book = new Workbook({
+            worksheets: [
+                {
+                    enableRtl: this._session.inverse,
+                    name: this._translate.get('SheetN', 1),
+                    columns: [...columns.map((_, i) => ({ index: i + 1, width: 250 })),
+                        { index: columns.length + 1 },
+                        ...(this._indices ? this._indices.map((_, i) => ({
+                            index: columns.length + i + 2
+                        })) : [])],
+                    rows
+                }
+            ],
+        }, 'xlsx');
+        book.save(`${title}.xlsx`);
     }
     /**
      * adds data source description to item keys, and normalizes indices.
@@ -24296,7 +24599,7 @@ let CubePivotViewComponent = class CubePivotViewComponent extends CubeBase {
     }
 };
 CubePivotViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubePivotViewComponent, deps: [{ token: SessionService }, { token: DocumentViewRef }, { token: CubeService }, { token: RouterImpl }], target: i0.ɵɵFactoryTarget.Component });
-CubePivotViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubePivotViewComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<bizdoc-cube-pivot [xAxis]=\"xAxis\"\r\n                   [series]=\"series\"\r\n                   [cube]=\"cube.name\" *ngIf=\"hasdata\"\r\n                   [filters]=\"axes\"\r\n                   [chartType]=\"chartType\"\r\n                   [width]=\"width\"\r\n                   (explore)=\"explore($event)\"></bizdoc-cube-pivot>\r\n", components: [{ type: CubePivotComponent, selector: "bizdoc-cube-pivot", inputs: ["width", "height", "cube", "xAxis", "yAxis", "series", "indices", "filters", "chartType", "indicesChartType", "currencyCode", "loading"], outputs: ["explore", "loadingChange"] }], directives: [{ type: i10$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+CubePivotViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubePivotViewComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<bizdoc-cube-pivot [xAxis]=\"xAxis\"\r\n                   [series]=\"series\"\r\n                   [cube]=\"cube.name\" *ngIf=\"hasdata\"\r\n                   [filters]=\"axes\"\r\n                   [chartType]=\"chartType\"\r\n                   [width]=\"width\"\r\n                   (explore)=\"explore($event)\"></bizdoc-cube-pivot>\r\n", components: [{ type: CubePivotComponent, selector: "bizdoc-cube-pivot", inputs: ["width", "height", "cube", "xAxis", "yAxis", "series", "indices", "filters", "chartType", "indicesChartType", "loading"], outputs: ["explore", "loadingChange"] }], directives: [{ type: i10$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 CubePivotViewComponent = __decorate([
     BizDoc({
         selector: 'bizdoc-pivot-view'
@@ -24795,7 +25098,7 @@ let CubeChartViewComponent = class CubeChartViewComponent extends CubeBase {
     }
 };
 CubeChartViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: CubeChartViewComponent, deps: [{ token: SessionService }, { token: DocumentViewRef }, { token: CubeService }, { token: RouterImpl }], target: i0.ɵɵFactoryTarget.Component });
-CubeChartViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeChartViewComponent, selector: "ng-component", host: { classAttribute: "view" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"hasdata; \">\r\n  <!--else none-->\r\n  <ng-container [ngSwitch]=\"isAccum\">\r\n    <bizdoc-cube-accum *ngSwitchCase=\"true\" [chartType]=\"chartType\" [width]=\"width\" [scope]=\"scope\"\r\n                       (explore)=\"explore($event)\"\r\n                       [cube]=\"cube.name\"\r\n                       [filters]=\"filters\"\r\n                       [xAxis]=\"xAxis\"></bizdoc-cube-accum>\r\n    <bizdoc-cube-chart *ngSwitchDefault\r\n                       [cube]=\"cube.name\"\r\n                       [xAxis]=\"xAxis\"\r\n                       [series]=\"series\"\r\n                       [indices]=\"indices\"\r\n                       [filters]=\"filters\"\r\n                       [chartType]=\"chartType\"\r\n                       [indicesChartType]=\"indicesChartType\"\r\n                       [width]=\"width\"\r\n                       [scope]=\"scope\"\r\n                       (explore)=\"explore($event)\"></bizdoc-cube-chart>\r\n  </ng-container>\r\n</ng-container>\r\n<ng-template #none>\r\n  <bizdoc-none icon=\"insert_chart_outlined\" subtitle=\"NothingHere\"></bizdoc-none>\r\n</ng-template>\r\n", components: [{ type: CubeAccumulationChartComponent, selector: "bizdoc-cube-accum", inputs: ["height", "width", "cube", "xAxis", "indices", "filters", "chartType", "scope", "loading"], outputs: ["loadingChange", "explore"] }, { type: CubeChartComponent, selector: "bizdoc-cube-chart", inputs: ["width", "height", "cube", "xAxis", "series", "indices", "filters", "yAxis", "chartType", "indicesChartType", "scope", "currencyCode", "loading"], outputs: ["explore", "loadingChange"] }, { type: NoneComponent, selector: "bizdoc-none", inputs: ["title", "subtitle", "icon"] }], directives: [{ type: i10$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i10$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
+CubeChartViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: CubeChartViewComponent, selector: "ng-component", host: { classAttribute: "view" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"hasdata; \">\r\n  <!--else none-->\r\n  <ng-container [ngSwitch]=\"isAccum\">\r\n    <bizdoc-cube-accum *ngSwitchCase=\"true\" [chartType]=\"chartType\" [width]=\"width\" [scope]=\"scope\"\r\n                       (explore)=\"explore($event)\"\r\n                       [cube]=\"cube.name\"\r\n                       [filters]=\"filters\"\r\n                       [xAxis]=\"xAxis\"></bizdoc-cube-accum>\r\n    <bizdoc-cube-chart *ngSwitchDefault\r\n                       [cube]=\"cube.name\"\r\n                       [xAxis]=\"xAxis\"\r\n                       [series]=\"series\"\r\n                       [indices]=\"indices\"\r\n                       [filters]=\"filters\"\r\n                       [chartType]=\"chartType\"\r\n                       [indicesChartType]=\"indicesChartType\"\r\n                       [width]=\"width\"\r\n                       [scope]=\"scope\"\r\n                       (explore)=\"explore($event)\"></bizdoc-cube-chart>\r\n  </ng-container>\r\n</ng-container>\r\n<ng-template #none>\r\n  <bizdoc-none icon=\"insert_chart_outlined\" subtitle=\"NothingHere\"></bizdoc-none>\r\n</ng-template>\r\n", components: [{ type: CubeAccumulationChartComponent, selector: "bizdoc-cube-accum", inputs: ["height", "width", "cube", "xAxis", "filters", "chartType", "scope", "loading"], outputs: ["loadingChange", "explore"] }, { type: CubeChartComponent, selector: "bizdoc-cube-chart", inputs: ["width", "height", "cube", "xAxis", "series", "indices", "filters", "yAxis", "chartType", "indicesChartType", "scope", "loading"], outputs: ["explore", "loadingChange"] }, { type: NoneComponent, selector: "bizdoc-none", inputs: ["title", "subtitle", "icon"] }], directives: [{ type: i10$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i10$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
 CubeChartViewComponent = __decorate([
     BizDoc({
         selector: 'bizdoc-chart-view'
@@ -27286,8 +27589,7 @@ let PositionsComponent = class PositionsComponent {
         });
     }
     async download() {
-        const me = this;
-        const wb = XLSX.utils.book_new();
+        const { profiles } = this, worksheets = [];
         for (let i = 0; i < this.types.length; i++) {
             let type = this.types[i];
             const model = this._everything[type.name];
@@ -27295,94 +27597,164 @@ let PositionsComponent = class PositionsComponent {
             if (!positions || !Object.keys(positions).length)
                 continue;
             const roles = this._session.profile.roles.filter(r => r.dataType === type.name && positions[r.name]);
+            const cells = [{
+                    index: 1,
+                    value: this._translate.get('Type'),
+                    cellStyle: {
+                        bold: true
+                    }
+                }, {
+                    index: 2,
+                    value: this._translate.get('Value'),
+                    cellStyle: {
+                        bold: true
+                    }
+                }, {
+                    index: 3,
+                    value: ''
+                }];
+            if (type.columns)
+                type.columns.slice(2).forEach((c, i) => cells.push({
+                    index: i + 4,
+                    value: ''
+                }));
+            roles.forEach(r => cells.push({
+                index: cells.length + 1,
+                value: r.title,
+                cellStyle: {
+                    bold: true
+                }
+            }));
             const rows = [];
-            rows.push([this._translate.get('Type'), this._translate.get('Value'), '', ...roles.map(r => r.title)]);
+            rows.push({
+                index: 1,
+                cells
+            });
             model.patterns && model.patterns.forEach(p => {
-                const row = [this._translate.get('Pattern'), p.expression, p.title];
-                fill(row);
-                columns(p.name, row);
+                const row = {
+                    index: rows.length + 1,
+                    cells: [{
+                            index: 1,
+                            value: this._translate.get('Pattern')
+                        }, {
+                            index: 2,
+                            value: p.expression
+                        }, {
+                            index: 3,
+                            value: p.title
+                        }]
+                };
+                addcolumns(p.name, row);
                 rows.push(row);
             });
             model.groups && model.groups.forEach(g => {
-                const row = [this._translate.get('Group'), g.items.join(', '), g.title];
-                fill(row);
-                columns(g.name, row);
+                const row = {
+                    index: rows.length + 1,
+                    cells: [{
+                            index: 1,
+                            value: this._translate.get('Group')
+                        }, {
+                            index: 2,
+                            value: g.items.join(', ')
+                        }, {
+                            index: 3,
+                            value: g.title
+                        }]
+                };
+                addcolumns(g.name, row);
                 rows.push(row);
             });
             let datasource = await this._datasources.all(type.name).toPromise();
             datasource.forEach(d => {
-                const row = [this._translate.get('Key')];
+                const row = {
+                    index: rows.length + 1,
+                    cells: [{
+                            index: 1,
+                            value: this._translate.get('Key')
+                        }]
+                };
                 if (type.columns)
-                    type.columns.forEach(c => row.push(d.value[c.name]));
+                    type.columns.forEach((c, i) => row.cells.push({
+                        index: i + 2,
+                        value: d.value[c.name]
+                    }));
                 else
-                    row.push(d.value);
-                columns(d.key, row);
+                    row.cells.push({ index: 2, value: d.value });
+                addcolumns(d.key, row);
                 rows.push(row);
             });
-            const ws = XLSX.utils.aoa_to_sheet(rows);
-            XLSX.utils.book_append_sheet(wb, ws, type.title);
-            function fill(row) {
-                type.columns && type.columns.forEach((_, i) => i && row.push(''));
-            }
-            function columns(key, row) {
+            const columns = [];
+            type.columns && type.columns.forEach((_, i) => columns.push({ index: i + 1, width: 250 }));
+            roles.forEach((_, i) => columns.push({ index: columns.length + i + 2 }));
+            worksheets.push({
+                name: type.title,
+                columns,
+                rows
+            });
+            function addcolumns(key, row) {
                 roles.forEach(r => {
                     const users = positions[r.name][key];
-                    row.push(users ? users.map(u => me.profiles[u] ? me.profiles[u].name : u).join(', ') : '');
+                    row.cells.push({
+                        index: row.cells.length + 1,
+                        value: users ? users.map(u => profiles[u] ? profiles[u].name : u).join(', ') : ''
+                    });
                 });
             }
         }
-        XLSX.writeFile(wb, `${this._translate.get('Positions')}.xlsx`);
-    }
-    async upload(evt) {
-        const { files } = evt.srcElement;
-        if (files && files.length) {
-            const file = files.item(0);
-            var reader = new FileReader();
-            reader.onload = e => { };
-            const text = await file.text();
-            //reader.readAs(text);
-            const wb = XLSX.readFile(file.name, {});
-            for (let i = 0; i < wb.SheetNames.length; i++) {
-                let title = wb.SheetNames[i], ws = wb.Sheets[title];
-                let type = this.types.find(t => t.title === title);
-                if (!type)
-                    throw '';
-                let roles = this._session.profile.roles.filter(r => r.dataType === type.name);
-                let row = ws['!rows'][0];
-                for (let c = 0; c < ws['!cols'].length; c++) {
-                    let col = ws['!cols'][c];
-                    //let role = roles.find(r => r.title === ws.);
-                    //  if (!role) {
-                    //    this._everything[type.name].roles.push({name: '', title: ''});
-                    //  }
-                }
-                for (let r = 0; r < ws['!rows'].length; r++) {
-                    let row = ws['!rows'][r];
-                    for (let c = 0; c < ws['!cols'].length; c++) {
-                        let col = ws['!cols'][c], content = '';
-                        if (content) {
-                            //let users = content.split(', ').map(name=> this.profiles.find(u=> u.name === name));
-                        }
-                        else { }
-                    }
-                }
-            }
-        }
-    }
+        const book = new Workbook({
+            worksheets,
+        }, 'xlsx');
+        book.save(`${this._translate.get('Positions')}.xlsx`);
+    }
+    // async upload(evt: InputEvent) {
+    //   const { files } = evt.srcElement as HTMLInputElement;
+    //   if (files && files.length) {
+    //     const file = files.item(0);
+    //     var reader = new FileReader();
+    //     reader.onload = e => { };
+    //     const text = await file.text();
+    //     //reader.readAs(text);
+    //     const wb = XLSX.readFile(file.name, {});
+    //     for (let i = 0; i < wb.SheetNames.length; i++) {
+    //       let title = wb.SheetNames[i], ws = wb.Sheets[title];
+    //       let type = this.types.find(t => t.title === title);
+    //       if (!type) throw '';
+    //       let roles = this._session.profile.roles.filter(r => r.dataType === type.name);
+    //       let row = ws['!rows'][0];
+    //       for (let c = 0; c < ws['!cols'].length; c++) {
+    //         let col = ws['!cols'][c];
+    //         //let role = roles.find(r => r.title === ws.);
+    //       //  if (!role) {
+    //       //    this._everything[type.name].roles.push({name: '', title: ''});
+    //       //  }
+    //       }
+    //       for (let r = 0; r < ws['!rows'].length; r++) {
+    //         let row = ws['!rows'][r];
+    //         for (let c = 0; c < ws['!cols'].length; c++) {
+    //           let col = ws['!cols'][c], content = '';
+    //           if (content) {
+    //             //let users = content.split(', ').map(name=> this.profiles.find(u=> u.name === name));
+    //           }
+    //           else { }
+    //         }
+    //       }
+    //     }
+    //   }
+    //}
     ngOnDestroy() {
         this._destroy.next();
         this._destroy.complete();
     }
 };
 PositionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: PositionsComponent, deps: [{ token: SessionService }, { token: UtilityRef }, { token: DatasourceService }, { token: PromptService }, { token: AccountService }, { token: WindowTitleService }, { token: TranslateService }, { token: Popup }, { token: i3$2.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
-PositionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: PositionsComponent, selector: "ng-component", viewQueries: [{ propertyName: "_fileElement", first: true, predicate: ["file"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "noRoleTpl", first: true, predicate: ["noRoleTpl"], descendants: true, static: true }, { propertyName: "roleTpl", first: true, predicate: ["roleTpl"], descendants: true, static: true }, { propertyName: "patternTpl", first: true, predicate: ["patternTpl"], descendants: true, static: true }, { propertyName: "newGroupTpl", first: true, predicate: ["groupTpl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\r\n  <button mat-button [matMenuTriggerFor]=\"typeMenu\">{{type?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\r\n  <mat-menu #typeMenu>\r\n    <button mat-menu-item *ngFor=\"let t of types\" (click)=\"change(t.name)\">{{t.title}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\r\n  <mat-menu #newMenu>\r\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\r\n  </mat-menu>\r\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\">\r\n  <ng-container *ngFor=\"let column of (type?.columns ||[])\" [matColumnDef]=\"column.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"key\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <span [ngSwitch]=\"element.type\">\r\n        <ng-container *ngSwitchCase=\"'group'\">({{'Group'|translate}})</ng-container>\r\n        <ng-container *ngSwitchCase=\"'pattern'\">({{'Pattern'|translate}})</ng-container>\r\n        <ng-container *ngSwitchDefault>\r\n          {{element.key}}\r\n        </ng-container>\r\n      </span>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"value\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      {{element.value}}\r\n    </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let role of roles\" [matColumnDef]=\"role.name\">\r\n    <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\">\r\n      <ng-container *ngIf=\"positions[role.name][element.key]\">\r\n        <ng-container *ngFor=\"let u of positions[role.name][element.key]; let first = first\">\r\n          <ng-container *ngIf=\"!first\">, </ng-container>\r\n          {{profiles[u]?.name}}\r\n        </ng-container>\r\n      </ng-container>\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\" *ngIf=\"element.type === 'pattern' || element.type === 'group'\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-container *ngIf=\"element.type === 'pattern'\">\r\n          <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"element.type === 'group'\">\r\n          <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\r\n</table>\r\n<!-- role template -->\r\n<ng-template #roleTpl>\r\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"role\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\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]=\"role.value\" color=\"primary\" [disabled]=\"!role.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<!-- pattern template -->\r\n<ng-template #patternTpl>\r\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"pattern\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\r\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\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]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.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<!-- group -->\r\n<ng-template #groupTpl>\r\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"group\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\r\n          <mat-select-trigger>\r\n            {{group.value.items ? group.value.items[0] : ''}}\r\n            <span *ngIf=\"group.value.items?.length > 1\" class=\"additional-selection\">\r\n              (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\r\n            </span>\r\n          </mat-select-trigger>\r\n          <mat-option *ngFor=\"let v of source\" [value]=\"v.key\">\r\n            <span *ngIf=\"!type.columns\">{{v.value}}</span>\r\n            <span *ngIf=\"type.columns\"><span *ngFor=\"let c of type.columns\">{{v.value[c.name]}}</span></span>\r\n          </mat-option>\r\n        </mat-select>\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]=\"group.value\" color=\"primary\" [disabled]=\"!group.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<ng-template #noRoleTpl>\r\n  <mat-dialog-content>\r\n    {{'NoRoles'|translate : type?.title}}\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<form style=\"display:none\">\r\n  <input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\r\n</form>\r\n", styles: ["table{width:100%}.form{padding:8px}table :ng-deep .mat-cell{cursor:pointer;border-left-width:1px;border-left-style:outset;padding:0 4px!important}\n"], components: [{ type: i7$4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: SearchInput, selector: "bizdoc-search-input", outputs: ["valueChange"] }, { type: i7$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i8$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i8$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i11$1.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i12.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i8$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i10$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i5$1.MatCellDef, selector: "[matCellDef]" }, { type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i10$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i10$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i10$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i3$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i3$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i3$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { type: i1$3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { type: i4.MatSelectTrigger, selector: "mat-select-trigger" }], pipes: { "translate": TranslatePipe, "sanitizeHtml": SanitizeHtmlPipe } });
+PositionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: PositionsComponent, selector: "ng-component", viewQueries: [{ propertyName: "_fileElement", first: true, predicate: ["file"], descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "noRoleTpl", first: true, predicate: ["noRoleTpl"], descendants: true, static: true }, { propertyName: "roleTpl", first: true, predicate: ["roleTpl"], descendants: true, static: true }, { propertyName: "patternTpl", first: true, predicate: ["patternTpl"], descendants: true, static: true }, { propertyName: "newGroupTpl", first: true, predicate: ["groupTpl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\r\n  <button mat-button [matMenuTriggerFor]=\"typeMenu\">{{type?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\r\n  <mat-menu #typeMenu>\r\n    <button mat-menu-item *ngFor=\"let t of types\" (click)=\"change(t.name)\">{{t.title}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\r\n  <mat-menu #newMenu>\r\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\r\n  </mat-menu>\r\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\">\r\n  <ng-container *ngFor=\"let column of (type?.columns ||[])\" [matColumnDef]=\"column.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"key\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <span [ngSwitch]=\"element.type\">\r\n        <ng-container *ngSwitchCase=\"'group'\">({{'Group'|translate}})</ng-container>\r\n        <ng-container *ngSwitchCase=\"'pattern'\">({{'Pattern'|translate}})</ng-container>\r\n        <ng-container *ngSwitchDefault>\r\n          {{element.key}}\r\n        </ng-container>\r\n      </span>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"value\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      {{element.value}}\r\n    </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let role of roles\" [matColumnDef]=\"role.name\">\r\n    <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\">\r\n      <ng-container *ngIf=\"positions[role.name][element.key]\">\r\n        <ng-container *ngFor=\"let u of positions[role.name][element.key]; let first = first\">\r\n          <ng-container *ngIf=\"!first\">, </ng-container>\r\n          {{profiles[u]?.name}}\r\n        </ng-container>\r\n      </ng-container>\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\" *ngIf=\"element.type === 'pattern' || element.type === 'group'\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-container *ngIf=\"element.type === 'pattern'\">\r\n          <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"element.type === 'group'\">\r\n          <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\r\n</table>\r\n<!-- role template -->\r\n<ng-template #roleTpl>\r\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"role\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\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]=\"role.value\" color=\"primary\" [disabled]=\"!role.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<!-- pattern template -->\r\n<ng-template #patternTpl>\r\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"pattern\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\r\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\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]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.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<!-- group -->\r\n<ng-template #groupTpl>\r\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"group\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\r\n          <mat-select-trigger>\r\n            {{group.value.items ? group.value.items[0] : ''}}\r\n            <span *ngIf=\"group.value.items?.length > 1\" class=\"additional-selection\">\r\n              (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\r\n            </span>\r\n          </mat-select-trigger>\r\n          <mat-option *ngFor=\"let v of source\" [value]=\"v.key\">\r\n            <span *ngIf=\"!type.columns\">{{v.value}}</span>\r\n            <span *ngIf=\"type.columns\"><span *ngFor=\"let c of type.columns\">{{v.value[c.name]}}</span></span>\r\n          </mat-option>\r\n        </mat-select>\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]=\"group.value\" color=\"primary\" [disabled]=\"!group.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<ng-template #noRoleTpl>\r\n  <mat-dialog-content>\r\n    {{'NoRoles'|translate : type?.title}}\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<!--<form style=\"display:none\">\r\n  <input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\r\n</form>-->\r\n", styles: ["table{width:100%}.form{padding:8px}table :ng-deep .mat-cell{cursor:pointer;border-left-width:1px;border-left-style:outset;padding:0 4px!important}\n"], components: [{ type: i7$4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { type: i7$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: SearchInput, selector: "bizdoc-search-input", outputs: ["valueChange"] }, { type: i7$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i8$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i8$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i11$1.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i5$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i6$2.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i12.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: i5$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i5$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i8$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i10$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { type: i6$2.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i5$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i5$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i5$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i5$1.MatCellDef, selector: "[matCellDef]" }, { type: i5$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i10$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i10$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i10$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i10$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i5$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i3$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i3$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i3$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { type: i1$3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { type: i4.MatSelectTrigger, selector: "mat-select-trigger" }], pipes: { "translate": TranslatePipe, "sanitizeHtml": SanitizeHtmlPipe } });
 PositionsComponent = __decorate([
     BizDoc({ selector: 'bizdoc-positions' })
     /** positions component*/
 ], PositionsComponent);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: PositionsComponent, decorators: [{
             type: Component,
-            args: [{ template: "<mat-toolbar>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\r\n  <button mat-button [matMenuTriggerFor]=\"typeMenu\">{{type?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\r\n  <mat-menu #typeMenu>\r\n    <button mat-menu-item *ngFor=\"let t of types\" (click)=\"change(t.name)\">{{t.title}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\r\n  <mat-menu #newMenu>\r\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\r\n  </mat-menu>\r\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\">\r\n  <ng-container *ngFor=\"let column of (type?.columns ||[])\" [matColumnDef]=\"column.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"key\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <span [ngSwitch]=\"element.type\">\r\n        <ng-container *ngSwitchCase=\"'group'\">({{'Group'|translate}})</ng-container>\r\n        <ng-container *ngSwitchCase=\"'pattern'\">({{'Pattern'|translate}})</ng-container>\r\n        <ng-container *ngSwitchDefault>\r\n          {{element.key}}\r\n        </ng-container>\r\n      </span>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"value\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      {{element.value}}\r\n    </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let role of roles\" [matColumnDef]=\"role.name\">\r\n    <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\">\r\n      <ng-container *ngIf=\"positions[role.name][element.key]\">\r\n        <ng-container *ngFor=\"let u of positions[role.name][element.key]; let first = first\">\r\n          <ng-container *ngIf=\"!first\">, </ng-container>\r\n          {{profiles[u]?.name}}\r\n        </ng-container>\r\n      </ng-container>\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\" *ngIf=\"element.type === 'pattern' || element.type === 'group'\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-container *ngIf=\"element.type === 'pattern'\">\r\n          <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"element.type === 'group'\">\r\n          <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\r\n</table>\r\n<!-- role template -->\r\n<ng-template #roleTpl>\r\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"role\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\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]=\"role.value\" color=\"primary\" [disabled]=\"!role.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<!-- pattern template -->\r\n<ng-template #patternTpl>\r\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"pattern\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\r\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\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]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.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<!-- group -->\r\n<ng-template #groupTpl>\r\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"group\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\r\n          <mat-select-trigger>\r\n            {{group.value.items ? group.value.items[0] : ''}}\r\n            <span *ngIf=\"group.value.items?.length > 1\" class=\"additional-selection\">\r\n              (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\r\n            </span>\r\n          </mat-select-trigger>\r\n          <mat-option *ngFor=\"let v of source\" [value]=\"v.key\">\r\n            <span *ngIf=\"!type.columns\">{{v.value}}</span>\r\n            <span *ngIf=\"type.columns\"><span *ngFor=\"let c of type.columns\">{{v.value[c.name]}}</span></span>\r\n          </mat-option>\r\n        </mat-select>\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]=\"group.value\" color=\"primary\" [disabled]=\"!group.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<ng-template #noRoleTpl>\r\n  <mat-dialog-content>\r\n    {{'NoRoles'|translate : type?.title}}\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<form style=\"display:none\">\r\n  <input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\r\n</form>\r\n", styles: ["table{width:100%}.form{padding:8px}table :ng-deep .mat-cell{cursor:pointer;border-left-width:1px;border-left-style:outset;padding:0 4px!important}\n"] }]
+            args: [{ template: "<mat-toolbar>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty\">{{'SaveChanges'|translate}}</button>\r\n  <span class=\"divider\"></span>\r\n  <bizdoc-search-input (valueChange)=\"search($event)\"></bizdoc-search-input>\r\n  <button mat-button [matMenuTriggerFor]=\"typeMenu\">{{type?.title}} <mat-icon>arrow_drop_down</mat-icon></button>\r\n  <mat-menu #typeMenu>\r\n    <button mat-menu-item *ngFor=\"let t of types\" (click)=\"change(t.name)\">{{t.title}}</button>\r\n  </mat-menu>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"newMenu\" [bizdocTooltip]=\"'Add'|translate\"><mat-icon>add</mat-icon></button>\r\n  <mat-menu #newMenu>\r\n    <button mat-menu-item (click)=\"newRole()\">{{'Role'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newPattern()\">{{'Pattern'|translate}}</button>\r\n    <button mat-menu-item (click)=\"newGroup()\">{{'Group'|translate}} </button>\r\n  </mat-menu>\r\n  <button mat-icon-button [bizdocTooltip]=\"'Download' | translate\" (click)=\"download()\" [disabled]=\"dirty\"><mat-icon>save_alt</mat-icon></button>\r\n</mat-toolbar>\r\n<mat-progress-bar [mode]=\"loading\" [style.visibility]=\"loading ? 'visible':'hidden'\"></mat-progress-bar>\r\n<table mat-table matSort [dataSource]=\"dataSource\" [style.display]=\"dataSource ? '': 'none'\">\r\n  <ng-container *ngFor=\"let column of (type?.columns ||[])\" [matColumnDef]=\"column.name\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{column.label}}</th>\r\n    <td mat-cell *matCellDef=\"let element\"> {{element[column.name]}} </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"key\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      <span [ngSwitch]=\"element.type\">\r\n        <ng-container *ngSwitchCase=\"'group'\">({{'Group'|translate}})</ng-container>\r\n        <ng-container *ngSwitchCase=\"'pattern'\">({{'Pattern'|translate}})</ng-container>\r\n        <ng-container *ngSwitchDefault>\r\n          {{element.key}}\r\n        </ng-container>\r\n      </span>\r\n    </td>\r\n  </ng-container>\r\n  <ng-container matColumnDef=\"value\">\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header>{{''}}</th>\r\n    <td mat-cell *matCellDef=\"let element\">\r\n      {{element.value}}\r\n    </td>\r\n  </ng-container>\r\n  <ng-container *ngFor=\"let role of roles\" [matColumnDef]=\"role.name\">\r\n    <th mat-header-cell *matHeaderCellDef>{{role.title}}</th>\r\n    <td mat-cell *matCellDef=\"let element\" [attr.data-role]=\"role.name\">\r\n      <ng-container *ngIf=\"positions[role.name][element.key]\">\r\n        <ng-container *ngFor=\"let u of positions[role.name][element.key]; let first = first\">\r\n          <ng-container *ngIf=\"!first\">, </ng-container>\r\n          {{profiles[u]?.name}}\r\n        </ng-container>\r\n      </ng-container>\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\" *ngIf=\"element.type === 'pattern' || element.type === 'group'\"><mat-icon>more_vert</mat-icon></button>\r\n      <mat-menu #options>\r\n        <ng-container *ngIf=\"element.type === 'pattern'\">\r\n          <button mat-menu-item (click)=\"editPattern(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deletePattern(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"element.type === 'group'\">\r\n          <button mat-menu-item (click)=\"editGroup(element.key)\">{{'Edit'|translate}}</button>\r\n          <mat-divider></mat-divider>\r\n          <button mat-menu-item (click)=\"deleteGroup(element.key)\">{{'Remove'|translate}} </button>\r\n        </ng-container>\r\n      </mat-menu>\r\n    </td>\r\n  </ng-container>\r\n\r\n  <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n  <tr mat-row *matRowDef=\"let element; columns: displayedColumns\" (click)=\"edit(element.key, $event)\"></tr>\r\n</table>\r\n<!-- role template -->\r\n<ng-template #roleTpl>\r\n  <h2 mat-dialog-title>{{'Role' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"role\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\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]=\"role.value\" color=\"primary\" [disabled]=\"!role.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<!-- pattern template -->\r\n<ng-template #patternTpl>\r\n  <h2 mat-dialog-title>{{'Pattern' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"pattern\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"expression\" [placeholder]=\"'Regex'| translate\" required autocomplete=\"off\" />\r\n        <mat-hint><span [innerHTML]=\"'RegexHint' | translate : 'https://regex101.com/'| sanitizeHtml\"></span></mat-hint>\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]=\"pattern.value\" color=\"primary\" [disabled]=\"!pattern.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<!-- group -->\r\n<ng-template #groupTpl>\r\n  <h2 mat-dialog-title>{{'Group' | translate }}</h2>\r\n  <mat-dialog-content>\r\n    <form [formGroup]=\"group\" fxLayout=\"column\">\r\n      <mat-form-field>\r\n        <input matInput formControlName=\"title\" [placeholder]=\"'Title'| translate\" required autocomplete=\"off\" />\r\n      </mat-form-field>\r\n      <mat-form-field>\r\n        <mat-select [placeholder]=\"'Items'|translate\" multiple formControlName=\"items\" required>\r\n          <mat-select-trigger>\r\n            {{group.value.items ? group.value.items[0] : ''}}\r\n            <span *ngIf=\"group.value.items?.length > 1\" class=\"additional-selection\">\r\n              (+{{group.value.items.length - 1}} {{(group.value.items?.length === 2 ? 'Other' : 'Others')|translate}})\r\n            </span>\r\n          </mat-select-trigger>\r\n          <mat-option *ngFor=\"let v of source\" [value]=\"v.key\">\r\n            <span *ngIf=\"!type.columns\">{{v.value}}</span>\r\n            <span *ngIf=\"type.columns\"><span *ngFor=\"let c of type.columns\">{{v.value[c.name]}}</span></span>\r\n          </mat-option>\r\n        </mat-select>\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]=\"group.value\" color=\"primary\" [disabled]=\"!group.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<ng-template #noRoleTpl>\r\n  <mat-dialog-content>\r\n    {{'NoRoles'|translate : type?.title}}\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=\"true\" color=\"primary\">{{'CreateRole' | translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'Cancel' | translate}}</button>\r\n  </mat-dialog-actions>\r\n</ng-template>\r\n<!--<form style=\"display:none\">\r\n  <input type=\"file\" name=\"file\" (onchange)=\"upload($event)\" #file/>\r\n</form>-->\r\n", styles: ["table{width:100%}.form{padding:8px}table :ng-deep .mat-cell{cursor:pointer;border-left-width:1px;border-left-style:outset;padding:0 4px!important}\n"] }]
         }], ctorParameters: function () { return [{ type: SessionService }, { type: UtilityRef, decorators: [{
                     type: Inject,
                     args: [UtilityRef]