react-lazy-images - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0-rc.1

dist/react-lazy-images.es.js

@@ -1,2 +0,2 @@
-import e from"react";import t from"react-intersection-observer";var r=function(e,t){return(r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r])})(e,t)};var o,n=function(){return(n=Object.assign||function(e){for(var t,r=1,o=arguments.length;r<o;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e}).apply(this,arguments)};function a(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)t.indexOf(o[n])<0&&(r[o[n]]=e[o[n]])}return r}!function(e){e.NotAsked="NotAsked",e.Loading="Loading",e.LoadSuccess="LoadSuccess",e.LoadError="LoadError"}(o||(o={}));var i=function(i){function c(e){var t=i.call(this,e)||this;return t.initialState={hasBeenInView:!1,imageState:o.NotAsked},t.state=t.initialState,t.onInView=t.onInView.bind(t),t.onLoadSuccess=t.onLoadSuccess.bind(t),t.onLoadError=t.onLoadError.bind(t),t}return function(e,t){function o(){this.constructor=e}r(e,t),e.prototype=null===t?Object.create(t):(o.prototype=t.prototype,new o)}(c,i),c.prototype.onInView=function(e){!0===e&&(this.props.src?(this.setState(function(e,t){return n({},e,{imageState:o.Loading})}),s({src:this.props.src,srcSet:this.props.srcSet,alt:this.props.alt,sizes:this.props.sizes},this.props.experimentalDecode).then(this.onLoadSuccess).catch(this.onLoadError)):this.setState(function(e,t){return n({},e,{imageState:o.LoadSuccess})}))},c.prototype.onLoadSuccess=function(){this.setState(function(e,t){return n({},e,{imageState:o.LoadSuccess})})},c.prototype.onLoadError=function(){this.setState(function(e,t){return n({},e,{imageState:o.LoadError})})},c.prototype.render=function(){var r=this,i=this.props,s=i.children,c=i.loadEagerly,p=i.observerProps,u=a(i,["children","loadEagerly","observerProps","experimentalDecode"]);return c?s({imageState:o.LoadSuccess,imageProps:u}):e.createElement(t,n({rootMargin:"50px 0px",threshold:.01},p,{onChange:this.onInView,triggerOnce:!0}),function(e){return s({imageState:r.state.imageState,imageProps:u,ref:e.ref})})},c.displayName="LazyImageFull",c}(e.Component),s=function(e,t){var r=e.src,o=e.srcSet,n=e.alt,a=e.sizes;return void 0===t&&(t=!1),new Promise(function(e,i){var s=new Image;o&&(s.srcset=o),n&&(s.alt=n),a&&(s.sizes=a),s.src=r,t&&"decode"in s?s.decode().then(function(){return e()}).catch(function(e){return i(e)}):(s.onload=e,s.onerror=i)})},c=function(t){var r=t.actual,s=t.placeholder,c=t.loading,p=t.error,u=a(t,["actual","placeholder","loading","error"]);return e.createElement(i,n({},u),function(e){var t=e.imageProps,n=e.ref;switch(e.imageState){case o.NotAsked:return!!s&&s({imageProps:t,ref:n});case o.Loading:return c?c():!!s&&s({imageProps:t,ref:n});case o.LoadSuccess:return r({imageProps:t});case o.LoadError:return p?p():r({imageProps:t})}})};c.displayName="LazyImage";export{c as LazyImage,o as ImageState,i as LazyImageFull};
+import e from"react";import r from"react-intersection-observer";import{unionize as t,ofType as n}from"unionize";var o=function(e,r){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,r){e.__proto__=r}||function(e,r){for(var t in r)r.hasOwnProperty(t)&&(e[t]=r[t])})(e,r)};var a,i=function(){return(i=Object.assign||function(e){for(var r,t=1,n=arguments.length;t<n;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e}).apply(this,arguments)};function c(e,r){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)r.indexOf(n[o])<0&&(t[n[o]]=e[n[o]])}return t}!function(e){e.NotAsked="NotAsked",e.Buffering="Buffering",e.Loading="Loading",e.LoadSuccess="LoadSuccess",e.LoadError="LoadError"}(a||(a={}));var u=t({NotAsked:{},Buffering:{},Loading:{},LoadSuccess:{},LoadError:n()}),s=t({ViewChanged:n(),BufferingEnded:{},LoadSuccess:{},LoadError:n()}),d=function(t){function n(e){var r=t.call(this,e)||this;return r.promiseCache={},r.initialState=u.NotAsked(),r.state=r.initialState,r.update=r.update.bind(r),r.reducer=r.reducer.bind(r),r}return function(e,r){function t(){this.constructor=e}o(e,r),e.prototype=null===r?Object.create(r):(t.prototype=r.prototype,new t)}(n,t),n.prototype.update=function(e){var r=this;this.setState(function(t,n){var o=r.reducer(e,t,n);return n.debugActions&&("production"===process.env.NODE_ENV&&console.warn('You are running LazyImage with debugActions="true" in production. This might have performance implications.'),console.log({action:e,prevState:t,nextState:o})),o})},n.prototype.reducer=function(e,r,t){var n=this;return s.match(e,{ViewChanged:function(e){return!0===e.inView?t.src?u.match(r,{NotAsked:function(){if(t.debounceDurationMs){var e=l(p(t.debounceDurationMs));return e.promise.then(function(){return n.update(s.BufferingEnded())}).catch(function(e){}),n.promiseCache.buffering=e,u.Buffering()}var r=f({src:t.src,srcSet:t.srcSet,alt:t.alt,sizes:t.sizes},t.experimentalDecode).then(function(e){return n.update(s.LoadSuccess({}))}).catch(function(e){return n.update(s.LoadError({msg:"Failed to load"}))});return n.promiseCache.loading=r,u.Loading()},default:function(){return r}}):u.LoadSuccess():u.match(r,{Buffering:function(){return n.promiseCache.buffering.cancel(),u.NotAsked()},default:function(){return r}})},BufferingEnded:function(){var e=f({src:t.src,srcSet:t.srcSet,alt:t.alt,sizes:t.sizes},t.experimentalDecode).then(function(e){return n.update(s.LoadSuccess({}))}).catch(function(e){return n.update(s.LoadError({msg:"Failed to load"}))});return n.promiseCache.loading=e,u.Loading()},LoadSuccess:function(){return u.LoadSuccess()},LoadError:function(e){return u.LoadError(e)}})},n.prototype.render=function(){var t=this,n=this.props,o=n.children,a=n.loadEagerly,d=n.observerProps,f=c(n,["children","loadEagerly","observerProps","experimentalDecode","debounceDurationMs","debugActions"]);return a?o({imageState:u.LoadSuccess().tag,imageProps:f}):e.createElement(r,i({rootMargin:"50px 0px",threshold:.01},d,{onChange:function(e){return t.update(s.ViewChanged({inView:e}))}}),function(e){return o({imageState:t.state.tag,imageProps:f,ref:e.ref})})},n.displayName="LazyImageFull",n}(e.Component),f=function(e,r){var t=e.src,n=e.srcSet,o=e.alt,a=e.sizes;return void 0===r&&(r=!1),new Promise(function(e,i){var c=new Image;if(n&&(c.srcset=n),o&&(c.alt=o),a&&(c.sizes=a),c.src=t,r&&"decode"in c)return c.decode().then(function(r){return e(r)}).catch(function(e){return i(e)});c.onload=e,c.onerror=i})},p=function(e){return new Promise(function(r){return setTimeout(r,e)})},l=function(e){var r=!1;return{promise:new Promise(function(t,n){e.then(function(e){return r?n({isCanceled:!0}):t(e)}),e.catch(function(e){return n(r?{isCanceled:!0}:e)})}),cancel:function(){r=!0}}},g=function(r){var t=r.actual,n=r.placeholder,o=r.loading,u=r.error,s=c(r,["actual","placeholder","loading","error"]);return e.createElement(d,i({},s),function(e){var r=e.imageProps,i=e.ref;switch(e.imageState){case a.NotAsked:return!!n&&n({imageProps:r,ref:i});case a.Loading:return o?o():!!n&&n({imageProps:r,ref:i});case a.LoadSuccess:return t({imageProps:r});case a.LoadError:return u?u():t({imageProps:r});case a.Buffering:return o?o():!!n&&n({imageProps:r,ref:i})}})};g.displayName="LazyImage";export{g as LazyImage,a as ImageState,d as LazyImageFull};
 //# sourceMappingURL=react-lazy-images.es.js.map

dist/react-lazy-images.js

@@ -1,2 +0,2 @@
-function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var t=e(require("react")),r=e(require("react-intersection-observer")),o=function(e,t){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r])})(e,t)};var a,n=function(){return(n=Object.assign||function(e){for(var t,r=1,o=arguments.length;r<o;r++)for(var a in t=arguments[r])Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a]);return e}).apply(this,arguments)};function s(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(e);a<o.length;a++)t.indexOf(o[a])<0&&(r[o[a]]=e[o[a]])}return r}(a=exports.ImageState||(exports.ImageState={})).NotAsked="NotAsked",a.Loading="Loading",a.LoadSuccess="LoadSuccess",a.LoadError="LoadError";var i=function(e){function a(t){var r=e.call(this,t)||this;return r.initialState={hasBeenInView:!1,imageState:exports.ImageState.NotAsked},r.state=r.initialState,r.onInView=r.onInView.bind(r),r.onLoadSuccess=r.onLoadSuccess.bind(r),r.onLoadError=r.onLoadError.bind(r),r}return function(e,t){function r(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}(a,e),a.prototype.onInView=function(e){!0===e&&(this.props.src?(this.setState(function(e,t){return n({},e,{imageState:exports.ImageState.Loading})}),c({src:this.props.src,srcSet:this.props.srcSet,alt:this.props.alt,sizes:this.props.sizes},this.props.experimentalDecode).then(this.onLoadSuccess).catch(this.onLoadError)):this.setState(function(e,t){return n({},e,{imageState:exports.ImageState.LoadSuccess})}))},a.prototype.onLoadSuccess=function(){this.setState(function(e,t){return n({},e,{imageState:exports.ImageState.LoadSuccess})})},a.prototype.onLoadError=function(){this.setState(function(e,t){return n({},e,{imageState:exports.ImageState.LoadError})})},a.prototype.render=function(){var e=this,o=this.props,a=o.children,i=o.loadEagerly,c=o.observerProps,p=s(o,["children","loadEagerly","observerProps","experimentalDecode"]);return i?a({imageState:exports.ImageState.LoadSuccess,imageProps:p}):t.createElement(r,n({rootMargin:"50px 0px",threshold:.01},c,{onChange:this.onInView,triggerOnce:!0}),function(t){return a({imageState:e.state.imageState,imageProps:p,ref:t.ref})})},a.displayName="LazyImageFull",a}(t.Component),c=function(e,t){var r=e.src,o=e.srcSet,a=e.alt,n=e.sizes;return void 0===t&&(t=!1),new Promise(function(e,s){var i=new Image;o&&(i.srcset=o),a&&(i.alt=a),n&&(i.sizes=n),i.src=r,t&&"decode"in i?i.decode().then(function(){return e()}).catch(function(e){return s(e)}):(i.onload=e,i.onerror=s)})},p=function(e){var r=e.actual,o=e.placeholder,a=e.loading,c=e.error,p=s(e,["actual","placeholder","loading","error"]);return t.createElement(i,n({},p),function(e){var t=e.imageProps,n=e.ref;switch(e.imageState){case exports.ImageState.NotAsked:return!!o&&o({imageProps:t,ref:n});case exports.ImageState.Loading:return a?a():!!o&&o({imageProps:t,ref:n});case exports.ImageState.LoadSuccess:return r({imageProps:t});case exports.ImageState.LoadError:return c?c():r({imageProps:t})}})};p.displayName="LazyImage",exports.LazyImage=p,exports.LazyImageFull=i;
+function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var r=e(require("react")),t=e(require("react-intersection-observer")),n=require("unionize"),o=function(e,r){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,r){e.__proto__=r}||function(e,r){for(var t in r)r.hasOwnProperty(t)&&(e[t]=r[t])})(e,r)};var a,i=function(){return(i=Object.assign||function(e){for(var r,t=1,n=arguments.length;t<n;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e}).apply(this,arguments)};function c(e,r){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)r.indexOf(n[o])<0&&(t[n[o]]=e[n[o]])}return t}(a=exports.ImageState||(exports.ImageState={})).NotAsked="NotAsked",a.Buffering="Buffering",a.Loading="Loading",a.LoadSuccess="LoadSuccess",a.LoadError="LoadError";var u=n.unionize({NotAsked:{},Buffering:{},Loading:{},LoadSuccess:{},LoadError:n.ofType()}),s=n.unionize({ViewChanged:n.ofType(),BufferingEnded:{},LoadSuccess:{},LoadError:n.ofType()}),d=function(e){function n(r){var t=e.call(this,r)||this;return t.promiseCache={},t.initialState=u.NotAsked(),t.state=t.initialState,t.update=t.update.bind(t),t.reducer=t.reducer.bind(t),t}return function(e,r){function t(){this.constructor=e}o(e,r),e.prototype=null===r?Object.create(r):(t.prototype=r.prototype,new t)}(n,e),n.prototype.update=function(e){var r=this;this.setState(function(t,n){var o=r.reducer(e,t,n);return n.debugActions&&("production"===process.env.NODE_ENV&&console.warn('You are running LazyImage with debugActions="true" in production. This might have performance implications.'),console.log({action:e,prevState:t,nextState:o})),o})},n.prototype.reducer=function(e,r,t){var n=this;return s.match(e,{ViewChanged:function(e){return!0===e.inView?t.src?u.match(r,{NotAsked:function(){if(t.debounceDurationMs){var e=l(p(t.debounceDurationMs));return e.promise.then(function(){return n.update(s.BufferingEnded())}).catch(function(e){}),n.promiseCache.buffering=e,u.Buffering()}var r=f({src:t.src,srcSet:t.srcSet,alt:t.alt,sizes:t.sizes},t.experimentalDecode).then(function(e){return n.update(s.LoadSuccess({}))}).catch(function(e){return n.update(s.LoadError({msg:"Failed to load"}))});return n.promiseCache.loading=r,u.Loading()},default:function(){return r}}):u.LoadSuccess():u.match(r,{Buffering:function(){return n.promiseCache.buffering.cancel(),u.NotAsked()},default:function(){return r}})},BufferingEnded:function(){var e=f({src:t.src,srcSet:t.srcSet,alt:t.alt,sizes:t.sizes},t.experimentalDecode).then(function(e){return n.update(s.LoadSuccess({}))}).catch(function(e){return n.update(s.LoadError({msg:"Failed to load"}))});return n.promiseCache.loading=e,u.Loading()},LoadSuccess:function(){return u.LoadSuccess()},LoadError:function(e){return u.LoadError(e)}})},n.prototype.render=function(){var e=this,n=this.props,o=n.children,a=n.loadEagerly,d=n.observerProps,f=c(n,["children","loadEagerly","observerProps","experimentalDecode","debounceDurationMs","debugActions"]);return a?o({imageState:u.LoadSuccess().tag,imageProps:f}):r.createElement(t,i({rootMargin:"50px 0px",threshold:.01},d,{onChange:function(r){return e.update(s.ViewChanged({inView:r}))}}),function(r){return o({imageState:e.state.tag,imageProps:f,ref:r.ref})})},n.displayName="LazyImageFull",n}(r.Component),f=function(e,r){var t=e.src,n=e.srcSet,o=e.alt,a=e.sizes;return void 0===r&&(r=!1),new Promise(function(e,i){var c=new Image;if(n&&(c.srcset=n),o&&(c.alt=o),a&&(c.sizes=a),c.src=t,r&&"decode"in c)return c.decode().then(function(r){return e(r)}).catch(function(e){return i(e)});c.onload=e,c.onerror=i})},p=function(e){return new Promise(function(r){return setTimeout(r,e)})},l=function(e){var r=!1;return{promise:new Promise(function(t,n){e.then(function(e){return r?n({isCanceled:!0}):t(e)}),e.catch(function(e){return n(r?{isCanceled:!0}:e)})}),cancel:function(){r=!0}}},g=function(e){var t=e.actual,n=e.placeholder,o=e.loading,a=e.error,u=c(e,["actual","placeholder","loading","error"]);return r.createElement(d,i({},u),function(e){var r=e.imageProps,i=e.ref;switch(e.imageState){case exports.ImageState.NotAsked:return!!n&&n({imageProps:r,ref:i});case exports.ImageState.Loading:return o?o():!!n&&n({imageProps:r,ref:i});case exports.ImageState.LoadSuccess:return t({imageProps:r});case exports.ImageState.LoadError:return a?a():t({imageProps:r});case exports.ImageState.Buffering:return o?o():!!n&&n({imageProps:r,ref:i})}})};g.displayName="LazyImage",exports.LazyImage=g,exports.LazyImageFull=d;
 //# sourceMappingURL=react-lazy-images.js.map

dist/react-lazy-images.umd.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-intersection-observer")):"function"==typeof define&&define.amd?define(["exports","react","react-intersection-observer"],t):t(e.reactLazyImages={},e.react,null)}(this,function(e,t,r){t=t&&t.hasOwnProperty("default")?t.default:t,r=r&&r.hasOwnProperty("default")?r.default:r;var o=function(e,t){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r])})(e,t)};var a,n=function(){return(n=Object.assign||function(e){for(var t,r=1,o=arguments.length;r<o;r++)for(var a in t=arguments[r])Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a]);return e}).apply(this,arguments)};function i(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(e);a<o.length;a++)t.indexOf(o[a])<0&&(r[o[a]]=e[o[a]])}return r}(a=e.ImageState||(e.ImageState={})).NotAsked="NotAsked",a.Loading="Loading",a.LoadSuccess="LoadSuccess",a.LoadError="LoadError";var s=function(a){function s(t){var r=a.call(this,t)||this;return r.initialState={hasBeenInView:!1,imageState:e.ImageState.NotAsked},r.state=r.initialState,r.onInView=r.onInView.bind(r),r.onLoadSuccess=r.onLoadSuccess.bind(r),r.onLoadError=r.onLoadError.bind(r),r}return function(e,t){function r(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}(s,a),s.prototype.onInView=function(t){!0===t&&(this.props.src?(this.setState(function(t,r){return n({},t,{imageState:e.ImageState.Loading})}),c({src:this.props.src,srcSet:this.props.srcSet,alt:this.props.alt,sizes:this.props.sizes},this.props.experimentalDecode).then(this.onLoadSuccess).catch(this.onLoadError)):this.setState(function(t,r){return n({},t,{imageState:e.ImageState.LoadSuccess})}))},s.prototype.onLoadSuccess=function(){this.setState(function(t,r){return n({},t,{imageState:e.ImageState.LoadSuccess})})},s.prototype.onLoadError=function(){this.setState(function(t,r){return n({},t,{imageState:e.ImageState.LoadError})})},s.prototype.render=function(){var o=this,a=this.props,s=a.children,c=a.loadEagerly,u=a.observerProps,p=i(a,["children","loadEagerly","observerProps","experimentalDecode"]);return c?s({imageState:e.ImageState.LoadSuccess,imageProps:p}):t.createElement(r,n({rootMargin:"50px 0px",threshold:.01},u,{onChange:this.onInView,triggerOnce:!0}),function(e){return s({imageState:o.state.imageState,imageProps:p,ref:e.ref})})},s.displayName="LazyImageFull",s}(t.Component),c=function(e,t){var r=e.src,o=e.srcSet,a=e.alt,n=e.sizes;return void 0===t&&(t=!1),new Promise(function(e,i){var s=new Image;o&&(s.srcset=o),a&&(s.alt=a),n&&(s.sizes=n),s.src=r,t&&"decode"in s?s.decode().then(function(){return e()}).catch(function(e){return i(e)}):(s.onload=e,s.onerror=i)})},u=function(r){var o=r.actual,a=r.placeholder,c=r.loading,u=r.error,p=i(r,["actual","placeholder","loading","error"]);return t.createElement(s,n({},p),function(t){var r=t.imageProps,n=t.ref;switch(t.imageState){case e.ImageState.NotAsked:return!!a&&a({imageProps:r,ref:n});case e.ImageState.Loading:return c?c():!!a&&a({imageProps:r,ref:n});case e.ImageState.LoadSuccess:return o({imageProps:r});case e.ImageState.LoadError:return u?u():o({imageProps:r})}})};u.displayName="LazyImage",e.LazyImage=u,e.LazyImageFull=s});
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("react-intersection-observer"),require("unionize")):"function"==typeof define&&define.amd?define(["exports","react","react-intersection-observer","unionize"],r):r(e.reactLazyImages={},e.react,null,e.unionize)}(this,function(e,r,t,n){r=r&&r.hasOwnProperty("default")?r.default:r,t=t&&t.hasOwnProperty("default")?t.default:t;var o=function(e,r){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,r){e.__proto__=r}||function(e,r){for(var t in r)r.hasOwnProperty(t)&&(e[t]=r[t])})(e,r)};var a,i=function(){return(i=Object.assign||function(e){for(var r,t=1,n=arguments.length;t<n;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e}).apply(this,arguments)};function c(e,r){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)r.indexOf(n[o])<0&&(t[n[o]]=e[n[o]])}return t}(a=e.ImageState||(e.ImageState={})).NotAsked="NotAsked",a.Buffering="Buffering",a.Loading="Loading",a.LoadSuccess="LoadSuccess",a.LoadError="LoadError";var u=n.unionize({NotAsked:{},Buffering:{},Loading:{},LoadSuccess:{},LoadError:n.ofType()}),s=n.unionize({ViewChanged:n.ofType(),BufferingEnded:{},LoadSuccess:{},LoadError:n.ofType()}),d=function(e){function n(r){var t=e.call(this,r)||this;return t.promiseCache={},t.initialState=u.NotAsked(),t.state=t.initialState,t.update=t.update.bind(t),t.reducer=t.reducer.bind(t),t}return function(e,r){function t(){this.constructor=e}o(e,r),e.prototype=null===r?Object.create(r):(t.prototype=r.prototype,new t)}(n,e),n.prototype.update=function(e){var r=this;this.setState(function(t,n){var o=r.reducer(e,t,n);return n.debugActions&&("production"===process.env.NODE_ENV&&console.warn('You are running LazyImage with debugActions="true" in production. This might have performance implications.'),console.log({action:e,prevState:t,nextState:o})),o})},n.prototype.reducer=function(e,r,t){var n=this;return s.match(e,{ViewChanged:function(e){return!0===e.inView?t.src?u.match(r,{NotAsked:function(){if(t.debounceDurationMs){var e=l(p(t.debounceDurationMs));return e.promise.then(function(){return n.update(s.BufferingEnded())}).catch(function(e){}),n.promiseCache.buffering=e,u.Buffering()}var r=f({src:t.src,srcSet:t.srcSet,alt:t.alt,sizes:t.sizes},t.experimentalDecode).then(function(e){return n.update(s.LoadSuccess({}))}).catch(function(e){return n.update(s.LoadError({msg:"Failed to load"}))});return n.promiseCache.loading=r,u.Loading()},default:function(){return r}}):u.LoadSuccess():u.match(r,{Buffering:function(){return n.promiseCache.buffering.cancel(),u.NotAsked()},default:function(){return r}})},BufferingEnded:function(){var e=f({src:t.src,srcSet:t.srcSet,alt:t.alt,sizes:t.sizes},t.experimentalDecode).then(function(e){return n.update(s.LoadSuccess({}))}).catch(function(e){return n.update(s.LoadError({msg:"Failed to load"}))});return n.promiseCache.loading=e,u.Loading()},LoadSuccess:function(){return u.LoadSuccess()},LoadError:function(e){return u.LoadError(e)}})},n.prototype.render=function(){var e=this,n=this.props,o=n.children,a=n.loadEagerly,d=n.observerProps,f=c(n,["children","loadEagerly","observerProps","experimentalDecode","debounceDurationMs","debugActions"]);return a?o({imageState:u.LoadSuccess().tag,imageProps:f}):r.createElement(t,i({rootMargin:"50px 0px",threshold:.01},d,{onChange:function(r){return e.update(s.ViewChanged({inView:r}))}}),function(r){return o({imageState:e.state.tag,imageProps:f,ref:r.ref})})},n.displayName="LazyImageFull",n}(r.Component),f=function(e,r){var t=e.src,n=e.srcSet,o=e.alt,a=e.sizes;return void 0===r&&(r=!1),new Promise(function(e,i){var c=new Image;if(n&&(c.srcset=n),o&&(c.alt=o),a&&(c.sizes=a),c.src=t,r&&"decode"in c)return c.decode().then(function(r){return e(r)}).catch(function(e){return i(e)});c.onload=e,c.onerror=i})},p=function(e){return new Promise(function(r){return setTimeout(r,e)})},l=function(e){var r=!1;return{promise:new Promise(function(t,n){e.then(function(e){return r?n({isCanceled:!0}):t(e)}),e.catch(function(e){return n(r?{isCanceled:!0}:e)})}),cancel:function(){r=!0}}},g=function(t){var n=t.actual,o=t.placeholder,a=t.loading,u=t.error,s=c(t,["actual","placeholder","loading","error"]);return r.createElement(d,i({},s),function(r){var t=r.imageProps,i=r.ref;switch(r.imageState){case e.ImageState.NotAsked:return!!o&&o({imageProps:t,ref:i});case e.ImageState.Loading:return a?a():!!o&&o({imageProps:t,ref:i});case e.ImageState.LoadSuccess:return n({imageProps:t});case e.ImageState.LoadError:return u?u():n({imageProps:t});case e.ImageState.Buffering:return a?a():!!o&&o({imageProps:t,ref:i})}})};g.displayName="LazyImage",e.LazyImage=g,e.LazyImageFull=d});
 //# sourceMappingURL=react-lazy-images.umd.js.map

package.json

 {
   "name": "react-lazy-images",
   "description": "React utilities for lazy image loading",
-  "version": "1.0.0",
+  "version": "1.1.0-rc.1",
   "source": "src/index.tsx",
@@ -13,3 +13,4 @@ "module": "dist/react-lazy-images.es.js",
     "dev:ts": "tsc --watch --pretty",
-    "build": "npm-run-all bundle:prod size",
+    "clean": "rimraf dist/",
+    "build": "npm-run-all clean bundle:prod size",
     "bundle:prod": "microbundle build",
@@ -67,3 +68,4 @@ "bundle:watch": "microbundle watch",
   "dependencies": {
-    "react-intersection-observer": "^6.1.0"
+    "react-intersection-observer": "^6.1.0",
+    "unionize": "^2.1.2"
   },
@@ -93,3 +95,3 @@ "peerDependencies": {
     "lint-staged": "^7.2.0",
-    "microbundle": "^0.5.1",
+    "microbundle": "0.5.1",
     "npm-run-all": "^4.1.3",
@@ -103,5 +105,5 @@ "prettier": "^1.13.7",
     "tachyons": "^4.10.0",
-    "typescript": "^2.9.2",
+    "typescript": "2.9.2",
     "typescript-eslint-parser": "^16.0.1"
   }
 }

src/react-intersection-observer.d.ts

@@ -58,3 +58,3 @@ /* Custom react-interesction-observer types, that match upstream */
     /** Call this function whenever the in view state changes */
-    onChange?(inView: boolean | React.FormEvent<HTMLElement>): void;
+    onChange?(inView: boolean): void;
   }
@@ -61,0 +61,0 @@

New alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

123030

increased by36.61%

Lines of code

576

increased by8.68%

Worsened metrics

Dependency count

4

increased by33.33%

Number of package files

15

decreased by-16.67%

Number of low quality alerts

3

increased by50%

Number of low supply chain risk alerts

3

increased byInfinity%

Dependency changes

• + Addedunionize@^2.1.2

• + Addedunionize@2.2.0(transitive)