Customized xml tags

[Naveen_Kumar]

How to create our own customized tags similar to camunda connector tags ?

<bpmn:serviceTask id=“Activity_0uvaugq” name=“Get User Details”>
< bpmn:extensionElements>
< camunda:connector>
< camunda:inputOutput>
< camunda:inputParameter name=“headers”>
< camunda:map>
< camunda:entry key=“Authorization”>Token</camunda:entry>
<camunda:entry key=“Content-Type”>application/json</camunda:entry>
</camunda:map>
</camunda:inputParameter>
<camunda:inputParameter name=“method”>GET</camunda:inputParameter>
<camunda:inputParameter name=“url”>https://abcd.com</camunda:inputParameter>
<camunda:outputParameter name=“GetUserStatuscode”>statusCode</camunda:outputParameter>
<camunda:outputParameter name=“GetUserDetailsResp”>response</camunda:outputParameter>
</camunda:inputOutput>
< camunda:connectorId>http-connector</camunda:connectorId>
</camunda:connector>
</bpmn:extensionElements>

[maxtru]

Hi @Naveen_Kumar ,

could you please explain your use case a bit more elaborate?

In principle:

• Per XML / BPMN Standard you can simply add a nameSpace in the bpmn:definitions element and then use respective elements in the XML.
• If you want to use custom elements in bpmn-js, then you need to extend the Model. A full example of how to do this, can be found here => GitHub - bpmn-io/bpmn-js-example-model-extension: An example of creating a model extension for bpmn-js

Regards
Max

[Naveen_Kumar]

Hi @maxtru,

Actually I’m trying to customize properties panel, so if the user selects serviceTask, on the properties panel we give options for the user to select any one of the operations (as shared in the below picture).

Now when the user selects any of the options/operations, I need to get the value and parse those in the below format dynimically (similar to camunda XML)

Note: No other input fields in the properties panel

   <bpmn:serviceTask id="Activity_0uvaugq" name="Get User Details">
  <bpmn:extensionElements>
    <custom:connector>
      <custom:inputOutput>
        <custom:inputParameter name="headers">
          <custom:map>
            <custom:entry key="Authorization">token</custom:entry>
            <custom:entry key="Content-Type">application/json</custom:entry>
          </custom:map>
        </custom:inputParameter>
        <custom:inputParameter name="method">GET</custom:inputParameter>
        <custom:inputParameter name="url">https://API.com</custom:inputParameter>
        <custom:outputParameter name="GetUserStatuscode">statusCode</custom:outputParameter>
        <custom:outputParameter name="GetUserDetailsResp">response</custom:outputParameter>
      </custom:inputOutput>
      <custom:connectorId>http-connector</custom:connectorId>
    </custom:connector>
  </bpmn:extensionElements>
  <bpmn:incoming>Flow_1nvf6dd</bpmn:incoming>
  <bpmn:outgoing>Flow_0lhgmxy</bpmn:outgoing>
</bpmn:serviceTask>

[maxtru]

In your example you use the custom namespace, but the elements are exactly the same structure as the camunda Connectors right? Example:

    <bpmn:serviceTask id="Activity_0fhhd05">
      <bpmn:extensionElements>
        <camunda:connector>
          <camunda:inputOutput>
            <camunda:inputParameter name="Input_3ie85hq">
              <camunda:map>
                <camunda:entry key="asdf">foobar</camunda:entry>
              </camunda:map>
            </camunda:inputParameter>
          </camunda:inputOutput>
        </camunda:connector>
      </bpmn:extensionElements>
    </bpmn:serviceTask>

So in case you just want a drop-down in the properties panel to configure camunda properties, you could check whether element templates are sufficient for you. With element templates you can - without coding - customize the configuration of specific elements in the properties panel.

If element templates are not sufficient for you, you can take a look into the properties panel extension example to learn how to add custom entries in the properites panel.

Again, if you want to have a custom namespace (and custom attributes or elements), you would additionally need to follow the model extension example