feat: add ability to reverse the horizontal image rotation direction

[audipasuatmadi]

Motivation

Some image just don't start from a certain direction. This caused dragging image doesn't feel natural. I could rename the image to a certain direction of course, but I feel we could add improvement to the library instead!

Result:

https://github.com/user-attachments/assets/72d159d2-51cd-457c-8030-82aae282d053

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-image-turntable	❌ Failed (Inspect)			Jun 29, 2025 2:05am

[audipasuatmadi]

Hi @nerdyman, thank you very much for your open-source project here. I really appreciate it and it helped a lot. I have made a PR here to simply allow reversing the direction of the rotation (I may be bad on variable names!) Please have a look, I hope this PR helps.

[nerdyman]

Thanks for your work @audipasuatmadi, what's the use case for this? Is it an RTL reading direction thing?

[audipasuatmadi]

Hi @nerdyman, I'm sorry I'm late to see your comment. I'm glad you take notice. I'll explain it as much as I can.

The use case is if the images ordering is reversed. Suppose we took an image of an object from the opposite direction. In the BMW car example this repo has above, suppose the image name is in reverse (clockwise, as opposed to the counter-clockwise behavior of the default code), without this feature, we have to: Rename each and every image to reverse it in another direction, so the drag feels natural. This PR solves that problem. I hope that makes sense.

[nerdyman]

Thanks @audipasuatmadi. I'm not if I follow. I think the keyboard nav would also need to be flipped in order for this to behave consistently.

V4 is introducing an autoRotate.counterClockwise #31 property so instead of reverseHorizontal this prop could be called counterClockwise.

I'm not sure if this is needed though, could the array not be reversed using Array.reverse?

E.g.

const images ['1.jpg', '2.jpg', '3.jpg'].reverse();