ngx-rs-ant 1.5.8 → 1.6.0

package/fesm2020/ngx-rs-ant.mjs

@@ -1713,11 +1713,23 @@ class CamundaBpmnEditorComponent {
             '</bpmndi:BPMNDiagram>' +
             '</bpmn:definitions>';
     }
+    set xml(xml) {
+        this._xml = xml;
+        this.loadXml();
+    }
+    get xml() {
+        return this._xml;
+    }
+    ngOnInit() {
+        if (!this.xml) {
+            this.xml = this.initialDiagram;
+        }
+    }
     ngAfterViewInit() {
         this.modeler = new BpmnModeler({
-            container: this.container?.nativeElement,
+            container: this.bpmnContainer?.nativeElement,
             propertiesPanel: {
-                parent: this.config?.nativeElement,
+                parent: this.bpmnConfig?.nativeElement,
             },
             keyboard: {
                 bindTo: document,
@@ -1735,30 +1747,42 @@ class CamundaBpmnEditorComponent {
             this.modeler._container.removeChild(logo);
         }
         this.canvas = this.modeler.get('canvas');
-        this.modeler.importXML(this.initialDiagram).then(() => {
+        this.loadXml();
+    }
+    loadXml() {
+        this.modeler.importXML(this.xml).then(() => {
             this.canvas.zoom('fit-viewport');
         });
     }
     showXml() {
         if (!this.isShowXml) {
-            this.modeler.saveXML({ format: true }).then((response) => {
-                this.xml = response.xml;
+            this.saveXml((xml) => {
+                this.xml = xml;
             });
         }
         this.isShowXml = !this.isShowXml;
     }
+    saveXml(callback) {
+        this.modeler.saveXML({ format: true }).then((response) => {
+            if (callback) {
+                callback(response.xml);
+            }
+        });
+    }
 }
 CamundaBpmnEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: CamundaBpmnEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CamundaBpmnEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: CamundaBpmnEditorComponent, selector: "rs-camunda-bpmn-editor", viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "config", first: true, predicate: ["config"], descendants: true }], ngImport: i0, template: "<div class=\"main\">\n  <div class=\"container\" #container></div>\n  <div class=\"config\" #config></div>\n  <div class=\"xml-viewer\" [ngStyle]=\"{display: isShowXml ? 'flex' : 'none'}\">\n    <rs-code-editor language=\"xml\" [code]=\"xml\" [readonly]=\"true\" [enableMinimap]=\"true\"></rs-code-editor>\n  </div>\n</div>\n<div class=\"footer\">\n  <dx-button [type]=\"isShowXml ? 'default' : 'normal'\" text=\"XML\" [hoverStateEnabled]=\"false\"\n             (onClick)=\"showXml()\"></dx-button>\n</div>\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap}:host .main{flex:1;display:flex;flex-flow:row nowrap;position:relative}:host .main .container{flex:1}:host .main .config{flex:0 0 360px;border:1px solid var(--coast-border-color, #dddddd)}:host .main .xml-viewer{position:absolute;width:100%;height:100%;display:flex;flex-flow:column nowrap;z-index:var(--coast-z-index-drawer, 1040)}:host .main .xml-viewer rs-code-editor{flex:1}:host .footer{flex:0 0 24px;border:1px solid var(--coast-border-color, #dddddd)}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CodeEditorComponent, selector: "rs-code-editor", inputs: ["code", "language", "readonly", "enableMinimap", "consoleMessage"], outputs: ["codeChange", "onContentReady"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }] });
+CamundaBpmnEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: CamundaBpmnEditorComponent, selector: "rs-camunda-bpmn-editor", inputs: { xml: "xml" }, viewQueries: [{ propertyName: "bpmnContainer", first: true, predicate: ["bpmnContainer"], descendants: true }, { propertyName: "bpmnConfig", first: true, predicate: ["bpmnConfig"], descendants: true }], ngImport: i0, template: "<div class=\"main\">\n  <div class=\"container\" #bpmnContainer></div>\n  <div class=\"config\" #bpmnConfig></div>\n  <div class=\"xml-viewer\" [ngStyle]=\"{display: isShowXml ? 'flex' : 'none'}\">\n    <rs-code-editor language=\"xml\" [code]=\"xml\" [readonly]=\"true\" [enableMinimap]=\"true\"></rs-code-editor>\n  </div>\n</div>\n<div class=\"footer\">\n  <dx-button [type]=\"isShowXml ? 'default' : 'normal'\" text=\"XML\" [hoverStateEnabled]=\"false\"\n             (onClick)=\"showXml()\"></dx-button>\n</div>\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap}:host .main{flex:1;display:flex;flex-flow:row nowrap;position:relative}:host .main .container{flex:1}:host .main .config{flex:0 0 360px;border:1px solid var(--coast-border-color, #dddddd)}:host .main .xml-viewer{position:absolute;width:100%;height:100%;display:flex;flex-flow:column nowrap;z-index:var(--coast-z-index-drawer, 1040)}:host .main .xml-viewer rs-code-editor{flex:1}:host .footer{flex:0 0 24px;border:1px solid var(--coast-border-color, #dddddd)}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CodeEditorComponent, selector: "rs-code-editor", inputs: ["code", "language", "readonly", "enableMinimap", "consoleMessage"], outputs: ["codeChange", "onContentReady"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: CamundaBpmnEditorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'rs-camunda-bpmn-editor', template: "<div class=\"main\">\n  <div class=\"container\" #container></div>\n  <div class=\"config\" #config></div>\n  <div class=\"xml-viewer\" [ngStyle]=\"{display: isShowXml ? 'flex' : 'none'}\">\n    <rs-code-editor language=\"xml\" [code]=\"xml\" [readonly]=\"true\" [enableMinimap]=\"true\"></rs-code-editor>\n  </div>\n</div>\n<div class=\"footer\">\n  <dx-button [type]=\"isShowXml ? 'default' : 'normal'\" text=\"XML\" [hoverStateEnabled]=\"false\"\n             (onClick)=\"showXml()\"></dx-button>\n</div>\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap}:host .main{flex:1;display:flex;flex-flow:row nowrap;position:relative}:host .main .container{flex:1}:host .main .config{flex:0 0 360px;border:1px solid var(--coast-border-color, #dddddd)}:host .main .xml-viewer{position:absolute;width:100%;height:100%;display:flex;flex-flow:column nowrap;z-index:var(--coast-z-index-drawer, 1040)}:host .main .xml-viewer rs-code-editor{flex:1}:host .footer{flex:0 0 24px;border:1px solid var(--coast-border-color, #dddddd)}\n"] }]
-        }], propDecorators: { container: [{
+            args: [{ selector: 'rs-camunda-bpmn-editor', template: "<div class=\"main\">\n  <div class=\"container\" #bpmnContainer></div>\n  <div class=\"config\" #bpmnConfig></div>\n  <div class=\"xml-viewer\" [ngStyle]=\"{display: isShowXml ? 'flex' : 'none'}\">\n    <rs-code-editor language=\"xml\" [code]=\"xml\" [readonly]=\"true\" [enableMinimap]=\"true\"></rs-code-editor>\n  </div>\n</div>\n<div class=\"footer\">\n  <dx-button [type]=\"isShowXml ? 'default' : 'normal'\" text=\"XML\" [hoverStateEnabled]=\"false\"\n             (onClick)=\"showXml()\"></dx-button>\n</div>\n", styles: [":host{flex:1;display:flex;flex-flow:column nowrap}:host .main{flex:1;display:flex;flex-flow:row nowrap;position:relative}:host .main .container{flex:1}:host .main .config{flex:0 0 360px;border:1px solid var(--coast-border-color, #dddddd)}:host .main .xml-viewer{position:absolute;width:100%;height:100%;display:flex;flex-flow:column nowrap;z-index:var(--coast-z-index-drawer, 1040)}:host .main .xml-viewer rs-code-editor{flex:1}:host .footer{flex:0 0 24px;border:1px solid var(--coast-border-color, #dddddd)}\n"] }]
+        }], propDecorators: { xml: [{
+                type: Input
+            }], bpmnContainer: [{
                 type: ViewChild,
-                args: ['container']
-            }], config: [{
+                args: ['bpmnContainer']
+            }], bpmnConfig: [{
                 type: ViewChild,
-                args: ['config']
+                args: ['bpmnConfig']
             }] } });
 
 class CodeEditorModule {