@react-hook/media-query
Version:
React hooks that update when media queries change between matched and unmatched states.
3 lines (2 loc) • 1.59 kB
JavaScript
function e(e,r){return e.matches[r]=0,e.mediaQueries[r]={},e}function r(r){var t=Object.keys(r);return"undefined"==typeof window?t.reduce(e,{mediaQueries:{},matches:{}}):t.reduce((e,t)=>{var n=window.matchMedia(r[t]);return e.mediaQueries[t]=n,e.matches[t]=n.matches,e},{mediaQueries:{},matches:{}})}function t(e,t){switch(t.type){case"updateMatches":return{matches:Object.keys(e.mediaQueries).reduce((function(r,t){return r[t]=e.mediaQueries[t].matches,r}),{}),mediaQueries:e.mediaQueries};case"setQueries":return r(t.queries)}}function n(e){function n(){return o({type:"updateMatches"})}function a(e){var r=n;return void 0!==e.addListener?e.addListener(r):e.addEventListener("change",r),r}var d=u(e),[m,o]=i(t,e,r);s(()=>{(function(e,r){if(r===e)return 0;var t=Object.values(r),n=Object.values(e);if(t.length!==n.length)return 1;if(t.some((e,r)=>e!==n[r]))return 1;var a=Object.keys(e);return Object.keys(r).some((e,r)=>e!==a[r])})(e,d.current)&&(o({type:"setQueries",queries:e}),d.current=e)},[e]),s(()=>{function e(e,r){void 0!==e.addListener?e.removeListener(t[r]):e.removeEventListener("change",t[r])}var r=Object.values(m.mediaQueries),t=r.map(a);return()=>{r.forEach(e)}},[m.mediaQueries]);var{matches:h}=m,v=c(()=>Object.values(h),[h]);return{matches:h,matchesAny:v.some(Boolean),matchesAll:v.length>0&&v.every(Boolean)}}function a(e){return n(function(e){return void 0===d[e]&&(d[e]={default:e}),d[e]}(e)).matchesAll}import{useRef as u,useReducer as i,useEffect as s,useMemo as c}from"react";var d={};export{n as useMediaQueries,a as useMediaQuery};
//# sourceMappingURL=index.mjs.map