react-only/lib/react-only.modern.js

🔍 <Only /> displays some contents for a specific screen size

import{createContext as n,createElement as r,useState as t,useLayoutEffect as e,useContext as i,useMemo as a,Fragment as o,Children as c}from"react";function u(){return(u=Object.assign||function(n){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var e in t)Object.prototype.hasOwnProperty.call(t,e)&&(n[e]=t[e])}return n}).apply(this,arguments)}function f(n,r){if(null==n)return{};var t,e,i={},a=Object.keys(n);for(e=0;e<a.length;e++)r.indexOf(t=a[e])>=0||(i[t]=n[t]);return i}var l=["em","ex","%","px","cm","mm","in","pt","pc","ch","rem","vh","vw","vmin","vmax"],s=["width","height"],p=function(n){return Object.keys(n).reduce((function(r,t){var e=n[t];if(!Array.isArray(e)||e.length<=1)return r;var i,a,o=e[0],c=e[1],u=e[2],f=e.slice(3);if(f.length>0){var p=new Error('The following fields "'+f+'" have been ignored');console.error(p)}if("number"!=typeof o||"number"!=typeof c)return r;"string"==typeof u?i=u:"object"==typeof u&&(a=u.direction,i=u.unit);var v=Math.min(o,c),d=Math.max(o,c),h=i&&l.includes(i)?i:"px",m=a&&s.includes(a)?a:"width";return r[t]=[v,d,h,m],r[t+"Up"]=[v,Infinity,h,m],r[t+"Down"]=[0,d,h,m],r}),{})},v={xs:[0,575,"px"],sm:[576,767,"px"],md:[768,991,"px"],lg:[992,1199,"px"],xl:[1200,Infinity,"px"]},d=n(p(v)),h=function(n){var t=n.breakpoints,e=n.additionalBreakpoints,i=n.children;return r(d.Provider,{value:p(u({},void 0===t?v:t,{},void 0===e?{}:e))},i)};h.displayName="BreakpointsProvider";var m=function(n,r){void 0===r&&(r=!1);var t,e=[],i=n[0],a=n[1],o=n[2],c=n[3];return 0!==i&&(t=""+i+o,r&&(t="calc("+t+" + 1px)"),e.push("(min-"+c+":"+t+")")),Infinity!==a&&(t=""+a+o,r&&(t="calc("+t+" - 1px)"),e.push("(max-"+c+":"+t+")"))," "+e.join(" and ")},y=function(n){var r=t(void 0),i=r[0],a=r[1];return e((function(){if(n){var r=matchMedia(n);a(r.matches);var t=function(n){a(n.matches)};return r.addListener(t),function(){r.removeListener(t)}}}),[n]),i},x=function(n,r){var t=i(d),e=a((function(){return function(n){return function(r,t){if(void 0===r&&(r=""),!r)return"";var e=r.split(" "),i=e.map((function(r){return n[r]})).filter(Boolean).map((function(n){return m(n,t)})).filter(Boolean).join(",");if(!i){var a=1===e.length;console.error('"'+e.join('", "')+'" '+(a?"is":"are")+"n't "+(a?"a ":"")+"valid breakpoint"+(a?"":"s"))}return i}}(t)}),[t]),o=a((function(){return e(n,r)}),[e,n,r]);return y(o)};function b(n){var t=n.matchMedia,e=n.on,i=n.strict,a=n.as,c=n.children,u=f(n,["matchMedia","on","strict","as","children"]),l=x(e,i),s=y(t);return l||s?r(a||o,a?u:void 0,c):null}b.displayName="Only";var j=function n(t){if(!t||!t.props)return t;var e=t.props.children;if(!e)return null;var i=c.map(e,n),a=t.props,o=a.only,u=a.matchMedia,l=a.strict,s=f(a,["only","matchMedia","strict"]),p=r(t.type,s,i);return o||u?r(b,{on:o||"",matchMedia:u||"",strict:l},p):p},g=function(n){var t=n.children,e=n.as,i=f(n,["children","as"]),a=c.map(t,j);return e?r(e,i,a):r(o,null,a)};g.displayName="Match";var k=function(n){return function(r){var t={};return Object.keys(r).forEach((function(e){var i=n[e];if(!i)throw new Error(e+" is not a valid breakpoint\nValid breakpoints are: "+Object.keys(n));t["@media "+m(i)]=r[e]})),t}},O=function(n){return function(r){return function n(r){var t="";return Object.entries(r).forEach((function(r){var e=r[0],i=r[1];t+="object"==typeof i?e+" {\n"+n(i)+"}\n":e+": "+i+";\n"})),t}(k(n)(r))}};export{d as BreakpointsContext,h as BreakpointsProvider,g as Match,b as Only,O as toCSS,k as toJSON,x as useOnly,y as useQuery};
//# sourceMappingURL=react-only.modern.js.map