react-progressive-graceful-image/umd/react-progressive-graceful-image.min.js

Graceful Progressive image loading for React

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],t):"object"==typeof exports?exports.ReactProgressiveGracefulImage=t(require("react"),require("react-dom")):e.ReactProgressiveGracefulImage=t(e.React,e.ReactDom)}(window,function(r,n){return a={},o.m=i=[function(e,t){e.exports=r},function(e,t){e.exports=n},function(e,t,r){"use strict";e.exports=function(e,t,r,n,o,i,a,s){if(0,!e){var u;if(void 0===t)u=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var c=[r,n,o,i,a,s],l=0;(u=new Error(t.replace(/%s/g,function(){return c[l++]}))).name="Invariant Violation"}throw u.framesToPop=1,u}}},function(e,t,r){e.exports=r(4)()},function(e,t,r){"use strict";var s=r(5);function n(){}function o(){}o.resetWarningCache=n,e.exports=function(){function e(e,t,r,n,o,i){if(i!==s){var a=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw a.name="Invariant Violation",a}}function t(){return e}var r={array:e.isRequired=e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:o,resetWarningCache:n};return r.PropTypes=r}},function(e,t,r){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,r){"use strict";r.r(t);var l=r(0),n=r.n(l),i=r(1),c=(r(3),/^-?\d*\.?\d+(px|%)$/);function a(r,n){return Array.isArray(r)&&Array.isArray(n)&&r.length===n.length?r.some(function(e,t){return a(r[t],n[t])}):r!==n}var s=new Map;function u(e){void 0===e&&(e={});for(var t,r=e.root||null,n=function(e){var t=(e?e.trim():"0px").split(/\s+/).map(function(e){if(!c.test(e))throw new Error("rootMargin must be a string literal containing pixels and/or percent values");return e}),r=t[0],n=void 0===r?"0px":r,o=t[1],i=void 0===o?n:o,a=t[2],s=void 0===a?n:a,u=t[3];return n+" "+i+" "+s+" "+(void 0===u?i:u)}(e.rootMargin),o=Array.isArray(e.threshold)?e.threshold:[null!=e.threshold?e.threshold:0],i=s.keys();t=i.next().value;){if(!(r!==t.root||n!==t.rootMargin||a(o,t.thresholds)))return t}return null}function o(e,t){var r=s.get(e);if(r)for(var n,o=r.values();n=o.next().value;)if(n.target===t.target)return n;return null}function f(e,t){for(var r=0;r<e.length;r++){var n=o(t,e[r]);n&&n.handleChange(e[r])}}var d=r(2),p=r.n(d),h={},v=Object.create(null,{errorReporter:{configurable:!1,get:function(){return h.errorReporter||function(e){return p()(!1,e)}},set:function(e){if("function"!=typeof e)throw new Error("ReactIntersectionObserver: `Config.errorReporter` must be a callable");h.errorReporter=e}}});function g(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function b(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}var y=["root","rootMargin","threshold"],m=["root","rootMargin","threshold","disabled"],w=Object.prototype,O=w.hasOwnProperty,S=w.toString,_=function(o){function e(){for(var n,e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return b(g(n=o.call.apply(o,[this].concat(t))||this),"handleChange",function(e){n.props.onChange(e,n.externalUnobserve)}),b(g(n),"handleNode",function(e){var t=n.props.children;if(null!=t){var r=t.ref;r&&("function"==typeof r?r(e):"object"==typeof r&&(r.current=e))}n.targetNode=e&&Object(i.findDOMNode)(e)}),b(g(n),"observe",function(){return null!=n.props.children&&!n.props.disabled&&(n.targetNode?(n.observer=function(e){return u(e)||new IntersectionObserver(f,e)}(function(n){return y.reduce(function(e,t){if(O.call(n,t)){var r="root"===t&&"[object String]"===S.call(n[t]);e[t]=r?document.querySelector(n[t]):n[t]}return e},{})}(n.props)),n.target=n.targetNode,function(e){s.has(e.observer)||s.set(e.observer,new Set),s.get(e.observer).add(e),e.observer.observe(e.target)}(g(n)),!0):(v.errorReporter("ReactIntersectionObserver: Can't find DOM node in the provided children. Make sure to render at least one DOM node in the tree."),!1))}),b(g(n),"unobserve",function(e){!function(e,t){if(s.has(e.observer)){var r=s.get(e.observer);r.delete(e)&&(0<r.size?e.observer.unobserve(t):(e.observer.disconnect(),s.delete(e.observer)))}}(g(n),e)}),b(g(n),"externalUnobserve",function(){n.unobserve(n.targetNode)}),n}!function(e,t){e.prototype=Object.create(t.prototype),(e.prototype.constructor=e).__proto__=t}(e,o);var t=e.prototype;return t.getSnapshotBeforeUpdate=function(t){var r=this;this.prevTargetNode=this.targetNode;var e=m.some(function(e){return a(r.props[e],t[e])});return e&&this.prevTargetNode&&(t.disabled||this.unobserve(this.prevTargetNode)),e},t.componentDidUpdate=function(e,t,r){var n=!1;r||(n=this.prevTargetNode!==this.targetNode)&&null!=this.prevTargetNode&&this.unobserve(this.prevTargetNode),(r||n)&&this.observe()},t.componentDidMount=function(){this.observe()},t.componentWillUnmount=function(){this.targetNode&&this.unobserve(this.targetNode)},t.render=function(){var e=this.props.children;return null!=e?n.a.cloneElement(n.a.Children.only(e),{ref:this.handleNode}):null},e}(n.a.Component);function j(e){return(j="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function x(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function E(e){return(E=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function I(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function M(e,t){return(M=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function P(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}b(_,"displayName","IntersectionObserver"),r.d(t,"default",function(){return N});function T(){return"undefined"!=typeof window}var N=function(){function t(e){var a;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),a=function(e,t){return!t||"object"!==j(t)&&"function"!=typeof t?I(e):t}(this,E(t).call(this,e)),P(I(a),"image",void 0),P(I(a),"handleOnlineStatus",function(){a.setState({isOnline:window.navigator.onLine})}),P(I(a),"loadImage",function(e,t){a.image&&(a.image.onload=null,a.image.onerror=null);var r=new Image;(a.image=r).onload=a.onLoad,r.onerror=function(e){a.onError(e)},r.src=e,t&&(r.srcset=t.srcSet,r.sizes=t.sizes)}),P(I(a),"onLoad",function(){a.props.delay?a.setImageWithDelay():a.setImage()}),P(I(a),"setImageWithDelay",function(){setTimeout(function(){a.setImage()},a.props.delay)}),P(I(a),"setImage",function(){a._isMounted&&a.setState({image:a.image.src,loading:!1,srcSetData:{srcSet:a.image.srcset||"",sizes:a.image.sizes||""}},function(){window.removeEventListener("online",a.handleOnlineStatus),window.removeEventListener("offline",a.handleOnlineStatus)})}),P(I(a),"onError",function(e){var t=a.props.onError;t&&t(e)}),P(I(a),"handleIntersection",function(e,t,r){if(e.isIntersecting){var n=a.props,o=n.src,i=n.srcSetData;r&&(a.loadImage(o,i),t())}}),a._isMounted=!1,a.state={isOnline:!T()||window.navigator.onLine,image:e.placeholder,loading:!0,srcSetData:{srcSet:"",sizes:""}},a}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&M(e,t)}(t,l["Component"]),function(e,t,r){t&&x(e.prototype,t),r&&x(e,r)}(t,[{key:"componentDidMount",value:function(){this._isMounted=!0,T()&&(window.addEventListener("online",this.handleOnlineStatus),window.addEventListener("offline",this.handleOnlineStatus))}},{key:"componentDidUpdate",value:function(e){var t=this,r=this.props,n=r.src,o=r.placeholder,i=r.srcSetData;n!==e.src&&this.setState({image:o,loading:!0},function(){t.loadImage(n,i)})}},{key:"componentWillUnmount",value:function(){this._isMounted=!1,this.image&&(this.image.onload=null,this.image.onerror=null),this.timeout&&window.clearTimeout(this.timeout),window.removeEventListener("online",this.handleOnlineStatus),window.removeEventListener("offline",this.handleOnlineStatus)}},{key:"render",value:function(){var r=this,e={onChange:function(e,t){return r.handleIntersection(e,t,r.state.isOnline)},rootMargin:this.props.rootMargin||"0% 0% 25%",threshold:this.props.threshold||[0],disabled:this.props.noLazyLoad||!1},t=this.state,n=t.image,o=t.loading,i=t.srcSetData,a=this.props,s=a.src,u=a.children,c=(a.noRetry,a.noLazyLoad);if(!u||"function"!=typeof u)throw new Error("ProgressiveImage requires a function as its only child");return c?u(s,!1,this.props.srcSetData):l.createElement(_,e,u(n,o,i))}}]),t}()}],o.c=a,o.d=function(e,t,r){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(t,e){if(1&e&&(t=o(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(o.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var n in t)o.d(r,n,function(e){return t[e]}.bind(null,n));return r},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="",o(o.s=6);function o(e){if(a[e])return a[e].exports;var t=a[e]={i:e,l:!1,exports:{}};return i[e].call(t.exports,t,t.exports,o),t.l=!0,t.exports}var i,a});