docs/src/hooks/useMediaQuery.ts at patch-1 · hmmhmmhm/docs

Repository navigation

import { useEffect, useState, useMemo } from "react";

const window !== "undefined" && window.matchMedia != null;

export const useMediaQuery = (query: string): boolean => {

const mediaQuery: MediaQueryList | null = useMemo(

() => (onBrowser ? window.matchMedia(query) : null),

[query],

);

const [value, setValue] = useState(mediaQuery?.matches);

useEffect(() => {

const handler = () => {

setValue( 3569 mediaQuery?.matches);

};

mediaQuery?.addListener(handler);

return () => mediaQuery?.removeListener(handler);

}, [mediaQuery]);

return value ?? false;

};