Image component should forward ref

[sophiawisdom]

Describe the feature you'd like to request

I would like to be able to use useRef with nextjs/Image. I want to use the Image element to show remote images in a feed and then allow users to click to copy the image with some text over it. In order to do that I need to draw the image to a canvas, and in order to do that I need to have a reference to the htmlImageElement.

Describe the solution you'd like

Ideally nextjs/Image should forward the ref on Image to the underlying . It also wouldn't be unworkable if I could pass a function that would be called with an htmlImageElement when something updates. The important thing is that there's some way to access the underlying element.

Describe alternatives you've considered

As stands we just use an HTML <picture><img> but this sort of sucks because the images resize in weird ways. Additionally, this request is essentially the same as #18398, particularly these comments.

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.