react-within-viewport - npm Package Compare versions

Comparing version 1.2.0 to 1.2.1

dist/bundle.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports.WithinViewport=e(require("react")):t.WithinViewport=e(t.react)}(this,function(t){return function(t){function e(i){if(n[i])return n[i].exports;var r=n[i]={exports:{},id:i,loaded:!1};return t[i].call(r.exports,r,r.exports,e),r.loaded=!0,r.exports}var n={};return e.m=t,e.c=n,e.p="",e(0)}([function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}Object.defineProperty(e,"__esModule",{value:!0});var r=n(1),o=i(r);e.default=o.default},function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function u(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0});var a=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},f=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),c=n(7),d=i(c),l=n(6),s=i(l),p=n(5),h=i(p),v=n(3),w=i(v),y=function(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],e=t.transform,n=void 0===e?function(t){return{inViewport:t}}:e,i=t.containerStyle,l=void 0===i?{width:"100%",height:"100%",padding:0,border:0}:i,p=t.getHeight,v=void 0===p?function(t){return t.getBoundingClientRect().height}:p,y=t.getWidth,g=void 0===y?function(t){return t.getBoundingClientRect().width}:y,m=t.getTop,b=void 0===m?function(t){return t.getBoundingClientRect().top}:m,O=t.getLeft,j=void 0===O?function(t){return t.getBoundingClientRect().left}:O,_=t.getViewportHeight,x=void 0===_?function(t,e){return t.innerHeight||e.clientHeight}:_,T=t.getViewportWidth,V=void 0===T?function(t,e){return t.innerWidth||e.clientWidth}:T,W=t.defaultAnswer,L=void 0===W?!0:W,E=t.wait,R=void 0===E?200:E,H=t.onViewportEnter,M=void 0===H?function(){}:H,S=t.onViewportLeave,C=void 0===S?function(){}:S;return function(t){var e,i;return i=e=function(e){function i(){var t,e,n,u;r(this,i);for(var f=arguments.length,c=Array(f),d=0;f>d;d++)c[d]=arguments[d];return e=n=o(this,(t=Object.getPrototypeOf(i)).call.apply(t,[this].concat(c))),n.state={containerWidth:null,containerHeight:null,containerTopOffset:null,containerLeftOffset:null,windowWidth:null,windowHeight:null,ready:!1},n.updateResize=function(){var t=function(){var t=n.refs.withinViewportContainer,e={containerWidth:g(t),containerHeight:v(t),windowWidth:V(window,document),windowHeight:x(window,document)};n.setState(a({},e,{ready:n.isReady(a({},n.state,e))}))};window.requestAnimationFrame?window.requestAnimationFrame(function(){return t()}):t()},n.updateScroll=function(){var t=function(){var t=n.refs.withinViewportContainer,e={containerTopOffset:b(t),containerLeftOffset:j(t)};n.setState(a({},e,{ready:n.isReady(a({},n.state,e))}))};window.requestAnimationFrame?window.requestAnimationFrame(function(){return t()}):t()},n.isReady=function(){var t=arguments.length<=0||void 0===arguments[0]?n.state:arguments[0];return null!==t.containerWidth&&null!==t.containerHeight&&null!==t.containerTopOffset&&null!==t.containerLeftOffset&&null!==t.windowHeight&&null!==t.windowWidth},n.inViewport=function(){var t=arguments.length<=0||void 0===arguments[0]?n.state:arguments[0];return t.ready?(t.containerTopOffset<0&&t.containerHeight+t.containerTopOffset>0||t.containerTopOffset>=0&&t.containerTopOffset<t.windowHeight)&&(t.containerLeftOffset<0&&t.containerWidth+t.containerLeftOffset>0||t.containerLeftOffset>=0&&t.containerLeftOffset<t.windowWidth):L},u=e,o(n,u)}return u(i,e),f(i,[{key:"componentDidMount",value:function(){window&&window.addEventListener&&(this.debouncedUpdateResize=(0,w.default)(this.updateResize,R),this.debouncedUpdateScroll=(0,w.default)(this.updateScroll,R),window.addEventListener("resize",this.debouncedUpdateResize),window.addEventListener("scroll",this.debouncedUpdateScroll),this.updateResize(),this.updateScroll())}},{key:"componentDidUpdate",value:function(t,e){var n=this.inViewport(e),i=this.inViewport(this.state);null===e.ready&&i===!1&&C(),null===e.ready&&i===!0&&M(),n===!0&&i===!1&&C(),n===!1&&i===!0&&M()}},{key:"componentWillUnmount",value:function(){window&&window.removeEventListener&&(window.removeEventListener("resize",this.debouncedUpdateResize),window.removeEventListener("scroll",this.debouncedUpdateScroll))}},{key:"shouldComponentUpdate",value:function(t,e){return!(0,h.default)(this.props,t)||!(0,h.default)(this.inViewport(this.state),this.inViewport(e))}},{key:"render",value:function(){return d.default.createElement("div",{ref:"withinViewportContainer",style:l},d.default.createElement(t,a({},n(this.inViewport()),this.props)))}}]),i}(c.Component),e.displayName=(0,s.default)(t,"withinViewport"),i}};e.default=y},function(t,e){"use strict";function n(t,e){return t===e?0!==t||1/t===1/e:t!==t&&e!==e}function i(t,e){if(n(t,e))return!0;if("object"!=typeof t||null===t||"object"!=typeof e||null===e)return!1;var i=Object.keys(t),o=Object.keys(e);if(i.length!==o.length)return!1;for(var u=0;u<i.length;u++)if(!r.call(e,i[u])||!n(t[i[u]],e[i[u]]))return!1;return!0}var r=Object.prototype.hasOwnProperty;t.exports=i},function(t,e){function n(t,e,n){function i(e){var n=v,i=w;return v=w=void 0,x=e,g=t.apply(i,n)}function o(t){return x=t,m=setTimeout(d,e),T?i(t):g}function u(t){var n=t-_,i=t-x,r=e-n;return V?O(r,y-i):r}function c(t){var n=t-_,i=t-x;return!_||n>=e||0>n||V&&i>=y}function d(){var t=j();return c(t)?l(t):void(m=setTimeout(d,u(t)))}function l(t){return clearTimeout(m),m=void 0,W&&v?i(t):(v=w=void 0,g)}function s(){void 0!==m&&clearTimeout(m),_=x=0,v=w=m=void 0}function p(){return void 0===m?g:l(j())}function h(){var t=j(),n=c(t);if(v=arguments,w=this,_=t,n){if(void 0===m)return o(_);if(V)return clearTimeout(m),m=setTimeout(d,e),i(_)}return void 0===m&&(m=setTimeout(d,e)),g}var v,w,y,g,m,_=0,x=0,T=!1,V=!1,W=!0;if("function"!=typeof t)throw new TypeError(f);return e=a(e)||0,r(n)&&(T=!!n.leading,V="maxWait"in n,y=V?b(a(n.maxWait)||0,e):y,W="trailing"in n?!!n.trailing:W),h.cancel=s,h.flush=p,h}function i(t){var e=r(t)?m.call(t):"";return e==d||e==l}function r(t){var e=typeof t;return!!t&&("object"==e||"function"==e)}function o(t){return!!t&&"object"==typeof t}function u(t){return"symbol"==typeof t||o(t)&&m.call(t)==s}function a(t){if("number"==typeof t)return t;if(u(t))return c;if(r(t)){var e=i(t.valueOf)?t.valueOf():t;t=r(e)?e+"":e}if("string"!=typeof t)return 0===t?t:+t;t=t.replace(p,"");var n=v.test(t);return n||w.test(t)?y(t.slice(2),n?2:8):h.test(t)?c:+t}var f="Expected a function",c=NaN,d="[object Function]",l="[object GeneratorFunction]",s="[object Symbol]",p=/^\s+|\s+$/g,h=/^[-+]0x[0-9a-f]+$/i,v=/^0b[01]+$/i,w=/^0o[0-7]+$/i,y=parseInt,g=Object.prototype,m=g.toString,b=Math.max,O=Math.min,j=Date.now;t.exports=n},function(t,e){"use strict";e.__esModule=!0;var n=function(t){if("string"==typeof t)return t;if(t)return t.displayName||t.name||"Component"};e.default=n},function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}e.__esModule=!0;var r=n(2),o=i(r);e.default=o.default},function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}e.__esModule=!0;var r=n(4),o=i(r),u=function(t,e){return e+"("+(0,o.default)(t)+")"};e.default=u},function(e,n){e.exports=t}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports.WithinViewport=e(require("react")):t.WithinViewport=e(t.react)}(this,function(t){return function(t){function e(i){if(n[i])return n[i].exports;var r=n[i]={exports:{},id:i,loaded:!1};return t[i].call(r.exports,r,r.exports,e),r.loaded=!0,r.exports}var n={};return e.m=t,e.c=n,e.p="",e(0)}([function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}Object.defineProperty(e,"__esModule",{value:!0});var r=n(1),o=i(r);e.default=o.default},function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function u(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0});var a=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},f=function(){function t(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(e,n,i){return n&&t(e.prototype,n),i&&t(e,i),e}}(),c=n(7),d=i(c),l=n(6),s=i(l),p=n(5),w=i(p),h=n(3),v=i(h),y=function(){var t=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],e=t.transform,n=void 0===e?function(t){var e=t.inViewport;return{inViewport:e}}:e,i=t.containerStyle,l=void 0===i?{width:"100%",height:"100%",padding:0,border:0}:i,p=t.getHeight,h=void 0===p?function(t){return t.getBoundingClientRect().height}:p,y=t.getWidth,g=void 0===y?function(t){return t.getBoundingClientRect().width}:y,m=t.getTop,b=void 0===m?function(t){return t.getBoundingClientRect().top}:m,O=t.getLeft,j=void 0===O?function(t){return t.getBoundingClientRect().left}:O,_=t.getViewportHeight,V=void 0===_?function(t,e){return t.innerHeight||e.clientHeight}:_,x=t.getViewportWidth,T=void 0===x?function(t,e){return t.innerWidth||e.clientWidth}:x,W=t.defaultAnswer,L=void 0===W?!0:W,E=t.wait,R=void 0===E?200:E,H=t.onViewportEnter,M=void 0===H?function(){}:H,S=t.onViewportLeave,C=void 0===S?function(){}:S;return function(t){var e,i;return i=e=function(e){function i(){var t,e,n,u;r(this,i);for(var f=arguments.length,c=Array(f),d=0;f>d;d++)c[d]=arguments[d];return e=n=o(this,(t=Object.getPrototypeOf(i)).call.apply(t,[this].concat(c))),n.state={containerWidth:null,containerHeight:null,containerTopOffset:null,containerLeftOffset:null,windowWidth:null,windowHeight:null,ready:!1},n.updateResize=function(){var t=function(){var t=n.refs.withinViewportContainer,e={containerWidth:g(t),containerHeight:h(t),windowWidth:T(window,document),windowHeight:V(window,document)};n.setState(a({},e,{ready:n.isReady(a({},n.state,e))}))};window.requestAnimationFrame?window.requestAnimationFrame(function(){return t()}):t()},n.updateScroll=function(){var t=function(){var t=n.refs.withinViewportContainer,e={containerTopOffset:b(t),containerLeftOffset:j(t)};n.setState(a({},e,{ready:n.isReady(a({},n.state,e))}))};window.requestAnimationFrame?window.requestAnimationFrame(function(){return t()}):t()},n.isReady=function(){var t=arguments.length<=0||void 0===arguments[0]?n.state:arguments[0];return null!==t.containerWidth&&null!==t.containerHeight&&null!==t.containerTopOffset&&null!==t.containerLeftOffset&&null!==t.windowHeight&&null!==t.windowWidth},n.inViewport=function(){var t=arguments.length<=0||void 0===arguments[0]?n.state:arguments[0];return t.ready?(t.containerTopOffset<0&&t.containerHeight+t.containerTopOffset>0||t.containerTopOffset>=0&&t.containerTopOffset<t.windowHeight)&&(t.containerLeftOffset<0&&t.containerWidth+t.containerLeftOffset>0||t.containerLeftOffset>=0&&t.containerLeftOffset<t.windowWidth):L},u=e,o(n,u)}return u(i,e),f(i,[{key:"componentDidMount",value:function(){window&&window.addEventListener&&(this.debouncedUpdateResize=(0,v.default)(this.updateResize,R),this.debouncedUpdateScroll=(0,v.default)(this.updateScroll,R),window.addEventListener("resize",this.debouncedUpdateResize),window.addEventListener("scroll",this.debouncedUpdateScroll),this.updateResize(),this.updateScroll())}},{key:"componentDidUpdate",value:function(t,e){var n=this.inViewport(e),i=this.inViewport(this.state);null===e.ready&&i===!1&&C(),null===e.ready&&i===!0&&M(),n===!0&&i===!1&&C(),n===!1&&i===!0&&M()}},{key:"componentWillUnmount",value:function(){window&&window.removeEventListener&&(window.removeEventListener("resize",this.debouncedUpdateResize),window.removeEventListener("scroll",this.debouncedUpdateScroll))}},{key:"shouldComponentUpdate",value:function(t,e){return!(0,w.default)(this.props,t)||!(0,w.default)(n(a({inViewport:this.inViewport(this.state)},this.state)),n(a({inViewport:this.inViewport(e)},e)))}},{key:"render",value:function(){return d.default.createElement("div",{ref:"withinViewportContainer",style:l},d.default.createElement(t,a({},n(a({inViewport:this.inViewport()},this.state)),this.props)))}}]),i}(c.Component),e.displayName=(0,s.default)(t,"withinViewport"),i}};e.default=y},function(t,e){"use strict";function n(t,e){return t===e?0!==t||1/t===1/e:t!==t&&e!==e}function i(t,e){if(n(t,e))return!0;if("object"!=typeof t||null===t||"object"!=typeof e||null===e)return!1;var i=Object.keys(t),o=Object.keys(e);if(i.length!==o.length)return!1;for(var u=0;u<i.length;u++)if(!r.call(e,i[u])||!n(t[i[u]],e[i[u]]))return!1;return!0}var r=Object.prototype.hasOwnProperty;t.exports=i},function(t,e){function n(t,e,n){function i(e){var n=h,i=v;return h=v=void 0,V=e,g=t.apply(i,n)}function o(t){return V=t,m=setTimeout(d,e),x?i(t):g}function u(t){var n=t-_,i=t-V,r=e-n;return T?O(r,y-i):r}function c(t){var n=t-_,i=t-V;return!_||n>=e||0>n||T&&i>=y}function d(){var t=j();return c(t)?l(t):void(m=setTimeout(d,u(t)))}function l(t){return clearTimeout(m),m=void 0,W&&h?i(t):(h=v=void 0,g)}function s(){void 0!==m&&clearTimeout(m),_=V=0,h=v=m=void 0}function p(){return void 0===m?g:l(j())}function w(){var t=j(),n=c(t);if(h=arguments,v=this,_=t,n){if(void 0===m)return o(_);if(T)return clearTimeout(m),m=setTimeout(d,e),i(_)}return void 0===m&&(m=setTimeout(d,e)),g}var h,v,y,g,m,_=0,V=0,x=!1,T=!1,W=!0;if("function"!=typeof t)throw new TypeError(f);return e=a(e)||0,r(n)&&(x=!!n.leading,T="maxWait"in n,y=T?b(a(n.maxWait)||0,e):y,W="trailing"in n?!!n.trailing:W),w.cancel=s,w.flush=p,w}function i(t){var e=r(t)?m.call(t):"";return e==d||e==l}function r(t){var e=typeof t;return!!t&&("object"==e||"function"==e)}function o(t){return!!t&&"object"==typeof t}function u(t){return"symbol"==typeof t||o(t)&&m.call(t)==s}function a(t){if("number"==typeof t)return t;if(u(t))return c;if(r(t)){var e=i(t.valueOf)?t.valueOf():t;t=r(e)?e+"":e}if("string"!=typeof t)return 0===t?t:+t;t=t.replace(p,"");var n=h.test(t);return n||v.test(t)?y(t.slice(2),n?2:8):w.test(t)?c:+t}var f="Expected a function",c=NaN,d="[object Function]",l="[object GeneratorFunction]",s="[object Symbol]",p=/^\s+|\s+$/g,w=/^[-+]0x[0-9a-f]+$/i,h=/^0b[01]+$/i,v=/^0o[0-7]+$/i,y=parseInt,g=Object.prototype,m=g.toString,b=Math.max,O=Math.min,j=Date.now;t.exports=n},function(t,e){"use strict";e.__esModule=!0;var n=function(t){if("string"==typeof t)return t;if(t)return t.displayName||t.name||"Component"};e.default=n},function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}e.__esModule=!0;var r=n(2),o=i(r);e.default=o.default},function(t,e,n){"use strict";function i(t){return t&&t.__esModule?t:{"default":t}}e.__esModule=!0;var r=n(4),o=i(r),u=function(t,e){return e+"("+(0,o.default)(t)+")"};e.default=u},function(e,n){e.exports=t}])});

dist/within-viewport.js

@@ -39,3 +39,4 @@ 'use strict';
   var _ref$transform = _ref.transform;
-  var transform = _ref$transform === undefined ? function (inViewport) {
+  var transform = _ref$transform === undefined ? function (_ref2) {
+    var inViewport = _ref2.inViewport;
     return { inViewport: inViewport };
@@ -201,3 +202,3 @@ } : _ref$transform;
         value: function shouldComponentUpdate(nextProps, nextState) {
-          return !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(this.inViewport(this.state), this.inViewport(nextState));
+          return !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(transform(_extends({ inViewport: this.inViewport(this.state) }, this.state)), transform(_extends({ inViewport: this.inViewport(nextState) }, nextState)));
         }
@@ -213,3 +214,3 @@ }, {
             },
-            _react2.default.createElement(BaseComponent, _extends({}, transform(this.inViewport()), this.props))
+            _react2.default.createElement(BaseComponent, _extends({}, transform(_extends({ inViewport: this.inViewport() }, this.state)), this.props))
           );
@@ -216,0 +217,0 @@ }

package.json

 {
   "name": "react-within-viewport",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "Debounced React high order component to flag when it's container is inside the viewport.",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -23,3 +23,4 @@ # react-within-viewport
 
-You can change the property name by passing a transformation function, example:
+The passed prop is transformed by a function.
+You can use it to, for example, changing the prop name:
 
@@ -26,0 +27,0 @@ ```js

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

34531

increased by0.84%

Lines of code

517

increased by0.19%

Number of lines in readme file

56

increased by1.82%

No dependency changes