Skip to content

fix(ui): stop passing useAnimatedStyle dependencies on native - #948

Merged
dannyhw merged 1 commit into
nextfrom
dannyhw/fix/reanimated-deps-warning
Nov 12, 2026
Merged

dannyhw merged 1 commit into
nextfrom
dannyhw/fix/reanimated-deps-warning

Conversation

@dannyhw

@dannyhw dannyhw commented Oct 24, 2026 •

Copy link
Copy Markdown
Member

Issue: #943

Stacked on #947, because it reuses that PR's jest setup for @storybook/react-native-ui. It will retarget to next once #947 merges. Only the top commit belongs to this PR.

What I did

MobileAddonsPanel passed a dependency array to useAnimatedStyle. On native, Reanimated 4.6+ ignores it (the worklets plugin captures the closure) and logs [Reanimated] Dependencies should only be used on the web and are always ignored on native on every Storybook launch.

The array is now passed only on web: Platform.OS === 'web' ? [...] : undefined.

  • Native gets undefined, which Reanimated 3.x and 4.x treat exactly like an omitted argument: the dependencies come from the worklet closure instead.
  • Web keeps the array, so behaviour there is unchanged, including web builds without the Babel plugin.
  • Works across the react-native-reanimated >=3 peer range.

The other Reanimated warnings in such a launch come from @gorhom/bottom-sheet's own hooks, so this PR doesn't touch them.

How to test

pnpm -F @storybook/react-native-ui test: the new tests assert useAnimatedStyle gets undefined on iOS and Android and the array on web. On next the native cases fail with Received: [{"value": 0}, 844, 34]. Manually: launch Storybook with react-native-reanimated ≥ 4.6 and check that the warning no longer comes from MobileAddonsPanel.

Fixes #943

@changeset-bot

changeset-bot Bot commented Oct 24, 2026 •

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 8761de7

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 9 packages
Name Type
@storybook/react-native-ui Patch
@storybook/addon-ondevice-actions Patch
@storybook/addon-ondevice-backgrounds Patch
@storybook/addon-ondevice-controls Patch
@storybook/addon-ondevice-notes Patch
@storybook/react-native-theming Patch
@storybook/react-native-ui-common Patch
@storybook/react-native-ui-lite Patch
@storybook/react-native Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@dannyhw
dannyhw force-pushed the dannyhw/fix/reanimated-deps-warning branch from 134ee9b to 590b304 Compare October 24, 2026 13:54
@dannyhw dannyhw changed the title fix(ui): stop passing useAnimatedStyle dependencies fix(ui): stop passing useAnimatedStyle dependencies on native Oct 24, 2026
@dannyhw
dannyhw force-pushed the dannyhw/fix/reanimated-deps-warning branch 2 times, most recently from 4956cc0 to 2345904 Compare November 8, 2026 21:18
@dannyhw
dannyhw added this pull request to stack #963 November 8, 2026 21:24
Base automatically changed from dannyhw/fix/ios-story-list-a11y to next November 8, 2026 21:25
@dannyhw
dannyhw force-pushed the dannyhw/fix/reanimated-deps-warning branch from 2345904 to 0a89bdf Compare November 8, 2026 21:25
Reanimated 4.6+ ignores the dependency array on native, where the
worklets plugin already captures the closure, and warns about it
("Dependencies should only be used on the web"). The array is kept on
web, where it is still used when the worklets babel plugin does not run:
without it a production web build would compute maxHeight only once and
clip the panel on a narrow viewport.

Adds a regression test that renders MobileAddonsPanel and asserts
useAnimatedStyle receives no dependency array on native and the
dependencies on web.

Fixes #943
@dannyhw
dannyhw force-pushed the dannyhw/fix/reanimated-deps-warning branch from 0a89bdf to 8761de7 Compare November 12, 2026 20:05
@dannyhw
dannyhw merged commit 894a300 into next Nov 12, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Reanimated 4 warns "Dependencies should only be used on the web" from MobileAddonsPanel

1 participant