loading attribute of component Image or Avatar doesn't work

[KKzLEO]

Description

I want to add loading attr for Avatar component to have lazy-loading function, but it doesn't work well because the loading attribute doesn't be passed to use-image hook so it still loaded each image in the first time instead of scrolling

at line 34 of avatar-image.tsx

Link to Reproduction

https://codesandbox.io/s/dark-wind-xc0t2m?file=/src/index.js

Steps to reproduce

1. Open dev tool and go to Network tab
2. Filter with image
3. Go to sandbox
4. Comment and uncomment Success or Failure example and see the differences (Remember refresh the whole page cuz cache)
5. You can see the lazyloading function of original img tag works well but Image or Avatar doesn't.

Chakra UI Version

3.2.1

Browser

No response

Operating System

• macOS
• Windows
• Linux

Additional Information

No response

[segunadebayo]

For this case, please use the Img component and pass the loading attribute to it instead.

<Img loading="lazy" rounded="full" />

[KKzLEO]

@segunadebayo it's still not working even using Img component instead.

[KKzLEO]

@segunadebayo could you reopen this issue?