lazy-react 3.1.0 → 3.1.1

package/demo/index.html

@@ -28,6 +28,7 @@
 		.styledImage{
 			height: 500px;
 			border: 10px solid tomato;
+			box-sizing: border-box;
 		}
 	</style>
 </head>

package/demo/index.js

@@ -26,7 +26,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
   \***********************/
 /***/ ((module, exports, __webpack_require__) => {
 
-eval("/* module decorator */ module = __webpack_require__.nmd(module);\nvar __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;function _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\n\n!function (e, t) {\n  \"object\" == ( false ? 0 : _typeof(exports)) && \"object\" == ( false ? 0 : _typeof(module)) ? module.exports = t(__webpack_require__(/*! react */ \"./node_modules/react/index.js\")) :  true ? !(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__(/*! react */ \"./node_modules/react/index.js\")], __WEBPACK_AMD_DEFINE_FACTORY__ = (t),\n\t\t__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?\n\t\t(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),\n\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)) : 0;\n}(self, function (e) {\n  return function () {\n    \"use strict\";\n\n    var t = {\n      787: function _(t) {\n        t.exports = e;\n      }\n    },\n        r = {};\n\n    function n(e) {\n      var o = r[e];\n      if (void 0 !== o) return o.exports;\n      var l = r[e] = {\n        exports: {}\n      };\n      return t[e](l, l.exports, n), l.exports;\n    }\n\n    n.n = function (e) {\n      var t = e && e.__esModule ? function () {\n        return e[\"default\"];\n      } : function () {\n        return e;\n      };\n      return n.d(t, {\n        a: t\n      }), t;\n    }, n.d = function (e, t) {\n      for (var r in t) {\n        n.o(t, r) && !n.o(e, r) && Object.defineProperty(e, r, {\n          enumerable: !0,\n          get: t[r]\n        });\n      }\n    }, n.o = function (e, t) {\n      return Object.prototype.hasOwnProperty.call(e, t);\n    }, n.r = function (e) {\n      \"undefined\" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {\n        value: \"Module\"\n      }), Object.defineProperty(e, \"__esModule\", {\n        value: !0\n      });\n    };\n    var o = {};\n    return function () {\n      n.r(o), n.d(o, {\n        LazyBackgroundImage: function LazyBackgroundImage() {\n          return u;\n        },\n        LazyComponent: function LazyComponent() {\n          return f;\n        },\n        LazyFrame: function LazyFrame() {\n          return s;\n        },\n        LazyImage: function LazyImage() {\n          return c;\n        }\n      });\n      var e = n(787),\n          t = n.n(e);\n\n      function r(e, t) {\n        (null == t || t > e.length) && (t = e.length);\n\n        for (var r = 0, n = new Array(t); r < t; r++) {\n          n[r] = e[r];\n        }\n\n        return n;\n      }\n\n      function l(t, n) {\n        var o,\n            l,\n            a = (o = (0, e.useState)({\n          link: \"\",\n          visible: !1\n        }), l = 2, function (e) {\n          if (Array.isArray(e)) return e;\n        }(o) || function (e, t) {\n          var r = null == e ? null : \"undefined\" != typeof Symbol && e[Symbol.iterator] || e[\"@@iterator\"];\n\n          if (null != r) {\n            var n,\n                o,\n                l = [],\n                i = !0,\n                a = !1;\n\n            try {\n              for (r = r.call(e); !(i = (n = r.next()).done) && (l.push(n.value), !t || l.length !== t); i = !0) {\n                ;\n              }\n            } catch (e) {\n              a = !0, o = e;\n            } finally {\n              try {\n                i || null == r[\"return\"] || r[\"return\"]();\n              } finally {\n                if (a) throw o;\n              }\n            }\n\n            return l;\n          }\n        }(o, l) || function (e, t) {\n          if (e) {\n            if (\"string\" == typeof e) return r(e, t);\n            var n = Object.prototype.toString.call(e).slice(8, -1);\n            return \"Object\" === n && e.constructor && (n = e.constructor.name), \"Map\" === n || \"Set\" === n ? Array.from(e) : \"Arguments\" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? r(e, t) : void 0;\n          }\n        }(o, l) || function () {\n          throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n        }()),\n            u = a[0],\n            c = a[1];\n\n        function s() {\n          c({\n            visible: !0,\n            link: n.link\n          });\n        }\n\n        return (0, e.useEffect)(function () {\n          return void 0 !== t.current && i.addElement({\n            element: t.current,\n            props: n,\n            makeItVisible: s\n          }), function () {\n            return i.removeElementFromList({\n              element: t.current,\n              props: n,\n              makeItVisible: s\n            });\n          };\n        }, []), u;\n      }\n\n      var i = {\n        elements: []\n      };\n\n      function a(e, t) {\n        (null == t || t > e.length) && (t = e.length);\n\n        for (var r = 0, n = new Array(t); r < t; r++) {\n          n[r] = e[r];\n        }\n\n        return n;\n      }\n\n      function u(r) {\n        var n,\n            o,\n            i = (0, e.useRef)(),\n            u = l(i, r),\n            c = (n = (0, e.useState)(Object.assign({\n          backgroundImage: \"url(\".concat(u.link, \")\")\n        }, r.style)), o = 2, function (e) {\n          if (Array.isArray(e)) return e;\n        }(n) || function (e, t) {\n          var r = null == e ? null : \"undefined\" != typeof Symbol && e[Symbol.iterator] || e[\"@@iterator\"];\n\n          if (null != r) {\n            var n,\n                o,\n                l = [],\n                i = !0,\n                a = !1;\n\n            try {\n              for (r = r.call(e); !(i = (n = r.next()).done) && (l.push(n.value), !t || l.length !== t); i = !0) {\n                ;\n              }\n            } catch (e) {\n              a = !0, o = e;\n            } finally {\n              try {\n                i || null == r[\"return\"] || r[\"return\"]();\n              } finally {\n                if (a) throw o;\n              }\n            }\n\n            return l;\n          }\n        }(n, o) || function (e, t) {\n          if (e) {\n            if (\"string\" == typeof e) return a(e, t);\n            var r = Object.prototype.toString.call(e).slice(8, -1);\n            return \"Object\" === r && e.constructor && (r = e.constructor.name), \"Map\" === r || \"Set\" === r ? Array.from(e) : \"Arguments\" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? a(e, t) : void 0;\n          }\n        }(n, o) || function () {\n          throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n        }()),\n            s = c[0],\n            f = c[1];\n        return (0, e.useEffect)(function () {\n          f(Object.assign({\n            backgroundImage: \"url(\".concat(u.link, \")\")\n          }, r.style));\n        }, [u]), t().createElement(\"div\", {\n          className: r.className,\n          style: s,\n          ref: i\n        }, r.children);\n      }\n\n      function c(r) {\n        var n = (0, e.useRef)(),\n            o = l(n, r);\n        return t().createElement(\"img\", {\n          src: o.link,\n          alt: r.alt,\n          style: r.style,\n          className: r.className,\n          ref: n\n        });\n      }\n\n      function s(r) {\n        var n = (0, e.useRef)(),\n            o = l(n, r);\n        return t().createElement(\"iframe\", {\n          height: r.height || \"500\",\n          scrolling: r.scrolling || \"no\",\n          src: o.link,\n          frameBorder: r.frameBorder || \"no\",\n          allowtransparency: r.allowTransparency || \"true\",\n          allowFullScreen: r.allowFullScreen || !0,\n          style: r.style || {},\n          ref: n\n        });\n      }\n\n      function f(r) {\n        var n = (0, e.useRef)(),\n            o = l(n, r),\n            i = t().createElement(\"div\", {\n          style: r.style ? r.style : {\n            heigt: \"300px\",\n            width: \"300px\"\n          }\n        });\n        return t().createElement(\"div\", {\n          ref: n\n        }, o.visible ? r.children : i);\n      }\n\n      i.isInViewPort = function (e) {\n        var t = e.offset,\n            r = e.top,\n            n = e.left;\n        return window.scrollY + window.innerHeight + t > r && window.scrollX + window.innerWidth + t > n;\n      }, i.calculateNewPosition = function (e) {\n        var t = e.element.getBoundingClientRect(),\n            r = t.top,\n            n = t.left,\n            o = t.right;\n        return Object.assign({}, e, {\n          top: r,\n          left: n,\n          right: o\n        });\n      }, i.addElement = function (e) {\n        var t = e.element,\n            r = e.props,\n            n = e.makeItVisible,\n            o = t.getBoundingClientRect(),\n            l = o.top,\n            a = o.left,\n            u = o.right;\n        i.elements.push({\n          element: t,\n          top: l,\n          left: a,\n          right: u,\n          offset: r.offset || 100,\n          makeItVisible: n\n        }), \"boolean\" == typeof i.isListenerAttached && (i.isListenerAttached = window.requestAnimationFrame(i.eventHandler));\n      }, i.eventHandler = function () {\n        0 === i.elements.length ? i.removeScrollHandler() : (i.elements.forEach(function (e, t) {\n          i.isInViewPort(e) ? (e.makeItVisible(), i.removeElementFromList(e)) : i.elements[t] = i.calculateNewPosition(e);\n        }), i.isListenerAttached = window.requestAnimationFrame(i.eventHandler));\n      }, i.removeScrollHandler = function () {\n        window.cancelAnimationFrame(i.isListenerAttached);\n      }, i.removeElementFromList = function (e) {\n        i.elements = i.elements.filter(function (t) {\n          return t !== e;\n        });\n      }, i.isListenerAttached = !1;\n    }(), o;\n  }();\n});\n\n//# sourceURL=webpack://lazy-react/./dist/index.js?");
+eval("/* module decorator */ module = __webpack_require__.nmd(module);\nvar __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;function _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\n\n!function (e, t) {\n  \"object\" == ( false ? 0 : _typeof(exports)) && \"object\" == ( false ? 0 : _typeof(module)) ? module.exports = t(__webpack_require__(/*! react */ \"./node_modules/react/index.js\")) :  true ? !(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__(/*! react */ \"./node_modules/react/index.js\")], __WEBPACK_AMD_DEFINE_FACTORY__ = (t),\n\t\t__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?\n\t\t(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),\n\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)) : 0;\n}(self, function (e) {\n  return function () {\n    \"use strict\";\n\n    var t = {\n      787: function _(t) {\n        t.exports = e;\n      }\n    },\n        r = {};\n\n    function n(e) {\n      var o = r[e];\n      if (void 0 !== o) return o.exports;\n      var i = r[e] = {\n        exports: {}\n      };\n      return t[e](i, i.exports, n), i.exports;\n    }\n\n    n.n = function (e) {\n      var t = e && e.__esModule ? function () {\n        return e[\"default\"];\n      } : function () {\n        return e;\n      };\n      return n.d(t, {\n        a: t\n      }), t;\n    }, n.d = function (e, t) {\n      for (var r in t) {\n        n.o(t, r) && !n.o(e, r) && Object.defineProperty(e, r, {\n          enumerable: !0,\n          get: t[r]\n        });\n      }\n    }, n.o = function (e, t) {\n      return Object.prototype.hasOwnProperty.call(e, t);\n    }, n.r = function (e) {\n      \"undefined\" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {\n        value: \"Module\"\n      }), Object.defineProperty(e, \"__esModule\", {\n        value: !0\n      });\n    };\n    var o = {};\n    return function () {\n      n.r(o), n.d(o, {\n        LazyBackgroundImage: function LazyBackgroundImage() {\n          return u;\n        },\n        LazyComponent: function LazyComponent() {\n          return f;\n        },\n        LazyFrame: function LazyFrame() {\n          return s;\n        },\n        LazyImage: function LazyImage() {\n          return c;\n        },\n        useRenderIfInViewPort: function useRenderIfInViewPort() {\n          return i;\n        }\n      });\n      var e = n(787),\n          t = n.n(e);\n\n      function r(e, t) {\n        (null == t || t > e.length) && (t = e.length);\n\n        for (var r = 0, n = new Array(t); r < t; r++) {\n          n[r] = e[r];\n        }\n\n        return n;\n      }\n\n      function i(t, n) {\n        var o,\n            i,\n            a = (o = (0, e.useState)({\n          link: \"\",\n          visible: !1\n        }), i = 2, function (e) {\n          if (Array.isArray(e)) return e;\n        }(o) || function (e, t) {\n          var r = null == e ? null : \"undefined\" != typeof Symbol && e[Symbol.iterator] || e[\"@@iterator\"];\n\n          if (null != r) {\n            var n,\n                o,\n                i = [],\n                l = !0,\n                a = !1;\n\n            try {\n              for (r = r.call(e); !(l = (n = r.next()).done) && (i.push(n.value), !t || i.length !== t); l = !0) {\n                ;\n              }\n            } catch (e) {\n              a = !0, o = e;\n            } finally {\n              try {\n                l || null == r[\"return\"] || r[\"return\"]();\n              } finally {\n                if (a) throw o;\n              }\n            }\n\n            return i;\n          }\n        }(o, i) || function (e, t) {\n          if (e) {\n            if (\"string\" == typeof e) return r(e, t);\n            var n = Object.prototype.toString.call(e).slice(8, -1);\n            return \"Object\" === n && e.constructor && (n = e.constructor.name), \"Map\" === n || \"Set\" === n ? Array.from(e) : \"Arguments\" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? r(e, t) : void 0;\n          }\n        }(o, i) || function () {\n          throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n        }()),\n            u = a[0],\n            c = a[1];\n\n        function s() {\n          c({\n            visible: !0,\n            link: n.link\n          });\n        }\n\n        return (0, e.useEffect)(function () {\n          return void 0 !== t.current && l.addElement({\n            element: t.current,\n            props: n,\n            makeItVisible: s\n          }), function () {\n            return l.removeElementFromList({\n              element: t.current,\n              props: n,\n              makeItVisible: s\n            });\n          };\n        }, []), u;\n      }\n\n      var l = {\n        elements: []\n      };\n\n      function a(e, t) {\n        (null == t || t > e.length) && (t = e.length);\n\n        for (var r = 0, n = new Array(t); r < t; r++) {\n          n[r] = e[r];\n        }\n\n        return n;\n      }\n\n      function u(r) {\n        var n,\n            o,\n            l = (0, e.useRef)(),\n            u = i(l, r),\n            c = (n = (0, e.useState)(Object.assign({\n          backgroundImage: \"url(\".concat(u.link, \")\")\n        }, r.style)), o = 2, function (e) {\n          if (Array.isArray(e)) return e;\n        }(n) || function (e, t) {\n          var r = null == e ? null : \"undefined\" != typeof Symbol && e[Symbol.iterator] || e[\"@@iterator\"];\n\n          if (null != r) {\n            var n,\n                o,\n                i = [],\n                l = !0,\n                a = !1;\n\n            try {\n              for (r = r.call(e); !(l = (n = r.next()).done) && (i.push(n.value), !t || i.length !== t); l = !0) {\n                ;\n              }\n            } catch (e) {\n              a = !0, o = e;\n            } finally {\n              try {\n                l || null == r[\"return\"] || r[\"return\"]();\n              } finally {\n                if (a) throw o;\n              }\n            }\n\n            return i;\n          }\n        }(n, o) || function (e, t) {\n          if (e) {\n            if (\"string\" == typeof e) return a(e, t);\n            var r = Object.prototype.toString.call(e).slice(8, -1);\n            return \"Object\" === r && e.constructor && (r = e.constructor.name), \"Map\" === r || \"Set\" === r ? Array.from(e) : \"Arguments\" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? a(e, t) : void 0;\n          }\n        }(n, o) || function () {\n          throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n        }()),\n            s = c[0],\n            f = c[1];\n        return (0, e.useEffect)(function () {\n          f(Object.assign({\n            backgroundImage: \"url(\".concat(u.link, \")\")\n          }, r.style));\n        }, [u]), t().createElement(\"div\", {\n          className: r.className,\n          style: s,\n          ref: l\n        }, r.children);\n      }\n\n      function c(r) {\n        var n = (0, e.useRef)(),\n            o = i(n, r);\n        return t().createElement(\"img\", {\n          src: o.link,\n          alt: r.alt,\n          style: r.style,\n          className: r.className,\n          ref: n\n        });\n      }\n\n      function s(r) {\n        var n = (0, e.useRef)(),\n            o = i(n, r);\n        return t().createElement(\"iframe\", {\n          height: r.height || \"500\",\n          scrolling: r.scrolling || \"no\",\n          src: o.link,\n          frameBorder: r.frameBorder || \"no\",\n          allowtransparency: r.allowTransparency || \"true\",\n          allowFullScreen: r.allowFullScreen || !0,\n          style: r.style || {},\n          ref: n\n        });\n      }\n\n      function f(r) {\n        var n = (0, e.useRef)(),\n            o = i(n, r),\n            l = t().createElement(\"div\", {\n          style: r.style ? r.style : {\n            heigt: \"300px\",\n            width: \"300px\"\n          }\n        });\n        return t().createElement(\"div\", {\n          ref: n\n        }, o.visible ? r.children : l);\n      }\n\n      l.isInViewPort = function (e) {\n        var t = e.offset,\n            r = e.top,\n            n = e.left;\n        return r < window.innerHeight + t && n < window.innerWidth + t;\n      }, l.calculateNewPosition = function (e) {\n        var t = e.element.getBoundingClientRect(),\n            r = t.top,\n            n = t.left;\n        return Object.assign({}, e, {\n          top: r,\n          left: n\n        });\n      }, l.addElement = function (e) {\n        var t = e.element,\n            r = e.props,\n            n = e.makeItVisible,\n            o = t.getBoundingClientRect(),\n            i = o.top,\n            a = o.left;\n        l.elements.push({\n          element: t,\n          top: i,\n          left: a,\n          offset: r.offset || 100,\n          makeItVisible: n\n        }), \"boolean\" == typeof l.isListenerAttached && (l.isListenerAttached = window.requestAnimationFrame(l.eventHandler));\n      }, l.eventHandler = function () {\n        0 === l.elements.length ? l.removeScrollHandler() : (l.elements.forEach(function (e, t) {\n          l.isInViewPort(e) ? (e.makeItVisible(), l.removeElementFromList(e)) : l.elements[t] = l.calculateNewPosition(e);\n        }), l.isListenerAttached = window.requestAnimationFrame(l.eventHandler));\n      }, l.removeScrollHandler = function () {\n        window.cancelAnimationFrame(l.isListenerAttached), l.isListenerAttached = !1;\n      }, l.removeElementFromList = function (e) {\n        l.elements = l.elements.filter(function (t) {\n          return t !== e;\n        });\n      }, l.isListenerAttached = !1;\n    }(), o;\n  }();\n});\n\n//# sourceURL=webpack://lazy-react/./dist/index.js?");
 
 /***/ }),
 

package/dist/index.js

@@ -1,2 +1 @@
-!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.LazyReact=t(require("react")):e.LazyReact=t(e.React)}(self,(function(e){return(()=>{"use strict";var t={787:t=>{t.exports=e}},r={};function n(e){var o=r[e];if(void 0!==o)return o.exports;var l=r[e]={exports:{}};return t[e](l,l.exports,n),l.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var o={};return(()=>{n.r(o),n.d(o,{LazyBackgroundImage:()=>u,LazyComponent:()=>f,LazyFrame:()=>s,LazyImage:()=>c});var e=n(787),t=n.n(e);function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function l(t,n){var o,l,a=(o=(0,e.useState)({link:"",visible:!1}),l=2,function(e){if(Array.isArray(e))return e}(o)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,l=[],i=!0,a=!1;try{for(r=r.call(e);!(i=(n=r.next()).done)&&(l.push(n.value),!t||l.length!==t);i=!0);}catch(e){a=!0,o=e}finally{try{i||null==r.return||r.return()}finally{if(a)throw o}}return l}}(o,l)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(o,l)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),u=a[0],c=a[1];function s(){c({visible:!0,link:n.link})}return(0,e.useEffect)((function(){return void 0!==t.current&&i.addElement({element:t.current,props:n,makeItVisible:s}),function(){return i.removeElementFromList({element:t.current,props:n,makeItVisible:s})}}),[]),u}var i={elements:[]};function a(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function u(r){var n,o,i=(0,e.useRef)(),u=l(i,r),c=(n=(0,e.useState)(Object.assign({backgroundImage:"url(".concat(u.link,")")},r.style)),o=2,function(e){if(Array.isArray(e))return e}(n)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,l=[],i=!0,a=!1;try{for(r=r.call(e);!(i=(n=r.next()).done)&&(l.push(n.value),!t||l.length!==t);i=!0);}catch(e){a=!0,o=e}finally{try{i||null==r.return||r.return()}finally{if(a)throw o}}return l}}(n,o)||function(e,t){if(e){if("string"==typeof e)return a(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?a(e,t):void 0}}(n,o)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),s=c[0],f=c[1];return(0,e.useEffect)((function(){f(Object.assign({backgroundImage:"url(".concat(u.link,")")},r.style))}),[u]),t().createElement("div",{className:r.className,style:s,ref:i},r.children)}function c(r){var n=(0,e.useRef)(),o=l(n,r);return t().createElement("img",{src:o.link,alt:r.alt,style:r.style,className:r.className,ref:n})}function s(r){var n=(0,e.useRef)(),o=l(n,r);return t().createElement("iframe",{height:r.height||"500",scrolling:r.scrolling||"no",src:o.link,frameBorder:r.frameBorder||"no",allowtransparency:r.allowTransparency||"true",allowFullScreen:r.allowFullScreen||!0,style:r.style||{},ref:n})}function f(r){var n=(0,e.useRef)(),o=l(n,r),i=t().createElement("div",{style:r.style?r.style:{heigt:"300px",width:"300px"}});return t().createElement("div",{ref:n},o.visible?r.children:i)}i.isInViewPort=function(e){var t=e.offset,r=e.top,n=e.left;return window.scrollY+window.innerHeight+t>r&&window.scrollX+window.innerWidth+t>n},i.calculateNewPosition=function(e){var t=e.element.getBoundingClientRect(),r=t.top,n=t.left,o=t.right;return Object.assign({},e,{top:r,left:n,right:o})},i.addElement=function(e){var t=e.element,r=e.props,n=e.makeItVisible,o=t.getBoundingClientRect(),l=o.top,a=o.left,u=o.right;i.elements.push({element:t,top:l,left:a,right:u,offset:r.offset||100,makeItVisible:n}),"boolean"==typeof i.isListenerAttached&&(i.isListenerAttached=window.requestAnimationFrame(i.eventHandler))},i.eventHandler=function(){0===i.elements.length?i.removeScrollHandler():(i.elements.forEach((function(e,t){i.isInViewPort(e)?(e.makeItVisible(),i.removeElementFromList(e)):i.elements[t]=i.calculateNewPosition(e)})),i.isListenerAttached=window.requestAnimationFrame(i.eventHandler))},i.removeScrollHandler=function(){window.cancelAnimationFrame(i.isListenerAttached)},i.removeElementFromList=function(e){i.elements=i.elements.filter((function(t){return t!==e}))},i.isListenerAttached=!1})(),o})()}));
-//# sourceMappingURL=index.js.map
+!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.LazyReact=t(require("react")):e.LazyReact=t(e.React)}(self,(function(e){return(()=>{"use strict";var t={787:t=>{t.exports=e}},r={};function n(e){var o=r[e];if(void 0!==o)return o.exports;var i=r[e]={exports:{}};return t[e](i,i.exports,n),i.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var o={};return(()=>{n.r(o),n.d(o,{LazyBackgroundImage:()=>u,LazyComponent:()=>f,LazyFrame:()=>s,LazyImage:()=>c,useRenderIfInViewPort:()=>i});var e=n(787),t=n.n(e);function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function i(t,n){var o,i,a=(o=(0,e.useState)({link:"",visible:!1}),i=2,function(e){if(Array.isArray(e))return e}(o)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],l=!0,a=!1;try{for(r=r.call(e);!(l=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);l=!0);}catch(e){a=!0,o=e}finally{try{l||null==r.return||r.return()}finally{if(a)throw o}}return i}}(o,i)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(o,i)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),u=a[0],c=a[1];function s(){c({visible:!0,link:n.link})}return(0,e.useEffect)((function(){return void 0!==t.current&&l.addElement({element:t.current,props:n,makeItVisible:s}),function(){return l.removeElementFromList({element:t.current,props:n,makeItVisible:s})}}),[]),u}var l={elements:[]};function a(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function u(r){var n,o,l=(0,e.useRef)(),u=i(l,r),c=(n=(0,e.useState)(Object.assign({backgroundImage:"url(".concat(u.link,")")},r.style)),o=2,function(e){if(Array.isArray(e))return e}(n)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],l=!0,a=!1;try{for(r=r.call(e);!(l=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);l=!0);}catch(e){a=!0,o=e}finally{try{l||null==r.return||r.return()}finally{if(a)throw o}}return i}}(n,o)||function(e,t){if(e){if("string"==typeof e)return a(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?a(e,t):void 0}}(n,o)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),s=c[0],f=c[1];return(0,e.useEffect)((function(){f(Object.assign({backgroundImage:"url(".concat(u.link,")")},r.style))}),[u]),t().createElement("div",{className:r.className,style:s,ref:l},r.children)}function c(r){var n=(0,e.useRef)(),o=i(n,r);return t().createElement("img",{src:o.link,alt:r.alt,style:r.style,className:r.className,ref:n})}function s(r){var n=(0,e.useRef)(),o=i(n,r);return t().createElement("iframe",{height:r.height||"500",scrolling:r.scrolling||"no",src:o.link,frameBorder:r.frameBorder||"no",allowtransparency:r.allowTransparency||"true",allowFullScreen:r.allowFullScreen||!0,style:r.style||{},ref:n})}function f(r){var n=(0,e.useRef)(),o=i(n,r),l=t().createElement("div",{style:r.style?r.style:{heigt:"300px",width:"300px"}});return t().createElement("div",{ref:n},o.visible?r.children:l)}l.isInViewPort=function(e){var t=e.offset,r=e.top,n=e.left;return r<window.innerHeight+t&&n<window.innerWidth+t},l.calculateNewPosition=function(e){var t=e.element.getBoundingClientRect(),r=t.top,n=t.left;return Object.assign({},e,{top:r,left:n})},l.addElement=function(e){var t=e.element,r=e.props,n=e.makeItVisible,o=t.getBoundingClientRect(),i=o.top,a=o.left;l.elements.push({element:t,top:i,left:a,offset:r.offset||100,makeItVisible:n}),"boolean"==typeof l.isListenerAttached&&(l.isListenerAttached=window.requestAnimationFrame(l.eventHandler))},l.eventHandler=function(){0===l.elements.length?l.removeScrollHandler():(l.elements.forEach((function(e,t){l.isInViewPort(e)?(e.makeItVisible(),l.removeElementFromList(e)):l.elements[t]=l.calculateNewPosition(e)})),l.isListenerAttached=window.requestAnimationFrame(l.eventHandler))},l.removeScrollHandler=function(){window.cancelAnimationFrame(l.isListenerAttached),l.isListenerAttached=!1},l.removeElementFromList=function(e){l.elements=l.elements.filter((function(t){return t!==e}))},l.isListenerAttached=!1})(),o})()}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lazy-react",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "description": "components to lazy load iframes, images and images as backgrounds",
   "main": "./dist/index.js",
   "scripts": {

package/src/baseClass.js

@@ -16,12 +16,14 @@ export default function useRenderIfInViewPort(element, props) {
   useEffect(() => {
     if (element.current !== undefined)
       CheckIfRender.addElement({
+        // add the element to the array of elements that are waiting to be lazy loaded
         element: element.current,
         props,
         makeItVisible,
       })
     return () =>
       CheckIfRender.removeElementFromList({
+        // if the element is unloaded remove the element from the list of elements that needs to be lazy loader
         element: element.current,
         props,
         makeItVisible,
@@ -31,33 +33,34 @@ export default function useRenderIfInViewPort(element, props) {
   return state
 }
 
+// array with all the elements that are waiting to be shown in the viewport
 const CheckIfRender = {
   elements: [],
 }
 
+// top: the position of the element in relation with the top of the browser
+// left: the position of the element in relation with the left of the browser
+// offset: the desired offset of the element in relation of the viewport
 CheckIfRender.isInViewPort = ({ offset, top, left }) =>
-  window.scrollY + window.innerHeight + offset > top &&
-  window.scrollX + window.innerWidth + offset > left
+  top < window.innerHeight + offset && left < window.innerWidth + offset
 
 CheckIfRender.calculateNewPosition = (elem) => {
   const reference = elem.element
-  const { top, left, right } = reference.getBoundingClientRect()
+  const { top, left } = reference.getBoundingClientRect()
   return {
     ...elem,
     top,
     left,
-    right,
   }
 }
 
 CheckIfRender.addElement = function ({ element, props, makeItVisible }) {
   //the distance from the pixel 0,0 and the top of the element
-  const { top, left, right } = element.getBoundingClientRect()
+  const { top, left } = element.getBoundingClientRect()
   CheckIfRender.elements.push({
     element,
     top,
     left,
-    right,
     offset: props.offset || 100,
     makeItVisible,
   })
@@ -93,6 +96,7 @@ CheckIfRender.eventHandler = function () {
 
 CheckIfRender.removeScrollHandler = function () {
   window.cancelAnimationFrame(CheckIfRender.isListenerAttached)
+  CheckIfRender.isListenerAttached = false
 }
 
 //When an element is unloaded remove it from the list of elements that are waiting to be lazy-loaded

package/src/index.js

@@ -2,5 +2,12 @@ import LazyBackgroundImage from './lazyLoadBackgroundImage'
 import LazyImage from './lazyLoadImage'
 import LazyFrame from './lazyLoadFrame'
 import LazyComponent from './lazyLoadComponent'
+import useRenderIfInViewPort from './baseClass'
 
-export { LazyBackgroundImage, LazyImage, LazyFrame, LazyComponent }
+export {
+  LazyBackgroundImage,
+  LazyImage,
+  LazyFrame,
+  LazyComponent,
+  useRenderIfInViewPort,
+}

package/src/lazyLoadBackgroundImage.js

@@ -17,7 +17,7 @@ export default function LazyBackgroundImage(props) {
   }, [isViewable])
 
   return (
-    <div className={props.className} style={style} ref={ref} >
+    <div className={props.className} style={style} ref={ref}>
       {props.children}
     </div>
   )

package/webpack.config.js

@@ -4,7 +4,6 @@ var webpack = require('webpack')
 module.exports = {
   mode:'production',
   entry: './src/index.js',
-  devtool: 'source-map',
   output: {
     library: 'LazyReact',
     libraryTarget: 'umd',

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"./dist/index.js","mappings":"CAAA,SAA2CA,EAAMC,GAC1B,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,EAAQG,QAAQ,UACR,mBAAXC,QAAyBA,OAAOC,IAC9CD,OAAO,CAAC,SAAUJ,GACQ,iBAAZC,QACdA,QAAmB,UAAID,EAAQG,QAAQ,UAEvCJ,EAAgB,UAAIC,EAAQD,EAAY,OAR1C,CASGO,MAAM,SAASC,GAClB,M,kCCVAL,EAAOD,QAAUM,ICCbC,EAA2B,GAG/B,SAASC,EAAoBC,GAE5B,IAAIC,EAAeH,EAAyBE,GAC5C,QAAqBE,IAAjBD,EACH,OAAOA,EAAaV,QAGrB,IAAIC,EAASM,EAAyBE,GAAY,CAGjDT,QAAS,IAOV,OAHAY,EAAoBH,GAAUR,EAAQA,EAAOD,QAASQ,GAG/CP,EAAOD,QCpBfQ,EAAoBK,EAAKZ,IACxB,IAAIa,EAASb,GAAUA,EAAOc,WAC7B,IAAOd,EAAiB,QACxB,IAAM,EAEP,OADAO,EAAoBQ,EAAEF,EAAQ,CAAEG,EAAGH,IAC5BA,GCLRN,EAAoBQ,EAAI,CAAChB,EAASkB,KACjC,IAAI,IAAIC,KAAOD,EACXV,EAAoBY,EAAEF,EAAYC,KAASX,EAAoBY,EAAEpB,EAASmB,IAC5EE,OAAOC,eAAetB,EAASmB,EAAK,CAAEI,YAAY,EAAMC,IAAKN,EAAWC,MCJ3EX,EAAoBY,EAAI,CAACK,EAAKC,IAAUL,OAAOM,UAAUC,eAAeC,KAAKJ,EAAKC,GCClFlB,EAAoBsB,EAAK9B,IACH,oBAAX+B,QAA0BA,OAAOC,aAC1CX,OAAOC,eAAetB,EAAS+B,OAAOC,YAAa,CAAEC,MAAO,WAE7DZ,OAAOC,eAAetB,EAAS,aAAc,CAAEiC,OAAO,K,mPCHxC,SAASC,EAAsBC,EAASC,GACrD,I,IAAA,G,GAA0BC,EAAAA,EAAAA,UAAS,CACjCC,KAAM,GACNC,SAAS,I,EAFX,E,8zBAAOC,EAAP,KAAcC,EAAd,KAKA,SAASC,IACPD,EAAS,CACPF,SAAS,EACTD,KAAMF,EAAME,OAmBhB,OAfAK,EAAAA,EAAAA,YAAU,WAOR,YANwBhC,IAApBwB,EAAQS,SACVC,EAAcC,WAAW,CACvBX,QAASA,EAAQS,QACjBR,MAAAA,EACAM,cAAAA,IAEG,kBACLG,EAAcE,sBAAsB,CAClCZ,QAASA,EAAQS,QACjBR,MAAAA,EACAM,cAAAA,OAEH,IAEIF,EAGT,IAAMK,EAAgB,CACpBG,SAAU,I,0GC/BG,SAASC,EAAoBb,GAC1C,I,IAAMc,GAAMC,EAAAA,EAAAA,UACRC,EAAaC,EAAgBH,EAAKd,GACtC,G,GAA0BC,EAAAA,EAAAA,UAAS,OAAD,QAChCiB,gBAAiB,OAAF,OAASF,EAAWd,KAApB,MACZF,EAAMmB,Q,EAFX,E,8zBAAOA,EAAP,KAAcC,EAAd,KAYA,OAPAb,EAAAA,EAAAA,YAAU,WACRa,EAAS,OAAD,QACNF,gBAAiB,OAAF,OAASF,EAAWd,KAApB,MACZF,EAAMmB,UAEV,CAACH,IAGF,yBAAKK,UAAWrB,EAAMqB,UAAWF,MAAOA,EAAOL,IAAKA,GACjDd,EAAMsB,UCjBE,SAASC,EAAUvB,GAChC,IAAMc,GAAMC,EAAAA,EAAAA,UACNC,EAAaC,EAAgBH,EAAKd,GAExC,OACE,yBACEwB,IAAKR,EAAWd,KAChBuB,IAAKzB,EAAMyB,IACXN,MAAOnB,EAAMmB,MACbE,UAAWrB,EAAMqB,UACjBP,IAAKA,ICVI,SAASY,EAAU1B,GAChC,IAAMc,GAAMC,EAAAA,EAAAA,UACRC,EAAaC,EAAgBH,EAAKd,GAEtC,OACE,4BACE2B,OAAQ3B,EAAM2B,QAAU,MACxBC,UAAW5B,EAAM4B,WAAa,KAC9BJ,IAAKR,EAAWd,KAChB2B,YAAa7B,EAAM6B,aAAe,KAClCC,kBAAmB9B,EAAM+B,mBAAqB,OAC9CC,gBAAiBhC,EAAMgC,kBAAmB,EAC1Cb,MAAOnB,EAAMmB,OAAS,GACtBL,IAAKA,ICbI,SAASmB,EAAcjC,GACpC,IAAMc,GAAMC,EAAAA,EAAAA,UACRC,EAAaC,EAAgBH,EAAKd,GAEhCkC,EACJ,yBACEf,MACEnB,EAAMmB,MACFnB,EAAMmB,MACN,CACEgB,MAAO,QACPC,MAAO,WAMnB,OACE,yBAAKtB,IAAKA,GAAME,EAAWb,QAAUH,EAAMsB,SAAWY,GJgB1DzB,EAAc4B,aAAe,gBAAGC,EAAH,EAAGA,OAAQC,EAAX,EAAWA,IAAKC,EAAhB,EAAgBA,KAAhB,OAC3BC,OAAOC,QAAUD,OAAOE,YAAcL,EAASC,GAC/CE,OAAOG,QAAUH,OAAOI,WAAaP,EAASE,GAEhD/B,EAAcqC,qBAAuB,SAACC,GACpC,IACA,EADkBA,EAAKhD,QACgBiD,wBAA/BT,EAAR,EAAQA,IAAKC,EAAb,EAAaA,KAAMS,EAAnB,EAAmBA,MACnB,wBACKF,EADL,CAEER,IAAAA,EACAC,KAAAA,EACAS,MAAAA,KAIJxC,EAAcC,WAAa,SAAU,GAAmC,IAAjCX,EAAiC,EAAjCA,QAASC,EAAwB,EAAxBA,MAAOM,EAAiB,EAAjBA,cAErD,EAA6BP,EAAQiD,wBAA7BT,EAAR,EAAQA,IAAKC,EAAb,EAAaA,KAAMS,EAAnB,EAAmBA,MACnBxC,EAAcG,SAASsC,KAAK,CAC1BnD,QAAAA,EACAwC,IAAAA,EACAC,KAAAA,EACAS,MAAAA,EACAX,OAAQtC,EAAMsC,QAAU,IACxBhC,cAAAA,IAG8C,kBAArCG,EAAc0C,qBACvB1C,EAAc0C,mBAAqBV,OAAOW,sBACxC3C,EAAc4C,gBAKpB5C,EAAc4C,aAAe,WAEW,IAAlC5C,EAAcG,SAAS0C,OACzB7C,EAAc8C,uBAEd9C,EAAcG,SAAS4C,SAAQ,SAACT,EAAMU,GAEhChD,EAAc4B,aAAaU,IAC7BA,EAAKzC,gBAELG,EAAcE,sBAAsBoC,IAGpCtC,EAAcG,SAAS6C,GAAKhD,EAAcqC,qBAAqBC,MAGnEtC,EAAc0C,mBAAqBV,OAAOW,sBACxC3C,EAAc4C,gBAKpB5C,EAAc8C,oBAAsB,WAClCd,OAAOiB,qBAAqBjD,EAAc0C,qBAI5C1C,EAAcE,sBAAwB,SAAUgD,GAC9ClD,EAAcG,SAAWH,EAAcG,SAASgD,QAC9C,SAACb,GAAD,OAAUA,IAASY,MAIvBlD,EAAc0C,oBAAqB,G","sources":["webpack://LazyReact/webpack/universalModuleDefinition","webpack://LazyReact/external umd {\"root\":\"React\",\"commonjs2\":\"react\",\"commonjs\":\"react\",\"amd\":\"react\"}","webpack://LazyReact/webpack/bootstrap","webpack://LazyReact/webpack/runtime/compat get default export","webpack://LazyReact/webpack/runtime/define property getters","webpack://LazyReact/webpack/runtime/hasOwnProperty shorthand","webpack://LazyReact/webpack/runtime/make namespace object","webpack://LazyReact/./src/baseClass.js","webpack://LazyReact/./src/lazyLoadBackgroundImage.js","webpack://LazyReact/./src/lazyLoadImage.js","webpack://LazyReact/./src/lazyLoadFrame.js","webpack://LazyReact/./src/lazyLoadComponent.js"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"LazyReact\"] = factory(require(\"react\"));\n\telse\n\t\troot[\"LazyReact\"] = factory(root[\"React\"]);\n})(self, function(__WEBPACK_EXTERNAL_MODULE__787__) {\nreturn ","module.exports = __WEBPACK_EXTERNAL_MODULE__787__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import React, { useState, useEffect } from 'react' // eslint-disable-line no-unused-vars\n\nexport default function useRenderIfInViewPort(element, props) {\n  const [state, setState] = useState({\n    link: '',\n    visible: false,\n  })\n\n  function makeItVisible() {\n    setState({\n      visible: true,\n      link: props.link,\n    })\n  }\n\n  useEffect(() => {\n    if (element.current !== undefined)\n      CheckIfRender.addElement({\n        element: element.current,\n        props,\n        makeItVisible,\n      })\n    return () =>\n      CheckIfRender.removeElementFromList({\n        element: element.current,\n        props,\n        makeItVisible,\n      })\n  }, [])\n\n  return state\n}\n\nconst CheckIfRender = {\n  elements: [],\n}\n\nCheckIfRender.isInViewPort = ({ offset, top, left }) =>\n  window.scrollY + window.innerHeight + offset > top &&\n  window.scrollX + window.innerWidth + offset > left\n\nCheckIfRender.calculateNewPosition = (elem) => {\n  const reference = elem.element\n  const { top, left, right } = reference.getBoundingClientRect()\n  return {\n    ...elem,\n    top,\n    left,\n    right,\n  }\n}\n\nCheckIfRender.addElement = function ({ element, props, makeItVisible }) {\n  //the distance from the pixel 0,0 and the top of the element\n  const { top, left, right } = element.getBoundingClientRect()\n  CheckIfRender.elements.push({\n    element,\n    top,\n    left,\n    right,\n    offset: props.offset || 100,\n    makeItVisible,\n  })\n  //check if has already been started the rAF cycle\n  if (typeof CheckIfRender.isListenerAttached === 'boolean') {\n    CheckIfRender.isListenerAttached = window.requestAnimationFrame(\n      CheckIfRender.eventHandler\n    )\n  }\n}\n\nCheckIfRender.eventHandler = function () {\n  //if there is no more element to lazy load remove the listener/rAF\n  if (CheckIfRender.elements.length === 0) {\n    CheckIfRender.removeScrollHandler()\n  } else {\n    CheckIfRender.elements.forEach((elem, i) => {\n      // if element is in viewPort make it visible\n      if (CheckIfRender.isInViewPort(elem)) {\n        elem.makeItVisible()\n        // remove element from the list of elements to lazy load\n        CheckIfRender.removeElementFromList(elem)\n      } else {\n        // if the element is not shown update his position\n        CheckIfRender.elements[i] = CheckIfRender.calculateNewPosition(elem)\n      }\n    })\n    CheckIfRender.isListenerAttached = window.requestAnimationFrame(\n      CheckIfRender.eventHandler\n    )\n  }\n}\n\nCheckIfRender.removeScrollHandler = function () {\n  window.cancelAnimationFrame(CheckIfRender.isListenerAttached)\n}\n\n//When an element is unloaded remove it from the list of elements that are waiting to be lazy-loaded\nCheckIfRender.removeElementFromList = function (toRemove) {\n  CheckIfRender.elements = CheckIfRender.elements.filter(\n    (elem) => elem !== toRemove\n  )\n}\n\nCheckIfRender.isListenerAttached = false\n\nexport { CheckIfRender }\n","import React, { useState, useEffect, useRef } from 'react' // eslint-disable-line no-unused-vars\nimport useIsInViewPort from './baseClass'\n\nexport default function LazyBackgroundImage(props) {\n  const ref = useRef()\n  let isViewable = useIsInViewPort(ref, props)\n  const [style, setStyle] = useState({\n    backgroundImage: `url(${isViewable.link})`,\n    ...props.style,\n  })\n\n  useEffect(() => {\n    setStyle({\n      backgroundImage: `url(${isViewable.link})`,\n      ...props.style,\n    })\n  }, [isViewable])\n\n  return (\n    <div className={props.className} style={style} ref={ref} >\n      {props.children}\n    </div>\n  )\n}\n","import React, { useRef } from 'react' // eslint-disable-line no-unused-vars\nimport useIsInViewPort from './baseClass'\n\nexport default function LazyImage(props) {\n  const ref = useRef()\n  const isViewable = useIsInViewPort(ref, props)\n\n  return (\n    <img\n      src={isViewable.link}\n      alt={props.alt}\n      style={props.style}\n      className={props.className}\n      ref={ref}\n    />\n  )\n}\n","import React, { useRef } from 'react' // eslint-disable-line no-unused-vars\nimport useIsInViewPort from './baseClass'\n\nexport default function LazyFrame(props) {\n  const ref = useRef()\n  let isViewable = useIsInViewPort(ref, props)\n\n  return (\n    <iframe\n      height={props.height || '500'}\n      scrolling={props.scrolling || 'no'}\n      src={isViewable.link}\n      frameBorder={props.frameBorder || 'no'}\n      allowtransparency={props.allowTransparency || 'true'}\n      allowFullScreen={props.allowFullScreen || true}\n      style={props.style || {}}\n      ref={ref}\n    />\n  )\n}\n","import React, { useRef } from 'react' // eslint-disable-line no-unused-vars\nimport useIsInViewPort from './baseClass'\n\nexport default function LazyComponent(props) {\n  const ref = useRef()\n  let isViewable = useIsInViewPort(ref, props)\n\n  const placeHolder = (\n    <div\n      style={\n        props.style\n          ? props.style\n          : {\n              heigt: '300px',\n              width: '300px',\n            }\n      }\n    />\n  )\n\n  return (\n    <div ref={ref}>{isViewable.visible ? props.children : placeHolder}</div>\n  )\n}\n"],"names":["root","factory","exports","module","require","define","amd","self","__WEBPACK_EXTERNAL_MODULE__787__","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","n","getter","__esModule","d","a","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value","useRenderIfInViewPort","element","props","useState","link","visible","state","setState","makeItVisible","useEffect","current","CheckIfRender","addElement","removeElementFromList","elements","LazyBackgroundImage","ref","useRef","isViewable","useIsInViewPort","backgroundImage","style","setStyle","className","children","LazyImage","src","alt","LazyFrame","height","scrolling","frameBorder","allowtransparency","allowTransparency","allowFullScreen","LazyComponent","placeHolder","heigt","width","isInViewPort","offset","top","left","window","scrollY","innerHeight","scrollX","innerWidth","calculateNewPosition","elem","getBoundingClientRect","right","push","isListenerAttached","requestAnimationFrame","eventHandler","length","removeScrollHandler","forEach","i","cancelAnimationFrame","toRemove","filter"],"sourceRoot":""}