Blog

News from the bpmn.io project

Property Cloning and Modeling Improvements

Published by Philipp Fromme on Wednesday, 08 March 2017.

bpmn-js0.20.0 diagram-js0.19.0

We are happy to announce the latest release of our BPMN toolkit. With this release it's possible to not only copy and paste elements but also their implementation details. Other improvements lead to a better modeling experience and simplify embedding the toolkit in your applications.

The new release allows you to move existing BPMN elements, i.e. Activities onto sequence flows, thereby splitting the flow into two. When dropping a new element onto the canvas, this worked already for a while.

Copy BPMN Implementation Details

In this release we completed the implementation of copying and pasting elements. Known invisible properties will be copied and preserved during morph / replace, if applicable.

The mechanism can be extended, making the Modeler aware of other things to copy/preserve, too. As an example, additional meta-data for Camunda BPMN 2.0 extensions allow bpmn-js to copy Camunda executable properties. Checkout the latest Camunda Modeler to see this in action.

Toolkit Improvements

Thanks to a community contribution you are now able to attach and detach the toolkit to the DOM dynamically. You must now set a mounting container explicitly via the container property or bpmn-js will be created in detached mode.

// create detached
var viewer = new BpmnViewer();

// attach it to some element
viewer.attachTo('#container');

// detach again
viewer.detach();

Starting with this release, labels do not require the toolkit to be attached to the DOM any more for proper layouting. That allows you to import diagrams in detached or hidden viewer/modeler instances.

Some minor bugs, such as the incorrect computation of a labels bounding box should be fixed now, too.

What's Next?

Do you miss an important feature within our BPMN toolkit? Approach us on our forums, tell us what you think and help us shape our roadmap.

As always, get the latest bpmn-js release via npm or bower.