diff --git a/dist/index.js b/dist/index.js
index ef3a2ee..75e01a6 100644
--- a/dist/index.js
+++ b/dist/index.js
@@ -1 +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["react-xmasonry"]=t(require("react")):e["react-xmasonry"]=t(e.React)}("undefined"!=typeof self?self:this,function(e){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,t),i.l=!0,i.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(t,n){t.exports=e},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0}),t.XBlock=t.XMasonry=void 0;var i=n(3),o=r(i),a=n(4),s=r(a);t.XMasonry=o.default,t.XBlock=s.default},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.debounce=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:45,n=0;return function(){0!==n&&clearTimeout(n),n=setTimeout(function(){n=0,e()},t)}},t.isServer=!("undefined"!=typeof document&&"undefined"!=typeof window)},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},l=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),u=n(0),c=function(e){return e&&e.__esModule?e:{default:e}}(u),d=n(2),h=0,p=!1,f=function e(){if(!d.isServer){if(!document.body)return void document.addEventListener("DOMContentLoaded",e);var t=document.createElement("div");t.style.overflow="scroll",t.style.height=t.style.width="200px",t.style.visibility="hidden",t.style.padding=t.style.margin=t.style.border=0,document.body.appendChild(t),h=t.offsetWidth-t.clientWidth||0,p=!0,document.body.removeChild(t)}},v=function(e){function t(e){i(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.state={blocks:{},containerHeight:0,columns:1,containerWidth:0},n.pastChildren=0,n.columns=n.state.columns,n.blocks=n.state.blocks,n.container=null,n.debouncedResize=(0,d.debounce)(n.updateContainerWidth.bind(n)),n.fixedHeight=0,n.containerWidth=n.state.containerWidth,n.update=n.updateInternal.bind(n),n.smartUpdate=0,p||f(),n.props.responsive&&!d.isServer&&window.addEventListener("resize",n.debouncedResize),!d.isServer&&n.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.addEventListener("loadingdone",n.update),d.isServer&&(n.state.containerWidth=n.containerWidth=n.props.width||999*n.props.targetBlockWidth,n.columns=n.getColumnsNumber(n.state.containerWidth)),n.pastChildren=e.children,n}return a(t,e),l(t,[{key:"getBestFitColumn",value:function(e){for(var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,n=Math.min(e.length-t+1,this.props.maxColumns-t+1),r=0,i=1/0,o=0;o<n;++o){var a=Math.max.apply(null,e.slice(o,o+t));a<i&&(i=a,r=o)}return{col:r,height:i}}}]),l(t,[{key:"updateInternal",value:function(){return!this.updateContainerWidth()&&this.measureChildren()}},{key:"componentDidMount",value:function(){this.updateInternal()}},{key:"componentWillUnmount",value:function(){d.isServer||window.removeEventListener("resize",this.debouncedResize),!d.isServer&&this.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.removeEventListener("loadingdone",this.update),this.smartUpdate&&clearTimeout(this.smartUpdate)}},{key:"componentDidUpdate",value:function(){if(c.default.Children.count(this.props.children)<c.default.Children.count(this.pastChildren)){var e=new Set,t={};c.default.Children.forEach(this.pastChildren,function(t,n){return t&&e.add(null===t.key?n:t.key)}),c.default.Children.forEach(this.props.children,function(n,r){if(n){var i=null===n.key?r:n.key;e.has(i)||(t[i]={})}}),this.recalculatePositions(null,t)}this.pastChildren=this.props.children,this.updateInternal()&&this.props.smartUpdate&&this.runSmartUpdate()}},{key:"runSmartUpdate",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:100;if(100===t&&this.smartUpdate)clearInterval(this.smartUpdate),this.smartUpdate=0;else if(this.smartUpdate)return;this.smartUpdate=setTimeout(function(){var n=!d.isServer&&void 0!==document.hidden&&document.hidden;if(n)var r=document.addEventListener("visibilitychange",function(){document.hidden||(document.removeEventListener("visibilitychange",r),e.runSmartUpdate(2*t))},!1);if(e.smartUpdate=0,e.updateInternal())return void e.runSmartUpdate();n||e.runSmartUpdate(2*t)},Math.min(t,this.props.smartUpdateCeil))}},{key:"getColumnsNumber",value:function(e){return Math.max(1,Math.round(e/this.props.targetBlockWidth))}},{key:"updateContainerWidth",value:function(){var e=d.isServer&&!this.container?this.props.width||999*this.props.targetBlockWidth:this.container?this.container.clientWidth:0;return e!==this.containerWidth&&e!==this.containerWidth+h&&(this.setState({columns:this.columns=this.getColumnsNumber(e),containerWidth:this.containerWidth=e,blocks:this.blocks={}}),!0)}},{key:"measureChildren",value:function(){if(!this.container)return!1;for(var e={},t=!1,n=0;n<this.container.children.length;n++){var r=this.container.children[n],i=r.hasAttribute("data-xkey"),o=r.getAttribute("data-key"),a=+r.getAttribute("data-width");(i||(this.blocks[o]||{}).height!==r.clientHeight||(this.blocks[o]||{}).width!==a)&&(e[o]={height:r.clientHeight},t||(t=!0))}return t&&this.recalculatePositions(e),t}},{key:"recalculatePositions",value:function(){for(var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,n=void 0,r=[],i=0;i<this.columns;++i)r.push(0);for(var o in this.blocks)this.blocks.hasOwnProperty(o)&&void 0===this.blocks[o]&&(null===t&&(t={}),t[o]={});if(t){n={};for(var a in this.blocks)this.blocks.hasOwnProperty(a)&&!t.hasOwnProperty(a)&&(n[a]=this.blocks[a]);for(var l in e)e.hasOwnProperty(l)&&!t.hasOwnProperty(l)&&(n[l]=e[l])}else n=s({},this.blocks,e);for(var u=0;u<this.container.children.length;u++){var c=this.container.children[u],d=c.getAttribute("data-key");if(n.hasOwnProperty(d)&&(!t||!t.hasOwnProperty(d))){var h=+c.getAttribute("data-width")||1,p=this.getBestFitColumn(r,h),f=p.col,v=p.height,m=v+n[d].height;n[d].left=this.containerWidth*f/this.columns,n[d].top=v,n[d].width=Math.min(h,this.columns);for(var y=0;y<h;++y)r[f+y]=m}}if(this.props.center&&0===r[r.length-1]){for(var b=1;0===r[r.length-1-b];++b);var g=this.containerWidth*b/this.columns/2;for(var k in n)n.hasOwnProperty(k)&&(n[k].left+=g)}this.setState({blocks:this.blocks=n,containerHeight:Math.max.apply(null,r)})}},{key:"render",value:function(){var e=this,n={},i=0,o=0===this.containerWidth?[]:this.props.children||[],a=c.default.Children.map(o,function(t,r){if(!t)return null;var o=null===t.key?r:t.key,a=e.blocks[o];return a||++i,n[o]=null,a?c.default.cloneElement(t,{"data-key":o,key:o,style:{left:Math.floor(a.left),top:a.top},measured:!0,height:a.height,parent:e}):c.default.cloneElement(t,{"data-key":o,"data-xkey":o,key:o,style:{visibility:d.isServer?"visible":"hidden"},height:0,parent:e})});for(var l in this.blocks)this.blocks.hasOwnProperty(l)&&!n.hasOwnProperty(l)&&(this.blocks[l]=void 0);var u=a.length-i>0||0===a.length?this.fixedHeight=this.state.containerHeight:this.fixedHeight,h=this.props,p=(h.center,h.maxColumns,h.responsive,h.smartUpdate,h.smartUpdateCeil,h.targetBlockWidth,h.updateOnImagesLoad,h.updateOnFontLoad,h.className),f=h.style,v=r(h,["center","maxColumns","responsive","smartUpdate","smartUpdateCeil","targetBlockWidth","updateOnImagesLoad","updateOnFontLoad","className","style"]);return c.default.createElement("div",s({className:"xmasonry"+(d.isServer?" xmasonry-static":"")+(p?" "+p:""),style:s({},t.containerStyle,{height:d.isServer?void 0:u},f),ref:function(t){return e.container=t}},v),a)}}]),t}(c.default.Component);v.defaultProps={center:!0,maxColumns:d.isServer?3:1/0,responsive:!0,smartUpdate:!0,smartUpdateCeil:1/0,targetBlockWidth:300,updateOnFontLoad:!0,updateOnImagesLoad:!0},v.containerStyle={position:"relative"},t.default=v},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},l=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),u=n(0),c=function(e){return e&&e.__esModule?e:{default:e}}(u),d=n(2),h=function(e){function t(){var e,n,r,a;i(this,t);for(var s=arguments.length,l=Array(s),u=0;u<s;u++)l[u]=arguments[u];return n=r=o(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(l))),r.divElement=null,r.placed=!1,a=n,o(r,a)}return a(t,e),l(t,[{key:"componentDidUpdate",value:function(){var e=this;if(!this.placed&&this.props.parent&&!this.props["data-xkey"]){this.placed=!0;var t=this.props.parent;requestAnimationFrame(function(){if(e.divElement){var n=Array.prototype.slice.call(e.divElement.querySelectorAll("img"));n.length>0&&t.props.updateOnImagesLoad&&n.forEach(function(e){return!e.complete&&e.addEventListener("load",t.update)}),e.props.height!==e.divElement.clientHeight&&t.update()}})}}},{key:"render",value:function(){var e=this,n=this.props,i=n.width,o=(n.height,n.measured),a=(n.parent,n.style),l=r(n,["width","height","measured","parent","style"]),u=this.props.parent.columns,h=Math.min(i||1,u,this.props.parent.props.maxColumns);return a.width=Math.floor(h*this.props.parent.containerWidth/u),c.default.createElement("div",s({"data-width":h},l,{style:s({},a,t.defaultStyle),className:o?"xblock":d.isServer?"xblock xblock-static":"",ref:function(t){return e.divElement=t}}),this.props.children)}}]),t}(c.default.Component);h.defaultProps={width:1,measured:!1},h.defaultStyle={position:d.isServer?void 0:"absolute",boxSizing:"border-box"},t.default=h}])});
\ No newline at end of file
+!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["react-xmasonry"]=t(require("react")):e["react-xmasonry"]=t(e.React)}("undefined"!=typeof self?self:this,function(e){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,t),i.l=!0,i.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(t,n){t.exports=e},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0}),t.XBlock=t.XMasonry=void 0;var i=n(3),o=r(i),a=n(5),s=r(a);t.XMasonry=o.default,t.XBlock=s.default},function(e,t,n){"use strict";(function(e){Object.defineProperty(t,"__esModule",{value:!0}),t.debounce=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:45,n=0;return function(){0!==n&&clearTimeout(n),n=setTimeout(function(){n=0,e()},t)}},t.isServer="false"!==((e||{}).env||{}).REACT_XMASONRY_SSR_ENABLED&&!("undefined"!=typeof document&&"undefined"!=typeof window)}).call(t,n(4))},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},u=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),c=function(e){return e&&e.__esModule?e:{default:e}}(l),d=n(2),h=0,p=!1,f=function e(){if(!d.isServer){if(!document.body)return void document.addEventListener("DOMContentLoaded",e);var t=document.createElement("div");t.style.overflow="scroll",t.style.height=t.style.width="200px",t.style.visibility="hidden",t.style.padding=t.style.margin=t.style.border=0,document.body.appendChild(t),h=t.offsetWidth-t.clientWidth||0,p=!0,document.body.removeChild(t)}},m=function(e){function t(e){i(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.state={blocks:{},containerHeight:0,columns:1,containerWidth:0},n.pastChildren=0,n.columns=n.state.columns,n.blocks=n.state.blocks,n.container=null,n.debouncedResize=(0,d.debounce)(n.updateContainerWidth.bind(n)),n.fixedHeight=0,n.containerWidth=n.state.containerWidth,n.update=n.updateInternal.bind(n),n.smartUpdate=0,p||f(),n.props.responsive&&!d.isServer&&window.addEventListener("resize",n.debouncedResize),!d.isServer&&n.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.addEventListener("loadingdone",n.update),d.isServer&&(n.state.containerWidth=n.containerWidth=n.props.width||999*n.props.targetBlockWidth,n.columns=n.getColumnsNumber(n.state.containerWidth)),n.pastChildren=e.children,n}return a(t,e),u(t,[{key:"getBestFitColumn",value:function(e){for(var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,n=Math.min(e.length-t+1,this.props.maxColumns-t+1),r=0,i=1/0,o=0;o<n;++o){var a=Math.max.apply(null,e.slice(o,o+t));a<i&&(i=a,r=o)}return{col:r,height:i}}}]),u(t,[{key:"updateInternal",value:function(){return!this.updateContainerWidth()&&this.measureChildren()}},{key:"componentDidMount",value:function(){this.updateInternal()}},{key:"componentWillUnmount",value:function(){d.isServer||window.removeEventListener("resize",this.debouncedResize),!d.isServer&&this.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.removeEventListener("loadingdone",this.update),this.smartUpdate&&clearTimeout(this.smartUpdate)}},{key:"componentDidUpdate",value:function(){if(c.default.Children.count(this.props.children)<c.default.Children.count(this.pastChildren)){var e=new Set,t={};c.default.Children.forEach(this.pastChildren,function(t,n){return t&&e.add(null===t.key?n:t.key)}),c.default.Children.forEach(this.props.children,function(n,r){if(n){var i=null===n.key?r:n.key;e.has(i)||(t[i]={})}}),this.recalculatePositions(null,t)}this.pastChildren=this.props.children,this.updateInternal()&&this.props.smartUpdate&&this.runSmartUpdate()}},{key:"runSmartUpdate",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:100;if(100===t&&this.smartUpdate)clearInterval(this.smartUpdate),this.smartUpdate=0;else if(this.smartUpdate)return;this.smartUpdate=setTimeout(function(){var n=!d.isServer&&void 0!==document.hidden&&document.hidden;if(n)var r=document.addEventListener("visibilitychange",function(){document.hidden||(document.removeEventListener("visibilitychange",r),e.runSmartUpdate(2*t))},!1);if(e.smartUpdate=0,e.updateInternal())return void e.runSmartUpdate();n||e.runSmartUpdate(2*t)},Math.min(t,this.props.smartUpdateCeil))}},{key:"getColumnsNumber",value:function(e){return Math.max(1,Math.round(e/this.props.targetBlockWidth))}},{key:"updateContainerWidth",value:function(){var e=d.isServer&&!this.container?this.props.width||999*this.props.targetBlockWidth:this.container?this.container.clientWidth:0;return e!==this.containerWidth&&e!==this.containerWidth+h&&(this.setState({columns:this.columns=this.getColumnsNumber(e),containerWidth:this.containerWidth=e,blocks:this.blocks={}}),!0)}},{key:"measureChildren",value:function(){if(!this.container)return!1;for(var e={},t=!1,n=0;n<this.container.children.length;n++){var r=this.container.children[n],i=r.hasAttribute("data-xkey"),o=r.getAttribute("data-key"),a=+r.getAttribute("data-width");(i||(this.blocks[o]||{}).height!==r.clientHeight||(this.blocks[o]||{}).width!==a)&&(e[o]={height:r.clientHeight},t||(t=!0))}return t&&this.recalculatePositions(e),t}},{key:"recalculatePositions",value:function(){for(var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,n=void 0,r=[],i=0;i<this.columns;++i)r.push(0);for(var o in this.blocks)this.blocks.hasOwnProperty(o)&&void 0===this.blocks[o]&&(null===t&&(t={}),t[o]={});if(t){n={};for(var a in this.blocks)this.blocks.hasOwnProperty(a)&&!t.hasOwnProperty(a)&&(n[a]=this.blocks[a]);for(var u in e)e.hasOwnProperty(u)&&!t.hasOwnProperty(u)&&(n[u]=e[u])}else n=s({},this.blocks,e);for(var l=0;l<this.container.children.length;l++){var c=this.container.children[l],d=c.getAttribute("data-key");if(n.hasOwnProperty(d)&&(!t||!t.hasOwnProperty(d))){var h=+c.getAttribute("data-width")||1,p=this.getBestFitColumn(r,h),f=p.col,m=p.height,v=m+n[d].height;n[d].left=this.containerWidth*f/this.columns,n[d].top=m,n[d].width=Math.min(h,this.columns);for(var y=0;y<h;++y)r[f+y]=v}}if(this.props.center&&0===r[r.length-1]){for(var b=1;0===r[r.length-1-b];++b);var g=this.containerWidth*b/this.columns/2;for(var w in n)n.hasOwnProperty(w)&&(n[w].left+=g)}this.setState({blocks:this.blocks=n,containerHeight:Math.max.apply(null,r)})}},{key:"render",value:function(){var e=this,n={},i=0,o=0===this.containerWidth?[]:this.props.children||[],a=c.default.Children.map(o,function(t,r){if(!t)return null;var o=null===t.key?r:t.key,a=e.blocks[o];return a||++i,n[o]=null,a?c.default.cloneElement(t,{"data-key":o,key:o,style:{left:Math.floor(a.left),top:a.top},measured:!0,height:a.height,parent:e}):c.default.cloneElement(t,{"data-key":o,"data-xkey":o,key:o,style:{visibility:d.isServer?"visible":"hidden"},height:0,parent:e})});for(var u in this.blocks)this.blocks.hasOwnProperty(u)&&!n.hasOwnProperty(u)&&(this.blocks[u]=void 0);var l=a.length-i>0||0===a.length?this.fixedHeight=this.state.containerHeight:this.fixedHeight,h=this.props,p=(h.center,h.maxColumns,h.responsive,h.smartUpdate,h.smartUpdateCeil,h.targetBlockWidth,h.updateOnImagesLoad,h.updateOnFontLoad,h.className),f=h.style,m=r(h,["center","maxColumns","responsive","smartUpdate","smartUpdateCeil","targetBlockWidth","updateOnImagesLoad","updateOnFontLoad","className","style"]);return c.default.createElement("div",s({className:"xmasonry"+(d.isServer?" xmasonry-static":"")+(p?" "+p:""),style:s({},t.containerStyle,{height:d.isServer?void 0:l},f),ref:function(t){return e.container=t}},m),a)}}]),t}(c.default.Component);m.defaultProps={center:!0,maxColumns:d.isServer?3:1/0,responsive:!0,smartUpdate:!0,smartUpdateCeil:1/0,targetBlockWidth:300,updateOnFontLoad:!0,updateOnImagesLoad:!0},m.containerStyle={position:"relative"},t.default=m},function(e,t){function n(){throw new Error("setTimeout has not been defined")}function r(){throw new Error("clearTimeout has not been defined")}function i(e){if(c===setTimeout)return setTimeout(e,0);if((c===n||!c)&&setTimeout)return c=setTimeout,setTimeout(e,0);try{return c(e,0)}catch(t){try{return c.call(null,e,0)}catch(t){return c.call(this,e,0)}}}function o(e){if(d===clearTimeout)return clearTimeout(e);if((d===r||!d)&&clearTimeout)return d=clearTimeout,clearTimeout(e);try{return d(e)}catch(t){try{return d.call(null,e)}catch(t){return d.call(this,e)}}}function a(){m&&p&&(m=!1,p.length?f=p.concat(f):v=-1,f.length&&s())}function s(){if(!m){var e=i(a);m=!0;for(var t=f.length;t;){for(p=f,f=[];++v<t;)p&&p[v].run();v=-1,t=f.length}p=null,m=!1,o(e)}}function u(e,t){this.fun=e,this.array=t}function l(){}var c,d,h=e.exports={};!function(){try{c="function"==typeof setTimeout?setTimeout:n}catch(e){c=n}try{d="function"==typeof clearTimeout?clearTimeout:r}catch(e){d=r}}();var p,f=[],m=!1,v=-1;h.nextTick=function(e){var t=new Array(arguments.length-1);if(arguments.length>1)for(var n=1;n<arguments.length;n++)t[n-1]=arguments[n];f.push(new u(e,t)),1!==f.length||m||i(s)},u.prototype.run=function(){this.fun.apply(null,this.array)},h.title="browser",h.browser=!0,h.env={},h.argv=[],h.version="",h.versions={},h.on=l,h.addListener=l,h.once=l,h.off=l,h.removeListener=l,h.removeAllListeners=l,h.emit=l,h.prependListener=l,h.prependOnceListener=l,h.listeners=function(e){return[]},h.binding=function(e){throw new Error("process.binding is not supported")},h.cwd=function(){return"/"},h.chdir=function(e){throw new Error("process.chdir is not supported")},h.umask=function(){return 0}},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},u=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),c=function(e){return e&&e.__esModule?e:{default:e}}(l),d=n(2),h=function(e){function t(){var e,n,r,a;i(this,t);for(var s=arguments.length,u=Array(s),l=0;l<s;l++)u[l]=arguments[l];return n=r=o(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),r.divElement=null,r.placed=!1,a=n,o(r,a)}return a(t,e),u(t,[{key:"componentDidUpdate",value:function(){var e=this;if(!this.placed&&this.props.parent&&!this.props["data-xkey"]){this.placed=!0;var t=this.props.parent;requestAnimationFrame(function(){if(e.divElement){var n=Array.prototype.slice.call(e.divElement.querySelectorAll("img"));n.length>0&&t.props.updateOnImagesLoad&&n.forEach(function(e){return!e.complete&&e.addEventListener("load",t.update)}),e.props.height!==e.divElement.clientHeight&&t.update()}})}}},{key:"render",value:function(){var e=this,n=this.props,i=n.width,o=(n.height,n.measured),a=(n.parent,n.style),u=r(n,["width","height","measured","parent","style"]),l=this.props.parent.columns,h=Math.min(i||1,l,this.props.parent.props.maxColumns);return a.width=Math.floor(h*this.props.parent.containerWidth/l),c.default.createElement("div",s({"data-width":h},u,{style:s({},a,t.defaultStyle),className:o?"xblock":d.isServer?"xblock xblock-static":"",ref:function(t){return e.divElement=t}}),this.props.children)}}]),t}(c.default.Component);h.defaultProps={width:1,measured:!1},h.defaultStyle={position:d.isServer?void 0:"absolute",boxSizing:"border-box"},t.default=h}])});
\ No newline at end of file
diff --git a/docs/index.js b/docs/index.js
index b8e4f09..4e8f7e5 100644
--- a/docs/index.js
+++ b/docs/index.js
@@ -1 +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["react-xmasonry"]=t(require("react")):e["react-xmasonry"]=t(e.React)}("undefined"!=typeof self?self:this,function(e){return function(e){function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=6)}([function(t,n){t.exports=e},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0}),t.XBlock=t.XMasonry=void 0;var a=n(3),o=r(a),i=n(4),l=r(i);t.XMasonry=o.default,t.XBlock=l.default},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.debounce=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:45,n=0;return function(){0!==n&&clearTimeout(n),n=setTimeout(function(){n=0,e()},t)}},t.isServer=!("undefined"!=typeof document&&"undefined"!=typeof window)},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),c=n(0),u=function(e){return e&&e.__esModule?e:{default:e}}(c),d=n(2),f=0,h=!1,p=function e(){if(!d.isServer){if(!document.body)return void document.addEventListener("DOMContentLoaded",e);var t=document.createElement("div");t.style.overflow="scroll",t.style.height=t.style.width="200px",t.style.visibility="hidden",t.style.padding=t.style.margin=t.style.border=0,document.body.appendChild(t),f=t.offsetWidth-t.clientWidth||0,h=!0,document.body.removeChild(t)}},m=function(e){function t(e){a(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.state={blocks:{},containerHeight:0,columns:1,containerWidth:0},n.pastChildren=0,n.columns=n.state.columns,n.blocks=n.state.blocks,n.container=null,n.debouncedResize=(0,d.debounce)(n.updateContainerWidth.bind(n)),n.fixedHeight=0,n.containerWidth=n.state.containerWidth,n.update=n.updateInternal.bind(n),n.smartUpdate=0,h||p(),n.props.responsive&&!d.isServer&&window.addEventListener("resize",n.debouncedResize),!d.isServer&&n.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.addEventListener("loadingdone",n.update),d.isServer&&(n.state.containerWidth=n.containerWidth=n.props.width||999*n.props.targetBlockWidth,n.columns=n.getColumnsNumber(n.state.containerWidth)),n.pastChildren=e.children,n}return i(t,e),s(t,[{key:"getBestFitColumn",value:function(e){for(var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,n=Math.min(e.length-t+1,this.props.maxColumns-t+1),r=0,a=1/0,o=0;o<n;++o){var i=Math.max.apply(null,e.slice(o,o+t));i<a&&(a=i,r=o)}return{col:r,height:a}}}]),s(t,[{key:"updateInternal",value:function(){return!this.updateContainerWidth()&&this.measureChildren()}},{key:"componentDidMount",value:function(){this.updateInternal()}},{key:"componentWillUnmount",value:function(){d.isServer||window.removeEventListener("resize",this.debouncedResize),!d.isServer&&this.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.removeEventListener("loadingdone",this.update),this.smartUpdate&&clearTimeout(this.smartUpdate)}},{key:"componentDidUpdate",value:function(){if(u.default.Children.count(this.props.children)<u.default.Children.count(this.pastChildren)){var e=new Set,t={};u.default.Children.forEach(this.pastChildren,function(t,n){return t&&e.add(null===t.key?n:t.key)}),u.default.Children.forEach(this.props.children,function(n,r){if(n){var a=null===n.key?r:n.key;e.has(a)||(t[a]={})}}),this.recalculatePositions(null,t)}this.pastChildren=this.props.children,this.updateInternal()&&this.props.smartUpdate&&this.runSmartUpdate()}},{key:"runSmartUpdate",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:100;if(100===t&&this.smartUpdate)clearInterval(this.smartUpdate),this.smartUpdate=0;else if(this.smartUpdate)return;this.smartUpdate=setTimeout(function(){var n=!d.isServer&&void 0!==document.hidden&&document.hidden;if(n)var r=document.addEventListener("visibilitychange",function(){document.hidden||(document.removeEventListener("visibilitychange",r),e.runSmartUpdate(2*t))},!1);if(e.smartUpdate=0,e.updateInternal())return void e.runSmartUpdate();n||e.runSmartUpdate(2*t)},Math.min(t,this.props.smartUpdateCeil))}},{key:"getColumnsNumber",value:function(e){return Math.max(1,Math.round(e/this.props.targetBlockWidth))}},{key:"updateContainerWidth",value:function(){var e=d.isServer&&!this.container?this.props.width||999*this.props.targetBlockWidth:this.container?this.container.clientWidth:0;return e!==this.containerWidth&&e!==this.containerWidth+f&&(this.setState({columns:this.columns=this.getColumnsNumber(e),containerWidth:this.containerWidth=e,blocks:this.blocks={}}),!0)}},{key:"measureChildren",value:function(){if(!this.container)return!1;for(var e={},t=!1,n=0;n<this.container.children.length;n++){var r=this.container.children[n],a=r.hasAttribute("data-xkey"),o=r.getAttribute("data-key"),i=+r.getAttribute("data-width");(a||(this.blocks[o]||{}).height!==r.clientHeight||(this.blocks[o]||{}).width!==i)&&(e[o]={height:r.clientHeight},t||(t=!0))}return t&&this.recalculatePositions(e),t}},{key:"recalculatePositions",value:function(){for(var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,n=void 0,r=[],a=0;a<this.columns;++a)r.push(0);for(var o in this.blocks)this.blocks.hasOwnProperty(o)&&void 0===this.blocks[o]&&(null===t&&(t={}),t[o]={});if(t){n={};for(var i in this.blocks)this.blocks.hasOwnProperty(i)&&!t.hasOwnProperty(i)&&(n[i]=this.blocks[i]);for(var s in e)e.hasOwnProperty(s)&&!t.hasOwnProperty(s)&&(n[s]=e[s])}else n=l({},this.blocks,e);for(var c=0;c<this.container.children.length;c++){var u=this.container.children[c],d=u.getAttribute("data-key");if(n.hasOwnProperty(d)&&(!t||!t.hasOwnProperty(d))){var f=+u.getAttribute("data-width")||1,h=this.getBestFitColumn(r,f),p=h.col,m=h.height,y=m+n[d].height;n[d].left=this.containerWidth*p/this.columns,n[d].top=m,n[d].width=Math.min(f,this.columns);for(var v=0;v<f;++v)r[p+v]=y}}if(this.props.center&&0===r[r.length-1]){for(var b=1;0===r[r.length-1-b];++b);var g=this.containerWidth*b/this.columns/2;for(var k in n)n.hasOwnProperty(k)&&(n[k].left+=g)}this.setState({blocks:this.blocks=n,containerHeight:Math.max.apply(null,r)})}},{key:"render",value:function(){var e=this,n={},a=0,o=0===this.containerWidth?[]:this.props.children||[],i=u.default.Children.map(o,function(t,r){if(!t)return null;var o=null===t.key?r:t.key,i=e.blocks[o];return i||++a,n[o]=null,i?u.default.cloneElement(t,{"data-key":o,key:o,style:{left:Math.floor(i.left),top:i.top},measured:!0,height:i.height,parent:e}):u.default.cloneElement(t,{"data-key":o,"data-xkey":o,key:o,style:{visibility:d.isServer?"visible":"hidden"},height:0,parent:e})});for(var s in this.blocks)this.blocks.hasOwnProperty(s)&&!n.hasOwnProperty(s)&&(this.blocks[s]=void 0);var c=i.length-a>0||0===i.length?this.fixedHeight=this.state.containerHeight:this.fixedHeight,f=this.props,h=(f.center,f.maxColumns,f.responsive,f.smartUpdate,f.smartUpdateCeil,f.targetBlockWidth,f.updateOnImagesLoad,f.updateOnFontLoad,f.className),p=f.style,m=r(f,["center","maxColumns","responsive","smartUpdate","smartUpdateCeil","targetBlockWidth","updateOnImagesLoad","updateOnFontLoad","className","style"]);return u.default.createElement("div",l({className:"xmasonry"+(d.isServer?" xmasonry-static":"")+(h?" "+h:""),style:l({},t.containerStyle,{height:d.isServer?void 0:c},p),ref:function(t){return e.container=t}},m),i)}}]),t}(u.default.Component);m.defaultProps={center:!0,maxColumns:d.isServer?3:1/0,responsive:!0,smartUpdate:!0,smartUpdateCeil:1/0,targetBlockWidth:300,updateOnFontLoad:!0,updateOnImagesLoad:!0},m.containerStyle={position:"relative"},t.default=m},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),c=n(0),u=function(e){return e&&e.__esModule?e:{default:e}}(c),d=n(2),f=function(e){function t(){var e,n,r,i;a(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=r=o(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),r.divElement=null,r.placed=!1,i=n,o(r,i)}return i(t,e),s(t,[{key:"componentDidUpdate",value:function(){var e=this;if(!this.placed&&this.props.parent&&!this.props["data-xkey"]){this.placed=!0;var t=this.props.parent;requestAnimationFrame(function(){if(e.divElement){var n=Array.prototype.slice.call(e.divElement.querySelectorAll("img"));n.length>0&&t.props.updateOnImagesLoad&&n.forEach(function(e){return!e.complete&&e.addEventListener("load",t.update)}),e.props.height!==e.divElement.clientHeight&&t.update()}})}}},{key:"render",value:function(){var e=this,n=this.props,a=n.width,o=(n.height,n.measured),i=(n.parent,n.style),s=r(n,["width","height","measured","parent","style"]),c=this.props.parent.columns,f=Math.min(a||1,c,this.props.parent.props.maxColumns);return i.width=Math.floor(f*this.props.parent.containerWidth/c),u.default.createElement("div",l({"data-width":f},s,{style:l({},i,t.defaultStyle),className:o?"xblock":d.isServer?"xblock xblock-static":"",ref:function(t){return e.divElement=t}}),this.props.children)}}]),t}(u.default.Component);f.defaultProps={width:1,measured:!1},f.defaultStyle={position:d.isServer?void 0:"absolute",boxSizing:"border-box"},t.default=f},function(e,t,n){"use strict";function r(){var e=["#ffff8d","#ff8a80","#a7ffeb","#ffd180","#80d8ff","#ccff90","#cfd8dc"];return e[Math.floor(Math.random()*e.length)]}function a(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:void 0,t=s.split(/\./g),n=Math.floor(Math.random()*(t.length-2)),r=e||1+Math.floor(Math.random()*(t.length-n+1));return t.splice(n,r).join(".")}function o(){for(var e=new Array(7+Math.floor(5*Math.random())),t=0;t<e.length;++t)e[t]={id:++l,title:a(1).slice(0,50),text:a()+".",cover:"https://source.unsplash.com/random/1600x900."+Math.random().toString().slice(2),cardWidth:Math.random()>.8?2:1};return e}function i(e){return{id:e,header:"This is a dummy card",body:a(),width:Math.random()>.8?2:1,color:r()}}Object.defineProperty(t,"__esModule",{value:!0}),t.getRandomColor=r,t.getRandomText=a,t.generateArticles=o,t.getRandomCard=i;var l=0,s="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vehicula leo a justo auctor, ut tristique mauris finibus. Curabitur sit amet dignissim lorem. Sed semper, mauris vel maximus efficitur, erat sem facilisis tellus, nec porta libero odio non nisi. Ut sed mi at metus pharetra vehicula et ut urna. Vestibulum sed nibh aliquet, tempor quam sed, facilisis erat. In commodo porttitor lacus, eget feugiat ipsum aliquam at. Donec ut suscipit odio. Ut dictum porttitor nunc, vel fringilla neque interdum vitae. Etiam non dolor eget arcu iaculis vehicula. Nulla volutpat varius venenatis. Praesent ac porttitor nunc. Fusce quis ex arcu. Donec at erat velit. Mauris nec metus nisi. Nunc ex lorem, vulputate nec felis id, commodo fringilla nunc. Donec dui velit, consequat venenatis rutrum sit amet, imperdiet nec nulla. In hac habitasse platea dictumst. Sed at ligula quis tortor consequat gravida a ac ex. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent vel bibendum ante. Fusce eros turpis, accumsan sit amet lobortis non, egestas in tellus. Phasellus lacinia nec odio quis molestie. Nullam vestibulum sed lectus a molestie. Nulla varius ligula sollicitudin."},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var a=n(7),o=r(a),i=n(8),l=r(i),s=n(9),c=r(s);window.init=function(){ReactDOM.render(React.createElement("div",null,React.createElement("h1",{style:{textAlign:"center"}},"Cards Demo"),React.createElement("div",{className:"littleGray centerText"},React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/css/CardsDemo.css"},"CSS source")," | ",React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/jsx/CardsDemo.jsx"},"JavaScript source")),React.createElement(o.default,null),React.createElement("h1",{style:{textAlign:"center"}},"Content Changes Demo"),React.createElement("div",{className:"littleGray limited centerText"},"When grid items change their size dynamically (like dynamically loaded CSS stylesheets or interactive layout), you need to update the layout manually each time when changes happen.",React.createElement("br",null),"Update XMasonry any time by triggering its ",React.createElement("a",{target:"_blank",href:"https://www.npmjs.com/package/react-xmasonry#accessing-xmasonry-by-reference"},"update")," method."),React.createElement("div",{className:"littleGray centerText"},React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/css/ContentChangesDemo.css"},"CSS source")," | ",React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/jsx/ContentChangesDemo.jsx"},"JavaScript source")),React.createElement(c.default,null),React.createElement("h1",{style:{textAlign:"center"}},"Articles Demo"),React.createElement("div",{className:"littleGray centerText"},"Use better CSS fixed ratio approach when possible (no image load hooks are triggered, content appears immediately)"),React.createElement("div",{className:"littleGray centerText"},React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/css/ArticlesDemo.css"},"CSS source")," | ",React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/jsx/ArticlesDemo.jsx"},"JavaScript source")),React.createElement(l.default,null)),document.getElementById("demoApp"))}},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),s=function(e){return e&&e.__esModule?e:{default:e}}(l),c=n(1),u=n(5),d=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),f=[{id:1,header:"Good News",body:"This is the dummy body. This is successfully rendered card.",color:d.getRandomColor()},{id:2,header:"Cool Masonry",body:"This is the dummy body. This is successfully rendered card.",color:d.getRandomColor()},{id:3,header:"Layout is Here!",body:"This card takes 2 columns. This is successfully rendered card. This is successfully rendered card. This is successfully rendered card. This is successfully rendered card.",width:2,color:d.getRandomColor()}],h=function(e){function t(){var e,n,o,i;r(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=o=a(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),o.state={data:f},o.lastCardId=o.state.data.length,i=n,a(o,i)}return o(t,e),i(t,[{key:"addCard",value:function(){this.setState({data:this.state.data.concat(d.getRandomCard(++this.lastCardId))})}},{key:"deleteCard",value:function(){if(!(this.state.data.length<1)){var e=this.state.data.slice();e.splice(Math.floor(Math.random()*e.length),1),this.setState({data:e})}}},{key:"replaceCard",value:function(){if(!(this.state.data.length<1)){var e=this.state.data.slice();e.splice(Math.floor(Math.random()*e.length),1,d.getRandomCard(++this.lastCardId)),this.setState({data:e})}}},{key:"render",value:function(){return s.default.createElement("div",{className:"demo",id:"CardsDemo"},s.default.createElement("div",{style:{textAlign:"center"}},s.default.createElement("button",{onClick:this.addCard.bind(this)},"Add Random Card"),s.default.createElement("button",{onClick:this.deleteCard.bind(this)},"Delete random card"),s.default.createElement("button",{onClick:this.replaceCard.bind(this)},"Replace random card")),s.default.createElement(c.XMasonry,null,s.default.createElement(c.XBlock,{key:"persistent"},s.default.createElement("div",{className:"card",style:{backgroundColor:"white"}},s.default.createElement("h1",null,"Persistent card"),s.default.createElement("p",null,"This card should always be the first card in this demo."))),this.state.data.map(function(e,t){return s.default.createElement(c.XBlock,{key:e.id,width:e.width||1},s.default.createElement("div",{className:"card",style:{backgroundColor:e.color}},s.default.createElement("h1",null,e.header,s.default.createElement("sup",null,e.id)),s.default.createElement("p",null,e.body)))})))}}]),t}(s.default.Component);t.default=h},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),s=function(e){return e&&e.__esModule?e:{default:e}}(l),c=n(1),u=n(5),d=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),f=function(e){function t(){var e,n,o,i;r(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=o=a(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),o.state={data:d.generateArticles()},i=n,a(o,i)}return o(t,e),i(t,[{key:"render",value:function(){var e=this;return s.default.createElement("div",{className:"demo",id:"ArticlesDemo"},s.default.createElement("div",{className:"centerText"},s.default.createElement("button",{onClick:function(){return e.setState({data:d.generateArticles()})}},"Regenerate")),s.default.createElement(c.XMasonry,{targetBlockWidth:400},this.state.data.map(function(e,t){return s.default.createElement(c.XBlock,{key:e.id,width:e.cardWidth},s.default.createElement("div",{className:"article"},s.default.createElement("div",{className:"imageBox"},s.default.createElement("div",{className:"image",style:{backgroundImage:"url("+e.cover+")"}},s.default.createElement("div",{className:"title"},e.title))),s.default.createElement("p",null,e.text)))})))}}]),t}(s.default.Component);t.default=f},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),s=function(e){return e&&e.__esModule?e:{default:e}}(l),c=n(1),u=n(5),d=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),f=function(e){function t(){var e,n,o,i;r(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=o=a(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),o.state={data:d.generateArticles()},o.xMasonry=null,i=n,a(o,i)}return o(t,e),i(t,[{key:"componentDidMount",value:function(){}},{key:"render",value:function(){var e=this;return s.default.createElement("div",{className:"demo",id:"ContentChangesDemo"},s.default.createElement("div",{className:"centerText"},s.default.createElement("button",{onClick:function(){return e.setState({data:d.generateArticles()})}},"Regenerate")),s.default.createElement(c.XMasonry,{ref:function(t){return e.xMasonry=t}},this.state.data.map(function(e,t){return s.default.createElement(c.XBlock,{key:e.id,width:e.cardWidth},s.default.createElement("div",{className:"card",style:{position:"relative"}},s.default.createElement("img",{src:e.cover,alt:"image"}),s.default.createElement("div",{className:"body"},s.default.createElement("h3",null,e.title),s.default.createElement("p",null,e.text))))}),null))}}]),t}(s.default.Component);t.default=f}])});
\ No newline at end of file
+!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["react-xmasonry"]=t(require("react")):e["react-xmasonry"]=t(e.React)}("undefined"!=typeof self?self:this,function(e){return function(e){function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=7)}([function(t,n){t.exports=e},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0}),t.XBlock=t.XMasonry=void 0;var a=n(3),o=r(a),i=n(5),l=r(i);t.XMasonry=o.default,t.XBlock=l.default},function(e,t,n){"use strict";(function(e){Object.defineProperty(t,"__esModule",{value:!0}),t.debounce=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:45,n=0;return function(){0!==n&&clearTimeout(n),n=setTimeout(function(){n=0,e()},t)}},t.isServer="false"!==((e||{}).env||{}).REACT_XMASONRY_SSR_ENABLED&&!("undefined"!=typeof document&&"undefined"!=typeof window)}).call(t,n(4))},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),c=n(0),u=function(e){return e&&e.__esModule?e:{default:e}}(c),d=n(2),f=0,h=!1,p=function e(){if(!d.isServer){if(!document.body)return void document.addEventListener("DOMContentLoaded",e);var t=document.createElement("div");t.style.overflow="scroll",t.style.height=t.style.width="200px",t.style.visibility="hidden",t.style.padding=t.style.margin=t.style.border=0,document.body.appendChild(t),f=t.offsetWidth-t.clientWidth||0,h=!0,document.body.removeChild(t)}},m=function(e){function t(e){a(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.state={blocks:{},containerHeight:0,columns:1,containerWidth:0},n.pastChildren=0,n.columns=n.state.columns,n.blocks=n.state.blocks,n.container=null,n.debouncedResize=(0,d.debounce)(n.updateContainerWidth.bind(n)),n.fixedHeight=0,n.containerWidth=n.state.containerWidth,n.update=n.updateInternal.bind(n),n.smartUpdate=0,h||p(),n.props.responsive&&!d.isServer&&window.addEventListener("resize",n.debouncedResize),!d.isServer&&n.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.addEventListener("loadingdone",n.update),d.isServer&&(n.state.containerWidth=n.containerWidth=n.props.width||999*n.props.targetBlockWidth,n.columns=n.getColumnsNumber(n.state.containerWidth)),n.pastChildren=e.children,n}return i(t,e),s(t,[{key:"getBestFitColumn",value:function(e){for(var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,n=Math.min(e.length-t+1,this.props.maxColumns-t+1),r=0,a=1/0,o=0;o<n;++o){var i=Math.max.apply(null,e.slice(o,o+t));i<a&&(a=i,r=o)}return{col:r,height:a}}}]),s(t,[{key:"updateInternal",value:function(){return!this.updateContainerWidth()&&this.measureChildren()}},{key:"componentDidMount",value:function(){this.updateInternal()}},{key:"componentWillUnmount",value:function(){d.isServer||window.removeEventListener("resize",this.debouncedResize),!d.isServer&&this.props.updateOnFontLoad&&document.fonts&&document.fonts.addEventListener&&document.fonts.removeEventListener("loadingdone",this.update),this.smartUpdate&&clearTimeout(this.smartUpdate)}},{key:"componentDidUpdate",value:function(){if(u.default.Children.count(this.props.children)<u.default.Children.count(this.pastChildren)){var e=new Set,t={};u.default.Children.forEach(this.pastChildren,function(t,n){return t&&e.add(null===t.key?n:t.key)}),u.default.Children.forEach(this.props.children,function(n,r){if(n){var a=null===n.key?r:n.key;e.has(a)||(t[a]={})}}),this.recalculatePositions(null,t)}this.pastChildren=this.props.children,this.updateInternal()&&this.props.smartUpdate&&this.runSmartUpdate()}},{key:"runSmartUpdate",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:100;if(100===t&&this.smartUpdate)clearInterval(this.smartUpdate),this.smartUpdate=0;else if(this.smartUpdate)return;this.smartUpdate=setTimeout(function(){var n=!d.isServer&&void 0!==document.hidden&&document.hidden;if(n)var r=document.addEventListener("visibilitychange",function(){document.hidden||(document.removeEventListener("visibilitychange",r),e.runSmartUpdate(2*t))},!1);if(e.smartUpdate=0,e.updateInternal())return void e.runSmartUpdate();n||e.runSmartUpdate(2*t)},Math.min(t,this.props.smartUpdateCeil))}},{key:"getColumnsNumber",value:function(e){return Math.max(1,Math.round(e/this.props.targetBlockWidth))}},{key:"updateContainerWidth",value:function(){var e=d.isServer&&!this.container?this.props.width||999*this.props.targetBlockWidth:this.container?this.container.clientWidth:0;return e!==this.containerWidth&&e!==this.containerWidth+f&&(this.setState({columns:this.columns=this.getColumnsNumber(e),containerWidth:this.containerWidth=e,blocks:this.blocks={}}),!0)}},{key:"measureChildren",value:function(){if(!this.container)return!1;for(var e={},t=!1,n=0;n<this.container.children.length;n++){var r=this.container.children[n],a=r.hasAttribute("data-xkey"),o=r.getAttribute("data-key"),i=+r.getAttribute("data-width");(a||(this.blocks[o]||{}).height!==r.clientHeight||(this.blocks[o]||{}).width!==i)&&(e[o]={height:r.clientHeight},t||(t=!0))}return t&&this.recalculatePositions(e),t}},{key:"recalculatePositions",value:function(){for(var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,n=void 0,r=[],a=0;a<this.columns;++a)r.push(0);for(var o in this.blocks)this.blocks.hasOwnProperty(o)&&void 0===this.blocks[o]&&(null===t&&(t={}),t[o]={});if(t){n={};for(var i in this.blocks)this.blocks.hasOwnProperty(i)&&!t.hasOwnProperty(i)&&(n[i]=this.blocks[i]);for(var s in e)e.hasOwnProperty(s)&&!t.hasOwnProperty(s)&&(n[s]=e[s])}else n=l({},this.blocks,e);for(var c=0;c<this.container.children.length;c++){var u=this.container.children[c],d=u.getAttribute("data-key");if(n.hasOwnProperty(d)&&(!t||!t.hasOwnProperty(d))){var f=+u.getAttribute("data-width")||1,h=this.getBestFitColumn(r,f),p=h.col,m=h.height,y=m+n[d].height;n[d].left=this.containerWidth*p/this.columns,n[d].top=m,n[d].width=Math.min(f,this.columns);for(var v=0;v<f;++v)r[p+v]=y}}if(this.props.center&&0===r[r.length-1]){for(var b=1;0===r[r.length-1-b];++b);var g=this.containerWidth*b/this.columns/2;for(var w in n)n.hasOwnProperty(w)&&(n[w].left+=g)}this.setState({blocks:this.blocks=n,containerHeight:Math.max.apply(null,r)})}},{key:"render",value:function(){var e=this,n={},a=0,o=0===this.containerWidth?[]:this.props.children||[],i=u.default.Children.map(o,function(t,r){if(!t)return null;var o=null===t.key?r:t.key,i=e.blocks[o];return i||++a,n[o]=null,i?u.default.cloneElement(t,{"data-key":o,key:o,style:{left:Math.floor(i.left),top:i.top},measured:!0,height:i.height,parent:e}):u.default.cloneElement(t,{"data-key":o,"data-xkey":o,key:o,style:{visibility:d.isServer?"visible":"hidden"},height:0,parent:e})});for(var s in this.blocks)this.blocks.hasOwnProperty(s)&&!n.hasOwnProperty(s)&&(this.blocks[s]=void 0);var c=i.length-a>0||0===i.length?this.fixedHeight=this.state.containerHeight:this.fixedHeight,f=this.props,h=(f.center,f.maxColumns,f.responsive,f.smartUpdate,f.smartUpdateCeil,f.targetBlockWidth,f.updateOnImagesLoad,f.updateOnFontLoad,f.className),p=f.style,m=r(f,["center","maxColumns","responsive","smartUpdate","smartUpdateCeil","targetBlockWidth","updateOnImagesLoad","updateOnFontLoad","className","style"]);return u.default.createElement("div",l({className:"xmasonry"+(d.isServer?" xmasonry-static":"")+(h?" "+h:""),style:l({},t.containerStyle,{height:d.isServer?void 0:c},p),ref:function(t){return e.container=t}},m),i)}}]),t}(u.default.Component);m.defaultProps={center:!0,maxColumns:d.isServer?3:1/0,responsive:!0,smartUpdate:!0,smartUpdateCeil:1/0,targetBlockWidth:300,updateOnFontLoad:!0,updateOnImagesLoad:!0},m.containerStyle={position:"relative"},t.default=m},function(e,t){function n(){throw new Error("setTimeout has not been defined")}function r(){throw new Error("clearTimeout has not been defined")}function a(e){if(u===setTimeout)return setTimeout(e,0);if((u===n||!u)&&setTimeout)return u=setTimeout,setTimeout(e,0);try{return u(e,0)}catch(t){try{return u.call(null,e,0)}catch(t){return u.call(this,e,0)}}}function o(e){if(d===clearTimeout)return clearTimeout(e);if((d===r||!d)&&clearTimeout)return d=clearTimeout,clearTimeout(e);try{return d(e)}catch(t){try{return d.call(null,e)}catch(t){return d.call(this,e)}}}function i(){m&&h&&(m=!1,h.length?p=h.concat(p):y=-1,p.length&&l())}function l(){if(!m){var e=a(i);m=!0;for(var t=p.length;t;){for(h=p,p=[];++y<t;)h&&h[y].run();y=-1,t=p.length}h=null,m=!1,o(e)}}function s(e,t){this.fun=e,this.array=t}function c(){}var u,d,f=e.exports={};!function(){try{u="function"==typeof setTimeout?setTimeout:n}catch(e){u=n}try{d="function"==typeof clearTimeout?clearTimeout:r}catch(e){d=r}}();var h,p=[],m=!1,y=-1;f.nextTick=function(e){var t=new Array(arguments.length-1);if(arguments.length>1)for(var n=1;n<arguments.length;n++)t[n-1]=arguments[n];p.push(new s(e,t)),1!==p.length||m||a(l)},s.prototype.run=function(){this.fun.apply(null,this.array)},f.title="browser",f.browser=!0,f.env={},f.argv=[],f.version="",f.versions={},f.on=c,f.addListener=c,f.once=c,f.off=c,f.removeListener=c,f.removeAllListeners=c,f.emit=c,f.prependListener=c,f.prependOnceListener=c,f.listeners=function(e){return[]},f.binding=function(e){throw new Error("process.binding is not supported")},f.cwd=function(){return"/"},f.chdir=function(e){throw new Error("process.chdir is not supported")},f.umask=function(){return 0}},function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),c=n(0),u=function(e){return e&&e.__esModule?e:{default:e}}(c),d=n(2),f=function(e){function t(){var e,n,r,i;a(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=r=o(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),r.divElement=null,r.placed=!1,i=n,o(r,i)}return i(t,e),s(t,[{key:"componentDidUpdate",value:function(){var e=this;if(!this.placed&&this.props.parent&&!this.props["data-xkey"]){this.placed=!0;var t=this.props.parent;requestAnimationFrame(function(){if(e.divElement){var n=Array.prototype.slice.call(e.divElement.querySelectorAll("img"));n.length>0&&t.props.updateOnImagesLoad&&n.forEach(function(e){return!e.complete&&e.addEventListener("load",t.update)}),e.props.height!==e.divElement.clientHeight&&t.update()}})}}},{key:"render",value:function(){var e=this,n=this.props,a=n.width,o=(n.height,n.measured),i=(n.parent,n.style),s=r(n,["width","height","measured","parent","style"]),c=this.props.parent.columns,f=Math.min(a||1,c,this.props.parent.props.maxColumns);return i.width=Math.floor(f*this.props.parent.containerWidth/c),u.default.createElement("div",l({"data-width":f},s,{style:l({},i,t.defaultStyle),className:o?"xblock":d.isServer?"xblock xblock-static":"",ref:function(t){return e.divElement=t}}),this.props.children)}}]),t}(u.default.Component);f.defaultProps={width:1,measured:!1},f.defaultStyle={position:d.isServer?void 0:"absolute",boxSizing:"border-box"},t.default=f},function(e,t,n){"use strict";function r(){var e=["#ffff8d","#ff8a80","#a7ffeb","#ffd180","#80d8ff","#ccff90","#cfd8dc"];return e[Math.floor(Math.random()*e.length)]}function a(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:void 0,t=s.split(/\./g),n=Math.floor(Math.random()*(t.length-2)),r=e||1+Math.floor(Math.random()*(t.length-n+1));return t.splice(n,r).join(".")}function o(){for(var e=new Array(7+Math.floor(5*Math.random())),t=0;t<e.length;++t)e[t]={id:++l,title:a(1).slice(0,50),text:a()+".",cover:"https://source.unsplash.com/random/1600x900."+Math.random().toString().slice(2),cardWidth:Math.random()>.8?2:1};return e}function i(e){return{id:e,header:"This is a dummy card",body:a(),width:Math.random()>.8?2:1,color:r()}}Object.defineProperty(t,"__esModule",{value:!0}),t.getRandomColor=r,t.getRandomText=a,t.generateArticles=o,t.getRandomCard=i;var l=0,s="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vehicula leo a justo auctor, ut tristique mauris finibus. Curabitur sit amet dignissim lorem. Sed semper, mauris vel maximus efficitur, erat sem facilisis tellus, nec porta libero odio non nisi. Ut sed mi at metus pharetra vehicula et ut urna. Vestibulum sed nibh aliquet, tempor quam sed, facilisis erat. In commodo porttitor lacus, eget feugiat ipsum aliquam at. Donec ut suscipit odio. Ut dictum porttitor nunc, vel fringilla neque interdum vitae. Etiam non dolor eget arcu iaculis vehicula. Nulla volutpat varius venenatis. Praesent ac porttitor nunc. Fusce quis ex arcu. Donec at erat velit. Mauris nec metus nisi. Nunc ex lorem, vulputate nec felis id, commodo fringilla nunc. Donec dui velit, consequat venenatis rutrum sit amet, imperdiet nec nulla. In hac habitasse platea dictumst. Sed at ligula quis tortor consequat gravida a ac ex. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent vel bibendum ante. Fusce eros turpis, accumsan sit amet lobortis non, egestas in tellus. Phasellus lacinia nec odio quis molestie. Nullam vestibulum sed lectus a molestie. Nulla varius ligula sollicitudin."},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var a=n(8),o=r(a),i=n(9),l=r(i),s=n(10),c=r(s);window.init=function(){ReactDOM.render(React.createElement("div",null,React.createElement("h1",{style:{textAlign:"center"}},"Cards Demo"),React.createElement("div",{className:"littleGray centerText"},React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/css/CardsDemo.css"},"CSS source")," | ",React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/jsx/CardsDemo.jsx"},"JavaScript source")),React.createElement(o.default,null),React.createElement("h1",{style:{textAlign:"center"}},"Content Changes Demo"),React.createElement("div",{className:"littleGray limited centerText"},"When grid items change their size dynamically (like dynamically loaded CSS stylesheets or interactive layout), you need to update the layout manually each time when changes happen.",React.createElement("br",null),"Update XMasonry any time by triggering its ",React.createElement("a",{target:"_blank",href:"https://www.npmjs.com/package/react-xmasonry#accessing-xmasonry-by-reference"},"update")," method."),React.createElement("div",{className:"littleGray centerText"},React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/css/ContentChangesDemo.css"},"CSS source")," | ",React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/jsx/ContentChangesDemo.jsx"},"JavaScript source")),React.createElement(c.default,null),React.createElement("h1",{style:{textAlign:"center"}},"Articles Demo"),React.createElement("div",{className:"littleGray centerText"},"Use better CSS fixed ratio approach when possible (no image load hooks are triggered, content appears immediately)"),React.createElement("div",{className:"littleGray centerText"},React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/css/ArticlesDemo.css"},"CSS source")," | ",React.createElement("a",{target:"_blank",href:"https://github.com/ZitRos/react-xmasonry/blob/master/docs/jsx/ArticlesDemo.jsx"},"JavaScript source")),React.createElement(l.default,null)),document.getElementById("demoApp"))}},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),s=function(e){return e&&e.__esModule?e:{default:e}}(l),c=n(1),u=n(6),d=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),f=[{id:1,header:"Good News",body:"This is the dummy body. This is successfully rendered card.",color:d.getRandomColor()},{id:2,header:"Cool Masonry",body:"This is the dummy body. This is successfully rendered card.",color:d.getRandomColor()},{id:3,header:"Layout is Here!",body:"This card takes 2 columns. This is successfully rendered card. This is successfully rendered card. This is successfully rendered card. This is successfully rendered card.",width:2,color:d.getRandomColor()}],h=function(e){function t(){var e,n,o,i;r(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=o=a(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),o.state={data:f},o.lastCardId=o.state.data.length,i=n,a(o,i)}return o(t,e),i(t,[{key:"addCard",value:function(){this.setState({data:this.state.data.concat(d.getRandomCard(++this.lastCardId))})}},{key:"deleteCard",value:function(){if(!(this.state.data.length<1)){var e=this.state.data.slice();e.splice(Math.floor(Math.random()*e.length),1),this.setState({data:e})}}},{key:"replaceCard",value:function(){if(!(this.state.data.length<1)){var e=this.state.data.slice();e.splice(Math.floor(Math.random()*e.length),1,d.getRandomCard(++this.lastCardId)),this.setState({data:e})}}},{key:"render",value:function(){return s.default.createElement("div",{className:"demo",id:"CardsDemo"},s.default.createElement("div",{style:{textAlign:"center"}},s.default.createElement("button",{onClick:this.addCard.bind(this)},"Add Random Card"),s.default.createElement("button",{onClick:this.deleteCard.bind(this)},"Delete random card"),s.default.createElement("button",{onClick:this.replaceCard.bind(this)},"Replace random card")),s.default.createElement(c.XMasonry,null,s.default.createElement(c.XBlock,{key:"persistent"},s.default.createElement("div",{className:"card",style:{backgroundColor:"white"}},s.default.createElement("h1",null,"Persistent card"),s.default.createElement("p",null,"This card should always be the first card in this demo."))),this.state.data.map(function(e,t){return s.default.createElement(c.XBlock,{key:e.id,width:e.width||1},s.default.createElement("div",{className:"card",style:{backgroundColor:e.color}},s.default.createElement("h1",null,e.header,s.default.createElement("sup",null,e.id)),s.default.createElement("p",null,e.body)))})))}}]),t}(s.default.Component);t.default=h},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),s=function(e){return e&&e.__esModule?e:{default:e}}(l),c=n(1),u=n(6),d=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),f=function(e){function t(){var e,n,o,i;r(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=o=a(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),o.state={data:d.generateArticles()},i=n,a(o,i)}return o(t,e),i(t,[{key:"render",value:function(){var e=this;return s.default.createElement("div",{className:"demo",id:"ArticlesDemo"},s.default.createElement("div",{className:"centerText"},s.default.createElement("button",{onClick:function(){return e.setState({data:d.generateArticles()})}},"Regenerate")),s.default.createElement(c.XMasonry,{targetBlockWidth:400},this.state.data.map(function(e,t){return s.default.createElement(c.XBlock,{key:e.id,width:e.cardWidth},s.default.createElement("div",{className:"article"},s.default.createElement("div",{className:"imageBox"},s.default.createElement("div",{className:"image",style:{backgroundImage:"url("+e.cover+")"}},s.default.createElement("div",{className:"title"},e.title))),s.default.createElement("p",null,e.text)))})))}}]),t}(s.default.Component);t.default=f},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(0),s=function(e){return e&&e.__esModule?e:{default:e}}(l),c=n(1),u=n(6),d=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}(u),f=function(e){function t(){var e,n,o,i;r(this,t);for(var l=arguments.length,s=Array(l),c=0;c<l;c++)s[c]=arguments[c];return n=o=a(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(s))),o.state={data:d.generateArticles()},o.xMasonry=null,i=n,a(o,i)}return o(t,e),i(t,[{key:"componentDidMount",value:function(){}},{key:"render",value:function(){var e=this;return s.default.createElement("div",{className:"demo",id:"ContentChangesDemo"},s.default.createElement("div",{className:"centerText"},s.default.createElement("button",{onClick:function(){return e.setState({data:d.generateArticles()})}},"Regenerate")),s.default.createElement(c.XMasonry,{ref:function(t){return e.xMasonry=t}},this.state.data.map(function(e,t){return s.default.createElement(c.XBlock,{key:e.id,width:e.cardWidth},s.default.createElement("div",{className:"card",style:{position:"relative"}},s.default.createElement("img",{src:e.cover,alt:"image"}),s.default.createElement("div",{className:"body"},s.default.createElement("h3",null,e.title),s.default.createElement("p",null,e.text))))}),null))}}]),t}(s.default.Component);t.default=f}])});
\ No newline at end of file
diff --git a/package.json b/package.json
index e5cfa7c..e0ebbb3 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-xmasonry",
-  "version": "3.0.4",
+  "version": "3.0.5",
   "description": "Simple & featured native masonry layout implementation for React JS",
   "main": "dist/index.js",
   "types": "types.d.ts",
diff --git a/readme.md b/readme.md
index 3ce6d1e..dc60e57 100644
--- a/readme.md
+++ b/readme.md
@@ -134,7 +134,7 @@ Warning: do not stick XBlock's content styling to `.xblock` selector. Use `.xmas
 how [XMasonry works](#xmasonry-under-the-hood) to understand why: the `.xblock` class is applied
 only **after** the content measurements are done.
 
-### Server Rendering Note
+### Server-Side Rendering
 
 XMasonry, being rendered on the server ([renderToStaticMarkup](https://facebook.github.io/react/docs/react-dom-server)),
 will be unable to detect content heights due server rendering algorithm limitations. 
@@ -157,6 +157,12 @@ server-rendered result look more consistent with the client's one, for example:
 }
 ```
 
+You can disable SSR by using the following environment variable passed to your renderer:
+
+```bash
+REACT_XMASONRY_SSR_ENABLED=false
+```
+
 Configuring Components
 ----------------------
 
diff --git a/src/utils/index.jsx b/src/utils/index.jsx
index fc9fbe3..60c7ba1 100644
--- a/src/utils/index.jsx
+++ b/src/utils/index.jsx
@@ -17,4 +17,5 @@ export const debounce = (f, rate = 45) => {
     }
 };
 
-export const isServer = !(typeof document !== "undefined" && typeof window !== "undefined");
\ No newline at end of file
+export const isServer = ((process || {}).env || {}).REACT_XMASONRY_SSR_ENABLED !== 'false'
+    && !(typeof document !== "undefined" && typeof window !== "undefined");
\ No newline at end of file