UNPKG

react-fetch-preloader

Version:

Simple React component for display preloader while fetching

3 lines (2 loc) 4.64 kB
!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],r):r(e.ReactFetchPreloader={},e.React)}(this,function(e,r){"use strict";function t(e,r){if(!(e instanceof r))throw new TypeError("Cannot call a class as a function")}function n(e,r){for(var t=0;t<r.length;t++){var n=r[t];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function o(e,r,t){return r&&n(e.prototype,r),t&&n(e,t),e}function a(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function i(){return(i=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e}).apply(this,arguments)}function u(e,r){if("function"!=typeof r&&null!==r)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(r&&r.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),r&&c(e,r)}function l(e){return(l=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function c(e,r){return(c=Object.setPrototypeOf||function(e,r){return e.__proto__=r,e})(e,r)}function s(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function f(e,r){return!r||"object"!=typeof r&&"function"!=typeof r?s(e):r}r=r&&r.hasOwnProperty("default")?r.default:r;var p=50,d=function(e){function n(){var e,o;t(this,n);for(var i=arguments.length,u=new Array(i),c=0;c<i;c++)u[c]=arguments[c];return a(s(s(o=f(this,(e=l(n)).call.apply(e,[this].concat(u))))),"state",{responseTime:0,isLoading:!1,showPreloader:!1,data:null,error:null}),a(s(s(o)),"checkResponse",function(){var e=o.props.duration,r=o.state,t=r.responseTime,n=r.isLoading,a=r.showPreloader;o.setState(function(e){return{responseTime:e.responseTime+p}},function(){t>=e&&n&&(a||o.setState({showPreloader:!0}),clearInterval(o.intervalId))})}),a(s(s(o)),"makeResponse",function(e){var r=o.props.fetch;o.setState({responseTime:0,isLoading:!0}),r(e).then(function(e){return e.json()}).then(function(e){o.setState({isLoading:!1,data:e,showPreloader:!1}),clearInterval(o.intervalId)}).catch(function(e){o.setState({isLoading:!1,error:e,showPreloader:!1}),clearInterval(o.intervalId)})}),a(s(s(o)),"renderContent",function(){var e=o.props,t=e.loaded,n=e.errored,a=o.state,i=a.data,u=a.isLoading,l=a.error;return l?r.createElement(n,{error:l}):!u&&i?r.createElement(t,{data:i}):null}),o}return u(n,r.Component),o(n,[{key:"componentDidMount",value:function(){var e=this.props,r=e.url,t=e.loaded;if(!r)throw new Error("url param is required!");if(!t)throw new Error("loaded param is required!");this.makeResponse(r),this.intervalId=setInterval(this.checkResponse,p)}},{key:"componentDidUpdate",value:function(e){var r=this.props.url;r!==e.url&&(this.makeResponse(r),this.intervalId=setInterval(this.checkResponse,p))}},{key:"componentWillUnmount",value:function(){clearInterval(this.intervalId)}},{key:"render",value:function(){var e=this.state.showPreloader,t=this.props.preloader;return e?r.createElement(t,null):this.renderContent()}}]),n}();a(d,"defaultProps",{fetch:"undefined"!=typeof window?window.fetch:function(){},duration:500,errored:function(){return null},preloader:function(){return r.createElement("span",null,"Loading...")}});e.withPreloader=function(e){return function(n){function c(){var e,n;t(this,c);for(var o=arguments.length,u=new Array(o),p=0;p<o;p++)u[p]=arguments[p];return a(s(s(n=f(this,(e=l(c)).call.apply(e,[this].concat(u))))),"state",{}),a(s(s(n)),"preload",function(e,r){if(!e)throw new Error("Id param is required!");if(!r)throw new Error("Url param is required!");n.setState(a({},e,{url:r}))}),a(s(s(n)),"renderPreloader",function(e,t){var o=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.forEach(function(r){a(e,r,t[r])})}return e}({},n.props.preloadOptions,t);return n.state[e]&&r.createElement(d,i({url:n.state[e].url},o))}),n}return u(c,r.Component),o(c,[{key:"render",value:function(){return r.createElement(e,{preload:this.preload,renderPreloader:this.renderPreloader})}}]),c}()},e.ShowPreloader=d,Object.defineProperty(e,"__esModule",{value:!0})}); //# sourceMappingURL=react-fetch-preloader.umd.production.min.js.map