How to overwrite panel


I have a form design component, and will use it to generates the form.

So I want overwrite the “Forms tab” in properties panel, and the other tabs will use default.

How to do it?

Thanks! :slight_smile:

What have you already done to achieve this? Where are you stuck? Have you made yourself familiar with how the properties panel is structured?

Hello philippfromme,

Thanks for reply! :slight_smile:

I am finished it, but instead of extended and overwrite, it is replace. like follow:


// ...other code
import CamundaPropertiesProvider from "bpmn-js-properties-panel/lib/provider/camunda/CamundaPropertiesProvider";

function MyFormPropertiesProvider(eventBus, bpmnFactory, elementRegistry, elementTemplates, translate) {, eventBus);

  var camundaProvider = new CamundaPropertiesProvider(eventBus, bpmnFactory, elementRegistry, elementTemplates, translate);
  this.getTabs = function (element) {
    var results = camundaProvider.getTabs(element);
    var myFormTab = {
      id: 'forms',
      label: 'Forms',
      groups: createMyFormTabGroups(element, elementRegistry)
    results.forEach((item, index) => {
      if ( === 'forms') {
        results.splice(index, 1, myFormTab);
    return results;


import MyFormPropertiesProvider from './MyFormPropertiesProvider';

export default {
  __depends__: [
  __init__: [ 'propertiesProvider' ],
  propertiesProvider: [ 'type', MyFormPropertiesProvider ]

I only found this.
Do you have others?

Thanks! :slight_smile: