From f65e64e41d593a0bd27f72cb0cd6fc13ea2d193f Mon Sep 17 00:00:00 2001 From: Ralph Soika <ralph.soika@imixs.com> Date: Mon, 20 Feb 2023 17:17:38 +0100 Subject: [PATCH] fixed Issue #189 --- .../src/bpmn-property-panel.tsx | 13 ++++++++++--- open-bpmn.glsp-client/workspace/test.bpmn | 6 ++++++ 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/open-bpmn.glsp-client/open-bpmn-properties/src/bpmn-property-panel.tsx b/open-bpmn.glsp-client/open-bpmn-properties/src/bpmn-property-panel.tsx index c7735dfd..97a7f9bb 100644 --- a/open-bpmn.glsp-client/open-bpmn-properties/src/bpmn-property-panel.tsx +++ b/open-bpmn.glsp-client/open-bpmn-properties/src/bpmn-property-panel.tsx @@ -100,13 +100,16 @@ export class BPMNPropertyPanel extends AbstractUIExtension implements SelectionL this.containerElement.appendChild(headerCompartment); this.headerDiv = headerCompartment; + // eslint-disable-next-line arrow-parens this.headerDiv.addEventListener('mousedown', (e) => { this.isResizing = true; this.currentY = e.clientY; }); + // eslint-disable-next-line arrow-parens this.headerDiv.addEventListener('mouseup', (e) => { this.isResizing = false; }); + // eslint-disable-next-line arrow-parens window.addEventListener('mousemove', (e) => { if (!this.isResizing) { return; @@ -128,7 +131,7 @@ export class BPMNPropertyPanel extends AbstractUIExtension implements SelectionL this.currentY = e.clientY; // if the mouse is no longer within the diagram plane, we stop the resizing - if (parent && !parent.matches(":hover")) { + if (parent && !parent.matches(':hover')) { this.isResizing = false; } }); @@ -210,7 +213,10 @@ export class BPMNPropertyPanel extends AbstractUIExtension implements SelectionL this.actionDispatcher.requestUntil(requestAction).then(response => { if (SetContextActions.is(response)) { this.actionDispatcher.dispatch( - SetUIExtensionVisibilityAction.create({ extensionId: BPMNPropertyPanel.ID, visible: !this.editorContext.isReadonly }) + SetUIExtensionVisibilityAction.create({ + extensionId: BPMNPropertyPanel.ID, + visible: !this.editorContext.isReadonly + }) ); } }); @@ -265,7 +271,6 @@ export class BPMNPropertyPanel extends AbstractUIExtension implements SelectionL } // set new selectionId this.selectedElementId = element.id; - console.log('======== > setup new property panel - selectionID=' + element.id); // because the jsonForms send a onchange event after init we mark this state here this.initForm = true; // update header @@ -298,6 +303,7 @@ export class BPMNPropertyPanel extends AbstractUIExtension implements SelectionL ]; // render JSONForm // vanillaRenderers + // we also set the key to the current elementID to reinitialize the form panel this.panelContainer.render(<JsonForms data={bpmnPropertiesData} schema={bpmnPropertiesSchema} @@ -305,6 +311,7 @@ export class BPMNPropertyPanel extends AbstractUIExtension implements SelectionL cells={vanillaCells} renderers={bpmnRenderers} onChange={({ errors, data }) => this.setState({ data })} + key={this.selectedElementId} />); } } else { diff --git a/open-bpmn.glsp-client/workspace/test.bpmn b/open-bpmn.glsp-client/workspace/test.bpmn index 08cb4000..7128fcd7 100644 --- a/open-bpmn.glsp-client/workspace/test.bpmn +++ b/open-bpmn.glsp-client/workspace/test.bpmn @@ -6,6 +6,9 @@ <bpmn2:documentation id="documentation_M0zeWA"/> <bpmn2:conditionalEventDefinition expression="b c d" id="conditionalEventDefinition_SHfHiA" language="72"/> </bpmn2:startEvent> + <bpmn2:manualTask id="task_2yKjyg" name="Task-1"> + <bpmn2:documentation id="documentation_5jrNVg"/> + </bpmn2:manualTask> </bpmn2:process> <bpmndi:BPMNDiagram id="BPMNDiagram_1" name="OpenBPMN Diagram"> <bpmndi:BPMNPlane bpmnElement="process_1" id="BPMNPlane_1"> @@ -15,6 +18,9 @@ <dc:Bounds height="14.0" width="100.0" x="110.0" y="129.0"/> </bpmndi:BPMNLabel> </bpmndi:BPMNShape> + <bpmndi:BPMNShape bpmnElement="task_2yKjyg" id="BPMNShape_BpJQRQ"> + <dc:Bounds height="50.0" width="110.0" x="256.0" y="86.0"/> + </bpmndi:BPMNShape> </bpmndi:BPMNPlane> </bpmndi:BPMNDiagram> </bpmn2:definitions>