DistortableImageOverlay events not firing reliably in React (image not draggable, load not triggered)

[G4mingEdition]

Describe the bug:
When adding images dynamically inside a React application, DistortableImageOverlay behaves inconsistently the image is sometimes not selectable.

Expected behavior:
All events should consistently fire and the image should always be selectable.

Reproduce the behavior:

1. Use React (18.3.1) + Leaflet (1.9.4) + leaflet-distortableimage (latest).
2. Dynamically add images using:

this.backgroundImagesLayer = L.distortableCollection();
...

this.map.whenReady(() => {
  const bgImg = L.distortableImageOverlay(url, {
    mode: 'scale',
    actions: [L.ScaleAction, L.RotateAction],
    selected: true,
  });
  
  this.backgroundImagesLayer.addLayer(bgImg); // 
  
  const init = () => {
    const el = bgImg.getElement();
    if (!el) return requestAnimationFrame(init);
  
    L.DomEvent.on(el, 'load', () => { // Working
        L.DomEvent.on(el, 'click', () => console.log('clicked')); // Not working sometimes
        bgImg.on('dragstart', () => console.log('dragstarted')); // Not working sometimes
    });
  };
  
  requestAnimationFrame(init);
});

3. Reload the page several times.
4. Observe that:
   • Sometimes the image is selectable.
   • Sometimes it is not.
   • The img fires "load" event.

Browser, versions and operating system:

• Browser: Chrome (latest)
• Versions: React 18.3.1, Leaflet 1.9.4
• OS: Windows 11

Additional notes:
I also tried explicitly importing the files in several ways, including:

import L from 'leaflet';
import 'leaflet-distortableimage';
import 'leaflet-distortableimage/dist/vendor.js';
import 'leaflet-distortableimage/dist/leaflet.distortableimage.css';

and also:

import L from 'leaflet';
import 'leaflet-distortableimage/dist/leaflet.distortableimage.js';
import 'leaflet-distortableimage/dist/vendor.js';
import 'leaflet-distortableimage/dist/leaflet.distortableimage.css';

The behavior remains the same: sometimes images never become selectable and Interaction/editing events fire inconsistently.

[saurabh24thakur]

I see this issue is currently unassigned. I have reviewed the requirements and would like to work on this. Please assign it to me so I can begin a Pull Request.