feat(hooks): useMotionPreference for reduce motion respect (no test - jest preset conflicts with mocking react-native)
This commit is contained in:
1 parent
48918e7156
commit
ea70ecbaa4
1 file changed
+29
@@ -0,0 +1,29 @@
|
|||||||
|
import { useEffect, useState } from 'react';
|
||||||
|
import { AccessibilityInfo } from 'react-native';
|
||||||
|
|
||||||
|
export type MotionPreferenceListener = (reduceMotion: boolean) => void;
|
||||||
|
|
||||||
|
export function useMotionPreference(): boolean {
|
||||||
|
const [reduceMotion, setReduceMotion] = useState(false);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
let mounted = true;
|
||||||
|
AccessibilityInfo.isReduceMotionEnabled()
|
||||||
|
.then((value) => {
|
||||||
|
if (mounted) setReduceMotion(value);
|
||||||
|
})
|
||||||
|
.catch(() => undefined);
|
||||||
|
|
||||||
|
const listener: MotionPreferenceListener = (value) => {
|
||||||
|
if (mounted) setReduceMotion(value);
|
||||||
|
};
|
||||||
|
AccessibilityInfo.addEventListener('reduceMotionChanged', listener);
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
mounted = false;
|
||||||
|
AccessibilityInfo.removeEventListener('reduceMotionChanged', listener);
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return reduceMotion;
|
||||||
|
}
|
||||||
Reference in new issue
Block a user