source: imaps-frontend/node_modules/react-use/lib/useMedia.js@ d565449

main
Last change on this file since d565449 was d565449, checked in by stefan toskovski <stefantoska84@…>, 4 weeks ago

Update repo after prototype presentation

  • Property mode set to 100644
File size: 1.5 KB
RevLine 
[d565449]1"use strict";
2Object.defineProperty(exports, "__esModule", { value: true });
3var react_1 = require("react");
4var util_1 = require("./misc/util");
5var getInitialState = function (query, defaultState) {
6 // Prevent a React hydration mismatch when a default value is provided by not defaulting to window.matchMedia(query).matches.
7 if (defaultState !== undefined) {
8 return defaultState;
9 }
10 if (util_1.isBrowser) {
11 return window.matchMedia(query).matches;
12 }
13 // A default value has not been provided, and you are rendering on the server, warn of a possible hydration mismatch when defaulting to false.
14 if (process.env.NODE_ENV !== 'production') {
15 console.warn('`useMedia` When server side rendering, defaultState should be defined to prevent a hydration mismatches.');
16 }
17 return false;
18};
19var useMedia = function (query, defaultState) {
20 var _a = react_1.useState(getInitialState(query, defaultState)), state = _a[0], setState = _a[1];
21 react_1.useEffect(function () {
22 var mounted = true;
23 var mql = window.matchMedia(query);
24 var onChange = function () {
25 if (!mounted) {
26 return;
27 }
28 setState(!!mql.matches);
29 };
30 mql.addEventListener('change', onChange);
31 setState(mql.matches);
32 return function () {
33 mounted = false;
34 mql.removeEventListener('change', onChange);
35 };
36 }, [query]);
37 return state;
38};
39exports.default = useMedia;
Note: See TracBrowser for help on using the repository browser.