react-use-media-query-ts/lib/esm/index.js

React custom hook for match Media queries with Typescript support

import { useState, useEffect } from 'react';

var matchMedia = function (query) {
    return typeof window !== 'undefined' && window.matchMedia(query);
};
function useMediaQuery(query) {
    var _a = useState(function () {
        var mql = matchMedia(query);
        if (!mql) {
            return false;
        }
        return mql.matches;
    }), matches = _a[0], setMatches = _a[1];
    useEffect(function () {
        var mediaQueryList = matchMedia(query);
        var handleChange = function (e) {
            setMatches(e.matches);
        };
        if (!mediaQueryList) {
            return;
        }
        mediaQueryList.addEventListener('change', handleChange);
        return function () {
            mediaQueryList.removeEventListener('change', handleChange);
        };
    }, [query]);
    return matches;
}

export { useMediaQuery as default };
//# sourceMappingURL=index.js.map