diff options
| author | 2023-11-03 21:13:33 +0800 | |
|---|---|---|
| committer | 2023-11-03 21:13:33 +0800 | |
| commit | 9f0d43fe099a95ab1516ae951dcb60a89e76a5a5 (patch) | |
| tree | 51614fe47bff8bb11028a07d4a35c34c9ff6594a /docs/components/usePrefersReducedMotion.tsx | |
| parent | 8f135707d069c900e055dae71e69909d6b9a41bb (diff) | |
| download | HydroRoll-9f0d43fe099a95ab1516ae951dcb60a89e76a5a5.tar.gz HydroRoll-9f0d43fe099a95ab1516ae951dcb60a89e76a5a5.zip | |
chore: delete useless codes
Diffstat (limited to 'docs/components/usePrefersReducedMotion.tsx')
| -rw-r--r-- | docs/components/usePrefersReducedMotion.tsx | 44 |
1 files changed, 0 insertions, 44 deletions
diff --git a/docs/components/usePrefersReducedMotion.tsx b/docs/components/usePrefersReducedMotion.tsx deleted file mode 100644 index dd9d82c..0000000 --- a/docs/components/usePrefersReducedMotion.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import { useState, useEffect } from "react"; - -const QUERY = "(prefers-reduced-motion: no-preference)"; -const isRenderingOnServer = typeof window === "undefined"; -/** - * All code here from https://www.joshwcomeau.com/snippets/react-hooks/use-prefers-reduced-motion/ - */ -const getInitialState = () => { - // For our initial server render, we won't know if the user - // prefers reduced motion, but it doesn't matter. This value - // will be overwritten on the client, before any animations - // occur. - return isRenderingOnServer ? true : !window.matchMedia(QUERY).matches; -}; - -/** - * Checks the user's device setting for `prefers-reduced-motion`. - * Use this if you can't use a media query in CSS. - * - * From https://www.joshwcomeau.com/snippets/react-hooks/use-prefers-reduced-motion/ - */ -export function usePrefersReducedMotion(): boolean { - const [prefersReducedMotion, setPrefersReducedMotion] = - useState(getInitialState); - useEffect(() => { - const mediaQueryList = window.matchMedia(QUERY); - const listener = (event: MediaQueryListEvent) => { - setPrefersReducedMotion(!event.matches); - }; - if (mediaQueryList.addEventListener) { - mediaQueryList.addEventListener("change", listener); - } else { - mediaQueryList.addListener(listener); - } - return () => { - if (mediaQueryList.removeEventListener) { - mediaQueryList.removeEventListener("change", listener); - } else { - mediaQueryList.removeListener(listener); - } - }; - }, []); - return prefersReducedMotion; -} |
