Add label to custom elements

Hi everyone,

I’m currently working on a custom modeler based on the camunda-modeler and I need to add a label to one of my custom element. It should act just like a task’s label.

Pizza%20topping

The orange-ish element is my custom element and I need to add a label to it just like the task I was editing in this presentation.

Any hints ? :smiley:

You’d need to implement a LabelEditingProvider to make this work.

Thank you for your answer, I’ll try this out. :slight_smile:

I managed to successfully implement LabelEditingProvider, but I’m actually facing an issue.
I implemented a Modeling to edit the name property of my custom element when the label editing is finished.

Here’s the code of my new Modeling class as well as the error I’m getting in the console:

import Modeling from 'bpmn-js/lib/features/modeling/Modeling';

import IdsmUpdateLabelHandler from '../label-editing/cmd/IdsmUpdateLabelHandler';

export default class IdsmModeling extends Modeling {
  constructor(eventBus, elementFactory, commandStack,
    bpmnRules) {
    super(eventBus, elementFactory, commandStack, bpmnRules);
  }

  getHandlers() {
    let handlers = super.getHandlers();

    handlers['element.updateLabel'] = IdsmUpdateLabelHandler;

    return handlers;
  }

  updateLabel(element, newLabel, newBouns) {
    this._commandStack.execute('element.updateLabel', {

    })
  }
};

IdsmModeling.$inject = [
  'eventBus',
  'elementFactory',
  'commandStack',
  'bpmnRules'
];

24

Was I right to implement a new Modeling class and if I was, do you have an idea of what I did wrong ?

As indicated by the error message it seems like that the two modeling instances are still around and both try to register handlers for the command shape.append.

Make sure you expose your custom Modeling via the name modeling to override the original implementation.

If you have more specific concerns and questions, please share your example on GitHub so we can have a look.

1 Like

Thank you for your answer, I finally figured out that the labels in the index.js files were important.

Hi itisntalex,

I’m facing the same problem. I want to add labels to custom elements too but I can’t figure out how. Could you explain your solution or post it here?