1 | "use strict";
|
2 |
|
3 | exports.__esModule = true;
|
4 | exports.default = useMediaQuery;
|
5 |
|
6 | var _useIsomorphicEffect = _interopRequireDefault(require("./useIsomorphicEffect"));
|
7 |
|
8 | var _react = require("react");
|
9 |
|
10 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
11 |
|
12 | var isBool = function isBool(a) {
|
13 | return typeof a === 'boolean';
|
14 | };
|
15 |
|
16 | var matchers = new Map();
|
17 |
|
18 | var getMatcher = function getMatcher(query) {
|
19 | if (!query || typeof window == 'undefined') return undefined;
|
20 | var mql = matchers.get(query);
|
21 |
|
22 | if (!mql) {
|
23 | mql = window.matchMedia(query);
|
24 | mql.refCount = 0;
|
25 | matchers.set(mql.media, mql);
|
26 | }
|
27 |
|
28 | return mql;
|
29 | };
|
30 |
|
31 |
|
32 |
|
33 |
|
34 |
|
35 |
|
36 |
|
37 |
|
38 |
|
39 |
|
40 |
|
41 |
|
42 |
|
43 |
|
44 |
|
45 |
|
46 |
|
47 |
|
48 |
|
49 |
|
50 | function useMediaQuery(query) {
|
51 | var mql = getMatcher(query);
|
52 |
|
53 | var _useState = (0, _react.useState)(function () {
|
54 | return mql ? mql.matches : false;
|
55 | }),
|
56 | matches = _useState[0],
|
57 | setMatches = _useState[1];
|
58 |
|
59 | (0, _useIsomorphicEffect.default)(function () {
|
60 | var mql = getMatcher(query);
|
61 |
|
62 | if (!mql) {
|
63 | return setMatches(false);
|
64 | }
|
65 |
|
66 | var handleChange = function handleChange() {
|
67 | setMatches(mql.matches);
|
68 | };
|
69 |
|
70 | mql.refCount++;
|
71 | mql.addListener(handleChange);
|
72 | handleChange();
|
73 | return function () {
|
74 | mql.removeListener(handleChange);
|
75 | mql.refCount--;
|
76 |
|
77 | if (mql.refCount <= 0) {
|
78 | matchers.delete(mql.media);
|
79 | }
|
80 |
|
81 | mql = undefined;
|
82 | };
|
83 | }, [query]);
|
84 | return matches;
|
85 | } |
\ | No newline at end of file |