@bizdoc/core 1.14.14 → 1.14.15

package/fesm2015/bizdoc-core.mjs

@@ -6,7 +6,7 @@ import { ComponentPortal, PortalModule, TemplatePortal } from '@angular/cdk/port
 import { __awaiter, __decorate } from 'tslib';
 import { trigger, state, style, transition, animate, query, stagger, animateChild, keyframes } from '@angular/animations';
 import { ESCAPE, RIGHT_ARROW, LEFT_ARROW, ENTER, COMMA, UP_ARROW, DOWN_ARROW, SEMICOLON } from '@angular/cdk/keycodes';
-import { Subject, Observable, of, fromEvent, forkJoin, interval, takeWhile, tap as tap$1, BehaviorSubject, filter as filter$1, debounceTime as debounceTime$1, takeUntil as takeUntil$1, from, merge, map as map$1, throwError, first as first$1, switchMap as switchMap$1, isObservable, EMPTY } from 'rxjs';
+import { Subject, Observable, of, fromEvent, forkJoin, interval, takeWhile, tap as tap$1, BehaviorSubject, filter as filter$1, debounceTime as debounceTime$1, takeUntil as takeUntil$1, from, merge, map as map$1, first as first$1, throwError, switchMap as switchMap$1, isObservable, EMPTY } from 'rxjs';
 import { map, tap, filter, switchMap, takeUntil, shareReplay, debounceTime, take, first, catchError, startWith, finalize } from 'rxjs/operators';
 import { HubConnectionBuilder, HubConnectionState } from '@microsoft/signalr';
 import dayjs from 'dayjs';
@@ -132,7 +132,7 @@ import * as i9$5 from '@syncfusion/ej2-angular-spreadsheet';
 import { Spreadsheet, isNumber, SpreadsheetModule, SelectionService as SelectionService$2, BasicModuleService, ClipboardService, CellFormatService, KeyboardNavigationService, KeyboardShortcutService, NumberFormatService } from '@syncfusion/ej2-angular-spreadsheet';
 import * as i4 from '@ctrl/ngx-emoji-mart';
 import { PickerModule } from '@ctrl/ngx-emoji-mart';
-import { Diagram, UndoRedo, ConnectorBridging, ConnectorEditing, Snapping, SymbolPalette, BpmnDiagrams, PortVisibility, PortConstraints, DiagramConstraints, DiagramTools, SelectorConstraints, NodeConstraints, ConnectorConstraints, Connector, Node, ConnectionPointOrigin, SnapConstraints, ComplexHierarchicalTreeService, DiagramModule, SymbolPaletteModule, ConnectorBridgingService, LineRoutingService, BpmnDiagramsService, LayoutAnimationService, UndoRedoService, SnappingService, ConnectorEditingService, LineDistributionService, ComplexHierarchicalTree, DataBinding, LineDistribution, ToolBase } from '@syncfusion/ej2-angular-diagrams';
+import { Diagram, UndoRedo, ConnectorBridging, ConnectorEditing, Snapping, SymbolPalette, BpmnDiagrams, PortVisibility, PortConstraints, DiagramConstraints, SelectorConstraints, NodeConstraints, ConnectorConstraints, DiagramTools, Connector, Node, ConnectionPointOrigin, SnapConstraints, ComplexHierarchicalTreeService, DiagramModule, SymbolPaletteModule, ConnectorBridgingService, LineRoutingService, BpmnDiagramsService, LayoutAnimationService, UndoRedoService, SnappingService, ConnectorEditingService, LineDistributionService, ComplexHierarchicalTree, DataBinding, LineDistribution, ToolBase } from '@syncfusion/ej2-angular-diagrams';
 import * as i9$3 from '@syncfusion/ej2-angular-schedule';
 import { Schedule, Day, WorkWeek, Month, MonthAgenda, Agenda, Year, ScheduleModule, ExcelExportService as ExcelExportService$2, DayService, WorkWeekService, MonthService, MonthAgendaService, ICalendarExportService, AgendaService, YearService } from '@syncfusion/ej2-angular-schedule';
 import * as i10$1 from '@syncfusion/ej2-angular-kanban';
@@ -13376,8 +13376,8 @@ class WorkflowNodeComponent {
         this._pane = _pane;
         this.change = new EventEmitter();
         this.connector = this._fb.group({
-            action: '',
-            case: ''
+            action: null,
+            case: null
         });
         this._elementDestroy = new Subject();
         this.actions = _session.profile.actions;
@@ -13403,25 +13403,24 @@ class WorkflowNodeComponent {
                 this._pane.icon = 'link';
                 this.connector.valueChanges.pipe(takeUntil$1(this._elementDestroy)).subscribe(v => {
                     const content = v['case'] || v['action'];
-                    this.connectors.forEach(c => {
-                        if (!c.addInfo)
-                            c.addInfo = this.connector.getRawValue();
-                        else
-                            Object.assign(c.addInfo, this.connector.getRawValue());
-                        cleanup(c.addInfo);
-                        if (!c.annotations.length)
-                            c.annotations.push({
+                    if (!connector.addInfo)
+                        connector.addInfo = this.connector.getRawValue();
+                    else
+                        Object.assign(connector.addInfo, this.connector.getRawValue());
+                    cleanup(connector.addInfo);
+                    if (connector.annotations.length) {
+                        connector.annotations[0].content = content;
+                        this.diagram.dataBind();
+                    }
+                    else
+                        this.diagram.addConnectorLabels(connector, [{
                                 style: {
                                     color: this._session.theme.dark ? 'white' : 'black',
                                     fill: 'transparent',
                                     opacity: .8,
                                 },
                                 content
-                            });
-                        else
-                            c.annotations[0].content = content;
-                    });
-                    this.diagram.dataBind();
+                            }]);
                     this.change.emit();
                 });
                 this.argumentstemplate.createEmbeddedView(this.connectorargs);
@@ -13435,21 +13434,22 @@ class WorkflowNodeComponent {
                     const annotationArg = tool.arguments.find(a => a.diagram);
                     function change(m) {
                         if (annotationArg && m[annotationArg.name] !== null) {
-                            if (node.annotations.length)
+                            if (node.annotations.length) {
                                 node.annotations[0].content = m[annotationArg.name] || null;
+                                this.diagram.dataBind();
+                            }
                             else
-                                node.annotations.push({
-                                    style: {
-                                        color: this._session.theme.dark ? 'white' : 'black',
-                                        fill: 'transparent',
-                                        opacity: .8,
-                                    },
-                                    content: m[annotationArg.name] || null
-                                });
+                                this.diagram.addNodeLabels(node, [{
+                                        style: {
+                                            color: this._session.theme.dark ? 'white' : 'black',
+                                            fill: 'transparent',
+                                            opacity: .8,
+                                        },
+                                        content: m[annotationArg.name] || null
+                                    }]);
                         }
                         Object.assign(addInfo, m);
                         cleanup(addInfo);
-                        this.diagram.dataBind();
                         this.change.emit();
                     }
                     if (tool.template) {
@@ -13547,15 +13547,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
 
 Diagram.Inject(UndoRedo, ConnectorBridging, ConnectorEditing, Snapping);
 SymbolPalette.Inject(BpmnDiagrams);
-function getPorts$1() {
-    const ports = [
-        { id: 'port1', shape: 'Circle', offset: { x: 0, y: 0.5 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw },
-        { id: 'port2', shape: 'Circle', offset: { x: 0.5, y: 1 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw },
-        { id: 'port3', shape: 'Circle', offset: { x: 1, y: 0.5 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw },
-        { id: 'port4', shape: 'Circle', offset: { x: 0.5, y: 0 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw }
-    ];
-    return ports;
-}
+const ports = [
+    { id: 'port1', shape: 'Circle', offset: { x: 0, y: 0.5 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw },
+    { id: 'port2', shape: 'Circle', offset: { x: 0.5, y: 1 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw },
+    { id: 'port3', shape: 'Circle', offset: { x: 1, y: 0.5 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw },
+    { id: 'port4', shape: 'Circle', offset: { x: 0.5, y: 0 }, visibility: PortVisibility.Connect | PortVisibility.Hover, constraints: PortConstraints.Default | PortConstraints.Draw }
+];
 function showPaletteIcon() {
     const paletteSpace = document.getElementById('palette-space');
     const isMobile = window.matchMedia('(max-width:550px)').matches;
@@ -13595,60 +13592,45 @@ class WorkflowComponent {
         this.dirty = false;
         this.palettes = [];
         this.diagramConstraints = DiagramConstraints.Default | DiagramConstraints.Bridging | DiagramConstraints.UserInteraction | DiagramConstraints.Zoom;
-        this.diagramTool = DiagramTools.Default;
         //SymbolPalette Properties
         this.symbolMargin = { left: 10, right: 10, top: 10, bottom: 10 };
         this.snapSettings = {
-        //  horizontalGridlines: gridlines,
-        //  verticalGridlines: gridlines,
-        //  constraints: SnapConstraints.All & ~SnapConstraints.ShowLines
+            snapLineColor: this._session.getAccent(100)
         };
         this.selectedItems = {
-            constraints: SelectorConstraints.All & ~SelectorConstraints.Rotate
+            constraints: SelectorConstraints.All & ~SelectorConstraints.Rotate,
         };
         this.scrollSettings = {
             minZoom: .5,
-            maxZoom: 2.5
-        };
-        this._rulerColor = this._session.getAccent(100);
-        this.rulerSettings = {
-            horizontalRuler: { markerColor: this._rulerColor },
-            verticalRuler: { markerColor: this._rulerColor }
+            maxZoom: 2.5,
         };
+        this.rulerSettings = {};
         this._destroy = new Subject();
         this._nodedestroy = new Subject();
         this.nodeDefaults = (obj) => {
-            if (obj.addInfo && obj.addInfo['nodeType']) {
-                obj.style = {
-                    fill: 'transparent',
-                    strokeColor: this._session.theme.dark ? 'white' : 'black',
-                    strokeWidth: 1
-                },
-                    obj.constraints = NodeConstraints.Default | NodeConstraints.AspectRatio,
-                    obj.ports = getPorts$1();
-                if (obj.width === undefined) {
-                    obj.width = 145;
-                }
-                else {
-                    const ratio = 100 / obj.width;
-                    obj.width = 100;
-                    obj.height *= ratio;
-                }
+            switch (obj.shape.type) {
+                case 'SwimLane':
+                    break;
+                case 'Text':
+                    if (obj.id !== 'version')
+                        obj.constraints = NodeConstraints.Default & ~NodeConstraints.InConnect & ~NodeConstraints.OutConnect;
+                    break;
+                default:
+                    if (obj.addInfo && obj.addInfo['nodeType']) {
+                        obj.constraints = NodeConstraints.Default | NodeConstraints.AspectRatio;
+                        obj.style.strokeColor = this._session.theme.dark ? 'white' : 'black';
+                        obj.ports = ports;
+                    }
+                    break;
             }
             return obj;
         };
         this.connDefaults = (obj) => {
-            obj.constraints = ConnectorConstraints.Default | ConnectorConstraints.Bridging |
-                ConnectorConstraints.Bridging;
+            obj.constraints = ConnectorConstraints.Default | ConnectorConstraints.Bridging;
             obj.style.strokeColor = this._session.theme.dark ? 'white' : 'black';
-            obj.type = this.connectorType;
-            //  if (!obj.annotations) obj.annotations = [{
-            //    style: {
-            //      color: this._session.theme.dark ? 'white' : 'black',
-            //      fill: 'transparent',
-            //      opacity: .8,
-            //    },
-            //  }];
+            if (!obj.type)
+                obj.type = this.connectorType;
+            return obj;
         };
         this._tools = localStorage.getItem('diagram_tools') === '1';
         this._palettes();
@@ -13680,14 +13662,13 @@ class WorkflowComponent {
             snapSettings: this.snapSettings,
             getConnectorDefaults: this.connDefaults.bind(this),
             constraints: this.diagramConstraints,
-            tool: this.diagramTool,
             getNodeDefaults: this.nodeDefaults.bind(this),
             scrollSettings: this.scrollSettings,
             selectedItems: this.selectedItems,
             rulerSettings: this.rulerSettings,
             dragEnter: this.dragEnter.bind(this),
             connectionChange: this.change.bind(this),
-            collectionChange: this.change.bind(this),
+            collectionChange: this.collectionChange.bind(this),
             propertyChange: this.propertyChange.bind(this),
             selectionChange: this.selectionChange.bind(this),
         }, this.diagramEl.nativeElement);
@@ -13718,6 +13699,8 @@ class WorkflowComponent {
                     nodeType: n.name,
                     title: n.title
                 },
+                width: 145,
+                height: 145,
             };
             node.node = n.name;
             let palette = this.palettes.find(p => p.title === (n.palette || ''));
@@ -13747,11 +13730,14 @@ class WorkflowComponent {
                 },
                 {
                     id: 'text', shape: { type: 'Text', content: 'T' },
+                    style: {
+                        fill: 'transparent'
+                    },
                     constraints: NodeConstraints.Default & ~NodeConstraints.InConnect & ~NodeConstraints.OutConnect,
                     addInfo: { title: this._translate.get('Text') }
                 }]
         });
-        const color = MATERIAL_PALETTES['grey'][200]; // this._session.getPrimery(100);
+        const color = MATERIAL_PALETTES['grey'][200];
         this.palettes.push({
             id: 'swimlaneShapes',
             expanded: true,
@@ -13763,11 +13749,15 @@ class WorkflowComponent {
                         title: this._translate.get('Horizontal')
                     },
                     shape: {
+                        header: {
+                            annotation: { content: 'Plan' }
+                        },
                         type: 'SwimLane',
                         lanes: [
                             {
                                 id: 'lane1',
                                 header: {
+                                    annotation: { content: 'Lane' },
                                     style: { fill: color }
                                 }
                             }
@@ -13786,10 +13776,14 @@ class WorkflowComponent {
                     },
                     shape: {
                         type: 'SwimLane',
+                        header: {
+                            annotation: { content: 'Plan' }
+                        },
                         lanes: [
                             {
                                 id: 'lane1',
                                 header: {
+                                    annotation: { content: 'Lane' },
                                     style: { fill: color }
                                 }
                             }
@@ -13807,8 +13801,14 @@ class WorkflowComponent {
                     },
                     shape: {
                         type: 'SwimLane',
-                        phases: [{ style: { strokeWidth: 1, strokeDashArray: '3,3', strokeColor: color }, }],
-                        annotations: [{ text: '' }],
+                        phases: [
+                            {
+                                style: { strokeWidth: 1, strokeDashArray: '3,3', strokeColor: color },
+                                header: {
+                                    annotation: { text: 'Phase' }
+                                }
+                            }
+                        ],
                         orientation: 'Vertical', isPhase: true
                     },
                     height: 60,
@@ -13821,12 +13821,16 @@ class WorkflowComponent {
                     },
                     shape: {
                         type: 'SwimLane',
-                        phases: [{ style: { strokeWidth: 1, strokeDashArray: '3,3', strokeColor: color }, }],
-                        annotations: [{ text: '' }],
+                        phases: [{
+                                style: { strokeWidth: 1, strokeDashArray: '3,3', strokeColor: color },
+                                header: {
+                                    annotation: { text: 'Phase' }
+                                }
+                            }],
                         orientation: 'Horizontal', isPhase: true
                     },
                     height: 60,
-                    width: 80,
+                    width: 140,
                     style: { strokeColor: color }
                 }
             ]
@@ -13859,7 +13863,6 @@ class WorkflowComponent {
     }
     getSymbolDefaults(symbol) {
         symbol.width = symbol.height = 40;
-        symbol.constraints = NodeConstraints.Default | NodeConstraints.AspectRatio;
     }
     pan() {
         this.diagram.constraints = this.diagram.constraints | DiagramConstraints.Pan;
@@ -13871,7 +13874,7 @@ class WorkflowComponent {
     }
     selectionChange(evt) {
         const { newValue, state } = evt;
-        if (state !== 'Changed' || !newValue.length) {
+        if (state !== 'Changing' || !newValue.length) {
             this._nodedestroy.next();
             return;
         }
@@ -13888,10 +13891,10 @@ class WorkflowComponent {
         const nodes = newValue.filter(n => n instanceof Node);
         if (nodes.length) {
             const node = nodes[0], addInfo = node.addInfo;
-            if (addInfo && addInfo.nodeType && node.annotations.length && node.annotations[0].style)
-                this.fontSize = node.annotations[0].style.fontSize;
-            else
+            if (!addInfo || !addInfo['nodeType'])
                 return;
+            if (node.annotations.length && node.annotations[0].style)
+                this.fontSize = node.annotations[0].style.fontSize;
         }
         this._router.navigate(WorkflowNodeComponent, {
             state: {
@@ -13903,12 +13906,12 @@ class WorkflowComponent {
             expandable: false,
             group: ''
         }).then(p => {
-            p.instance.change.
-                pipe(takeUntil(this._nodedestroy.pipe(tap$1(() => p.close())))).subscribe(() => this.dirty = true);
+            p.instance.change.pipe(takeUntil(this._nodedestroy)).subscribe(() => this.change());
+            this._nodedestroy.pipe(first$1()).subscribe(() => p.close());
         });
     }
     align(value) {
-        function align(n) {
+        this.diagram.selectedItems.nodes.forEach(n => {
             n.annotations.length && Object.assign(n.annotations[0], {
                 offset: {
                     x: value === 'Right' ? 1 : value === 'Left' ? 0 : .5,
@@ -13917,44 +13920,50 @@ class WorkflowComponent {
                 verticalAlignment: value === 'Top' ? 'Bottom' : value === 'Bottom' ? 'Top' : 'Center',
                 horizontalAlignment: value === 'Right' ? 'Left' : value === 'Left' ? 'Right' : 'Center'
             });
-        }
-        this.diagram.selectedItems.nodes.forEach(align);
-        this.diagram.selectedItems.connectors.forEach(c => {
-            c.annotations.forEach(a => {
-                a.alignment = value === 'Left' ? 'Before' :
-                    value === 'Right' ? 'After' : 'Center';
-                a.offset = 5;
-                a.displacement = {
-                    x: value === 'Right' ? 1 : value === 'Left' ? 0 : .5,
-                    y: value === 'Top' ? 0 : value === 'Bottom' ? 1 : .5
-                };
-            });
         });
+        this.diagram.selectedItems.connectors.forEach(c => c.annotations.forEach(a => Object.assign(a, {
+            verticalAlignment: value === 'Top' ? 'Bottom' : value === 'Bottom' ? 'Top' : 'Center',
+            horizontalAlignment: value === 'Left' ? 'Left' : value === 'Right' ? 'Right' : 'Center',
+            //  displacement: {
+            //    x: value === 'Right' ? 10 : value === 'Left' ? -10 : 0,
+            //    y: value === 'Top' ? -10 : value === 'Bottom' ? 10 : 0
+            //  }
+        })));
         this.alignment = value;
         this.dirty = true;
     }
     dragEnter(args) {
         if (args.element instanceof Node) {
-            const shape = args.element.shape;
-            if (shape.isLane) {
-                switch (shape.orientation) {
-                    case 'Horizontal':
-                        shape.lanes[0].height = 100;
-                        shape.lanes[0].width = 400;
-                        break;
-                    case 'Vertical':
-                        shape.lanes[0].height = 400;
-                        shape.lanes[0].width = 100;
+            switch (args.element.shape.type) {
+                case 'SwimLane':
+                    {
+                        const shape = args.element.shape;
+                        switch (shape.orientation) {
+                            case 'Horizontal':
+                                shape.lanes[0].width = 400;
+                                break;
+                            case 'Vertical':
+                                shape.lanes[0].height = 400;
+                                break;
+                        }
                         break;
-                }
-            }
-            else {
-                const { width, height } = args.element;
-                args.element.width = 100;
-                args.element.height *= 100 / width;
-                args.element.offsetX += (args.element.width - width) / 2;
-                args.element.offsetY += (args.element.height - height) / 2;
-                args.element.style = { fill: 'white', strokeColor: 'black' };
+                    }
+                case 'Text':
+                    //(args.element.style as TextStyleModel).fontSize = 20;
+                    break;
+                default:
+                    {
+                        const { width, height } = args.element;
+                        args.element.width = 100;
+                        args.element.height *= 100 / width;
+                        args.element.offsetX += (args.element.width - width) / 2;
+                        args.element.offsetY += (args.element.height - height) / 2;
+                        args.element.style = {
+                            fill: 'transparent',
+                            strokeColor: this._session.theme.dark ? 'white' : 'black',
+                            strokeWidth: 1
+                        };
+                    }
             }
         }
     }
@@ -13965,6 +13974,10 @@ class WorkflowComponent {
     change() {
         this.dirty = true;
     }
+    collectionChange() {
+        this._router.collapse();
+        this.dirty = true;
+    }
     /**
      * Ctrl-s save
      * @param event
@@ -13989,22 +14002,58 @@ class WorkflowComponent {
         this.connectorType = type;
         this.dirty = true;
     }
+    boldChange() {
+        var _a, _b;
+        const val = !((_b = (_a = this.diagram.selectedItems.nodes[0].annotations[0]) === null || _a === void 0 ? void 0 : _a.style) === null || _b === void 0 ? void 0 : _b.bold);
+        function change(node) {
+            if (node.shape.type === 'Text')
+                node.style.bold = val;
+            else
+                node.annotations.forEach(a => {
+                    if (!a.style)
+                        a.style = { bold: val };
+                    else
+                        a.style.bold = val;
+                });
+        }
+        this.diagram.selectedItems.nodes.forEach(change);
+        this.diagram.selectedItems.connectors.forEach(change);
+        this.diagram.dataBind();
+    }
+    italicChange() {
+        var _a, _b;
+        const val = !((_b = (_a = this.diagram.selectedItems.nodes[0].annotations[0]) === null || _a === void 0 ? void 0 : _a.style) === null || _b === void 0 ? void 0 : _b.italic);
+        function change(node) {
+            if (node.shape.type === 'Text')
+                node.style.italic = val;
+            else
+                node.annotations.forEach(a => {
+                    if (!a.style)
+                        a.style = { italic: val };
+                    else
+                        a.style.italic = val;
+                });
+        }
+        this.diagram.selectedItems.nodes.forEach(change);
+        this.diagram.selectedItems.connectors.forEach(change);
+        this.diagram.dataBind();
+    }
     fontSizeChange(val) {
         function change(node) {
             var _a;
-            (_a = node.annotations) === null || _a === void 0 ? void 0 : _a.forEach(a => {
-                if (!a.style)
-                    a.style = { fontSize: val };
-                else
-                    a.style.fontSize = val;
-            });
             if (node.shape.type === 'Text')
                 node.style.fontSize = val;
+            else
+                (_a = node.annotations) === null || _a === void 0 ? void 0 : _a.forEach(a => {
+                    if (!a.style)
+                        a.style = { fontSize: val };
+                    else
+                        a.style.fontSize = val;
+                });
         }
         this.diagram.selectedItems.nodes.forEach(change);
         this.diagram.selectedItems.connectors.forEach(change);
         this.diagram.dataBind();
-        this.dirty = true;
     }
     strokeChange(val) {
         this.diagram.selectedItems.connectors.forEach(c => {
@@ -14019,11 +14068,7 @@ class WorkflowComponent {
         this.diagram.serializationSettings = { preventDefaults: true };
         const obj = JSON.parse(this.diagram.saveDiagram());
         this._form.workflow.connectors = obj.connectors;
-        this._form.workflow.nodes = obj.nodes.filter(n => n.id !== 'version').map((n) => {
-            n.offsetX = Math.round(n.offsetX);
-            n.offsetY = Math.round(n.offsetY);
-            return n;
-        });
+        this._form.workflow.nodes = obj.nodes.filter(n => n.id !== 'version');
         this.saving = true;
         return this._service.save(this._form).toPromise().then(v => {
             this.ps.toast('ChangesSaved');
@@ -14052,12 +14097,12 @@ class WorkflowComponent {
     }
 }
 WorkflowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: WorkflowComponent, deps: [{ token: PromptService }, { token: FormService }, { token: PaneRef }, { token: PanesRouter }, { token: SessionService }, { token: TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-WorkflowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: WorkflowComponent, selector: "bizdoc-workflow", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "symbolPaletteEl", first: true, predicate: ["symbolPaletteEl"], descendants: true, static: true }, { propertyName: "diagramEl", first: true, predicate: ["diagramEl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\r\n  <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\r\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\r\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\r\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\r\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\r\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\r\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\r\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\r\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\r\n    </button>\r\n    <!--<ng-container *ngIf=\"connectors.length\">\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n      <ng-container *ngIf=\"nodes[0].annotations.length\">\r\n        < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\r\n      </ng-container>\r\n      < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n    </ng-container>-->\r\n  </mat-menu>\r\n  &nbsp;\r\n  <button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\r\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\r\n          'sf-icon-left': alignment === 'Left',\r\n          'sf-icon-center': alignment === 'Center',\r\n          'sf-icon-bottom': alignment === 'Bottom',\r\n          'sf-icon-right': alignment === 'Right'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"align('Top')\">\r\n      <span class=\"e-icons sf-icon-top\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Left')\">\r\n      <span class=\"e-icons sf-icon-left\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Center')\">\r\n      <span class=\"e-icons sf-icon-center\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Bottom')\">\r\n      <span class=\"e-icons sf-icon-bottom\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Right')\">\r\n      <span class=\"e-icons sf-icon-right\"></span>\r\n    </button>\r\n  </mat-menu>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\r\n          [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\r\n          [bizdocTooltip]=\"'FontSize'|translate\">\r\n    <mat-icon>format_size</mat-icon>\r\n  </button>\r\n  <mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item *ngFor=\"let size of fontSizes\" (click)=\"fontSizeChange(size)\">\r\n      {{size}}\r\n    </button>\r\n  </mat-menu>\r\n  <span class=\"divider\"></span>\r\n</mat-toolbar>\r\n<div class=\"row container\">\r\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\r\n    <div dir=\"ltr\" #symbolPaletteEl>\r\n    </div>\r\n  </div>\r\n  <div #diagramEl id=\"diagram\" fxFlex dir=\"ltr\">\r\n  </div>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;height:100%}.container{flex-grow:1;overflow-y:auto}#diagram{flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"], components: [{ type: i7$3.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { type: i7.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: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i9$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i9$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { type: i9$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i25.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7$2.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i23.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "translate": TranslatePipe } });
+WorkflowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: WorkflowComponent, selector: "bizdoc-workflow", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" }, classAttribute: "pane" }, viewQueries: [{ propertyName: "symbolPaletteEl", first: true, predicate: ["symbolPaletteEl"], descendants: true, static: true }, { propertyName: "diagramEl", first: true, predicate: ["diagramEl"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\r\n  <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\r\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\r\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\r\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\r\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\r\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\r\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\r\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\r\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\r\n    </button>\r\n    <!--<ng-container *ngIf=\"connectors.length\">\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n      <ng-container *ngIf=\"nodes[0].annotations.length\">\r\n        < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\r\n      </ng-container>\r\n      < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n    </ng-container>-->\r\n  </mat-menu>\r\n  &nbsp;\r\n  <button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\r\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\r\n          'sf-icon-left': alignment === 'Left',\r\n          'sf-icon-center': alignment === 'Center',\r\n          'sf-icon-bottom': alignment === 'Bottom',\r\n          'sf-icon-right': alignment === 'Right'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"align('Top')\">\r\n      <span class=\"e-icons sf-icon-top\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Left')\">\r\n      <span class=\"e-icons sf-icon-left\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Center')\">\r\n      <span class=\"e-icons sf-icon-center\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Right')\">\r\n      <span class=\"e-icons sf-icon-right\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Bottom')\">\r\n      <span class=\"e-icons sf-icon-bottom\"></span>\r\n    </button>\r\n  </mat-menu>\r\n  <button mat-icon-button (click)=\"boldChange()\" [bizdocTooltip]=\"'Bold' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_bold</mat-icon></button>\r\n  <button mat-icon-button (click)=\"italicChange()\" [bizdocTooltip]=\"'Italic' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_italic</mat-icon></button>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\r\n          [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\r\n          [bizdocTooltip]=\"'FontSize'|translate\">\r\n    <mat-icon>format_size</mat-icon>\r\n  </button>\r\n  <mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item *ngFor=\"let size of fontSizes\" (click)=\"fontSizeChange(size)\">\r\n      {{size}}\r\n    </button>\r\n  </mat-menu>\r\n  <span class=\"divider\"></span>\r\n</mat-toolbar>\r\n<div class=\"row container\">\r\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\r\n    <div dir=\"ltr\" #symbolPaletteEl>\r\n    </div>\r\n  </div>\r\n  <div #diagramEl id=\"diagram\" fxFlex dir=\"ltr\">\r\n  </div>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;height:100%}.container{flex-grow:1;overflow-y:auto}#diagram{flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"], components: [{ type: i7$3.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { type: i7.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: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i9$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i9$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: TooltipDirective, selector: "[bizdocTooltip]", inputs: ["bizdocTooltip", "bizdocTooltipTemplate", "bizdocTooltipContext", "bizdocTooltipPosition", "bizdocTooltipDuration", "bizdocTooltipDisabled"] }, { type: i9$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i25.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7$2.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i23.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "translate": TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: WorkflowComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bizdoc-workflow', host: {
                         class: 'pane'
-                    }, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\r\n  <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\r\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\r\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\r\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\r\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\r\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\r\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\r\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\r\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\r\n    </button>\r\n    <!--<ng-container *ngIf=\"connectors.length\">\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n      <ng-container *ngIf=\"nodes[0].annotations.length\">\r\n        < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\r\n      </ng-container>\r\n      < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n    </ng-container>-->\r\n  </mat-menu>\r\n  &nbsp;\r\n  <button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\r\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\r\n          'sf-icon-left': alignment === 'Left',\r\n          'sf-icon-center': alignment === 'Center',\r\n          'sf-icon-bottom': alignment === 'Bottom',\r\n          'sf-icon-right': alignment === 'Right'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"align('Top')\">\r\n      <span class=\"e-icons sf-icon-top\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Left')\">\r\n      <span class=\"e-icons sf-icon-left\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Center')\">\r\n      <span class=\"e-icons sf-icon-center\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Bottom')\">\r\n      <span class=\"e-icons sf-icon-bottom\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Right')\">\r\n      <span class=\"e-icons sf-icon-right\"></span>\r\n    </button>\r\n  </mat-menu>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\r\n          [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\r\n          [bizdocTooltip]=\"'FontSize'|translate\">\r\n    <mat-icon>format_size</mat-icon>\r\n  </button>\r\n  <mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item *ngFor=\"let size of fontSizes\" (click)=\"fontSizeChange(size)\">\r\n      {{size}}\r\n    </button>\r\n  </mat-menu>\r\n  <span class=\"divider\"></span>\r\n</mat-toolbar>\r\n<div class=\"row container\">\r\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\r\n    <div dir=\"ltr\" #symbolPaletteEl>\r\n    </div>\r\n  </div>\r\n  <div #diagramEl id=\"diagram\" fxFlex dir=\"ltr\">\r\n  </div>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;height:100%}.container{flex-grow:1;overflow-y:auto}#diagram{flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"] }]
+                    }, template: "<mat-toolbar>\r\n  <button mat-icon-button (click)=\"tools = !tools\" [bizdocTooltip]=\"'Collapse' | translate\"><mat-icon>view_sidebar</mat-icon></button>\r\n  <button mat-button (click)=\"save()\" color=\"primary\" [disabled]=\"!dirty || saving\">{{'SaveChanges' | translate}}</button>\r\n  <button mat-icon-button (click)=\"diagram.fitToPage()\" [bizdocTooltip]=\"'FitToPage' | translate\"><mat-icon>fullscreen_exit</mat-icon></button>\r\n  <button mat-icon-button (click)=\"pan()\" [bizdocTooltip]=\"'Pan' | translate\"><span class=\"e-icons sf-icon-pan\"></span></button>\r\n  <button mat-icon-button (click)=\"cursor()\" [bizdocTooltip]=\"'Cursor' | translate\"><span class=\"e-icons sf-icon-cursor\"></span></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.undo()\" [bizdocTooltip]=\"'Undo' | translate\" [disabled]=\"!diagram.historyManager?.canUndo\"><mat-icon>undo</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.redo()\" [bizdocTooltip]=\"'Redo' | translate\" [disabled]=\"!diagram.historyManager?.canRedo\"><mat-icon>redo</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-icon-button (click)=\"diagram.copy()\" [bizdocTooltip]=\"'Copy' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>copy</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.paste()\" [bizdocTooltip]=\"'Paste' | translate\"><mat-icon>paste</mat-icon></button>\r\n  <button mat-icon-button (click)=\"diagram.remove()\" [bizdocTooltip]=\"'Remove' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>delete</mat-icon></button>\r\n  <span class=\"tools-divider\"></span>\r\n  <button mat-button [matMenuTriggerFor]=\"lineMenu\" [disabled]=\"diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'ConnectorMode'|translate\">\r\n    <span class=\"e-menu-icon\" [ngClass]=\"{'sf-icon-straight-line': connectorType === 'Straight',\r\n          'sf-icon-orthogonal-line': connectorType === 'Orthogonal',\r\n          'sf-icon-beizer-line': connectorType === 'Bezier'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #lineMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Straight')\">\r\n      <span class=\"e-menu-icon sf-icon-straight-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Orthogonal')\">\r\n      <span class=\"e-menu-icon sf-icon-orthogonal-line\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"connectorTypeChange('Bezier')\">\r\n      <span class=\"e-menu-icon sf-icon-beizer-line\"></span>\r\n    </button>\r\n    <!--<ng-container *ngIf=\"connectors.length\">\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n      <ng-container *ngIf=\"nodes[0].annotations.length\">\r\n        < bizdoc-color-picker (valueChanges)='colorChange($event)' [label]=\"'Color'|translate\"></ bizdoc-color-picker>\r\n      </ng-container>\r\n      < bizdoc-color-picker (valueChanges)='bgChange($event)' [label]=\"'Background'|translate\"></ bizdoc-color-picker>\r\n      < bizdoc-color-picker (valueChanges)='strokeChange($event)' [label]=\"'Stroke'|translate\"></ bizdoc-color-picker>\r\n    </ng-container>-->\r\n  </mat-menu>\r\n  &nbsp;\r\n  <button mat-button [matMenuTriggerFor]=\"alignMenu\" [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\" [bizdocTooltip]=\"'Align'|translate\">\r\n    <span class=\"e-icons\" [ngClass]=\"{'sf-icon-top': alignment === 'Top',\r\n          'sf-icon-left': alignment === 'Left',\r\n          'sf-icon-center': alignment === 'Center',\r\n          'sf-icon-bottom': alignment === 'Bottom',\r\n          'sf-icon-right': alignment === 'Right'}\"></span>\r\n    <mat-icon>arrow_drop_down</mat-icon>\r\n  </button>\r\n  <mat-menu #alignMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item (click)=\"align('Top')\">\r\n      <span class=\"e-icons sf-icon-top\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Left')\">\r\n      <span class=\"e-icons sf-icon-left\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Center')\">\r\n      <span class=\"e-icons sf-icon-center\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Right')\">\r\n      <span class=\"e-icons sf-icon-right\"></span>\r\n    </button>\r\n    <button mat-menu-item (click)=\"align('Bottom')\">\r\n      <span class=\"e-icons sf-icon-bottom\"></span>\r\n    </button>\r\n  </mat-menu>\r\n  <button mat-icon-button (click)=\"boldChange()\" [bizdocTooltip]=\"'Bold' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_bold</mat-icon></button>\r\n  <button mat-icon-button (click)=\"italicChange()\" [bizdocTooltip]=\"'Italic' | translate\" [disabled]=\"diagram.selectedItems?.connectors.length === 0 && diagram.selectedItems?.nodes.length === 0\"><mat-icon>format_italic</mat-icon></button>\r\n  <button mat-icon-button [matMenuTriggerFor]=\"sizeMenu\"\r\n          [disabled]=\"diagram.selectedItems?.nodes.length === 0 && diagram.selectedItems?.connectors.length === 0\"\r\n          [bizdocTooltip]=\"'FontSize'|translate\">\r\n    <mat-icon>format_size</mat-icon>\r\n  </button>\r\n  <mat-menu #sizeMenu overlayPanelClass=\"icon-menu-panel\">\r\n    <button mat-menu-item *ngFor=\"let size of fontSizes\" (click)=\"fontSizeChange(size)\">\r\n      {{size}}\r\n    </button>\r\n  </mat-menu>\r\n  <span class=\"divider\"></span>\r\n</mat-toolbar>\r\n<div class=\"row container\">\r\n  <div id=\"symbolpalette\" [style.display]=\"tools?'':'none'\">\r\n    <div dir=\"ltr\" #symbolPaletteEl>\r\n    </div>\r\n  </div>\r\n  <div #diagramEl id=\"diagram\" fxFlex dir=\"ltr\">\r\n  </div>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;height:100%}.container{flex-grow:1;overflow-y:auto}#diagram{flex-grow:1}#symbolpalette{width:210px}::ng-deep .e-rtl{direction:ltr}::ng-deep .mat-toolbar .mat-button-toggle{background:transparent!important}.e-menu-icon{font-family:diagram-icons!important;speak:none;font-size:18px;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::ng-deep .mat-menu-panel{min-width:0!important}.tools-divider:after{content:\"|\";opacity:.6;margin:0 2px}\n"] }]
         }], ctorParameters: function () { return [{ type: PromptService }, { type: FormService }, { type: PaneRef }, { type: PanesRouter }, { type: SessionService }, { type: TranslateService }]; }, propDecorators: { symbolPaletteEl: [{
                 type: ViewChild,
                 args: ['symbolPaletteEl', { static: true }]
@@ -15473,24 +15518,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
             type: Injectable
         }], ctorParameters: function () { return [{ type: MailboxService }]; } });
 
+class SaveChangesDialog {
+    ngOnInit() {
+        playAudio('alert_error-03');
+    }
+}
+SaveChangesDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SaveChangesDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SaveChangesDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: SaveChangesDialog, selector: "ng-component", ngImport: i0, template: "  <h2 mat-dialog-title>\r\n      {{'SaveChanges' | translate}}\r\n  </h2>\r\n  <mat-dialog-content>\r\n    <p class=\"mat-body\">\r\n      {{'SaveChangesAsk' | translate}}\r\n    </p>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=true color=\"primary\" cdkFocusInitial>{{'Save'|translate}}</button>\r\n    <button mat-button mat-dialog-close color=\"warn\">{{'DiscardChanges'|translate}}</button>\r\n    <button mat-button [mat-dialog-close]=\"false\">{{'ContinueEditing'|translate}}</button>\r\n  </mat-dialog-actions>\r\n", components: [{ type: i7.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"] }], directives: [{ type: i3$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i3$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i3$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i3$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "translate": TranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SaveChangesDialog, decorators: [{
+            type: Component,
+            args: [{ template: "  <h2 mat-dialog-title>\r\n      {{'SaveChanges' | translate}}\r\n  </h2>\r\n  <mat-dialog-content>\r\n    <p class=\"mat-body\">\r\n      {{'SaveChangesAsk' | translate}}\r\n    </p>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=true color=\"primary\" cdkFocusInitial>{{'Save'|translate}}</button>\r\n    <button mat-button mat-dialog-close color=\"warn\">{{'DiscardChanges'|translate}}</button>\r\n    <button mat-button [mat-dialog-close]=\"false\">{{'ContinueEditing'|translate}}</button>\r\n  </mat-dialog-actions>\r\n" }]
+        }] });
+
 class AdminDismiss {
-    constructor(_sb) {
-        this._sb = _sb;
+    constructor(_dialog) {
+        this._dialog = _dialog;
     }
     onDismiss(component) {
         if (component.dirty)
-            return this._sb.ask('SaveChangesAsk', 'SaveChanges', { i18n: true, color: 'primary', ok: 'Save', cancel: 'DiscardChanges' }).
-                toPromise().
-                then(ok => ok ? component.save().then(() => true) : true);
+            return new Promise((resolve, reject) => this._dialog.open(SaveChangesDialog).
+                afterClosed().
+                subscribe(ok => {
+                if (ok)
+                    component.save().then(() => resolve(true), reject);
+                else
+                    resolve(ok !== false);
+            }));
         else
             return true;
     }
 }
-AdminDismiss.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: AdminDismiss, deps: [{ token: PromptService }], target: i0.ɵɵFactoryTarget.Injectable });
+AdminDismiss.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: AdminDismiss, deps: [{ token: i3$1.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
 AdminDismiss.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: AdminDismiss });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: AdminDismiss, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: PromptService }]; } });
+        }], ctorParameters: function () { return [{ type: i3$1.MatDialog }]; } });
 
 class AgoPipe {
     constructor(_translate) {
@@ -15744,18 +15806,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: PanesRouter }, { type: i0.ElementRef }, { type: TranslateService }, { type: PaneRef }]; } });
 
-class SaveChangesDialog {
-    ngOnInit() {
-        playAudio('alert_error-03');
-    }
-}
-SaveChangesDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SaveChangesDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SaveChangesDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: SaveChangesDialog, selector: "ng-component", ngImport: i0, template: "  <h2 mat-dialog-title>\r\n      {{'SaveChanges' | translate}}\r\n  </h2>\r\n  <mat-dialog-content>\r\n    <p class=\"mat-body\">\r\n      {{'SaveChangesAsk' | translate}}\r\n    </p>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=true color=\"primary\" cdkFocusInitial>{{'Save'|translate}}</button>\r\n    <button mat-button [mat-dialog-close]=\"false\">{{'ContinueEditing'|translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'DiscardChanges'|translate}}</button>\r\n  </mat-dialog-actions>\r\n", components: [{ type: i7.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"] }], directives: [{ type: i3$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i3$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i3$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i3$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "translate": TranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SaveChangesDialog, decorators: [{
-            type: Component,
-            args: [{ template: "  <h2 mat-dialog-title>\r\n      {{'SaveChanges' | translate}}\r\n  </h2>\r\n  <mat-dialog-content>\r\n    <p class=\"mat-body\">\r\n      {{'SaveChangesAsk' | translate}}\r\n    </p>\r\n  </mat-dialog-content>\r\n  <mat-dialog-actions>\r\n    <button mat-button [mat-dialog-close]=true color=\"primary\" cdkFocusInitial>{{'Save'|translate}}</button>\r\n    <button mat-button [mat-dialog-close]=\"false\">{{'ContinueEditing'|translate}}</button>\r\n    <button mat-button mat-dialog-close>{{'DiscardChanges'|translate}}</button>\r\n  </mat-dialog-actions>\r\n" }]
-        }] });
-
 class ComposeDismiss {
     constructor(_dialog) {
         this._dialog = _dialog;