Release v4.0.3 adds a reanimated bug

[InkaAlicja]

Describe the bug
v4.0.3 adds a reanimated bug - it reads from value during render. This is prohibited.
Here is the added code causing the issue:
https://github.com/dohooo/react-native-reanimated-carousel/pull/834/files#diff-c662647aa188103a615992880b70f15b01bf0628c1c6568ac66027a6204dd31aR81-R82
https://github.com/dohooo/react-native-reanimated-carousel/pull/834/files#diff-fc926ece907ee027904d9350be1dd410527cbf2e21d9ec4761ce324c5691191bR111-R112

Not sure about this one:
https://github.com/dohooo/react-native-reanimated-carousel/pull/834/files#diff-1809b33deeff2195d46d110a4e8140f0899049cdd83c12450c8f781b8deaaefaR159

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
There should be no errors from reanimated

Screenshots

This shows up on the console after upgrading from v4.0.2 to v4.0.3:

Versions (please complete the following information):

• react: v19.0.0
• react-native: v0.79.5
• react-native-reanimated: v3.17.5
• react-native-reanimated-carousel: v4.0.3
• react-native-gesture-handler: v2.25.0

Smartphone (please complete the following information):

• Device: iPhone 16 (symulator)
• OS: iOS 18.5

Additional context
Add any other context about the problem here.

[dosubot]

Hi @InkaAlicja! I'm Dosu and I’m helping the react-native-reanimated-carousel team.

You’re correct—v4.0.3 introduced a bug where both Basic and Custom PaginationItem components read from animValue.value directly during render, specifically in the accessibilityHint and accessibilityState props. This is prohibited by react-native-reanimated and leads to warnings or errors, as you’ve seen. The problematic code was added in PR #834, which replaced TouchableWithoutFeedback with Pressable and added accessibility props that access the shared value during render. The third code location you mentioned (in src/layouts/normal.ts) is not problematic—it only uses interpolate in a worklet context and does not read shared values during render.

To avoid this issue, shared values should only be accessed inside worklets or hooks like useDerivedValue or useAnimatedStyle, not directly in render or prop logic. Refactoring the accessibility logic so it doesn’t depend on direct shared value access during render will resolve the warning. This pattern is recommended throughout the community and in related issues.

If you need a workaround before an upstream fix, try to avoid using features that trigger the warning, or consider using a different carousel implementation until the library updates its internals to comply with reanimated’s requirements.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}