You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
23 lines
543 B
23 lines
543 B
import {
|
|
useEffect,
|
|
useState,
|
|
useMemo,
|
|
} from 'react'
|
|
|
|
export const useMediaQuery = (query: string) => {
|
|
const mediaQuery = useMemo(() => matchMedia(query), [query])
|
|
const [queryMatches, setQueryMatches] = useState(mediaQuery.matches)
|
|
|
|
useEffect(() => {
|
|
const listener = (event: MediaQueryListEvent) => {
|
|
setQueryMatches(event.matches)
|
|
}
|
|
mediaQuery.addEventListener('change', listener)
|
|
|
|
return () => {
|
|
mediaQuery.removeEventListener('change', listener)
|
|
}
|
|
}, [mediaQuery])
|
|
|
|
return queryMatches
|
|
}
|
|
|