Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3094 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3094 stevensc 1 
import { useLayoutEffect, useState } from 'react'
2 
 
3 
export function useMediaQuery(
4 
  query,
3095 stevensc 5 
  options = { defaultValue: false, initializeWithValue: true }
3094 stevensc 6 
) {
7 
  const getMatches = (query) => {
8 
    return window.matchMedia(query).matches
9 
  }
10 
 
11 
  const [matches, setMatches] = useState(() => {
3095 stevensc 12 
    if (options.initializeWithValue) {
3094 stevensc 13 
      return getMatches(query)
14 
    }
3095 stevensc 15 
    return options.defaultValue
3094 stevensc 16 
  })
17 
 
18 
  // Handles the change event of the media query.
19 
  function handleChange() {
20 
    setMatches(getMatches(query))
21 
  }
22 
 
23 
  useLayoutEffect(() => {
24 
    const matchMedia = window.matchMedia(query)
25 
    handleChange()
26 
 
27 
    matchMedia.addEventListener('change', handleChange)
28 
    return () => {
29 
      matchMedia.removeEventListener('change', handleChange)
30 
    }
31 
  }, [query])
32 
 
33 
  return matches
34 
}