attach event handler to dynamic custom node created using addNodes()

[sefgit]

I have custom node that emit custom event, which I would like to handle using a function defined inside a parent component that creates this custom node using addNodes().

Following modified code taken from the Drag&Drop example:

function onCustomEvent(params) {
    /* custom event handler in parent component */
   console.log(params);
}

function onDrop(event) {
  const position = screenToFlowCoordinate({
      x: event.clientX,
      y: event.clientY,
  })

const nodeId = getId()

const newNode = {
  id: nodeId,
  type: draggedType.value,
  position,
  data: { label: nodeId },
  
  /* how can I add custom event handler ? */
  on: { customEvent: onCustomEvent, }, // FIXME
}

/**
 * Align node position after drop, so it's centered to the mouse
 *
 * We can hook into events even in a callback, and we can remove the event listener after it's been called.
 */
const { off } = onNodesInitialized(() => {
  updateNode(nodeId, (node) => ({
    position: { x: node.position.x - node.dimensions.width / 2, y: node.position.y - node.dimensions.height / 2 },
  }))

  off()
})

addNodes(newNode)

}

Thank you for your time and effort.