bpmn-js-properties-panel
A simple properties panel for bpmn-js
Last updated 2 months ago by bpmn-io .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install bpmn-js-properties-panel 
SYNC missed versions from official npm registry.

bpmn-js-properties-panel

Build Status

A properties panel extension for bpmn-js that adds the ability to edit technical properties (generic and Camunda).

bpmn-js-properties-panel screenshot

Features

The properties panel allows users to edit invisible BPMN properties in a convenient way.

Some of the features are:

  • Edit element ids, multi-instance details and more
  • Edit execution related Camunda properties
  • Redo and undo (plugs into the bpmn-js editing cycle)

Usage

Provide two HTML elements, one for the properties panel and one for the BPMN diagram:

<div class="modeler">
  <div id="canvas"></div>
  <div id="properties"></div>
</div>

Bootstrap bpmn-js with the properties panel and a properties provider:

var BpmnJS = require('bpmn-js/lib/Modeler'),
    propertiesPanelModule = require('bpmn-js-properties-panel'),
    propertiesProviderModule = require('bpmn-js-properties-panel/lib/provider/bpmn');

var bpmnJS = new BpmnJS({
  additionalModules: [
    propertiesPanelModule,
    propertiesProviderModule
  ],
  container: '#canvas',
  propertiesPanel: {
    parent: '#properties'
  }
});

Dynamic Attach/Detach

You may attach or detach the properties panel dynamically to any element on the page, too:

var propertiesPanel = bpmnJS.get('propertiesPanel');

// detach the panel
propertiesPanel.detach();

// attach it to some other element
propertiesPanel.attachTo('#other-properties');

Use with Camunda properties

In order to be able to edit Camunda related properties, use the camunda properties provider. In addition, you need to define the camunda namespace via camunda-bpmn-moddle.

var BpmnJS = require('bpmn-js/lib/Modeler'),
    propertiesPanelModule = require('bpmn-js-properties-panel'),
    // use Camunda properties provider
    propertiesProviderModule = require('bpmn-js-properties-panel/lib/provider/camunda');

// a descriptor that defines Camunda related BPMN 2.0 XML extensions
var camundaModdleDescriptor = require('camunda-bpmn-moddle/resources/camunda');

var bpmnJS = new BpmnJS({
  additionalModules: [
    propertiesPanelModule,
    propertiesProviderModule
  ],
  container: '#canvas',
  propertiesPanel: {
    parent: '#properties'
  },
  // make camunda prefix known for import, editing and export
  moddleExtensions: {
    camunda: camundaModdleDescriptor
  }
});

...

Additional Resources

Development

Running the tests

npm install

export TEST_BROWSERS=Chrome
npm run all

License

MIT

Current Tags

  • 0.33.2                                ...           latest (2 months ago)

62 Versions

  • 0.33.2                                ...           2 months ago
  • 0.33.1                                ...           6 months ago
  • 0.33.0                                ...           6 months ago
  • 0.32.2                                ...           7 months ago
  • 0.32.1                                ...           9 months ago
  • 0.32.0                                ...           10 months ago
  • 0.31.0                                ...           a year ago
  • 0.30.0                                ...           a year ago
  • 0.29.0                                ...           a year ago
  • 0.28.2                                ...           a year ago
  • 0.28.1                                ...           2 years ago
  • 0.28.0                                ...           2 years ago
  • 0.27.0                                ...           2 years ago
  • 0.26.2                                ...           2 years ago
  • 0.26.1                                ...           2 years ago
  • 0.26.0                                ...           2 years ago
  • 0.25.2                                ...           2 years ago
  • 0.25.1                                ...           2 years ago
  • 0.25.0                                ...           2 years ago
  • 0.24.2                                ...           2 years ago
  • 0.24.1                                ...           2 years ago
  • 0.24.0                                ...           2 years ago
  • 0.23.0                                ...           2 years ago
  • 0.22.1                                ...           2 years ago
  • 0.22.0                                ...           2 years ago
  • 0.21.0                                ...           2 years ago
  • 0.20.0                                ...           2 years ago
  • 0.19.1                                ...           2 years ago
  • 0.19.0                                ...           2 years ago
  • 0.18.5                                ...           2 years ago
  • 0.18.4                                ...           3 years ago
  • 0.18.3                                ...           3 years ago
  • 0.18.2                                ...           3 years ago
  • 0.18.1                                ...           3 years ago
  • 0.18.0                                ...           3 years ago
  • 0.17.0                                ...           3 years ago
  • 0.16.1                                ...           3 years ago
  • 0.16.0                                ...           3 years ago
  • 0.15.0                                ...           3 years ago
  • 0.14.0                                ...           3 years ago
  • 0.13.1                                ...           3 years ago
  • 0.13.0                                ...           3 years ago
  • 0.12.0                                ...           3 years ago
  • 0.11.2                                ...           3 years ago
  • 0.11.1                                ...           3 years ago
  • 0.11.0                                ...           4 years ago
  • 0.10.0                                ...           4 years ago
  • 0.9.0                                ...           4 years ago
  • 0.8.2                                ...           4 years ago
  • 0.8.1                                ...           4 years ago
  • 0.8.0                                ...           4 years ago
  • 0.7.0                                ...           4 years ago
  • 0.6.3                                ...           4 years ago
  • 0.6.2                                ...           4 years ago
  • 0.6.1                                ...           4 years ago
  • 0.6.0                                ...           4 years ago
  • 0.5.0                                ...           4 years ago
  • 0.4.0                                ...           4 years ago
  • 0.3.0                                ...           4 years ago
  • 0.2.1                                ...           5 years ago
  • 0.2.0                                ...           5 years ago
  • 0.1.0                                ...           5 years ago
Downloads
Today 100
This Week 318
This Month 3,210
Last Day 218
Last Week 1,073
Last Month 3,978
Dependencies (6)
Dev Dependencies (26)

Copyright 2014 - 2017 © taobao.org |