Sharcoux
RTL Layout Issue with Range Slider
Describe the bug When using @react-native-assets/slider in an RTL (right-to-left) layout, the range value slider behaves incorrectly. The min and max values appear reversed, the thumb positions do not update properly, and interactions feel inverted.
To Reproduce Go to this repo Link Enable RTL in the app (I18nManager.forceRTL(true)). Implement a range slider with two thumbs. Observe that the slider does not behave correctly when adjusting values.
Expected behavior The slider should respect the RTL layout and move logically from right to left. The min and max values should not be swapped unexpectedly. The thumbs should remain correctly positioned when adjusting the range. Screenshots
https://github.com/user-attachments/assets/ee4079e6-0b7d-4738-8cfa-8fc16e2f44d1
Please complete the following information: OS: iOS 18.3, @react-native-assets/slider 2.24.0 Additional context This issue occurs specifically in RTL mode. The problem might be related to how the component calculates positioning for the thumbs in RTL layouts. Attached screen recording demonstrates the issue.
As mentionned in the bug template, please reproduce the issue on this Snack. This will greatly accelerate the time to provide a solution.
@Sharcoux what do you mean about news
i I took the templet from the report bug
thank you
Basically, go to the snack, make the changes required to reproduce the issue and provide the link to the edited snack. This way I can test directly on snack on the 3 environments.
Without a snack reproducing the problem, and as I couldn't reproduce with my attempts, I'll close this. Reopen or open a new subject if you get new information to provide.
@Sharcoux pls take a look to this open repo has the issue https://github.com/omarabualhija/-react-native-assets-slider-RTL-issue/tree/master
as we can not make the device support RTL in the Snack
and u can take a look at the video
Look,, I don't know how to replicate the problem and I don't understand why you can't replicate the issue on Snack. However, if the documentation I've read is accurate and I18nManager.isRTL is working as expected, then the version 11.0.12 should be solving the problem.
