Hi, we have a need to use custom elements within our diagram. One of the feature requests is to embed tiny icons within the SVG of the custom elements and perform various actions depending on which icon is clicked. So if I build my SVG with icons (or even embedded shapes) within the SVG that I’m using for the custom element is there a way to detect when a specific icon is clicked. I would even be happy with just knowing the coordinate of the click within my SVG and I can keep a map and know what the user clicked on.
I am not sure whether this is a question specific to our modeling toolkit, but a general question to handle click events of dom elements. Once you know the selector of your custom svg and you ensure it is clickable (by setting css property pointer-events accordingly), it should be easily doable.
I would advise you not to render clickable icons as part of the actual diagram. There is a dedicated feature for that kind of use case: https://github.com/bpmn-io/bpmn-js-examples/tree/master/overlays You can render any HTML into these.