@dnb/eufemia/cjs/shared/useMediaQuery.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = useMediaQuery;
require("core-js/modules/web.dom-collections.iterator.js");
var _react = _interopRequireWildcard(require("react"));
var _componentHelper = require("./component-helper");
var _Context = _interopRequireDefault(require("./Context"));
var _MediaQueryUtils = require("./MediaQueryUtils");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
const useLayoutEffect = typeof window === 'undefined' ? _react.default.useEffect : _react.default.useLayoutEffect;
function useMediaQuery(props) {
  var _mediaQueryList$curre;
  const context = (0, _react.useContext)(_Context.default);
  const {
    query,
    when,
    not,
    matchOnSSR,
    disabled,
    correctRange = true,
    log
  } = props;
  let matches = (0, _react.useMemo)(() => {
    if (disabled) {
      return false;
    }
    return (0, _componentHelper.isTrue)(matchOnSSR) && !(0, _MediaQueryUtils.isMatchMediaSupported)();
  }, [disabled, matchOnSSR]);
  const mediaQueryList = (0, _react.useRef)((0, _MediaQueryUtils.makeMediaQueryList)({
    query,
    when,
    not
  }, context.breakpoints, {
    disabled,
    correctRange,
    log
  }));
  if ((_mediaQueryList$curre = mediaQueryList.current) !== null && _mediaQueryList$curre !== void 0 && _mediaQueryList$curre.matches) {
    matches = true;
  }
  const [match, matchUpdate] = (0, _react.useState)(matches);
  const listenerRef = (0, _react.useRef)();
  useLayoutEffect(() => {
    if (disabled) {
      return;
    }
    if (typeof listenerRef.current === 'function') {
      var _mediaQueryList$curre2;
      listenerRef.current();
      mediaQueryList.current = (0, _MediaQueryUtils.makeMediaQueryList)({
        query,
        when,
        not
      }, context.breakpoints, {
        disabled,
        correctRange,
        log
      });
      matchUpdate((_mediaQueryList$curre2 = mediaQueryList.current) === null || _mediaQueryList$curre2 === void 0 ? void 0 : _mediaQueryList$curre2.matches);
    }
    listenerRef.current = (0, _MediaQueryUtils.createMediaQueryListener)(mediaQueryList.current, match => matchUpdate(match));
    return listenerRef.current;
  }, [query, when, not, disabled]);
  return Boolean(match);
}
//# sourceMappingURL=useMediaQuery.js.map