Customize properties panel from plugin

BPMN & Modeling Discussion & Questions
1

Hello,

I’m currenlty writing a plugin for the camunda modeler and would like to customize the properties panel for bpmn entitites from the plugin itself.

After searching for a bit I discovered that the modeler calls modeler.get('propertiesPanel') to get an instance of properties panel. That instance is then attached to the react component.

What would be the easiest way to modify the properties panel to fit my needs?

Best Regards

2

What modifications do you want to make?

3

Hey,

I solved a part of the problem by myself already. My solution was to inject the propertiesProvider dependency into a module of my plugin and replace its getTabs method to provide my custom tabs.

Right now I’m kind off stuck at figuring out how to customize the input and output fields to only provide the Map datatype and change the prefix of new properties to a custom prefix instead of Input_....

In the bpmn-js-properties-panel module I found a method that creates the Input Parameters entry and I think that maybe modifying the ‘newElement’ method from below would be the solution to the prefixing problem.

 var inputEntry = extensionElementsEntry(element, bpmnFactory, {
    id: idPrefix + 'inputs',
    label: translate('Input Parameters'),
    modelProperty: 'name',
    prefix: 'Input',
    resizable: true,

    createExtensionElement: newElement('camunda:InputParameter', 'inputParameters'),
    removeExtensionElement: removeElement(getInputParameter, 'inputParameters', 'outputParameters'),

    getExtensionElements: function(element) {
      return getInputParameters(element, insideConnector);
    },

    onSelectionChange: function(element, node, event, scope) {
      outputEntry && outputEntry.deselect(element, node);
    },

    setOptionLabelValue: setOptionLabelValue(getInputParameter)

  });

But when I try to add a debugging command or console output into the function returned from newElement I just see no output in console or in the debugger.

Best Regards

4

I also can’t seem to find where the initial data type is set for input and output parameters. If possible I would like to change the default type to map instead of text with my plugin.

I mean, I can find bits and pieces of ‘Text’ in the source code but no actual initial value. Also the initialization seems to be scattered between bpmn-js-properties-panel/lib/provider/camunda/parts/implementation/InputOutput and bpmn-js-properties-panel/lib/provider/camunda/parts/implementation/InputOutputParameter, but I could be wrong on that one.

5