Digamos que tenemos dos div, uno interno y otro externo.

El div interno es responsable del zoom y la panorámica (realizado mediante transformaciones CSS, traducción y escala).

Ahora se pueden agregar nuevos divs al div interno arrastrando y soltando. Los eventos de caída son aceptados por el div externo

Ahora, durante el evento de caída obtienes la posición del clienteX, clienteY, ahora usando esto encuentras la posición de caída correcta en relación con la división interna.

aquí hay una posible solución (pero la posición final se ha desplazado cuando se hace zoom)

handleDrop = (e) => {

  const canvasContainerRect = outerDivBoundingRect()
  // const canvasRect = innerDivBoundingRect()

  let finalPosition = { 
            x: (e.clientX - canvasContainerRect.left  - translateX) / zoom,
            y: (e.clientY - canvasContainerRect.top - translateY) / zoom,
        }

  console.log("final: ", finalPosition)
}