react-socks/dist/index.js

React library to render components only on specific viewports

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports["react-socks"]=t(require("react")):e["react-socks"]=t(e.react)}(this,(function(e){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=8)}([function(e,t,n){e.exports=n(4)()},function(t,n){t.exports=e},function(e,t,n){"use strict";(function(e){Object.defineProperty(t,"__esModule",{value:!0});var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r="undefined"!=typeof window&&void 0!==window.document,o="object"===("undefined"==typeof self?"undefined":n(self))&&self.constructor&&"DedicatedWorkerGlobalScope"===self.constructor.name,i=void 0!==e&&null!=e.versions&&null!=e.versions.node;t.isBrowser=r,t.isWebWorker=o,t.isNode=i}).call(this,n(6))},function(e,t,n){(function(t){var n="Expected a function",r=NaN,o="[object Symbol]",i=/^\s+|\s+$/g,u=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,c=/^0o[0-7]+$/i,f=parseInt,s="object"==typeof t&&t&&t.Object===Object&&t,l="object"==typeof self&&self&&self.Object===Object&&self,p=s||l||Function("return this")(),y=Object.prototype.toString,d=Math.max,h=Math.min,m=function(){return p.Date.now()};function b(e){var t=typeof e;return!!e&&("object"==t||"function"==t)}function v(e){if("number"==typeof e)return e;if(function(e){return"symbol"==typeof e||function(e){return!!e&&"object"==typeof e}(e)&&y.call(e)==o}(e))return r;if(b(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=b(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=e.replace(i,"");var n=a.test(e);return n||c.test(e)?f(e.slice(2),n?2:8):u.test(e)?r:+e}e.exports=function(e,t,r){var o,i,u,a,c,f,s=0,l=!1,p=!1,y=!0;if("function"!=typeof e)throw new TypeError(n);function k(t){var n=o,r=i;return o=i=void 0,s=t,a=e.apply(r,n)}function w(e){var n=e-f;return void 0===f||n>=t||n<0||p&&e-s>=u}function g(){var e=m();if(w(e))return O(e);c=setTimeout(g,function(e){var n=t-(e-f);return p?h(n,u-(e-s)):n}(e))}function O(e){return c=void 0,y&&o?k(e):(o=i=void 0,a)}function j(){var e=m(),n=w(e);if(o=arguments,i=this,f=e,n){if(void 0===c)return function(e){return s=e,c=setTimeout(g,t),l?k(e):a}(f);if(p)return c=setTimeout(g,t),k(f)}return void 0===c&&(c=setTimeout(g,t)),a}return t=v(t)||0,b(r)&&(l=!!r.leading,u=(p="maxWait"in r)?d(v(r.maxWait)||0,t):u,y="trailing"in r?!!r.trailing:y),j.cancel=function(){void 0!==c&&clearTimeout(c),s=0,o=f=i=c=void 0},j.flush=function(){return void 0===c?a:O(m())},j}}).call(this,n(7))},function(e,t,n){"use strict";var r=n(5);function o(){}function i(){}i.resetWarningCache=o,e.exports=function(){function e(e,t,n,o,i,u){if(u!==r){var a=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw a.name="Invariant Violation",a}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:i,resetWarningCache:o};return n.PropTypes=n,n}},function(e,t,n){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t){var n,r,o=e.exports={};function i(){throw new Error("setTimeout has not been defined")}function u(){throw new Error("clearTimeout has not been defined")}function a(e){if(n===setTimeout)return setTimeout(e,0);if((n===i||!n)&&setTimeout)return n=setTimeout,setTimeout(e,0);try{return n(e,0)}catch(t){try{return n.call(null,e,0)}catch(t){return n.call(this,e,0)}}}!function(){try{n="function"==typeof setTimeout?setTimeout:i}catch(e){n=i}try{r="function"==typeof clearTimeout?clearTimeout:u}catch(e){r=u}}();var c,f=[],s=!1,l=-1;function p(){s&&c&&(s=!1,c.length?f=c.concat(f):l=-1,f.length&&y())}function y(){if(!s){var e=a(p);s=!0;for(var t=f.length;t;){for(c=f,f=[];++l<t;)c&&c[l].run();l=-1,t=f.length}c=null,s=!1,function(e){if(r===clearTimeout)return clearTimeout(e);if((r===u||!r)&&clearTimeout)return r=clearTimeout,clearTimeout(e);try{r(e)}catch(t){try{return r.call(null,e)}catch(t){return r.call(this,e)}}}(e)}}function d(e,t){this.fun=e,this.array=t}function h(){}o.nextTick=function(e){var t=new Array(arguments.length-1);if(arguments.length>1)for(var n=1;n<arguments.length;n++)t[n-1]=arguments[n];f.push(new d(e,t)),1!==f.length||s||a(y)},d.prototype.run=function(){this.fun.apply(null,this.array)},o.title="browser",o.browser=!0,o.env={},o.argv=[],o.version="",o.versions={},o.on=h,o.addListener=h,o.once=h,o.off=h,o.removeListener=h,o.removeAllListeners=h,o.emit=h,o.prependListener=h,o.prependOnceListener=h,o.listeners=function(e){return[]},o.binding=function(e){throw new Error("process.binding is not supported")},o.cwd=function(){return"/"},o.chdir=function(e){throw new Error("process.chdir is not supported")},o.umask=function(){return 0}},function(e,t){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(e){"object"==typeof window&&(n=window)}e.exports=n},function(e,t,n){"use strict";n.r(t);var r=n(1),o=n.n(r),i=n(0),u=n.n(i),a=n(2);function c(e){return(c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function f(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}var s=9999,l=new(function(){function e(){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e);this.allBreakpoints=[{xsmall:0},{small:576},{medium:768},{large:992},{xlarge:1200}]}var t,n,r;return t=e,(n=[{key:"getBreakpointName",value:function(e){var t;return this.allBreakpoints.forEach((function(n){var r=Object.keys(n)[0];n[r]<=e&&(t=r)})),t}},{key:"getBreakpointWidth",value:function(e){var t=0;return this.allBreakpoints.forEach((function(n){var r=Object.keys(n)[0];r===e&&(t=n[r])})),t}},{key:"getNextBreakpointWidth",value:function(e){for(var t=9999,n=0,r=0;r<this.allBreakpoints.length;r++){var o=this.allBreakpoints[r];if(Object.keys(o)[0]===e&&(n=r),n>0){var i=n+1;if(this.allBreakpoints.length>i){var u=this.allBreakpoints[i];t=u[Object.keys(u)[0]]}break}}return t}},{key:"shouldRender",value:function(e){var t=e.breakpointName,n=e.modifier,r=e.currentBreakpointName,o=e.currentWidth,i=e.customQuery;if("only"===n){if(t===r)return!0}else if("up"===n){if(o>=this.getBreakpointWidth(t))return!0}else if("down"===n){if(o<this.getNextBreakpointWidth(t))return!0}else if(i)return a.isBrowser&&window.matchMedia(i).matches;return!1}},{key:"getWidthSafely",value:function(){return a.isBrowser&&window?Math.max(document.documentElement.clientWidth,window.innerWidth||0):s}},{key:"currentWidth",get:function(){return this.getWidthSafely()}},{key:"breakpoints",set:function(e){this.allBreakpoints=e}}])&&f(t.prototype,n),r&&f(t,r),e}()),p=l,y=function(e){if(!(e&&"object"===c(e)&&e instanceof Array))throw new Error("setDefaultBreakpoints error: Breakpoints should be an array");e.forEach((function(e){if(!e||"object"!==c(e))throw new Error("setDefaultBreakpoints error: Breakpoints should be an array of objects");if(1!==Object.keys(e).length)throw new Error("setDefaultBreakpoints error: Each breakpoint object should have only one key")})),l.breakpoints=e},d=function(e){return s=e},h=n(3),m=n.n(h);function b(e){return(b="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function v(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function k(e){return(k=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function w(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function g(e,t){return(g=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}var O=o.a.createContext({currentWidth:9999,currentBreakpointName:""}),j=function(e){function t(e){var n;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),n=function(e,t){return!t||"object"!==b(t)&&"function"!=typeof t?w(e):t}(this,k(t).call(this,e));var r=p.currentWidth;return n.state={currentWidth:r,currentBreakpointName:p.getBreakpointName(r)},n.handleResize=m()(n.handleResize.bind(w(n)),100),n}var n,r,i;return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&g(e,t)}(t,e),n=t,(r=[{key:"componentDidMount",value:function(){window.addEventListener("resize",this.handleResize)}},{key:"componentWillUnmount",value:function(){window.removeEventListener("resize",this.handleResize),this.handleResize.cancel()}},{key:"handleResize",value:function(){var e=p.currentWidth;this.setState({currentWidth:e,currentBreakpointName:p.getBreakpointName(e)})}},{key:"render",value:function(){var e=this.props.children,t=this.state,n=t.currentWidth,r=t.currentBreakpointName;return o.a.createElement(O.Provider,{value:{currentWidth:n,currentBreakpointName:r}},e)}}])&&v(n.prototype,r),i&&v(n,i),t}(o.a.Component),T=function(){return o.a.useContext(O).currentWidth},x=function(){return o.a.useContext(O).currentBreakpointName};function B(e){return(B="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function S(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function _(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function E(e){return(E=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function N(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function P(e,t){return(P=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}j.propTypes={children:u.a.node};var W=function(e){function t(e){var n;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),(n=function(e,t){return!t||"object"!==B(t)&&"function"!=typeof t?N(e):t}(this,E(t).call(this,e))).extractBreakpointAndModifierFromProps=n.extractBreakpointAndModifierFromProps.bind(N(n)),n}var n,r,i;return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&P(e,t)}(t,e),n=t,(r=[{key:"extractBreakpointAndModifierFromProps",value:function(e){var t,n,r=e.tagName||"div",o=e.className||"",i=e.style,u=!1;return Object.keys(e).forEach((function(e){"up"===e||"down"===e||"only"===e?n=e:"customQuery"===e?u=!0:"tagName"!==e&&"className"!==e&&"style"!==e&&(t=e)})),"up"!==n&&"down"!==n&&"only"!==n||(u=!1),n||u||(n="only"),{breakpoint:t,modifier:n,tagName:r,className:o,style:i,customQuery:u?e.customQuery:null}}},{key:"render",value:function(){var e=this.props,t=e.children,n=S(e,["children"]),r=this.extractBreakpointAndModifierFromProps(n),i=r.breakpoint,u=r.modifier,a=r.className,c=r.tagName,f=r.style,s=r.customQuery,l=this.context,y=l.currentBreakpointName,d=l.currentWidth;if(!p.shouldRender({breakpointName:i,modifier:u,currentBreakpointName:y,currentWidth:d,customQuery:s}))return null;var h=c;return o.a.createElement(h,{className:"breakpoint__".concat(i,"-").concat(u," ").concat(a),style:f},t)}}])&&_(n.prototype,r),i&&_(n,i),t}(o.a.Component);W.contextType=O,W.propTypes={children:u.a.node,up:u.a.bool,down:u.a.bool,only:u.a.bool,tagName:u.a.string,className:u.a.string,style:u.a.objectOf(u.a.oneOfType([u.a.string,u.a.number])),customQuery:u.a.string},n.d(t,"Breakpoint",(function(){return W})),n.d(t,"BreakpointProvider",(function(){return j})),n.d(t,"setDefaultBreakpoints",(function(){return y})),n.d(t,"setDefaultWidth",(function(){return d})),n.d(t,"useCurrentWidth",(function(){return T})),n.d(t,"useCurrentBreakpointName",(function(){return x}));t.default=W}])}));