From aded49f65b09fc06ad07831df527da017e75bcec Mon Sep 17 00:00:00 2001 From: Samuel Newman Date: Thu, 16 May 2024 12:01:26 +0100 Subject: [PATCH] Implement prefersReducedMotion on native (#4039) * implement prefersReducedMotion on native * just take the function from the reanimated source * use patch-package to export internal function --- patches/react-native-reanimated+3.6.0.patch | 30 +++++++++++++++++++++ src/platform/detection.ts | 6 ++--- 2 files changed, 32 insertions(+), 4 deletions(-) create mode 100644 patches/react-native-reanimated+3.6.0.patch diff --git a/patches/react-native-reanimated+3.6.0.patch b/patches/react-native-reanimated+3.6.0.patch new file mode 100644 index 00000000..093d83e4 --- /dev/null +++ b/patches/react-native-reanimated+3.6.0.patch @@ -0,0 +1,30 @@ +diff --git a/node_modules/react-native-reanimated/lib/module/reanimated2/index.js b/node_modules/react-native-reanimated/lib/module/reanimated2/index.js +index 91e49f4..c10d3fc 100644 +--- a/node_modules/react-native-reanimated/lib/module/reanimated2/index.js ++++ b/node_modules/react-native-reanimated/lib/module/reanimated2/index.js +@@ -45,4 +45,5 @@ export { getUseOfValueInStyleWarning } from './pluginUtils'; + export { withReanimatedTimer, advanceAnimationByTime, advanceAnimationByFrame, setUpTests, getAnimatedStyle } from './jestUtils'; + export { LayoutAnimationConfig } from './component/LayoutAnimationConfig'; + export { startMapper, stopMapper } from './mappers'; ++export { isReducedMotion } from './PlatformChecker'; + //# sourceMappingURL=index.js.map +\ No newline at end of file +diff --git a/node_modules/react-native-reanimated/lib/typescript/reanimated2/index.d.ts b/node_modules/react-native-reanimated/lib/typescript/reanimated2/index.d.ts +index 96bd913..ad63a09 100644 +--- a/node_modules/react-native-reanimated/lib/typescript/reanimated2/index.d.ts ++++ b/node_modules/react-native-reanimated/lib/typescript/reanimated2/index.d.ts +@@ -33,3 +33,4 @@ export type { Adaptable, AdaptTransforms, AnimateProps, AnimatedProps, AnimatedT + export type { AnimatedScrollViewProps } from './component/ScrollView'; + export type { FlatListPropsWithLayout } from './component/FlatList'; + export { startMapper, stopMapper } from './mappers'; ++export { isReducedMotion } from './PlatformChecker'; +diff --git a/node_modules/react-native-reanimated/src/reanimated2/index.ts b/node_modules/react-native-reanimated/src/reanimated2/index.ts +index 096dc05..38fc01d 100644 +--- a/node_modules/react-native-reanimated/src/reanimated2/index.ts ++++ b/node_modules/react-native-reanimated/src/reanimated2/index.ts +@@ -271,3 +271,4 @@ export type { + export type { AnimatedScrollViewProps } from './component/ScrollView'; + export type { FlatListPropsWithLayout } from './component/FlatList'; + export { startMapper, stopMapper } from './mappers'; ++export { isReducedMotion } from './PlatformChecker'; +\ No newline at end of file diff --git a/src/platform/detection.ts b/src/platform/detection.ts index de4dfc07..fffde1be 100644 --- a/src/platform/detection.ts +++ b/src/platform/detection.ts @@ -1,4 +1,5 @@ import {Platform} from 'react-native' +import {isReducedMotion} from 'react-native-reanimated' import {getLocales} from 'expo-localization' import {dedupArray} from 'lib/functions' @@ -20,7 +21,4 @@ export const deviceLocales = dedupArray( .filter(code => typeof code === 'string'), ) as string[] -export const prefersReducedMotion = - isWeb && - // @ts-ignore we know window exists -prf - !global.window.matchMedia('(prefers-reduced-motion: no-preference)')?.matches +export const prefersReducedMotion = isReducedMotion()