How to use this with react

[vabatta]

Hi,

how can I use this with react?

[andomain]

Hi

I have used this in a React project previously. I don't have access to the code any more as it remains with my former company but I might be able to help.
What are you trying to do? In my experience the best way is to create a React wrapper around the necessary component that stores the state (in this case probably the focused coordinates) and passes any necessary handlers that update this state to the image-focus components.

[vabatta]

Okay, the issue that I am facing is that I cannot 'unmount' the focused image. Once I wrapped my ref with the FocusedImage, I want to be able to return back to the state where my img element is just an img element (no inline styles, no event attached, ...). (img.stopListening is not enough)

[third774]

Gotcha! Sounds like we need to add a .dispose() method?

[vabatta]

Sounds good. I really want to be able to attach and detach the library to an element dynamically.

[mcabs3]

@third774 any update on this? I'd love this feature as well

[mcabs3]

I have addressed this with an initial draft (that I have working) in this PR.

[third774]

FWIW at this point I'd just recommend using object-position.

https://kevinkipp.com/blog/til-object-position/