🐛 Fixed bug with MagicTabSelect not animating

* Setting prefersReducedMotion to true by default was messing
  with the `MagicTabSelect` component

packages/react-magic-motion/hooks.tsx

@@ -10,7 +10,7 @@ const PREFERSREDUCEDMOTION = "(prefers-reduced-motion: no-preference)";
  */
 export function usePlaceholderBoxSize(
   isCardExpanded: boolean,
-  rootNode: RefObject<HTMLElement>
+  rootNode: RefObject<HTMLElement>,
 ): { placeholderBoxHeight: number; placeholderBoxWidth: number } {
   const [placeholderBoxDimensions, setPlaceholderBoxDimensions] = useState({
     width: 0,
@@ -49,12 +49,12 @@ export function usePlaceholderBoxSize(
  * Updates the `prefersReducedMotion` state whenever
  * the `prefers-reduced-motion:reduce` option is set
  */
-export function usePrefersReducedMotion() {
-  const [prefersReducedMotion, setPrefersReducedMotion] = useState(true);
+export function usePrefersReducedMotion(): boolean {
+  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);
 
   useEffect(() => {
     const mediaQueryList = window.matchMedia(PREFERSREDUCEDMOTION);
-    if (mediaQueryList) setPrefersReducedMotion(!mediaQueryList.matches);
+    setPrefersReducedMotion(!mediaQueryList.matches);
     const listener = (event: MediaQueryListEvent) => {
       setPrefersReducedMotion(!event.matches);
     };