@blockstack/ui/dist/hooks/use-media-query.esm.js

Blockstack UI components built using React and styled-components with styled-system.

import { useState } from 'react';
import './use-controllable.esm.js';
import './use-previous.esm.js';
import './use-disclosure.esm.js';
import './use-latest-ref.esm.js';
import './use-event-listener.esm.js';
import './use-force-update.esm.js';
import './use-id.esm.js';
import './use-merge-refs.esm.js';
import { useSafeLayoutEffect } from './use-safe-layout-effect.esm.js';
import './use-timeout.esm.js';
import './use-theme.esm.js';
import './use-color-mode.esm.js';

var isBrowser = typeof window !== 'undefined';

var isSupported = function isSupported(api) {
  return isBrowser && api in window;
};

function useMediaQuery(query) {
  var _React$useState = useState(function () {
    if (!isSupported('matchMedia')) return false;
    return window.matchMedia(query).matches;
  }),
      matches = _React$useState[0],
      setMatches = _React$useState[1];

  useSafeLayoutEffect(function () {
    if (!isSupported('matchMedia')) return;
    var mediaQueryList = window.matchMedia(query);

    var listener = function listener() {
      return setMatches(mediaQueryList.matches);
    };

    mediaQueryList.addListener(listener);
    listener();
    return function () {
      mediaQueryList.removeListener(listener);
    };
  }, [query]);
  return [matches, setMatches];
}

export { useMediaQuery };
//# sourceMappingURL=use-media-query.esm.js.map