@k.sh/react-visibility-sensor
Version:
Sensor component for React that notifies you when it goes in or out of the window viewport.
3 lines (2 loc) • 15.2 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],t):(e=e||self).VisibilitySensor=t(e.React,e.ReactDOM)}(this,function(e,t){"use strict";function n(e){return(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})(e)}function r(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 o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(e){return(i=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function a(e,t){return(a=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function c(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t;var u=Object.getOwnPropertySymbols,l=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable;var f=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach(function(e){r[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(e){return!1}}()?Object.assign:function(e,t){for(var n,r,o=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(e),i=1;i<arguments.length;i++){for(var a in n=Object(arguments[i]))l.call(n,a)&&(o[a]=n[a]);if(u){r=u(n);for(var c=0;c<r.length;c++)s.call(n,r[c])&&(o[r[c]]=n[r[c]])}}return o},p="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",d=function(){};if("production"!==process.env.NODE_ENV){var y=p,h={};d=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}}}var b=function(e,t,n,r,o){if("production"!==process.env.NODE_ENV)for(var i in e)if(e.hasOwnProperty(i)){var a;try{if("function"!=typeof e[i]){var c=Error((r||"React class")+": "+n+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.");throw c.name="Invariant Violation",c}a=e[i](t,i,r,n,null,y)}catch(e){a=e}if(!a||a instanceof Error||d((r||"React class")+": type specification of "+n+" `"+i+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof a+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),a instanceof Error&&!(a.message in h)){h[a.message]=!0;var u=o?o():"";d("Failed "+n+" type: "+a.message+(null!=u?u:""))}}},v=function(){};function m(){return null}"production"!==process.env.NODE_ENV&&(v=function(e){var t="Warning: "+e;"undefined"!=typeof console&&console.error(t);try{throw new Error(t)}catch(e){}});var g=function(e,t){var n="function"==typeof Symbol&&Symbol.iterator,r="@@iterator";var o="<<anonymous>>",i={array:l("array"),bool:l("boolean"),func:l("function"),number:l("number"),object:l("object"),string:l("string"),symbol:l("symbol"),any:u(m),arrayOf:function(e){return u(function(t,n,r,o,i){if("function"!=typeof e)return new c("Property `"+i+"` of component `"+r+"` has invalid PropType notation inside arrayOf.");var a=t[n];if(!Array.isArray(a)){var u=d(a);return new c("Invalid "+o+" `"+i+"` of type `"+u+"` supplied to `"+r+"`, expected an array.")}for(var l=0;l<a.length;l++){var s=e(a,l,r,o,i+"["+l+"]",p);if(s instanceof Error)return s}return null})},element:function(){return u(function(t,n,r,o,i){var a=t[n];if(!e(a)){var u=d(a);return new c("Invalid "+o+" `"+i+"` of type `"+u+"` supplied to `"+r+"`, expected a single ReactElement.")}return null})}(),instanceOf:function(e){return u(function(t,n,r,i,a){if(!(t[n]instanceof e)){var u=e.name||o,l=function(e){if(!e.constructor||!e.constructor.name)return o;return e.constructor.name}(t[n]);return new c("Invalid "+i+" `"+a+"` of type `"+l+"` supplied to `"+r+"`, expected instance of `"+u+"`.")}return null})},node:function(){return u(function(e,t,n,r,o){if(!s(e[t]))return new c("Invalid "+r+" `"+o+"` supplied to `"+n+"`, expected a ReactNode.");return null})}(),objectOf:function(e){return u(function(t,n,r,o,i){if("function"!=typeof e)return new c("Property `"+i+"` of component `"+r+"` has invalid PropType notation inside objectOf.");var a=t[n],u=d(a);if("object"!==u)return new c("Invalid "+o+" `"+i+"` of type `"+u+"` supplied to `"+r+"`, expected an object.");for(var l in a)if(a.hasOwnProperty(l)){var s=e(a,l,r,o,i+"."+l,p);if(s instanceof Error)return s}return null})},oneOf:function(e){if(!Array.isArray(e))return"production"!==process.env.NODE_ENV&&v("Invalid argument supplied to oneOf, expected an instance of array."),m;return u(function(t,n,r,o,i){for(var u=t[n],l=0;l<e.length;l++)if(a(u,e[l]))return null;var s=JSON.stringify(e);return new c("Invalid "+o+" `"+i+"` of value `"+u+"` supplied to `"+r+"`, expected one of "+s+".")})},oneOfType:function(e){if(!Array.isArray(e))return"production"!==process.env.NODE_ENV&&v("Invalid argument supplied to oneOfType, expected an instance of array."),m;for(var t=0;t<e.length;t++){var n=e[t];if("function"!=typeof n)return v("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+h(n)+" at index "+t+"."),m}return u(function(t,n,r,o,i){for(var a=0;a<e.length;a++){var u=e[a];if(null==u(t,n,r,o,i,p))return null}return new c("Invalid "+o+" `"+i+"` supplied to `"+r+"`.")})},shape:function(e){return u(function(t,n,r,o,i){var a=t[n],u=d(a);if("object"!==u)return new c("Invalid "+o+" `"+i+"` of type `"+u+"` supplied to `"+r+"`, expected `object`.");for(var l in e){var s=e[l];if(s){var f=s(a,l,r,o,i+"."+l,p);if(f)return f}}return null})},exact:function(e){return u(function(t,n,r,o,i){var a=t[n],u=d(a);if("object"!==u)return new c("Invalid "+o+" `"+i+"` of type `"+u+"` supplied to `"+r+"`, expected `object`.");var l=f({},t[n],e);for(var s in l){var y=e[s];if(!y)return new c("Invalid "+o+" `"+i+"` key `"+s+"` supplied to `"+r+"`.\nBad object: "+JSON.stringify(t[n],null," ")+"\nValid keys: "+JSON.stringify(Object.keys(e),null," "));var h=y(a,s,r,o,i+"."+s,p);if(h)return h}return null})}};function a(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t}function c(e){this.message=e,this.stack=""}function u(e){if("production"!==process.env.NODE_ENV)var n={},r=0;function i(i,a,u,l,s,f,d){if(l=l||o,f=f||u,d!==p){if(t){var y=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 y.name="Invariant Violation",y}if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var h=l+":"+u;!n[h]&&r<3&&(v("You are manually calling a React.PropTypes validation function for the `"+f+"` prop on `"+l+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),n[h]=!0,r++)}}return null==a[u]?i?null===a[u]?new c("The "+s+" `"+f+"` is marked as required in `"+l+"`, but its value is `null`."):new c("The "+s+" `"+f+"` is marked as required in `"+l+"`, but its value is `undefined`."):null:e(a,u,l,s,f)}var a=i.bind(null,!1);return a.isRequired=i.bind(null,!0),a}function l(e){return u(function(t,n,r,o,i,a){var u=t[n];return d(u)!==e?new c("Invalid "+o+" `"+i+"` of type `"+y(u)+"` supplied to `"+r+"`, expected `"+e+"`."):null})}function s(t){switch(typeof t){case"number":case"string":case"undefined":return!0;case"boolean":return!t;case"object":if(Array.isArray(t))return t.every(s);if(null===t||e(t))return!0;var o=function(e){var t=e&&(n&&e[n]||e[r]);if("function"==typeof t)return t}(t);if(!o)return!1;var i,a=o.call(t);if(o!==t.entries){for(;!(i=a.next()).done;)if(!s(i.value))return!1}else for(;!(i=a.next()).done;){var c=i.value;if(c&&!s(c[1]))return!1}return!0;default:return!1}}function d(e){var t=typeof e;return Array.isArray(e)?"array":e instanceof RegExp?"object":function(e,t){return"symbol"===e||"Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol}(t,e)?"symbol":t}function y(e){if(null==e)return""+e;var t=d(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}function h(e){var t=y(e);switch(t){case"array":case"object":return"an "+t;case"boolean":case"date":case"regexp":return"a "+t;default:return t}}return c.prototype=Error.prototype,i.checkPropTypes=b,i.PropTypes=i,i};function O(){}var w,k=(function(e){if("production"!==process.env.NODE_ENV){var t="function"==typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103;e.exports=g(function(e){return"object"==typeof e&&null!==e&&e.$$typeof===t},!0)}else e.exports=function(){function e(e,t,n,r,o,i){if(i!==p){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,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return n.checkPropTypes=O,n.PropTypes=n,n}()}(w={exports:{}},w.exports),w.exports),E=function(e,t,n){var r=e.direction,o=e.value;switch(r){case"top":return n.top+o<t.top&&n.bottom>t.bottom&&n.left<t.left&&n.right>t.right;case"left":return n.left+o<t.left&&n.bottom>t.bottom&&n.top<t.top&&n.right>t.right;case"bottom":return n.bottom-o>t.bottom&&n.left<t.left&&n.right>t.right&&n.top<t.top;case"right":return n.right-o>t.right&&n.left<t.left&&n.top<t.top&&n.bottom>t.bottom}};var T=function(u){function l(e){var t,r,a;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,l),r=this,a=i(l).call(this,e),t=!a||"object"!=typeof a&&"function"!=typeof a?c(r):a,o(c(c(t)),"getContainer",function(){return t.props.containment||window}),o(c(c(t)),"addEventListener",function(e,n,r,o){var i;t.debounceCheck||(t.debounceCheck={});var a=function(){i=null,t.check()},c={target:e,fn:o>-1?function(){i||(i=setTimeout(a,o||0))}:function(){clearTimeout(i),i=setTimeout(a,r||0)},getLastTimeout:function(){return i}};e.addEventListener(n,c.fn),t.debounceCheck[n]=c}),o(c(c(t)),"startWatching",function(){t.debounceCheck||t.interval||(t.props.intervalCheck&&(t.interval=setInterval(t.check,t.props.intervalDelay)),t.props.scrollCheck&&t.addEventListener(t.getContainer(),"scroll",t.props.scrollDelay,t.props.scrollThrottle),t.props.resizeCheck&&t.addEventListener(window,"resize",t.props.resizeDelay,t.props.resizeThrottle),!t.props.delayedCall&&t.check())}),o(c(c(t)),"stopWatching",function(){if(t.debounceCheck)for(var e in t.debounceCheck)if(t.debounceCheck.hasOwnProperty(e)){var n=t.debounceCheck[e];clearTimeout(n.getLastTimeout()),n.target.removeEventListener(e,n.fn),t.debounceCheck[e]=null}t.debounceCheck=null,t.interval&&(t.interval=clearInterval(t.interval))}),o(c(c(t)),"check",function(){var e,r,o=t.node;if(!o)return t.state;if(e=function(e){return void 0===e.width&&(e.width=e.right-e.left),void 0===e.height&&(e.height=e.bottom-e.top),e}(t.roundRectDown(o.getBoundingClientRect())),t.props.containment){var i=t.props.containment.getBoundingClientRect();r={top:i.top,left:i.left,bottom:i.bottom,right:i.right}}else r={top:0,left:0,bottom:window.innerHeight||document.documentElement.clientHeight,right:window.innerWidth||document.documentElement.clientWidth};var a=t.props.offset||{};"object"===n(a)&&(r.top+=a.top||0,r.left+=a.left||0,r.bottom-=a.bottom||0,r.right-=a.right||0);var c={top:e.top>=r.top,left:e.left>=r.left,bottom:e.bottom<=r.bottom,right:e.right<=r.right},u=e.height>0&&e.width>0,l=u&&c.top&&c.left&&c.bottom&&c.right;if(u&&t.props.partialVisibility){var s=e.top<=r.bottom&&e.bottom>=r.top&&e.left<=r.right&&e.right>=r.left;"string"==typeof t.props.partialVisibility&&(s=c[t.props.partialVisibility]),l=t.props.minTopValue?s&&e.top<=r.bottom-t.props.minTopValue:s}"string"==typeof a.direction&&"number"==typeof a.value&&(console.warn("[notice] offset.direction and offset.value have been deprecated. They still work for now, but will be removed in next major version. Please upgrade to the new syntax: { %s: %d }",a.direction,a.value),l=E(a,e,r));var f=t.state;return t.state.isVisible!==l&&(f={isVisible:l,visibilityRect:c},t.setState(f),t.props.onChange&&t.props.onChange(l)),f}),t.state={isVisible:null,visibilityRect:{}},t}var s,f,p;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&&a(e,t)}(l,e.Component),s=l,(f=[{key:"componentDidMount",value:function(){this.node=t.findDOMNode(this),this.props.active&&this.startWatching()}},{key:"componentWillUnmount",value:function(){this.stopWatching()}},{key:"componentDidUpdate",value:function(e){this.node=t.findDOMNode(this),this.props.active&&!e.active?(this.setState({isVisible:null,visibilityRect:{}}),this.startWatching()):this.props.active||this.stopWatching()}},{key:"roundRectDown",value:function(e){return{top:Math.floor(e.top),left:Math.floor(e.left),bottom:Math.floor(e.bottom),right:Math.floor(e.right)}}},{key:"render",value:function(){return this.props.children instanceof Function?this.props.children({isVisible:this.state.isVisible,visibilityRect:this.state.visibilityRect}):e.Children.only(this.props.children)}}])&&r(s.prototype,f),p&&r(s,p),l}();return o(T,"defaultProps",{active:!0,partialVisibility:!1,minTopValue:0,scrollCheck:!1,scrollDelay:250,scrollThrottle:-1,resizeCheck:!1,resizeDelay:250,resizeThrottle:-1,intervalCheck:!0,intervalDelay:100,delayedCall:!1,offset:{},containment:null,children:e.createElement("span",null)}),o(T,"propTypes",{onChange:k.func,active:k.bool,partialVisibility:k.oneOfType([k.bool,k.oneOf(["top","right","bottom","left"])]),delayedCall:k.bool,offset:k.oneOfType([k.shape({top:k.number,left:k.number,bottom:k.number,right:k.number}),k.shape({direction:k.oneOf(["top","right","bottom","left"]),value:k.number})]),scrollCheck:k.bool,scrollDelay:k.number,scrollThrottle:k.number,resizeCheck:k.bool,resizeDelay:k.number,resizeThrottle:k.number,intervalCheck:k.bool,intervalDelay:k.number,containment:"undefined"!=typeof window?k.instanceOf(window.Element):k.any,children:k.oneOfType([k.element,k.func]),minTopValue:k.number}),T});
//# sourceMappingURL=visibility-sensor.min.js.map