From 5215b62dfab795af8c9ff95267daa39cbd1aadb8 Mon Sep 17 00:00:00 2001 From: Samuel Reed Date: Wed, 3 Jun 2015 19:36:57 -0500 Subject: [PATCH] WIP on IE11 upgrade with resizable state problem --- css/styles.css | 33 ++++++++++++++++--------------- dist/react-grid-layout.min.js | 4 ++-- dist/react-grid-layout.min.js.map | 2 +- package.json | 4 ++-- test/test-hook.jsx | 5 ++--- 5 files changed, 24 insertions(+), 24 deletions(-) diff --git a/css/styles.css b/css/styles.css index a7900aa93..2228efa7d 100644 --- a/css/styles.css +++ b/css/styles.css @@ -27,26 +27,27 @@ transition: none; z-index: 3; } -.react-draggable { +.react-resizable { position: relative; } -.react-draggable-active { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - -o-user-select: none; - user-select: none; -} -.react-grid-resize-handle { +.react-resizable-handle.react-draggable { position: absolute; - opacity: 0; width: 20px; height: 20px; - line-height: 28px; - font-size: 20px; - text-align: right; + bottom: 0; + right: 0; + background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pg08IS0tIEdlbmVyYXRvcjogQWRvYmUgRmlyZXdvcmtzIENTNiwgRXhwb3J0IFNWRyBFeHRlbnNpb24gYnkgQWFyb24gQmVhbGwgKGh0dHA6Ly9maXJld29ya3MuYWJlYWxsLmNvbSkgLiBWZXJzaW9uOiAwLjYuMSAgLS0+DTwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DTxzdmcgaWQ9IlVudGl0bGVkLVBhZ2UlMjAxIiB2aWV3Qm94PSIwIDAgNiA2IiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjojZmZmZmZmMDAiIHZlcnNpb249IjEuMSINCXhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiDQl4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjZweCIgaGVpZ2h0PSI2cHgiDT4NCTxnIG9wYWNpdHk9IjAuMzAyIj4NCQk8cGF0aCBkPSJNIDYgNiBMIDAgNiBMIDAgNC4yIEwgNCA0LjIgTCA0LjIgNC4yIEwgNC4yIDAgTCA2IDAgTCA2IDYgTCA2IDYgWiIgZmlsbD0iIzAwMDAwMCIvPg0JPC9nPg08L3N2Zz4='); + background-position: bottom right; + padding: 0 3px 3px 0; + background-repeat: no-repeat; + background-origin: content-box; + box-sizing: border-box; cursor: se-resize; -} -.react-grid-item:hover .react-grid-resize-handle { - opacity: 1; + /* Since this handle is absolutely positioned, we don't want the + draggable transforms to actually move it */ + transform: none !important; + -webkit-transform: none !important; + -ms-transform: none !important; + -o-transform: none !important; + -moz-transform: none !important; } diff --git a/dist/react-grid-layout.min.js b/dist/react-grid-layout.min.js index dee61850b..5ac404832 100644 --- a/dist/react-grid-layout.min.js +++ b/dist/react-grid-layout.min.js @@ -1,7 +1,7 @@ -!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("React")):"function"==typeof define&&define.amd?define(["React"],e):"object"==typeof exports?exports.ReactGridLayout=e(require("React")):t.ReactGridLayout=e(t.React)}(this,function(t){return function(t){function e(o){if(r[o])return r[o].exports;var n=r[o]={exports:{},id:o,loaded:!1};return t[o].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var r={};return e.m=t,e.c=r,e.p="",e(0)}([function(t,e,r){"use strict";t.exports=r(5),t.exports.Responsive=r(11)},function(e,r,o){e.exports=t},function(t,e,r){"use strict";var o=r(3),n=t.exports={bottom:function(t){for(var e,r=0,o=0,n=t.length;n>o;o++)e=t[o].y+t[o].h,e>r&&(r=e);return r},clone:function(t){return o({},t)},collides:function(t,e){return t===e?!1:t.x+t.w<=e.x?!1:t.x>=e.x+e.w?!1:t.y+t.h<=e.y?!1:t.y>=e.y+e.h?!1:!0},compact:function(t,e){for(var r=n.getStatics(t),o=[],i=n.sortLayoutItemsByRowCol(t),s=0,a=i.length;a>s;s++){var p=i[s];p["static"]||(p=n.compactItem(r,p,e),r.push(p)),o[t.indexOf(p)]=p,delete p.moved}return o},compactItem:function(t,e,r){if(r)for(;e.y>0&&!n.getFirstCollision(t,e);)e.y--;for(var o;o=n.getFirstCollision(t,e);)e.y=o.y+o.h;return e},correctBounds:function(t,e){for(var r=n.getStatics(t),o=0,i=t.length;i>o;o++){var s=t[o];if(s.x+s.w>e.cols&&(s.x=e.cols-s.w),s.x<0&&(s.x=0,s.w=e.cols),s["static"])for(;n.getFirstCollision(r,s);)s.y++;else r.push(s)}return t},getLayoutItem:function(t,e){e=""+e;for(var r=0,o=t.length;o>r;r++)if(""+t[r].i===e)return t[r]},getFirstCollision:function(t,e){for(var r=0,o=t.length;o>r;r++)if(n.collides(t[r],e))return t[r]},getAllCollisions:function(t,e){for(var r=[],o=0,i=t.length;i>o;o++)n.collides(t[o],e)&&r.push(t[o]);return r},getStatics:function(t){for(var e=[],r=0,o=t.length;o>r;r++)t[r]["static"]&&e.push(t[r]);return e},moveElement:function(t,e,r,o,i){if(e["static"])return t;if(e.y===o&&e.x===r)return t;var s=e.y>o;void 0!==r&&(e.x=r),void 0!==o&&(e.y=o),e.moved=!0;var a=n.sortLayoutItemsByRowCol(t);s&&(a=a.reverse());for(var p=n.getAllCollisions(a,e),c=0,l=p.length;l>c;c++){var u=p[c];u.moved||e.y>u.y&&e.y-u.y>u.h/4||(t=u["static"]?n.moveElementAwayFromCollision(t,u,e,i):n.moveElementAwayFromCollision(t,e,u,i))}return t},moveElementAwayFromCollision:function(t,e,r,o){if(o){var i={x:r.x,y:r.y,w:r.w,h:r.h};if(i.y=Math.max(e.y-r.h,0),!n.getFirstCollision(t,i))return n.moveElement(t,r,void 0,i.y)}return n.moveElement(t,r,void 0,r.y+1)},perc:function(t){return 100*t+"%"},setTransform:function(t,e){var r=(""+e[0]).replace(/(\d)$/,"$1px"),o=(""+e[1]).replace(/(\d)$/,"$1px");return t.transform="translate("+r+","+o+")",t.WebkitTransform="translate("+r+","+o+")",t.MozTransform="translate("+r+","+o+")",t.msTransform="translate("+r+","+o+")",t.OTransform="translate("+r+","+o+")",t},sortLayoutItemsByRowCol:function(t){return[].concat(t).sort(function(t,e){return t.y>e.y||t.y===e.y&&t.x>e.x?1:-1})},synchronizeLayoutWithChildren:function(t,e,r,i){Array.isArray(e)||(e=[e]),t=t||[];for(var s=[],a=0,p=e.length;p>a;a++){var c=e[a],l=n.getLayoutItem(t,c.key);if(l)l.i=""+l.i,s.push(l);else{var u=c.props._grid;u?(n.validateLayout([u],"ReactGridLayout.child"),s.push(i?o({},u,{y:Math.min(n.bottom(s),u.y),i:c.key}):o({},u,{y:u.y,i:c.key}))):s.push({w:1,h:1,x:0,y:n.bottom(s),i:c.key})}}return s=n.correctBounds(s,{cols:r}),s=n.compact(s,i)},validateLayout:function(t,e){e=e||"Layout";var r=["x","y","w","h"];if(!Array.isArray(t))throw new Error(e+" must be an array!");for(var o=0,n=t.length;n>o;o++){for(var i=0;i=0||Object.prototype.hasOwnProperty.call(t,o)&&(r[o]=t[o]);return r},n=Object.assign||function(t){for(var e=1;et.w||t.minW>t.maxW)&&o("minW",t)},maxW:function(t,e,r){n.PropTypes.number.apply(this,arguments),(t.maxWt.h||t.minH>t.maxH)&&o("minH",t)},maxH:function(t,e,r){n.PropTypes.number.apply(this,arguments),(t.maxH=0||Object.prototype.hasOwnProperty.call(t,o)&&(r[o]=t[o]);return r},n=Object.assign||function(t){for(var e=1;ei;i++){var a=r[i];e>t[a]&&(o=a)}return o},getColsFromBreakpoint:function(t,e){if(!e[t])throw new Error("ResponsiveReactGridLayout: `cols` entry for breakpoint "+t+" is missing!");return e[t]},findOrGenerateResponsiveLayout:function(t,e,r,i,s,a){if(t[r])return t[r];for(var p=t[i],c=n.sortBreakpoints(e),l=c.slice(c.indexOf(r)),u=0,h=l.length;h>u;u++){var f=l[u];if(t[f]){p=t[f];break}}return p=JSON.parse(JSON.stringify(p||[])),o.compact(o.correctBounds(p,{cols:s}),a)},sortBreakpoints:function(t){var e=Object.keys(t);return e.sort(function(e,r){return t[e]-t[r]})}}},function(t,e,r){function o(t){return null===t||void 0===t}function n(t){return t&&"object"==typeof t&&"number"==typeof t.length?"function"!=typeof t.copy||"function"!=typeof t.slice?!1:t.length>0&&"number"!=typeof t[0]?!1:!0:!1}function i(t,e,r){var i,l;if(o(t)||o(e))return!1;if(t.prototype!==e.prototype)return!1;if(p(t))return p(e)?(t=s.call(t),e=s.call(e),c(t,e,r)):!1;if(n(t)){if(!n(e))return!1;if(t.length!==e.length)return!1;for(i=0;i=0;i--)if(u[i]!=h[i])return!1;for(i=u.length-1;i>=0;i--)if(l=u[i],!c(t[l],e[l],r))return!1;return typeof t==typeof e}var s=Array.prototype.slice,a=r(15),p=r(14),c=t.exports=function(t,e,r){return r||(r={}),t===e?!0:t instanceof Date&&e instanceof Date?t.getTime()===e.getTime():"object"!=typeof t&&"object"!=typeof e?r.strict?t===e:t==e:i(t,e,r)}},function(t,e,r){function o(t){return"[object Arguments]"==Object.prototype.toString.call(t)}function n(t){return t&&"object"==typeof t&&"number"==typeof t.length&&Object.prototype.hasOwnProperty.call(t,"callee")&&!Object.prototype.propertyIsEnumerable.call(t,"callee")||!1}var i="[object Arguments]"==function(){return Object.prototype.toString.call(arguments)}();e=t.exports=i?o:n,e.supported=o,e.unsupported=n},function(t,e,r){function o(t){var e=[];for(var r in t)e.push(r);return e}e=t.exports="function"==typeof Object.keys?Object.keys:o,e.shim=o},function(t,e,r){"use strict";function o(t){var e=t._pendingState||t.state;return{node:t.getDOMNode(),position:{top:e.clientY,left:e.clientX}}}function n(t){return"both"===t.props.axis||"y"===t.props.axis}function i(t){return"both"===t.props.axis||"x"===t.props.axis}function s(t){return"function"==typeof t||"[object Function]"===Object.prototype.toString.call(t)}function a(t,e){for(var r=0,o=t.length;o>r;r++)if(e.apply(e,[t[r],r,t]))return t[r]}function p(t,e){var r=a(["matches","webkitMatchesSelector","mozMatchesSelector","msMatchesSelector","oMatchesSelector"],function(e){return s(t[e])});return t[r].call(t,e)}function c(t){var e=t.touches&&t.touches[0]||t;return{clientX:e.clientX,clientY:e.clientY}}function l(t,e,r){t&&(t.attachEvent?t.attachEvent("on"+e,r):t.addEventListener?t.addEventListener(e,r,!0):t["on"+e]=r)}function u(t,e,r){t&&(t.detachEvent?t.detachEvent("on"+e,r):t.removeEventListener?t.removeEventListener(e,r,!0):t["on"+e]=null)}function h(t){var e=t.clientHeight,r=window.getComputedStyle(t);return e+=m(r.borderTopWidth),e+=m(r.borderBottomWidth)}function f(t){var e=t.clientWidth,r=window.getComputedStyle(t);return e+=m(r.borderLeftWidth),e+=m(r.borderRightWidth)}function y(t){var e=t.clientHeight,r=window.getComputedStyle(t);return e-=m(r.paddingTop),e-=m(r.paddingBottom)}function d(t){var e=t.clientWidth,r=window.getComputedStyle(t);return e-=m(r.paddingLeft),e-=m(r.paddingRight)}function g(t){return"number"==typeof t&&!isNaN(t)}function m(t){return parseInt(t,10)}function v(t,e,r){var o=JSON.parse(JSON.stringify(t.props.bounds)),n=t.getDOMNode(),i=n.parentNode;if("parent"===o){var s=window.getComputedStyle(n),a=window.getComputedStyle(i);o={left:-n.offsetLeft+m(a.paddingLeft)+m(s.borderLeftWidth)+m(s.marginLeft),top:-n.offsetTop+m(a.paddingTop)+m(s.borderTopWidth)+m(s.marginTop),right:d(i)-f(n)-n.offsetLeft,bottom:y(i)-h(n)-n.offsetTop}}return g(o.right)&&(e=Math.min(e,o.right)),g(o.bottom)&&(r=Math.min(r,o.bottom)),g(o.left)&&(e=Math.max(e,o.left)),g(o.top)&&(r=Math.max(r,o.top)),[e,r]}function b(t,e,r){var o=Math.round(e/t[0])*t[0],n=Math.round(r/t[1])*t[1];return[o,n]}function S(t){if(t.props.enableUserSelectHack){var e=document.body.getAttribute("style")||"";document.body.setAttribute("style",e+O)}}function w(t){if(t.props.enableUserSelectHack){var e=document.body.getAttribute("style")||"";document.body.setAttribute("style",e.replace(O,""))}}function x(t){var e=t.x+"px",r=t.y+"px";return{transform:"translate("+e+","+r+")",WebkitTransform:"translate("+e+","+r+")",OTransform:"translate("+e+","+r+")",msTransform:"translate("+e+","+r+")",MozTransform:"translate("+e+","+r+")"}}var T=r(1),R=function(){},P=r(3),z=r(17),C={touch:{start:"touchstart",move:"touchmove",end:"touchend"},mouse:{start:"mousedown",move:"mousemove",end:"mouseup"}},D=C.mouse,O=";user-select: none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;-ms-user-select:none;";t.exports=T.createClass({displayName:"Draggable",propTypes:{axis:T.PropTypes.oneOf(["both","x","y"]),bounds:T.PropTypes.oneOfType([T.PropTypes.shape({left:T.PropTypes.Number,right:T.PropTypes.Number,top:T.PropTypes.Number,bottom:T.PropTypes.Number}),T.PropTypes.oneOf(["parent",!1])]),enableUserSelectHack:T.PropTypes.bool,handle:T.PropTypes.string,cancel:T.PropTypes.string,grid:T.PropTypes.arrayOf(T.PropTypes.number),start:T.PropTypes.shape({x:T.PropTypes.number,y:T.PropTypes.number}),moveOnStartChange:T.PropTypes.bool,zIndex:T.PropTypes.number,onStart:T.PropTypes.func,onDrag:T.PropTypes.func,onStop:T.PropTypes.func,onMouseDown:T.PropTypes.func},componentWillReceiveProps:function(t){t.moveOnStartChange&&t.start&&this.setState(this.getInitialState(t))},componentWillUnmount:function(){u(document,D.move,this.handleDrag),u(document,D.end,this.handleDragEnd),w(this)},getDefaultProps:function(){return{axis:"both",bounds:!1,handle:null,cancel:null,grid:null,moveOnStartChange:!1,start:{x:0,y:0},zIndex:0/0,enableUserSelectHack:!0,onStart:R,onDrag:R,onStop:R,onMouseDown:R}},getInitialState:function(t){return t=t||this.props,{dragging:!1,offsetX:0,offsetY:0,clientX:t.start.x,clientY:t.start.y}},handleDragStart:function(t){if(this.props.onMouseDown(t),!(this.props.handle&&!p(t.target,this.props.handle)||this.props.cancel&&p(t.target,this.props.cancel))){var e=this.props.onStart(t,o(this));if(e!==!1){var r=c(t);S(this),this.setState({dragging:!0,offsetX:r.clientX-this.state.clientX,offsetY:r.clientY-this.state.clientY}),l(document,D.move,this.handleDrag),l(document,D.end,this.handleDragEnd)}}},handleDragEnd:function(t){this.state.dragging&&(w(this),this.setState({dragging:!1}),this.props.onStop(t,o(this)),u(document,D.move,this.handleDrag),u(document,D.end,this.handleDragEnd))},handleDrag:function(t){var e=c(t),r=e.clientX-this.state.offsetX,n=e.clientY-this.state.offsetY;if(Array.isArray(this.props.grid)){var i=b(this.props.grid,r,n);r=i[0],n=i[1]}if(this.props.bounds){var s=v(this,r,n);r=s[0],n=s[1]}var a=this.props.onDrag(t,o(this));return a===!1?this.handleDragEnd():void this.setState({clientX:r,clientY:n})},onMouseDown:function(t){return D==C.touch?t.preventDefault():this.handleDragStart.apply(this,arguments)},onTouchStart:function(t){return D=C.touch,this.handleDragStart.apply(this,arguments)},render:function(){var t=this.props.children.props.style||{},e=x({x:i(this)?this.state.clientX:0,y:n(this)?this.state.clientY:0}),r={touchAction:"none"},o=P({},t,e,r);this.state.dragging&&!isNaN(this.props.zIndex)&&(o.zIndex=this.props.zIndex);var s=z(this.props.children.props.className||"","react-draggable",{"react-draggable-dragging":this.state.dragging,"react-draggable-dragged":this.state.dragged});return T.cloneElement(T.Children.only(this.props.children),{style:o,className:s,onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onMouseUp:this.handleDragEnd,onTouchEnd:this.handleDragEnd})}})},function(t,e,r){/*! +!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("React")):"function"==typeof define&&define.amd?define(["React"],e):"object"==typeof exports?exports.ReactGridLayout=e(require("React")):t.ReactGridLayout=e(t.React)}(this,function(t){return function(t){function e(o){if(r[o])return r[o].exports;var n=r[o]={exports:{},id:o,loaded:!1};return t[o].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var r={};return e.m=t,e.c=r,e.p="",e(0)}([function(t,e,r){"use strict";t.exports=r(5),t.exports.Responsive=r(11)},function(e,r,o){e.exports=t},function(t,e,r){"use strict";var o=r(3),n=t.exports={bottom:function(t){for(var e,r=0,o=0,n=t.length;n>o;o++)e=t[o].y+t[o].h,e>r&&(r=e);return r},clone:function(t){return o({},t)},collides:function(t,e){return t===e?!1:t.x+t.w<=e.x?!1:t.x>=e.x+e.w?!1:t.y+t.h<=e.y?!1:t.y>=e.y+e.h?!1:!0},compact:function(t,e){for(var r=n.getStatics(t),o=[],i=n.sortLayoutItemsByRowCol(t),s=0,a=i.length;a>s;s++){var p=i[s];p["static"]||(p=n.compactItem(r,p,e),r.push(p)),o[t.indexOf(p)]=p,delete p.moved}return o},compactItem:function(t,e,r){if(r)for(;e.y>0&&!n.getFirstCollision(t,e);)e.y--;for(var o;o=n.getFirstCollision(t,e);)e.y=o.y+o.h;return e},correctBounds:function(t,e){for(var r=n.getStatics(t),o=0,i=t.length;i>o;o++){var s=t[o];if(s.x+s.w>e.cols&&(s.x=e.cols-s.w),s.x<0&&(s.x=0,s.w=e.cols),s["static"])for(;n.getFirstCollision(r,s);)s.y++;else r.push(s)}return t},getLayoutItem:function(t,e){e=""+e;for(var r=0,o=t.length;o>r;r++)if(""+t[r].i===e)return t[r]},getFirstCollision:function(t,e){for(var r=0,o=t.length;o>r;r++)if(n.collides(t[r],e))return t[r]},getAllCollisions:function(t,e){for(var r=[],o=0,i=t.length;i>o;o++)n.collides(t[o],e)&&r.push(t[o]);return r},getStatics:function(t){for(var e=[],r=0,o=t.length;o>r;r++)t[r]["static"]&&e.push(t[r]);return e},moveElement:function(t,e,r,o,i){if(e["static"])return t;if(e.y===o&&e.x===r)return t;var s=e.y>o;void 0!==r&&(e.x=r),void 0!==o&&(e.y=o),e.moved=!0;var a=n.sortLayoutItemsByRowCol(t);s&&(a=a.reverse());for(var p=n.getAllCollisions(a,e),l=0,c=p.length;c>l;l++){var h=p[l];h.moved||e.y>h.y&&e.y-h.y>h.h/4||(t=h["static"]?n.moveElementAwayFromCollision(t,h,e,i):n.moveElementAwayFromCollision(t,e,h,i))}return t},moveElementAwayFromCollision:function(t,e,r,o){if(o){var i={x:r.x,y:r.y,w:r.w,h:r.h};if(i.y=Math.max(e.y-r.h,0),!n.getFirstCollision(t,i))return n.moveElement(t,r,void 0,i.y)}return n.moveElement(t,r,void 0,r.y+1)},perc:function(t){return 100*t+"%"},setTransform:function(t,e){var r=(""+e[0]).replace(/(\d)$/,"$1px"),o=(""+e[1]).replace(/(\d)$/,"$1px");return t.transform="translate("+r+","+o+")",t.WebkitTransform="translate("+r+","+o+")",t.MozTransform="translate("+r+","+o+")",t.msTransform="translate("+r+","+o+")",t.OTransform="translate("+r+","+o+")",t},sortLayoutItemsByRowCol:function(t){return[].concat(t).sort(function(t,e){return t.y>e.y||t.y===e.y&&t.x>e.x?1:-1})},synchronizeLayoutWithChildren:function(t,e,r,i){Array.isArray(e)||(e=[e]),t=t||[];for(var s=[],a=0,p=e.length;p>a;a++){var l=e[a],c=n.getLayoutItem(t,l.key);if(c)c.i=""+c.i,s.push(c);else{var h=l.props._grid;h?(n.validateLayout([h],"ReactGridLayout.child"),s.push(i?o({},h,{y:Math.min(n.bottom(s),h.y),i:l.key}):o({},h,{y:h.y,i:l.key}))):s.push({w:1,h:1,x:0,y:n.bottom(s),i:l.key})}}return s=n.correctBounds(s,{cols:r}),s=n.compact(s,i)},validateLayout:function(t,e){e=e||"Layout";var r=["x","y","w","h"];if(!Array.isArray(t))throw new Error(e+" must be an array!");for(var o=0,n=t.length;n>o;o++){for(var i=0;i=0||Object.prototype.hasOwnProperty.call(t,o)&&(r[o]=t[o]);return r},n=Object.assign||function(t){for(var e=1;et.w||t.minW>t.maxW)&&o("minW",t)},maxW:function(t,e,r){n.PropTypes.number.apply(this,arguments),(t.maxWt.h||t.minH>t.maxH)&&o("minH",t)},maxH:function(t,e,r){n.PropTypes.number.apply(this,arguments),(t.maxH=0||Object.prototype.hasOwnProperty.call(t,o)&&(r[o]=t[o]);return r},n=Object.assign||function(t){for(var e=1;ei;i++){var a=r[i];e>t[a]&&(o=a)}return o},getColsFromBreakpoint:function(t,e){if(!e[t])throw new Error("ResponsiveReactGridLayout: `cols` entry for breakpoint "+t+" is missing!");return e[t]},findOrGenerateResponsiveLayout:function(t,e,r,i,s,a){if(t[r])return t[r];for(var p=t[i],l=n.sortBreakpoints(e),c=l.slice(l.indexOf(r)),h=0,u=c.length;u>h;h++){var f=c[h];if(t[f]){p=t[f];break}}return p=JSON.parse(JSON.stringify(p||[])),o.compact(o.correctBounds(p,{cols:s}),a)},sortBreakpoints:function(t){var e=Object.keys(t);return e.sort(function(e,r){return t[e]-t[r]})}}},function(t,e,r){function o(t){return null===t||void 0===t}function n(t){return t&&"object"==typeof t&&"number"==typeof t.length?"function"!=typeof t.copy||"function"!=typeof t.slice?!1:t.length>0&&"number"!=typeof t[0]?!1:!0:!1}function i(t,e,r){var i,c;if(o(t)||o(e))return!1;if(t.prototype!==e.prototype)return!1;if(p(t))return p(e)?(t=s.call(t),e=s.call(e),l(t,e,r)):!1;if(n(t)){if(!n(e))return!1;if(t.length!==e.length)return!1;for(i=0;i=0;i--)if(h[i]!=u[i])return!1;for(i=h.length-1;i>=0;i--)if(c=h[i],!l(t[c],e[c],r))return!1;return typeof t==typeof e}var s=Array.prototype.slice,a=r(15),p=r(14),l=t.exports=function(t,e,r){return r||(r={}),t===e?!0:t instanceof Date&&e instanceof Date?t.getTime()===e.getTime():"object"!=typeof t&&"object"!=typeof e?r.strict?t===e:t==e:i(t,e,r)}},function(t,e,r){function o(t){return"[object Arguments]"==Object.prototype.toString.call(t)}function n(t){return t&&"object"==typeof t&&"number"==typeof t.length&&Object.prototype.hasOwnProperty.call(t,"callee")&&!Object.prototype.propertyIsEnumerable.call(t,"callee")||!1}var i="[object Arguments]"==function(){return Object.prototype.toString.call(arguments)}();e=t.exports=i?o:n,e.supported=o,e.unsupported=n},function(t,e,r){function o(t){var e=[];for(var r in t)e.push(r);return e}e=t.exports="function"==typeof Object.keys?Object.keys:o,e.shim=o},function(t,e,r){"use strict";function o(t){var e=t._pendingState||t.state;return{node:t.getDOMNode(),position:{top:e.clientY,left:e.clientX}}}function n(t){return"both"===t.props.axis||"y"===t.props.axis}function i(t){return"both"===t.props.axis||"x"===t.props.axis}function s(t){return"function"==typeof t||"[object Function]"===Object.prototype.toString.call(t)}function a(t,e){for(var r=0,o=t.length;o>r;r++)if(e.apply(e,[t[r],r,t]))return t[r]}function p(t,e){var r=a(["matches","webkitMatchesSelector","mozMatchesSelector","msMatchesSelector","oMatchesSelector"],function(e){return s(t[e])});return t[r].call(t,e)}function l(t){var e=t.touches&&t.touches[0]||t;return{clientX:e.clientX,clientY:e.clientY}}function c(t,e,r){t&&(t.attachEvent?t.attachEvent("on"+e,r):t.addEventListener?t.addEventListener(e,r,!0):t["on"+e]=r)}function h(t,e,r){t&&(t.detachEvent?t.detachEvent("on"+e,r):t.removeEventListener?t.removeEventListener(e,r,!0):t["on"+e]=null)}function u(t){var e=t.clientHeight,r=window.getComputedStyle(t);return e+=m(r.borderTopWidth),e+=m(r.borderBottomWidth)}function f(t){var e=t.clientWidth,r=window.getComputedStyle(t);return e+=m(r.borderLeftWidth),e+=m(r.borderRightWidth)}function d(t){var e=t.clientHeight,r=window.getComputedStyle(t);return e-=m(r.paddingTop),e-=m(r.paddingBottom)}function y(t){var e=t.clientWidth,r=window.getComputedStyle(t);return e-=m(r.paddingLeft),e-=m(r.paddingRight)}function g(t){return"number"==typeof t&&!isNaN(t)}function m(t){return parseInt(t,10)}function v(t,e,r){var o=JSON.parse(JSON.stringify(t.props.bounds)),n=t.getDOMNode(),i=n.parentNode;if("parent"===o){var s=window.getComputedStyle(n),a=window.getComputedStyle(i);o={left:-n.offsetLeft+m(a.paddingLeft)+m(s.borderLeftWidth)+m(s.marginLeft),top:-n.offsetTop+m(a.paddingTop)+m(s.borderTopWidth)+m(s.marginTop),right:y(i)-f(n)-n.offsetLeft,bottom:d(i)-u(n)-n.offsetTop}}return g(o.right)&&(e=Math.min(e,o.right)),g(o.bottom)&&(r=Math.min(r,o.bottom)),g(o.left)&&(e=Math.max(e,o.left)),g(o.top)&&(r=Math.max(r,o.top)),[e,r]}function b(t,e,r){var o=Math.round(e/t[0])*t[0],n=Math.round(r/t[1])*t[1];return[o,n]}function S(t){if(t.props.enableUserSelectHack){var e=document.body.getAttribute("style")||"";document.body.setAttribute("style",e+O)}}function w(t){if(t.props.enableUserSelectHack){var e=document.body.getAttribute("style")||"";document.body.setAttribute("style",e.replace(O,""))}}function x(t){var e=t.x+"px",r=t.y+"px";return{transform:"translate("+e+","+r+")",WebkitTransform:"translate("+e+","+r+")",OTransform:"translate("+e+","+r+")",msTransform:"translate("+e+","+r+")",MozTransform:"translate("+e+","+r+")"}}var T=r(1),R=function(){},z=r(3),P=r(17),C={touch:{start:"touchstart",move:"touchmove",end:"touchend"},mouse:{start:"mousedown",move:"mousemove",end:"mouseup"}},D=C.mouse,O=";user-select: none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;-ms-user-select:none;";t.exports=T.createClass({displayName:"Draggable",propTypes:{axis:T.PropTypes.oneOf(["both","x","y"]),bounds:T.PropTypes.oneOfType([T.PropTypes.shape({left:T.PropTypes.Number,right:T.PropTypes.Number,top:T.PropTypes.Number,bottom:T.PropTypes.Number}),T.PropTypes.oneOf(["parent",!1])]),enableUserSelectHack:T.PropTypes.bool,handle:T.PropTypes.string,cancel:T.PropTypes.string,grid:T.PropTypes.arrayOf(T.PropTypes.number),start:T.PropTypes.shape({x:T.PropTypes.number,y:T.PropTypes.number}),moveOnStartChange:T.PropTypes.bool,zIndex:T.PropTypes.number,onStart:T.PropTypes.func,onDrag:T.PropTypes.func,onStop:T.PropTypes.func,onMouseDown:T.PropTypes.func},componentWillReceiveProps:function(t){t.moveOnStartChange&&t.start&&this.setState(this.getInitialState(t))},componentWillUnmount:function(){h(document,D.move,this.handleDrag),h(document,D.end,this.handleDragEnd),w(this)},getDefaultProps:function(){return{axis:"both",bounds:!1,handle:null,cancel:null,grid:null,moveOnStartChange:!1,start:{x:0,y:0},zIndex:0/0,enableUserSelectHack:!0,onStart:R,onDrag:R,onStop:R,onMouseDown:R}},getInitialState:function(t){return t=t||this.props,{dragging:!1,offsetX:0,offsetY:0,clientX:t.start.x,clientY:t.start.y}},handleDragStart:function(t){if(this.props.onMouseDown(t),!(this.props.handle&&!p(t.target,this.props.handle)||this.props.cancel&&p(t.target,this.props.cancel))){var e=this.props.onStart(t,o(this));if(e!==!1){var r=l(t);S(this),this.setState({dragging:!0,offsetX:r.clientX-this.state.clientX,offsetY:r.clientY-this.state.clientY}),c(document,D.move,this.handleDrag),c(document,D.end,this.handleDragEnd)}}},handleDragEnd:function(t){this.state.dragging&&(w(this),this.setState({dragging:!1}),this.props.onStop(t,o(this)),h(document,D.move,this.handleDrag),h(document,D.end,this.handleDragEnd))},handleDrag:function(t){var e=l(t),r=e.clientX-this.state.offsetX,n=e.clientY-this.state.offsetY;if(Array.isArray(this.props.grid)){var i=b(this.props.grid,r,n);r=i[0],n=i[1]}if(this.props.bounds){var s=v(this,r,n);r=s[0],n=s[1]}var a=this.props.onDrag(t,o(this));return a===!1?this.handleDragEnd():void this.setState({clientX:r,clientY:n})},onMouseDown:function(t){return D==C.touch?t.preventDefault():this.handleDragStart.apply(this,arguments)},onTouchStart:function(t){return D=C.touch,this.handleDragStart.apply(this,arguments)},resetState:function(){this.setState({offsetX:0,offsetY:0,clientX:0,clientY:0})},render:function(){var t=this.props.children.props.style||{},e=x({x:i(this)?this.state.clientX:0,y:n(this)?this.state.clientY:0}),r={touchAction:"none"},o=z({},t,e,r);this.state.dragging&&!isNaN(this.props.zIndex)&&(o.zIndex=this.props.zIndex);var s=P(this.props.children.props.className||"","react-draggable",{"react-draggable-dragging":this.state.dragging,"react-draggable-dragged":this.state.dragged});return T.cloneElement(T.Children.only(this.props.children),{style:o,className:s,onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onMouseUp:this.handleDragEnd,onTouchEnd:this.handleDragEnd})}})},function(t,e,r){/*! Copyright (c) 2015 Jed Watson. Licensed under the MIT License (MIT), see http://jedwatson.github.io/classnames */ -function o(){for(var t,e="",r=0;r=0||Object.prototype.hasOwnProperty.call(t,o)&&(r[o]=t[o]);return r},n=function(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t)){var r=[],o=!0,n=!1,i=void 0;try{for(var s,a=t[Symbol.iterator]();!(o=(s=a.next()).done)&&(r.push(s.value),!e||r.length!==e);o=!0);}catch(p){n=!0,i=p}finally{try{!o&&a["return"]&&a["return"]()}finally{if(n)throw i}}return r}throw new TypeError("Invalid attempt to destructure non-iterable instance")},i=Object.assign||function(t){for(var e=1;e=0||Object.prototype.hasOwnProperty.call(t,o)&&(r[o]=t[o]);return r},n=function(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t)){var r=[],o=!0,n=!1,i=void 0;try{for(var s,a=t[Symbol.iterator]();!(o=(s=a.next()).done)&&(r.push(s.value),!e||r.length!==e);o=!0);}catch(p){n=!0,i=p}finally{try{!o&&a["return"]&&a["return"]()}finally{if(n)throw i}}return r}throw new TypeError("Invalid attempt to destructure non-iterable instance")},i=Object.assign||function(t){for(var e=1;e max) max = bottomY;\n\t }\n\t return max;\n\t },\n\n\t /**\n\t * Clones a shallow object.\n\t * @param {Object} obj Object to clone.\n\t * @return {Object} Cloned object.\n\t */\n\t clone: function clone(obj) {\n\t return assign({}, obj);\n\t },\n\n\t /**\n\t * Given two layouts, check if they collide.\n\t *\n\t * @param {Object} l1 Layout object.\n\t * @param {Object} l2 Layout object.\n\t * @return {Boolean} True if colliding.\n\t */\n\t collides: function collides(l1, l2) {\n\t if (l1 === l2) {\n\t return false;\n\t } // same element\n\t if (l1.x + l1.w <= l2.x) {\n\t return false;\n\t } // l1 is left of l2\n\t if (l1.x >= l2.x + l2.w) {\n\t return false;\n\t } // l1 is right of l2\n\t if (l1.y + l1.h <= l2.y) {\n\t return false;\n\t } // l1 is above l2\n\t if (l1.y >= l2.y + l2.h) {\n\t return false;\n\t } // l1 is below l2\n\t return true; // boxes overlap\n\t },\n\n\t /**\n\t * Given a layout, compact it. This involves going down each y coordinate and removing gaps\n\t * between items.\n\t *\n\t * @param {Array} layout Layout.\n\t * @param {Boolean} verticalCompact Whether or not to compact the layout\n\t * vertically.\n\t * @return {Array} Compacted Layout.\n\t */\n\t compact: function compact(layout, verticalCompact) {\n\t // Statics go in the compareWith array right away so items flow around them.\n\t var compareWith = utils.getStatics(layout),\n\t out = [];\n\t // We go through the items by row and column.\n\t var sorted = utils.sortLayoutItemsByRowCol(layout);\n\n\t for (var i = 0, len = sorted.length; i < len; i++) {\n\t var l = sorted[i];\n\n\t // Don't move static elements\n\t if (!l['static']) {\n\t l = utils.compactItem(compareWith, l, verticalCompact);\n\n\t // Add to comparison array. We only collide with items before this one.\n\t // Statics are already in this array.\n\t compareWith.push(l);\n\t }\n\n\t // Add to output array to make sure they still come out in the right order.\n\t out[layout.indexOf(l)] = l;\n\n\t // Clear moved flag, if it exists.\n\t delete l.moved;\n\t }\n\n\t return out;\n\t },\n\n\t compactItem: function compactItem(compareWith, l, verticalCompact) {\n\t if (verticalCompact) {\n\t // Move the element up as far as it can go without colliding.\n\t while (l.y > 0 && !utils.getFirstCollision(compareWith, l)) {\n\t l.y--;\n\t }\n\t }\n\n\t // Move it down, and keep moving it down if it's colliding.\n\t var collides;\n\t while (collides = utils.getFirstCollision(compareWith, l)) {\n\t l.y = collides.y + collides.h;\n\t }\n\t return l;\n\t },\n\n\t /**\n\t * Given a layout, make sure all elements fit within its bounds.\n\t *\n\t * @param {Array} layout Layout array.\n\t * @param {Number} bounds Number of columns.\n\t * @return {[type]} [description]\n\t */\n\t correctBounds: function correctBounds(layout, bounds) {\n\t var collidesWith = utils.getStatics(layout);\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t var l = layout[i];\n\t // Overflows right\n\t if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w;\n\t // Overflows left\n\t if (l.x < 0) {\n\t l.x = 0;\n\t l.w = bounds.cols;\n\t }\n\t if (!l['static']) collidesWith.push(l);else {\n\t // If this is static and collides with other statics, we must move it down.\n\t // We have to do something nicer than just letting them overlap.\n\t while (utils.getFirstCollision(collidesWith, l)) {\n\t l.y++;\n\t }\n\t }\n\t }\n\t return layout;\n\t },\n\n\t /**\n\t * Get a layout item by ID. Used so we can override later on if necessary.\n\t *\n\t * @param {Array} layout Layout array.\n\t * @param {Number} id ID\n\t * @return {LayoutItem} Item at ID.\n\t */\n\t getLayoutItem: function getLayoutItem(layout, id) {\n\t id = '' + id;\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if ('' + layout[i].i === id) {\n\t return layout[i];\n\t }\n\t }\n\t },\n\n\t /**\n\t * Returns the first item this layout collides with.\n\t * It doesn't appear to matter which order we approach this from, although\n\t * perhaps that is the wrong thing to do.\n\t *\n\t * @param {Object} layoutItem Layout item.\n\t * @return {Object|undefined} A colliding layout item, or undefined.\n\t */\n\t getFirstCollision: function getFirstCollision(layout, layoutItem) {\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if (utils.collides(layout[i], layoutItem)) {\n\t return layout[i];\n\t }\n\t }\n\t },\n\n\t getAllCollisions: function getAllCollisions(layout, layoutItem) {\n\t var out = [];\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if (utils.collides(layout[i], layoutItem)) out.push(layout[i]);\n\t }\n\t return out;\n\t },\n\n\t /**\n\t * Get all static elements.\n\t * @param {Array} layout Array of layout objects.\n\t * @return {Array} Array of static layout items..\n\t */\n\t getStatics: function getStatics(layout) {\n\t var out = [];\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if (layout[i]['static']) out.push(layout[i]);\n\t }\n\t return out;\n\t },\n\n\t /**\n\t * Move an element. Responsible for doing cascading movements of other elements.\n\t *\n\t * @param {Array} layout Full layout to modify.\n\t * @param {LayoutItem} l element to move.\n\t * @param {Number} [x] X position in grid units.\n\t * @param {Number} [y] Y position in grid units.\n\t * @param {Boolean} [isUserAction] If true, designates that the item we're moving is\n\t * being dragged/resized by th euser.\n\t */\n\t moveElement: function moveElement(layout, l, x, y, isUserAction) {\n\t if (l['static']) {\n\t return layout;\n\t } // Short-circuit if nothing to do.\n\t if (l.y === y && l.x === x) {\n\t return layout;\n\t }var movingUp = l.y > y;\n\t // This is quite a bit faster than extending the object\n\t if (x !== undefined) l.x = x;\n\t if (y !== undefined) l.y = y;\n\t l.moved = true;\n\n\t // If this collides with anything, move it.\n\t // When doing this comparison, we have to sort the items we compare with\n\t // to ensure, in the case of multiple collisions, that we're getting the\n\t // nearest collision.\n\t var sorted = utils.sortLayoutItemsByRowCol(layout);\n\t if (movingUp) sorted = sorted.reverse();\n\t var collisions = utils.getAllCollisions(sorted, l);\n\n\t // Move each item that collides away from this element.\n\t for (var i = 0, len = collisions.length; i < len; i++) {\n\t var collision = collisions[i];\n\t // console.log('resolving collision between', l.i, 'at', l.y, 'and', collision.i, 'at', collision.y);\n\n\t // Short circuit so we can't infinite loop\n\t if (collision.moved) continue;\n\n\t // This makes it feel a bit more precise by waiting to swap for just a bit when moving up.\n\t if (l.y > collision.y && l.y - collision.y > collision.h / 4) continue;\n\n\t // Don't move static items - we have to move *this* element away\n\t if (collision['static']) {\n\t layout = utils.moveElementAwayFromCollision(layout, collision, l, isUserAction);\n\t } else {\n\t layout = utils.moveElementAwayFromCollision(layout, l, collision, isUserAction);\n\t }\n\t }\n\n\t return layout;\n\t },\n\n\t /**\n\t * This is where the magic needs to happen - given a collision, move an element away from the collision.\n\t * We attempt to move it up if there's room, otherwise it goes below.\n\t *\n\t * @param {Array} layout Full layout to modify.\n\t * @param {LayoutItem} collidesWith Layout item we're colliding with.\n\t * @param {LayoutItem} itemToMove Layout item we're moving.\n\t * @param {Boolean} [isUserAction] If true, designates that the item we're moving is being dragged/resized\n\t * by the user.\n\t */\n\t moveElementAwayFromCollision: function moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAction) {\n\n\t // If there is enough space above the collision to put this element, move it there.\n\t // We only do this on the main collision as this can get funky in cascades and cause\n\t // unwanted swapping behavior.\n\t if (isUserAction) {\n\t // Make a mock item so we don't modify the item here, only modify in moveElement.\n\t var fakeItem = {\n\t x: itemToMove.x,\n\t y: itemToMove.y,\n\t w: itemToMove.w,\n\t h: itemToMove.h\n\t };\n\t fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0);\n\t if (!utils.getFirstCollision(layout, fakeItem)) {\n\t return utils.moveElement(layout, itemToMove, undefined, fakeItem.y);\n\t }\n\t }\n\n\t // Previously this was optimized to move below the collision directly, but this can cause problems\n\t // with cascading moves, as an item may actually leapflog a collision and cause a reversal in order.\n\t return utils.moveElement(layout, itemToMove, undefined, itemToMove.y + 1);\n\t },\n\n\t /**\n\t * Helper to convert a number to a percentage string.\n\t *\n\t * @param {Number} num Any number\n\t * @return {String} That number as a percentage.\n\t */\n\t perc: function perc(num) {\n\t return num * 100 + '%';\n\t },\n\n\t setTransform: function setTransform(style, coords) {\n\t // Replace unitless items with px\n\t var x = ('' + coords[0]).replace(/(\\d)$/, '$1px');\n\t var y = ('' + coords[1]).replace(/(\\d)$/, '$1px');\n\t style.transform = 'translate(' + x + ',' + y + ')';\n\t style.WebkitTransform = 'translate(' + x + ',' + y + ')';\n\t style.MozTransform = 'translate(' + x + ',' + y + ')';\n\t style.msTransform = 'translate(' + x + ',' + y + ')';\n\t style.OTransform = 'translate(' + x + ',' + y + ')';\n\t return style;\n\t },\n\n\t /**\n\t * Get layout items sorted from top left to right and down.\n\t *\n\t * @return {Array} Array of layout objects.\n\t * @return {Array} Layout, sorted static items first.\n\t */\n\t sortLayoutItemsByRowCol: function sortLayoutItemsByRowCol(layout) {\n\t return [].concat(layout).sort(function (a, b) {\n\t if (a.y > b.y || a.y === b.y && a.x > b.x) {\n\t return 1;\n\t }\n\t return -1;\n\t });\n\t },\n\n\t /**\n\t * Generate a layout using the initialLayout and children as a template.\n\t * Missing entries will be added, extraneous ones will be truncated.\n\t *\n\t * @param {Array} initialLayout Layout passed in through props.\n\t * @param {String} breakpoint Current responsive breakpoint.\n\t * @param {Boolean} verticalCompact Whether or not to compact the layout\n\t * vertically.\n\t * @return {Array} Working layout.\n\t */\n\t synchronizeLayoutWithChildren: function synchronizeLayoutWithChildren(initialLayout, children, cols, verticalCompact) {\n\t // ensure 'children' is always an array\n\t if (!Array.isArray(children)) {\n\t children = [children];\n\t }\n\t initialLayout = initialLayout || [];\n\n\t // Generate one layout item per child.\n\t var layout = [];\n\t for (var i = 0, len = children.length; i < len; i++) {\n\t var child = children[i];\n\t // Don't overwrite if it already exists.\n\t var exists = utils.getLayoutItem(initialLayout, child.key);\n\t if (exists) {\n\t // Ensure 'i' is always a string\n\t exists.i = '' + exists.i;\n\t layout.push(exists);\n\t continue;\n\t }\n\t // New item: attempt to use a layout item from the child, if it exists.\n\t var g = child.props._grid;\n\t if (g) {\n\t utils.validateLayout([g], 'ReactGridLayout.child');\n\t // Validated; add it to the layout. Bottom 'y' possible is the bottom of the layout.\n\t // This allows you to do nice stuff like specify {y: Infinity}\n\t if (verticalCompact) {\n\t layout.push(assign({}, g, { y: Math.min(utils.bottom(layout), g.y), i: child.key }));\n\t } else {\n\t layout.push(assign({}, g, { y: g.y, i: child.key }));\n\t }\n\t } else {\n\t // Nothing provided: ensure this is added to the bottom\n\t layout.push({ w: 1, h: 1, x: 0, y: utils.bottom(layout), i: child.key });\n\t }\n\t }\n\n\t // Correct the layout.\n\t layout = utils.correctBounds(layout, { cols: cols });\n\t layout = utils.compact(layout, verticalCompact);\n\n\t return layout;\n\t },\n\n\t /**\n\t * Validate a layout. Throws errors.\n\t *\n\t * @param {Array} layout Array of layout items.\n\t * @param {String} [contextName] Context name for errors.\n\t * @throw {Error} Validation error.\n\t */\n\t validateLayout: function validateLayout(layout, contextName) {\n\t contextName = contextName || 'Layout';\n\t var subProps = ['x', 'y', 'w', 'h'];\n\t if (!Array.isArray(layout)) throw new Error(contextName + ' must be an array!');\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t for (var j = 0; j < subProps.length; j++) {\n\t if (typeof layout[i][subProps[j]] !== 'number') {\n\t throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].' + subProps[j] + ' must be a Number!');\n\t }\n\t }\n\t if (layout[i]['static'] !== undefined && typeof layout[i]['static'] !== 'boolean') {\n\t throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].static must be a Boolean!');\n\t }\n\t }\n\t }\n\t};\n\n/***/ },\n/* 3 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tfunction ToObject(val) {\n\t\tif (val == null) {\n\t\t\tthrow new TypeError('Object.assign cannot be called with null or undefined');\n\t\t}\n\n\t\treturn Object(val);\n\t}\n\n\tmodule.exports = Object.assign || function (target, source) {\n\t\tvar from;\n\t\tvar keys;\n\t\tvar to = ToObject(target);\n\n\t\tfor (var s = 1; s < arguments.length; s++) {\n\t\t\tfrom = arguments[s];\n\t\t\tkeys = Object.keys(Object(from));\n\n\t\t\tfor (var i = 0; i < keys.length; i++) {\n\t\t\t\tto[keys[i]] = from[keys[i]];\n\t\t\t}\n\t\t}\n\n\t\treturn to;\n\t};\n\n\n/***/ },\n/* 4 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tvar deepEqual = __webpack_require__(13);\n\n\t// Like PureRenderMixin, but with deep comparisons.\n\tvar PureDeepRenderMixin = {\n\t shouldComponentUpdate: function shouldComponentUpdate(nextProps, nextState) {\n\t return !deepEqual(this.props, nextProps) || !deepEqual(this.state, nextState);\n\t }\n\t};\n\n\tmodule.exports = PureDeepRenderMixin;\n\n/***/ },\n/* 5 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar GridItem = __webpack_require__(10);\n\tvar utils = __webpack_require__(2);\n\tvar PureDeepRenderMixin = __webpack_require__(4);\n\tvar WidthListeningMixin = __webpack_require__(6);\n\n\t/**\n\t * A reactive, fluid grid layout with draggable, resizable components.\n\t */\n\tvar ReactGridLayout = React.createClass({\n\t displayName: 'ReactGridLayout',\n\n\t mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n\t propTypes: {\n\t //\n\t // Basic props\n\t //\n\n\t // If true, the container height swells and contracts to fit contents\n\t autoSize: React.PropTypes.bool,\n\t // # of cols.\n\t cols: React.PropTypes.number,\n\n\t // A selector that will not be draggable.\n\t draggableCancel: React.PropTypes.string,\n\t // A selector for the draggable handler\n\t draggableHandle: React.PropTypes.string,\n\n\t // If true, the layout will compact vertically\n\t verticalCompact: React.PropTypes.bool,\n\n\t // layout is an array of object with the format:\n\t // {x: Number, y: Number, w: Number, h: Number, i: Number}\n\t layout: function layout(props, propName, componentName) {\n\t var layout = props.layout;\n\t // I hope you're setting the _grid property on the grid items\n\t if (layout === undefined) {\n\t return;\n\t }utils.validateLayout(layout, 'layout');\n\t },\n\n\t layouts: function layouts(props, propName, componentName) {\n\t if (props.layouts) {\n\t throw new Error('ReactGridLayout does not use `layouts`: Use ReactGridLayout.Responsive.');\n\t }\n\t },\n\n\t // margin between items [x, y] in px\n\t margin: React.PropTypes.array,\n\t // Rows have a static height, but you can change this based on breakpoints if you like\n\t rowHeight: React.PropTypes.number,\n\n\t //\n\t // Flags\n\t //\n\t isDraggable: React.PropTypes.bool,\n\t isResizable: React.PropTypes.bool,\n\t // Use CSS transforms instead of top/left\n\t useCSSTransforms: React.PropTypes.bool,\n\n\t //\n\t // Callbacks\n\t //\n\n\t // Callback so you can save the layout.\n\t // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n\t onLayoutChange: React.PropTypes.func,\n\n\t // Calls when drag starts. Callback is of the signature (layout, oldItem, newItem, placeholder, e).\n\t // All callbacks below have the same signature. 'start' and 'stop' callbacks omit the 'placeholder'.\n\t onDragStart: React.PropTypes.func,\n\t // Calls on each drag movement.\n\t onDrag: React.PropTypes.func,\n\t // Calls when drag is complete.\n\t onDragStop: React.PropTypes.func,\n\t //Calls when resize starts.\n\t onResizeStart: React.PropTypes.func,\n\t // Calls when resize movement happens.\n\t onResize: React.PropTypes.func,\n\t // Calls when resize is complete.\n\t onResizeStop: React.PropTypes.func,\n\n\t //\n\t // Other validations\n\t //\n\n\t // Children must not have duplicate keys.\n\t children: function children(props, propName, componentName) {\n\t React.PropTypes.node.apply(this, arguments);\n\t var children = props[propName];\n\n\t // Check children keys for duplicates. Throw if found.\n\t var keys = {};\n\t React.Children.forEach(children, function (child, i, list) {\n\t if (keys[child.key]) {\n\t throw new Error('Duplicate child key found! This will cause problems in ReactGridLayout.');\n\t }\n\t keys[child.key] = true;\n\t });\n\t }\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t autoSize: true,\n\t cols: 12,\n\t rowHeight: 150,\n\t layout: [],\n\t margin: [10, 10],\n\t isDraggable: true,\n\t isResizable: true,\n\t useCSSTransforms: true,\n\t verticalCompact: true,\n\t onLayoutChange: function onLayoutChange() {},\n\t onDragStart: function onDragStart() {},\n\t onDrag: function onDrag() {},\n\t onDragStop: function onDragStop() {},\n\t onResizeStart: function onResizeStart() {},\n\t onResize: function onResize() {},\n\t onResizeStop: function onResizeStop() {}\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t activeDrag: null,\n\t isMounted: false,\n\t layout: utils.synchronizeLayoutWithChildren(this.props.layout, this.props.children, this.props.cols, this.props.verticalCompact),\n\t width: this.props.initialWidth\n\t };\n\t },\n\n\t componentDidMount: function componentDidMount() {\n\t // Call back with layout on mount. This should be done after correcting the layout width\n\t // to ensure we don't rerender with the wrong width.\n\t this.props.onLayoutChange(this.state.layout);\n\t this.setState({ isMounted: true });\n\t },\n\n\t componentWillReceiveProps: function componentWillReceiveProps(nextProps) {\n\t // This allows you to set the width manually if you like.\n\t // Use manual width changes in combination with `listenToWindowResize: false`\n\t if (nextProps.width !== this.props.width) this.onWidthChange(nextProps.width);\n\n\t // If children change, regenerate the layout.\n\t if (nextProps.children.length !== this.props.children.length) {\n\t this.setState({\n\t layout: utils.synchronizeLayoutWithChildren(this.state.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n\t });\n\t }\n\n\t // Allow parent to set layout directly.\n\t if (nextProps.layout && JSON.stringify(nextProps.layout) !== JSON.stringify(this.state.layout)) {\n\t this.setState({\n\t layout: utils.synchronizeLayoutWithChildren(nextProps.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n\t });\n\t }\n\t },\n\n\t componentDidUpdate: function componentDidUpdate(prevProps, prevState) {\n\t // Call back so we can store the layout\n\t // Do it only when a resize/drag is not active, otherwise there are way too many callbacks\n\t if (this.state.layout !== prevState.layout && !this.state.activeDrag) {\n\t this.props.onLayoutChange(this.state.layout, this.state.layouts);\n\t }\n\t },\n\n\t /**\n\t * Calculates a pixel value for the container.\n\t * @return {String} Container height in pixels.\n\t */\n\t containerHeight: function containerHeight() {\n\t if (!this.props.autoSize) {\n\t return;\n\t }return utils.bottom(this.state.layout) * this.props.rowHeight + this.props.margin[1] + 'px';\n\t },\n\n\t /**\n\t * When the width changes, save it to state. This helps with left/width calculations.\n\t */\n\t onWidthChange: function onWidthChange(width) {\n\t this.setState({ width: width });\n\t },\n\n\t /**\n\t * When dragging starts\n\t * @param {Number} i Index of the child\n\t * @param {Number} x X position of the move\n\t * @param {Number} y Y position of the move\n\t * @param {Event} e The mousedown event\n\t * @param {Element} element The current dragging DOM element\n\t * @param {Object} position Drag information\n\t */\n\t onDragStart: function onDragStart(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\n\t // No need to clone, `l` hasn't changed.\n\t this.props.onDragStart(layout, l, l, null, e);\n\t },\n\t /**\n\t * Each drag movement create a new dragelement and move the element to the dragged location\n\t * @param {Number} i Index of the child\n\t * @param {Number} x X position of the move\n\t * @param {Number} y Y position of the move\n\t * @param {Event} e The mousedown event\n\t * @param {Element} element The current dragging DOM element\n\t * @param {Object} position Drag information\n\t */\n\t onDrag: function onDrag(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t // Clone layout item so we can pass it to the callback.\n\t var oldL = utils.clone(l);\n\n\t // Create placeholder (display only)\n\t var placeholder = {\n\t w: l.w, h: l.h, x: l.x, y: l.y, placeholder: true, i: i\n\t };\n\n\t // Move the element to the dragged location.\n\t layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n\t this.props.onDrag(layout, oldL, l, placeholder, e);\n\n\t this.setState({\n\t layout: utils.compact(layout, this.props.verticalCompact),\n\t activeDrag: placeholder\n\t });\n\t },\n\n\t /**\n\t * When dragging stops, figure out which position the element is closest to and update its x and y.\n\t * @param {Number} i Index of the child.\n\t * @param {Number} i Index of the child\n\t * @param {Number} x X position of the move\n\t * @param {Number} y Y position of the move\n\t * @param {Event} e The mousedown event\n\t * @param {Element} element The current dragging DOM element\n\t * @param {Object} position Drag information\n\t */\n\t onDragStop: function onDragStop(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t var oldL = utils.clone(l);\n\n\t // Move the element here\n\t layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n\t this.props.onDragStop(layout, oldL, l, null, e);\n\n\t // Set state\n\t this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: null });\n\t },\n\n\t onResizeStart: function onResizeStart(i, w, h, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\n\t // No need to clone, item hasn't changed\n\t this.props.onResizeStart(layout, l, l, null, e);\n\t },\n\n\t onResize: function onResize(i, w, h, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t var oldL = utils.clone(l);\n\n\t // Set new width and height.\n\t l.w = w;\n\t l.h = h;\n\n\t // Create placeholder element (display only)\n\t var placeholder = {\n\t w: w, h: h, x: l.x, y: l.y, placeholder: true, i: i\n\t };\n\n\t this.props.onResize(layout, oldL, l, placeholder, e);\n\n\t // Re-compact the layout and set the drag placeholder.\n\t this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: placeholder });\n\t },\n\n\t onResizeStop: function onResizeStop(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t var oldL = utils.clone(l);\n\n\t this.props.onResizeStop(layout, oldL, l, null, e);\n\n\t this.setState({ activeDrag: null, layout: utils.compact(layout, this.props.verticalCompact) });\n\t },\n\n\t /**\n\t * Create a placeholder object.\n\t * @return {Element} Placeholder div.\n\t */\n\t placeholder: function placeholder() {\n\t if (!this.state.activeDrag) {\n\t return '';\n\t } // {...this.state.activeDrag} is pretty slow, actually\n\t return React.createElement(\n\t GridItem,\n\t {\n\t w: this.state.activeDrag.w,\n\t h: this.state.activeDrag.h,\n\t x: this.state.activeDrag.x,\n\t y: this.state.activeDrag.y,\n\t i: this.state.activeDrag.i,\n\t isPlaceholder: true,\n\t className: 'react-grid-placeholder',\n\t containerWidth: this.state.width,\n\t cols: this.props.cols,\n\t margin: this.props.margin,\n\t rowHeight: this.props.rowHeight,\n\t isDraggable: false,\n\t isResizable: false,\n\t useCSSTransforms: this.props.useCSSTransforms\n\t },\n\t React.createElement('div', null)\n\t );\n\t },\n\n\t /**\n\t * Given a grid item, set its style attributes & surround in a .\n\t * @param {Element} child React element.\n\t * @param {Number} i Index of element.\n\t * @return {Element} Element wrapped in draggable and properly placed.\n\t */\n\t processGridItem: function processGridItem(child) {\n\t var i = child.key;\n\t var l = utils.getLayoutItem(this.state.layout, i);\n\n\t // watchStart property tells Draggable to react to changes in the start param\n\t // Must be turned off on the item we're dragging as the changes in `activeDrag` cause rerenders\n\t var moveOnStartChange = !(this.state.activeDrag && this.state.activeDrag.i === i);\n\n\t // Parse 'static'. Any properties defined directly on the grid item will take precedence.\n\t var draggable, resizable;\n\t if (l['static'] || this.props.isDraggable === false) draggable = false;\n\t if (l['static'] || this.props.isResizable === false) resizable = false;\n\n\t return React.createElement(\n\t GridItem,\n\t _extends({\n\t containerWidth: this.state.width,\n\t cols: this.props.cols,\n\t margin: this.props.margin,\n\t rowHeight: this.props.rowHeight,\n\t moveOnStartChange: moveOnStartChange,\n\t cancel: this.props.draggableCancel,\n\t handle: this.props.draggableHandle,\n\t onDragStop: this.onDragStop,\n\t onDragStart: this.onDragStart,\n\t onDrag: this.onDrag,\n\t onResizeStart: this.onResizeStart,\n\t onResize: this.onResize,\n\t onResizeStop: this.onResizeStop,\n\t isDraggable: draggable,\n\t isResizable: resizable,\n\t useCSSTransforms: this.props.useCSSTransforms && this.state.isMounted,\n\t usePercentages: !this.state.isMounted\n\t }, l),\n\t child\n\t );\n\t },\n\n\t render: function render() {\n\t // Calculate classname\n\t var _props = this.props;\n\t var className = _props.className;\n\n\t var props = _objectWithoutProperties(_props, ['className']);\n\n\t className = 'react-grid-layout ' + (className || '');\n\n\t return React.createElement(\n\t 'div',\n\t _extends({}, props, { className: className, style: { height: this.containerHeight() } }),\n\t React.Children.map(this.props.children, this.processGridItem),\n\t this.placeholder()\n\t );\n\t }\n\t});\n\n\tmodule.exports = ReactGridLayout;\n\n/***/ },\n/* 6 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tvar React = __webpack_require__(1);\n\n\t/**\n\t * A simple mixin that provides facility for listening to container resizes.\n\t */\n\tvar WidthListeningMixin = {\n\n\t propTypes: {\n\t // This allows setting this on the server side\n\t initialWidth: React.PropTypes.number,\n\n\t // If false, you should supply width yourself. Good if you want to debounce resize events\n\t // or reuse a handler from somewhere else.\n\t listenToWindowResize: React.PropTypes.bool\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t initialWidth: 1280,\n\t listenToWindowResize: true\n\t };\n\t },\n\n\t componentDidMount: function componentDidMount() {\n\t if (this.props.listenToWindowResize) {\n\t window.addEventListener('resize', this.onWindowResize);\n\t // This is intentional. Once to properly set the breakpoint and resize the elements,\n\t // and again to compensate for any scrollbar that appeared because of the first step.\n\t this.onWindowResize();\n\t this.onWindowResize();\n\t }\n\t },\n\n\t componentWillUnmount: function componentWillUnmount() {\n\t window.removeEventListener('resize', this.onWindowResize);\n\t },\n\n\t /**\n\t * On window resize, update width.\n\t */\n\t onWindowResize: function onWindowResize() {\n\t this.onWidthChange(this.getDOMNode().offsetWidth);\n\t }\n\n\t};\n\n\tmodule.exports = WidthListeningMixin;\n\n/***/ },\n/* 7 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tmodule.exports = __webpack_require__(16);\n\n\n/***/ },\n/* 8 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar Draggable = __webpack_require__(7);\n\tvar PureRenderMixin = __webpack_require__(9);\n\tvar assign = __webpack_require__(3);\n\tvar cloneElement = __webpack_require__(19);\n\n\tvar Resizable = module.exports = React.createClass({\n\t displayName: 'Resizable',\n\t mixins: [PureRenderMixin],\n\n\t propTypes: {\n\t // Require that one and only one child be present.\n\t children: React.PropTypes.element.isRequired,\n\t // Functions\n\t onResizeStop: React.PropTypes.func,\n\t onResizeStart: React.PropTypes.func,\n\t onResize: React.PropTypes.func,\n\n\t width: React.PropTypes.number.isRequired,\n\t height: React.PropTypes.number.isRequired,\n\t // If you change this, be sure to update your css\n\t handleSize: React.PropTypes.array,\n\t // These will be passed wholesale to react-draggable\n\t draggableOpts: React.PropTypes.object\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t handleSize: [20, 20]\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t bounds: this.constraintsToBounds(),\n\t initialWidth: this.props.width,\n\t initialHeight: this.props.height\n\t };\n\t },\n\n\t constraintsToBounds: function constraintsToBounds() {\n\t var p = this.props;\n\t var mins = p.minConstraints || p.handleSize;\n\t var maxes = p.maxConstraints || [Infinity, Infinity];\n\t return {\n\t left: mins[0] - p.width,\n\t top: mins[1] - p.height,\n\t right: maxes[0] - p.width,\n\t bottom: maxes[1] - p.height\n\t };\n\t },\n\n\t /**\n\t * Wrapper around drag events to provide more useful data.\n\t *\n\t * @param {String} handlerName Handler name to wrap.\n\t * @return {Function} Handler function.\n\t */\n\t resizeHandler: function resizeHandler(handlerName) {\n\t var me = this;\n\t return function (e, _ref) {\n\t var node = _ref.node;\n\t var position = _ref.position;\n\n\t me.props[handlerName] && me.props[handlerName](e, { node: node, size: calcWH(me.state, position) });\n\t };\n\t },\n\n\t render: function render() {\n\t var p = this.props;\n\n\t // What we're doing here is getting the child of this element, and cloning it with this element's props.\n\t // We are then defining its children as:\n\t // Its original children (resizable's child's children), and\n\t // A draggable handle.\n\t return cloneElement(p.children, assign({}, p, {\n\t children: [p.children.props.children, React.createElement(\n\t Draggable,\n\t _extends({}, p.draggableOpts, {\n\t onStop: this.resizeHandler('onResizeStop'),\n\t onStart: this.resizeHandler('onResizeStart'),\n\t onDrag: this.resizeHandler('onResize'),\n\t bounds: this.state.bounds\n\t }),\n\t React.createElement('span', { className: 'react-resizable-handle' })\n\t )]\n\t }));\n\t }\n\t});\n\n\t/**\n\t * Parse left and top coordinates.\n\t * @param {Number} options.left Left coordinate.\n\t * @param {Number} options.top Top coordinate.\n\t * @return {Object} Coordinates\n\t */\n\tfunction calcWH(_ref, _ref2) {\n\t var initialWidth = _ref.initialWidth;\n\t var initialHeight = _ref.initialHeight;\n\t var left = _ref2.left;\n\t var top = _ref2.top;\n\n\t return { width: initialWidth + left, height: initialHeight + top };\n\t}\n\n/***/ },\n/* 9 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t/**\n\t * Copyright 2013-2015, Facebook, Inc.\n\t * All rights reserved.\n\t *\n\t * This source code is licensed under the BSD-style license found in the\n\t * LICENSE file in the root directory of this source tree. An additional grant\n\t * of patent rights can be found in the PATENTS file in the same directory.\n\t *\n\t* @providesModule ReactComponentWithPureRenderMixin\n\t*/\n\n\t'use strict';\n\n\tvar shallowEqual = __webpack_require__(22);\n\n\t/**\n\t * If your React component's render function is \"pure\", e.g. it will render the\n\t * same result given the same props and state, provide this Mixin for a\n\t * considerable performance boost.\n\t *\n\t * Most React components have pure render functions.\n\t *\n\t * Example:\n\t *\n\t * var ReactComponentWithPureRenderMixin =\n\t * require('ReactComponentWithPureRenderMixin');\n\t * React.createClass({\n\t * mixins: [ReactComponentWithPureRenderMixin],\n\t *\n\t * render: function() {\n\t * return
foo
;\n\t * }\n\t * });\n\t *\n\t * Note: This only checks shallow equality for props and state. If these contain\n\t * complex data structures this mixin may have false-negatives for deeper\n\t * differences. Only mixin to components which have simple props and state, or\n\t * use `forceUpdate()` when you know deep data structures have changed.\n\t */\n\tvar ReactComponentWithPureRenderMixin = {\n\t shouldComponentUpdate: function(nextProps, nextState) {\n\t return !shallowEqual(this.props, nextProps) ||\n\t !shallowEqual(this.state, nextState);\n\t }\n\t};\n\n\tmodule.exports = ReactComponentWithPureRenderMixin;\n\n\n/***/ },\n/* 10 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tvar React = __webpack_require__(1);\n\tvar cloneWithProps = __webpack_require__(21);\n\tvar utils = __webpack_require__(2);\n\tvar Draggable = __webpack_require__(7);\n\tvar Resizable = __webpack_require__(20).Resizable;\n\tvar PureDeepRenderMixin = __webpack_require__(4);\n\n\t/**\n\t * An individual item within a ReactGridLayout.\n\t */\n\tvar GridItem = React.createClass({\n\t displayName: 'GridItem',\n\n\t mixins: [PureDeepRenderMixin],\n\n\t propTypes: {\n\t // Children must be only a single element\n\t children: React.PropTypes.element,\n\n\t // General grid attributes\n\t cols: React.PropTypes.number.isRequired,\n\t containerWidth: React.PropTypes.number.isRequired,\n\t rowHeight: React.PropTypes.number.isRequired,\n\t margin: React.PropTypes.array.isRequired,\n\n\t // These are all in grid units\n\t x: React.PropTypes.number.isRequired,\n\t y: React.PropTypes.number.isRequired,\n\t w: React.PropTypes.number.isRequired,\n\t h: React.PropTypes.number.isRequired,\n\n\t // All optional\n\t minW: function minW(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.minW > props.w || props.minW > props.maxW) constraintError('minW', props);\n\t },\n\t maxW: function maxW(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.maxW < props.w || props.maxW < props.minW) constraintError('maxW', props);\n\t },\n\t minH: function minH(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.minH > props.h || props.minH > props.maxH) constraintError('minH', props);\n\t },\n\t maxH: function maxH(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.maxH < props.h || props.maxH < props.minH) constraintError('maxH', props);\n\t },\n\n\t // ID is nice to have for callbacks\n\t i: React.PropTypes.string.isRequired,\n\n\t // If true, item will be repositioned when x/y/w/h change\n\t moveOnStartChange: React.PropTypes.bool,\n\n\t // Functions\n\t onDragStop: React.PropTypes.func,\n\t onDragStart: React.PropTypes.func,\n\t onDrag: React.PropTypes.func,\n\t onResizeStop: React.PropTypes.func,\n\t onResizeStart: React.PropTypes.func,\n\t onResize: React.PropTypes.func,\n\n\t // Flags\n\t isDraggable: React.PropTypes.bool,\n\t isResizable: React.PropTypes.bool,\n\t // Use CSS transforms instead of top/left\n\t useCSSTransforms: React.PropTypes.bool,\n\t isPlaceholder: React.PropTypes.bool,\n\n\t // Others\n\t className: React.PropTypes.string,\n\t // Selector for draggable handle\n\t handle: React.PropTypes.string,\n\t // Selector for draggable cancel (see react-draggable)\n\t cancel: React.PropTypes.string\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t isDraggable: true,\n\t isResizable: true,\n\t useCSSTransforms: true,\n\t className: '',\n\t cancel: '',\n\t minH: 1,\n\t minW: 1,\n\t maxH: Infinity,\n\t maxW: Infinity\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t resizing: false,\n\t className: ''\n\t };\n\t },\n\n\t /**\n\t * Return position on the page given an x, y, w, h.\n\t * left, top, width, height are all in pixels.\n\t * @param {Number} x X coordinate in grid units.\n\t * @param {Number} y Y coordinate in grid units.\n\t * @param {Number} w W coordinate in grid units.\n\t * @param {Number} h H coordinate in grid units.\n\t * @return {Object} Object containing coords.\n\t */\n\t calcPosition: function calcPosition(x, y, w, h) {\n\t var p = this.props;\n\t var width = p.containerWidth - p.margin[0];\n\t var out = {\n\t left: width * (x / p.cols) + p.margin[0],\n\t top: p.rowHeight * y + p.margin[1],\n\t width: width * (w / p.cols) - p.margin[0],\n\t height: h * p.rowHeight - p.margin[1]\n\t };\n\t return out;\n\t },\n\n\t /**\n\t * Translate x and y coordinates from pixels to grid units.\n\t * @param {Number} options.left Left offset in pixels.\n\t * @param {Number} options.top Top offset in pixels.\n\t * @return {Object} x and y in grid units.\n\t */\n\t calcXY: function calcXY(_ref) {\n\t var left = _ref.left;\n\t var top = _ref.top;\n\n\t left = left - this.props.margin[0];\n\t top = top - this.props.margin[1];\n\t // This is intentional; because so much of the logic on moving boxes up/down relies\n\t // on an exact y position, we only round the x, not the y.\n\t var x = Math.round(left / this.props.containerWidth * this.props.cols);\n\t var y = Math.floor(top / this.props.rowHeight);\n\t x = Math.max(Math.min(x, this.props.cols), 0);\n\t y = Math.max(y, 0);\n\t return { x: x, y: y };\n\t },\n\n\t /**\n\t * Given a height and width in pixel values, calculate grid units.\n\t * @param {Number} options.height Height in pixels.\n\t * @param {Number} options.width Width in pixels.\n\t * @return {Object} w, h as grid units.\n\t */\n\t calcWH: function calcWH(_ref) {\n\t var height = _ref.height;\n\t var width = _ref.width;\n\n\t width = width + this.props.margin[0];\n\t height = height + this.props.margin[1];\n\t var w = Math.round(width / this.props.containerWidth * this.props.cols);\n\t var h = Math.round(height / this.props.rowHeight);\n\t w = Math.max(Math.min(w, this.props.cols - this.props.x), 0);\n\t h = Math.max(h, 0);\n\t return { w: w, h: h };\n\t },\n\n\t /**\n\t * This is where we set the grid item's absolute placement. It gets a little tricky because we want to do it\n\t * well when server rendering, and the only way to do that properly is to use percentage width/left because\n\t * we don't know exactly what the browser viewport is.\n\t * Unfortunately, CSS Transforms, which are great for performance, break in this instance because a percentage\n\t * left is relative to the item itself, not its container! So we cannot use them on the server rendering pass.\n\t *\n\t * @param {Object} pos Position object with width, height, left, top.\n\t * @return {Object} Style object.\n\t */\n\t createStyle: function createStyle(pos) {\n\t var style = {\n\t width: pos.width + 'px',\n\t height: pos.height + 'px',\n\t left: pos.left + 'px',\n\t top: pos.top + 'px',\n\t position: 'absolute'\n\t };\n\n\t // This is used for server rendering.\n\t if (this.props.usePercentages) {\n\t pos.left = utils.perc(pos.left / this.props.containerWidth);\n\t style.left = pos.left;\n\t style.width = utils.perc(pos.width / this.props.containerWidth);\n\t }\n\n\t // CSS Transforms support\n\t if (this.props.useCSSTransforms) {\n\t utils.setTransform(style, [pos.left, pos.top]);\n\t delete style.left;\n\t delete style.top;\n\t }\n\n\t return style;\n\t },\n\n\t /**\n\t * Mix a Draggable instance into a child.\n\t * @param {Element} child Child element.\n\t * @param {Object} position Position object (pixel values)\n\t * @return {Element} Child wrapped in Draggable.\n\t */\n\t mixinDraggable: function mixinDraggable(child, position) {\n\t var start = typeof position.left === 'string' ? undefined : { x: position.left, y: position.top };\n\t return React.createElement(\n\t Draggable,\n\t {\n\t start: start,\n\t moveOnStartChange: this.props.moveOnStartChange,\n\t onStop: this.onDragHandler('onDragStop'),\n\t onStart: this.onDragHandler('onDragStart'),\n\t onDrag: this.onDragHandler('onDrag'),\n\t handle: this.props.handle,\n\t cancel: '.react-resizable-handle ' + this.props.cancel,\n\t useCSSTransforms: this.props.useCSSTransforms\n\t },\n\t child\n\t );\n\t },\n\n\t /**\n\t * Mix a Resizable instance into a child.\n\t * @param {Element} child Child element.\n\t * @param {Object} position Position object (pixel values)\n\t * @return {Element} Child wrapped in Resizable.\n\t */\n\t mixinResizable: function mixinResizable(child, position) {\n\t var p = this.props;\n\t // This is the max possible width - doesn't go to infinity because of the width of the window\n\t var maxWidth = this.calcPosition(0, 0, p.cols - p.x, 0).width;\n\n\t // Calculate min/max constraints using our min & maxes\n\t var mins = this.calcPosition(0, 0, p.minW, p.minH);\n\t var maxes = this.calcPosition(0, 0, p.maxW, p.maxH);\n\t var minConstraints = [mins.width, mins.height];\n\t var maxConstraints = [Math.min(maxes.width, maxWidth), Math.min(maxes.height, Infinity)];\n\t return React.createElement(\n\t Resizable,\n\t {\n\t width: position.width,\n\t height: position.height,\n\t minConstraints: minConstraints,\n\t maxConstraints: maxConstraints,\n\t onResizeStop: this.onResizeHandler('onResizeStop'),\n\t onResizeStart: this.onResizeHandler('onResizeStart'),\n\t onResize: this.onResizeHandler('onResize')\n\t },\n\t child\n\t );\n\t },\n\n\t /**\n\t * Wrapper around drag events to provide more useful data.\n\t * All drag events call the function with the given handler name,\n\t * with the signature (index, x, y).\n\t *\n\t * @param {String} handlerName Handler name to wrap.\n\t * @return {Function} Handler function.\n\t */\n\t onDragHandler: function onDragHandler(handlerName) {\n\t var me = this;\n\t return function (e, _ref) {\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t if (!me.props[handlerName]) return;\n\t // Get new XY\n\n\t var _me$calcXY = me.calcXY(position);\n\n\t var x = _me$calcXY.x;\n\t var y = _me$calcXY.y;\n\n\t // Cap x at numCols\n\t x = Math.min(x, me.props.cols - me.props.w);\n\n\t me.props[handlerName](me.props.i, x, y, { e: e, element: element, position: position });\n\t };\n\t },\n\n\t /**\n\t * Wrapper around drag events to provide more useful data.\n\t * All drag events call the function with the given handler name,\n\t * with the signature (index, x, y).\n\t *\n\t * @param {String} handlerName Handler name to wrap.\n\t * @return {Function} Handler function.\n\t */\n\t onResizeHandler: function onResizeHandler(handlerName) {\n\t var me = this;\n\t return function (e, _ref) {\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t if (!me.props[handlerName]) return;\n\n\t // Get new XY\n\n\t var _me$calcWH = me.calcWH(size);\n\n\t var w = _me$calcWH.w;\n\t var h = _me$calcWH.h;\n\n\t // Cap w at numCols\n\t w = Math.min(w, me.props.cols - me.props.x);\n\t // Ensure w is at least 1\n\t w = Math.max(w, 1);\n\n\t // Min/max capping\n\t w = Math.max(Math.min(w, me.props.maxW), me.props.minW);\n\t h = Math.max(Math.min(h, me.props.maxH), me.props.minH);\n\n\t me.setState({ resizing: handlerName === 'onResizeStop' ? null : size });\n\n\t me.props[handlerName](me.props.i, w, h, { e: e, element: element, size: size });\n\t };\n\t },\n\n\t render: function render() {\n\t var p = this.props,\n\t pos = this.calcPosition(p.x, p.y, p.w, p.h);\n\t if (this.state.resizing) {\n\t pos.width = this.state.resizing.width;\n\t pos.height = this.state.resizing.height;\n\t }\n\n\t // Create the child element. We clone the existing element but modify its className and style.\n\t var child = cloneWithProps(this.props.children, {\n\t // Munge a classname. Use passed in classnames and resizing.\n\t // React with merge the classNames.\n\t className: ['react-grid-item', this.props.className, this.state.resizing ? 'resizing' : '', this.props.useCSSTransforms ? 'cssTransforms' : ''].join(' '),\n\t // We can set the width and height on the child, but unfortunately we can't set the position.\n\t style: this.createStyle(pos)\n\t });\n\n\t // Resizable support. This is usually on but the user can toggle it off.\n\t if (this.props.isResizable) {\n\t child = this.mixinResizable(child, pos);\n\t }\n\n\t // Draggable support. This is always on, except for with placeholders.\n\t if (this.props.isDraggable) {\n\t child = this.mixinDraggable(child, pos);\n\t }\n\n\t return child;\n\t }\n\t});\n\n\tfunction constraintError(name, props) {\n\t delete props.children;\n\t throw new Error(name + ' overrides contraints on gridItem ' + props.i + '. Full props: ' + JSON.stringify(props));\n\t}\n\n\tmodule.exports = GridItem;\n\n/***/ },\n/* 11 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar utils = __webpack_require__(2);\n\tvar responsiveUtils = __webpack_require__(12);\n\tvar PureDeepRenderMixin = __webpack_require__(4);\n\tvar WidthListeningMixin = __webpack_require__(6);\n\tvar ReactGridLayout = __webpack_require__(5);\n\n\t/**\n\t * A wrapper around ReactGridLayout to support responsive breakpoints.\n\t */\n\tvar ResponsiveReactGridLayout = React.createClass({\n\t displayName: 'ResponsiveReactGridLayout',\n\n\t mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n\t propTypes: {\n\t //\n\t // Basic props\n\t //\n\n\t // Optional, but if you are managing width yourself you may want to set the breakpoint\n\t // yourself as well.\n\t breakpoint: React.PropTypes.string,\n\n\t // {name: pxVal}, e.g. {lg: 1200, md: 996, sm: 768, xs: 480}\n\t breakpoints: React.PropTypes.object,\n\n\t // # of cols. This is a breakpoint -> cols map\n\t cols: React.PropTypes.object,\n\n\t // layouts is an object mapping breakpoints to layouts.\n\t // e.g. {lg: Layout, md: Layout, ...}\n\t layouts: function layouts(props, propName, componentName) {\n\t React.PropTypes.object.isRequired.apply(this, arguments);\n\n\t var layouts = props.layouts;\n\t Object.keys(layouts).map(function (k) {\n\t utils.validateLayout(layouts[k], 'layouts.' + k);\n\t });\n\t },\n\n\t //\n\t // Callbacks\n\t //\n\n\t // Calls back with breakpoint and new # cols\n\t onBreakpointChange: React.PropTypes.func,\n\n\t // Callback so you can save the layout.\n\t // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n\t onLayoutChange: React.PropTypes.func\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t breakpoints: { lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 },\n\t cols: { lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 },\n\t layouts: {},\n\t onBreakpointChange: function onBreakpointChange() {},\n\t onLayoutChange: function onLayoutChange() {}\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t var breakpoint = this.props.breakpoint || responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, this.props.initialWidth);\n\t var cols = responsiveUtils.getColsFromBreakpoint(breakpoint, this.props.cols);\n\n\t // Get the initial layout. This can tricky; we try to generate one however possible if one doesn't exist\n\t // for this layout.\n\t var initialLayout = responsiveUtils.findOrGenerateResponsiveLayout(this.props.layouts, this.props.breakpoints, breakpoint, breakpoint, cols, this.props.verticalCompact);\n\n\t return {\n\t layout: initialLayout,\n\t // storage for layouts obsoleted by breakpoints\n\t layouts: this.props.layouts || {},\n\t breakpoint: breakpoint,\n\t cols: cols,\n\t width: this.props.initialWidth\n\t };\n\t },\n\n\t componentWillReceiveProps: function componentWillReceiveProps(nextProps) {\n\t // This allows you to set the width manually if you like.\n\t // Use manual width changes in combination with `listenToWindowResize: false`\n\t if (nextProps.width) this.onWidthChange(nextProps.width);\n\n\t // Allow parent to set breakpoint directly.\n\t if (nextProps.breakpoint !== this.props.breakpoint) {\n\t this.onWidthChange(this.state.width);\n\t }\n\n\t // Allow parent to set layouts directly.\n\t if (nextProps.layouts && nextProps.layouts !== this.state.layouts) {\n\t // Since we're setting an entirely new layout object, we must generate a new responsive layout\n\t // if one does not exist.\n\t var newLayout = responsiveUtils.findOrGenerateResponsiveLayout(nextProps.layouts, nextProps.breakpoints, this.state.breakpoint, this.state.breakpoint, this.state.cols, this.props.verticalLayout);\n\n\t this.setState({\n\t layouts: nextProps.layouts,\n\t layout: newLayout\n\t });\n\t }\n\t },\n\n\t /**\n\t * Bubble this up, add `layouts` object.\n\t * @param {Array} layout Layout from inner Grid.\n\t */\n\t onLayoutChange: function onLayoutChange(layout) {\n\t this.state.layouts[this.state.breakpoint] = layout;\n\t this.setState({ layout: layout, layouts: this.state.layouts });\n\t this.props.onLayoutChange(layout, this.state.layouts);\n\t },\n\n\t /**\n\t * When the width changes work through breakpoints and reset state with the new width & breakpoint.\n\t * Width changes are necessary to figure out the widget widths.\n\t */\n\t onWidthChange: function onWidthChange(width) {\n\t // Set new breakpoint\n\t var newState = { width: width };\n\t newState.breakpoint = this.props.breakpoint || responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, newState.width);\n\t newState.cols = responsiveUtils.getColsFromBreakpoint(newState.breakpoint, this.props.cols);\n\n\t // Breakpoint change\n\t if (newState.cols !== this.state.cols) {\n\n\t // Store the current layout\n\t newState.layouts = this.state.layouts;\n\t newState.layouts[this.state.breakpoint] = JSON.parse(JSON.stringify(this.state.layout));\n\n\t // Find or generate a new one.\n\t newState.layout = responsiveUtils.findOrGenerateResponsiveLayout(newState.layouts, this.props.breakpoints, newState.breakpoint, this.state.breakpoint, newState.cols, this.props.verticalLayout);\n\n\t // This adds missing items.\n\t newState.layout = utils.synchronizeLayoutWithChildren(newState.layout, this.props.children, newState.cols, this.props.verticalCompact);\n\n\t // Store this new layout as well.\n\t newState.layouts[newState.breakpoint] = newState.layout;\n\n\t this.props.onBreakpointChange(newState.breakpoint, newState.cols);\n\t }\n\n\t this.setState(newState);\n\t },\n\n\t render: function render() {\n\t // Don't pass responsive props to RGL.\n\t /*jshint unused:false*/\n\t var _props = this.props;\n\t var layouts = _props.layouts;\n\t var onBreakpointChange = _props.onBreakpointChange;\n\t var breakpoints = _props.breakpoints;\n\n\t var props = _objectWithoutProperties(_props, ['layouts', 'onBreakpointChange', 'breakpoints']);\n\n\t return React.createElement(\n\t ReactGridLayout,\n\t _extends({}, props, {\n\t layout: this.state.layout,\n\t cols: this.state.cols,\n\t listenToWindowResize: false,\n\t onLayoutChange: this.onLayoutChange,\n\t width: this.state.width }),\n\t this.props.children\n\t );\n\t }\n\t});\n\n\tmodule.exports = ResponsiveReactGridLayout;\n\n/***/ },\n/* 12 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar utils = __webpack_require__(2);\n\n\tvar responsiveUtils = module.exports = {\n\n\t /**\n\t * Given a width, find the highest breakpoint that matches is valid for it (width > breakpoint).\n\t *\n\t * @param {Object} breakpoints Breakpoints object (e.g. {lg: 1200, md: 960, ...})\n\t * @param {Number} width Screen width.\n\t * @return {String} Highest breakpoint that is less than width.\n\t */\n\t getBreakpointFromWidth: function getBreakpointFromWidth(breakpoints, width) {\n\t var sorted = responsiveUtils.sortBreakpoints(breakpoints);\n\t var matching = sorted[0];\n\t for (var i = 1, len = sorted.length; i < len; i++) {\n\t var breakpointName = sorted[i];\n\t if (width > breakpoints[breakpointName]) matching = breakpointName;\n\t }\n\t return matching;\n\t },\n\n\t /**\n\t * Given a breakpoint, get the # of cols set for it.\n\t * @param {String} breakpoint Breakpoint name.\n\t * @param {Object} cols Map of breakpoints to cols.\n\t * @return {Number} Number of cols.\n\t */\n\t getColsFromBreakpoint: function getColsFromBreakpoint(breakpoint, cols) {\n\t if (!cols[breakpoint]) {\n\t throw new Error('ResponsiveReactGridLayout: `cols` entry for breakpoint ' + breakpoint + ' is missing!');\n\t }\n\t return cols[breakpoint];\n\t },\n\n\t /**\n\t * Given existing layouts and a new breakpoint, find or generate a new layout.\n\t *\n\t * This finds the layout above the new one and generates from it, if it exists.\n\t *\n\t * @param {Array} layouts Existing layouts.\n\t * @param {Array} breakpoints All breakpoints.\n\t * @param {String} breakpoint New breakpoint.\n\t * @param {String} breakpoint Last breakpoint (for fallback).\n\t * @param {Number} cols Column count at new breakpoint.\n\t * @param {Boolean} verticalCompact Whether or not to compact the layout\n\t * vertically.\n\t * @return {Array} New layout.\n\t */\n\t findOrGenerateResponsiveLayout: function findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, lastBreakpoint, cols, verticalCompact) {\n\t // If it already exists, just return it.\n\t if (layouts[breakpoint]) {\n\t return layouts[breakpoint];\n\t } // Find or generate the next layout\n\t var layout = layouts[lastBreakpoint];\n\t var breakpointsSorted = responsiveUtils.sortBreakpoints(breakpoints);\n\t var breakpointsAbove = breakpointsSorted.slice(breakpointsSorted.indexOf(breakpoint));\n\t for (var i = 0, len = breakpointsAbove.length; i < len; i++) {\n\t var b = breakpointsAbove[i];\n\t if (layouts[b]) {\n\t layout = layouts[b];\n\t break;\n\t }\n\t }\n\t layout = JSON.parse(JSON.stringify(layout || [])); // clone layout so we don't modify existing items\n\t return utils.compact(utils.correctBounds(layout, { cols: cols }), verticalCompact);\n\t },\n\n\t /**\n\t * Given breakpoints, return an array of breakpoints sorted by width. This is usually\n\t * e.g. ['xxs', 'xs', 'sm', ...]\n\t *\n\t * @param {Object} breakpoints Key/value pair of breakpoint names to widths.\n\t * @return {Array} Sorted breakpoints.\n\t */\n\t sortBreakpoints: function sortBreakpoints(breakpoints) {\n\t var keys = Object.keys(breakpoints);\n\t return keys.sort(function (a, b) {\n\t return breakpoints[a] - breakpoints[b];\n\t });\n\t }\n\t};\n\n/***/ },\n/* 13 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar pSlice = Array.prototype.slice;\n\tvar objectKeys = __webpack_require__(15);\n\tvar isArguments = __webpack_require__(14);\n\n\tvar deepEqual = module.exports = function (actual, expected, opts) {\n\t if (!opts) opts = {};\n\t // 7.1. All identical values are equivalent, as determined by ===.\n\t if (actual === expected) {\n\t return true;\n\n\t } else if (actual instanceof Date && expected instanceof Date) {\n\t return actual.getTime() === expected.getTime();\n\n\t // 7.3. Other pairs that do not both pass typeof value == 'object',\n\t // equivalence is determined by ==.\n\t } else if (typeof actual != 'object' && typeof expected != 'object') {\n\t return opts.strict ? actual === expected : actual == expected;\n\n\t // 7.4. For all other Object pairs, including Array objects, equivalence is\n\t // determined by having the same number of owned properties (as verified\n\t // with Object.prototype.hasOwnProperty.call), the same set of keys\n\t // (although not necessarily the same order), equivalent values for every\n\t // corresponding key, and an identical 'prototype' property. Note: this\n\t // accounts for both named and indexed properties on Arrays.\n\t } else {\n\t return objEquiv(actual, expected, opts);\n\t }\n\t}\n\n\tfunction isUndefinedOrNull(value) {\n\t return value === null || value === undefined;\n\t}\n\n\tfunction isBuffer (x) {\n\t if (!x || typeof x !== 'object' || typeof x.length !== 'number') return false;\n\t if (typeof x.copy !== 'function' || typeof x.slice !== 'function') {\n\t return false;\n\t }\n\t if (x.length > 0 && typeof x[0] !== 'number') return false;\n\t return true;\n\t}\n\n\tfunction objEquiv(a, b, opts) {\n\t var i, key;\n\t if (isUndefinedOrNull(a) || isUndefinedOrNull(b))\n\t return false;\n\t // an identical 'prototype' property.\n\t if (a.prototype !== b.prototype) return false;\n\t //~~~I've managed to break Object.keys through screwy arguments passing.\n\t // Converting to array solves the problem.\n\t if (isArguments(a)) {\n\t if (!isArguments(b)) {\n\t return false;\n\t }\n\t a = pSlice.call(a);\n\t b = pSlice.call(b);\n\t return deepEqual(a, b, opts);\n\t }\n\t if (isBuffer(a)) {\n\t if (!isBuffer(b)) {\n\t return false;\n\t }\n\t if (a.length !== b.length) return false;\n\t for (i = 0; i < a.length; i++) {\n\t if (a[i] !== b[i]) return false;\n\t }\n\t return true;\n\t }\n\t try {\n\t var ka = objectKeys(a),\n\t kb = objectKeys(b);\n\t } catch (e) {//happens when one is a string literal and the other isn't\n\t return false;\n\t }\n\t // having the same number of owned properties (keys incorporates\n\t // hasOwnProperty)\n\t if (ka.length != kb.length)\n\t return false;\n\t //the same set of keys (although not necessarily the same order),\n\t ka.sort();\n\t kb.sort();\n\t //~~~cheap key test\n\t for (i = ka.length - 1; i >= 0; i--) {\n\t if (ka[i] != kb[i])\n\t return false;\n\t }\n\t //equivalent values for every corresponding key, and\n\t //~~~possibly expensive deep test\n\t for (i = ka.length - 1; i >= 0; i--) {\n\t key = ka[i];\n\t if (!deepEqual(a[key], b[key], opts)) return false;\n\t }\n\t return typeof a === typeof b;\n\t}\n\n\n/***/ },\n/* 14 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar supportsArgumentsClass = (function(){\n\t return Object.prototype.toString.call(arguments)\n\t})() == '[object Arguments]';\n\n\texports = module.exports = supportsArgumentsClass ? supported : unsupported;\n\n\texports.supported = supported;\n\tfunction supported(object) {\n\t return Object.prototype.toString.call(object) == '[object Arguments]';\n\t};\n\n\texports.unsupported = unsupported;\n\tfunction unsupported(object){\n\t return object &&\n\t typeof object == 'object' &&\n\t typeof object.length == 'number' &&\n\t Object.prototype.hasOwnProperty.call(object, 'callee') &&\n\t !Object.prototype.propertyIsEnumerable.call(object, 'callee') ||\n\t false;\n\t};\n\n\n/***/ },\n/* 15 */\n/***/ function(module, exports, __webpack_require__) {\n\n\texports = module.exports = typeof Object.keys === 'function'\n\t ? Object.keys : shim;\n\n\texports.shim = shim;\n\tfunction shim (obj) {\n\t var keys = [];\n\t for (var key in obj) keys.push(key);\n\t return keys;\n\t}\n\n\n/***/ },\n/* 16 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar React = __webpack_require__(1);\n\tvar emptyFunction = function(){};\n\tvar assign = __webpack_require__(3);\n\tvar classNames = __webpack_require__(17);\n\n\t//\n\t// Helpers. See Element definition below this section.\n\t//\n\n\tfunction createUIEvent(draggable) {\n\t // State changes are often (but not always!) async. We want the latest value.\n\t var state = draggable._pendingState || draggable.state;\n\t return {\n\t node: draggable.getDOMNode(),\n\t position: {\n\t top: state.clientY,\n\t left: state.clientX\n\t }\n\t };\n\t}\n\n\tfunction canDragY(draggable) {\n\t return draggable.props.axis === 'both' ||\n\t draggable.props.axis === 'y';\n\t}\n\n\tfunction canDragX(draggable) {\n\t return draggable.props.axis === 'both' ||\n\t draggable.props.axis === 'x';\n\t}\n\n\tfunction isFunction(func) {\n\t return typeof func === 'function' || Object.prototype.toString.call(func) === '[object Function]';\n\t}\n\n\t// @credits https://gist.github.com/rogozhnikoff/a43cfed27c41e4e68cdc\n\tfunction findInArray(array, callback) {\n\t for (var i = 0, length = array.length; i < length; i++) {\n\t if (callback.apply(callback, [array[i], i, array])) return array[i];\n\t }\n\t}\n\n\tfunction matchesSelector(el, selector) {\n\t var method = findInArray([\n\t 'matches',\n\t 'webkitMatchesSelector',\n\t 'mozMatchesSelector',\n\t 'msMatchesSelector',\n\t 'oMatchesSelector'\n\t ], function(method){\n\t return isFunction(el[method]);\n\t });\n\n\t return el[method].call(el, selector);\n\t}\n\n\t/**\n\t * simple abstraction for dragging events names\n\t * */\n\tvar eventsFor = {\n\t touch: {\n\t start: 'touchstart',\n\t move: 'touchmove',\n\t end: 'touchend'\n\t },\n\t mouse: {\n\t start: 'mousedown',\n\t move: 'mousemove',\n\t end: 'mouseup'\n\t }\n\t};\n\n\t// Default to mouse events\n\tvar dragEventFor = eventsFor['mouse'];\n\n\t/**\n\t * get {clientX, clientY} positions of control\n\t * */\n\tfunction getControlPosition(e) {\n\t var position = (e.touches && e.touches[0]) || e;\n\t return {\n\t clientX: position.clientX,\n\t clientY: position.clientY\n\t };\n\t}\n\n\tfunction addEvent(el, event, handler) {\n\t if (!el) { return; }\n\t if (el.attachEvent) {\n\t el.attachEvent('on' + event, handler);\n\t } else if (el.addEventListener) {\n\t el.addEventListener(event, handler, true);\n\t } else {\n\t el['on' + event] = handler;\n\t }\n\t}\n\n\tfunction removeEvent(el, event, handler) {\n\t if (!el) { return; }\n\t if (el.detachEvent) {\n\t el.detachEvent('on' + event, handler);\n\t } else if (el.removeEventListener) {\n\t el.removeEventListener(event, handler, true);\n\t } else {\n\t el['on' + event] = null;\n\t }\n\t}\n\n\tfunction outerHeight(node) {\n\t // This is deliberately excluding margin for our calculations, since we are using\n\t // offsetTop which is including margin. See getBoundPosition\n\t var height = node.clientHeight;\n\t var computedStyle = window.getComputedStyle(node);\n\t height += int(computedStyle.borderTopWidth);\n\t height += int(computedStyle.borderBottomWidth);\n\t return height;\n\t}\n\n\tfunction outerWidth(node) {\n\t // This is deliberately excluding margin for our calculations, since we are using\n\t // offsetLeft which is including margin. See getBoundPosition\n\t var width = node.clientWidth;\n\t var computedStyle = window.getComputedStyle(node);\n\t width += int(computedStyle.borderLeftWidth);\n\t width += int(computedStyle.borderRightWidth);\n\t return width;\n\t}\n\tfunction innerHeight(node) {\n\t var height = node.clientHeight;\n\t var computedStyle = window.getComputedStyle(node);\n\t height -= int(computedStyle.paddingTop);\n\t height -= int(computedStyle.paddingBottom);\n\t return height;\n\t}\n\n\tfunction innerWidth(node) {\n\t var width = node.clientWidth;\n\t var computedStyle = window.getComputedStyle(node);\n\t width -= int(computedStyle.paddingLeft);\n\t width -= int(computedStyle.paddingRight);\n\t return width;\n\t}\n\n\tfunction isNum(num) {\n\t return typeof num === 'number' && !isNaN(num);\n\t}\n\n\tfunction int(a) {\n\t return parseInt(a, 10);\n\t}\n\n\tfunction getBoundPosition(draggable, clientX, clientY) {\n\t var bounds = JSON.parse(JSON.stringify(draggable.props.bounds));\n\t var node = draggable.getDOMNode();\n\t var parent = node.parentNode;\n\n\t if (bounds === 'parent') {\n\t var nodeStyle = window.getComputedStyle(node);\n\t var parentStyle = window.getComputedStyle(parent);\n\t // Compute bounds. This is a pain with padding and offsets but this gets it exactly right.\n\t bounds = {\n\t left: -node.offsetLeft + int(parentStyle.paddingLeft) +\n\t int(nodeStyle.borderLeftWidth) + int(nodeStyle.marginLeft),\n\t top: -node.offsetTop + int(parentStyle.paddingTop) +\n\t int(nodeStyle.borderTopWidth) + int(nodeStyle.marginTop),\n\t right: innerWidth(parent) - outerWidth(node) - node.offsetLeft,\n\t bottom: innerHeight(parent) - outerHeight(node) - node.offsetTop\n\t };\n\t }\n\n\t // Keep x and y below right and bottom limits...\n\t if (isNum(bounds.right)) clientX = Math.min(clientX, bounds.right);\n\t if (isNum(bounds.bottom)) clientY = Math.min(clientY, bounds.bottom);\n\n\t // But above left and top limits.\n\t if (isNum(bounds.left)) clientX = Math.max(clientX, bounds.left);\n\t if (isNum(bounds.top)) clientY = Math.max(clientY, bounds.top);\n\n\t return [clientX, clientY];\n\t}\n\n\tfunction snapToGrid(grid, pendingX, pendingY) {\n\t var x = Math.round(pendingX / grid[0]) * grid[0];\n\t var y = Math.round(pendingY / grid[1]) * grid[1];\n\t return [x, y];\n\t}\n\n\t// Useful for preventing blue highlights all over everything when dragging.\n\tvar userSelectStyle = ';user-select: none;-webkit-user-select:none;-moz-user-select:none;' +\n\t '-o-user-select:none;-ms-user-select:none;';\n\n\tfunction addUserSelectStyles(draggable) {\n\t if (!draggable.props.enableUserSelectHack) return;\n\t var style = document.body.getAttribute('style') || '';\n\t document.body.setAttribute('style', style + userSelectStyle);\n\t}\n\n\tfunction removeUserSelectStyles(draggable) {\n\t if (!draggable.props.enableUserSelectHack) return;\n\t var style = document.body.getAttribute('style') || '';\n\t document.body.setAttribute('style', style.replace(userSelectStyle, ''));\n\t}\n\n\tfunction createCSSTransform(style) {\n\t // Replace unitless items with px\n\t var x = style.x + 'px';\n\t var y = style.y + 'px';\n\t return {\n\t transform: 'translate(' + x + ',' + y + ')',\n\t WebkitTransform: 'translate(' + x + ',' + y + ')',\n\t OTransform: 'translate(' + x + ',' + y + ')',\n\t msTransform: 'translate(' + x + ',' + y + ')',\n\t MozTransform: 'translate(' + x + ',' + y + ')'\n\t };\n\t}\n\n\n\t//\n\t// End Helpers.\n\t//\n\n\t//\n\t// Define \n\t//\n\n\tmodule.exports = React.createClass({\n\t displayName: 'Draggable',\n\n\t propTypes: {\n\t /**\n\t * `axis` determines which axis the draggable can move.\n\t *\n\t * 'both' allows movement horizontally and vertically.\n\t * 'x' limits movement to horizontal axis.\n\t * 'y' limits movement to vertical axis.\n\t *\n\t * Defaults to 'both'.\n\t */\n\t axis: React.PropTypes.oneOf(['both', 'x', 'y']),\n\n\t /**\n\t * `bounds` determines the range of movement available to the element.\n\t * Available values are:\n\t *\n\t * 'parent' restricts movement within the Draggable's parent node.\n\t *\n\t * Alternatively, pass an object with the following properties, all of which are optional:\n\t *\n\t * {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}\n\t *\n\t * All values are in px.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
Content
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t bounds: React.PropTypes.oneOfType([\n\t React.PropTypes.shape({\n\t left: React.PropTypes.Number,\n\t right: React.PropTypes.Number,\n\t top: React.PropTypes.Number,\n\t bottom: React.PropTypes.Number\n\t }),\n\t React.PropTypes.oneOf(['parent', false])\n\t ]),\n\n\t /**\n\t * By default, we add 'user-select:none' attributes to the document body\n\t * to prevent ugly text selection during drag. If this is causing problems\n\t * for your app, set this to `false`.\n\t */\n\t enableUserSelectHack: React.PropTypes.bool,\n\n\t /**\n\t * `handle` specifies a selector to be used as the handle that initiates drag.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
\n\t *
Click me to drag
\n\t *
This is some other content
\n\t *
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t handle: React.PropTypes.string,\n\n\t /**\n\t * `cancel` specifies a selector to be used to prevent drag initialization.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return(\n\t * \n\t *
\n\t *
You can't drag from here
\n\t *
Dragging here works fine
\n\t *
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t cancel: React.PropTypes.string,\n\n\t /**\n\t * `grid` specifies the x and y that dragging should snap to.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
I snap to a 25 x 25 grid
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t grid: React.PropTypes.arrayOf(React.PropTypes.number),\n\n\t /**\n\t * `start` specifies the x and y that the dragged item should start at\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
I start with transformX: 25px and transformY: 25px;
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t start: React.PropTypes.shape({\n\t x: React.PropTypes.number,\n\t y: React.PropTypes.number\n\t }),\n\n\t /**\n\t * `moveOnStartChange`, if true (default false) will move the element if the `start`\n\t * property changes.\n\t */\n\t moveOnStartChange: React.PropTypes.bool,\n\n\n\t /**\n\t * `zIndex` specifies the zIndex to use while dragging.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
I have a zIndex
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t zIndex: React.PropTypes.number,\n\n\t /**\n\t * Called when dragging starts.\n\t * If this function returns the boolean false, dragging will be canceled.\n\t *\n\t * Example:\n\t *\n\t * ```js\n\t * function (event, ui) {}\n\t * ```\n\t *\n\t * `event` is the Event that was triggered.\n\t * `ui` is an object:\n\t *\n\t * ```js\n\t * {\n\t * position: {top: 0, left: 0}\n\t * }\n\t * ```\n\t */\n\t onStart: React.PropTypes.func,\n\n\t /**\n\t * Called while dragging.\n\t * If this function returns the boolean false, dragging will be canceled.\n\t *\n\t * Example:\n\t *\n\t * ```js\n\t * function (event, ui) {}\n\t * ```\n\t *\n\t * `event` is the Event that was triggered.\n\t * `ui` is an object:\n\t *\n\t * ```js\n\t * {\n\t * position: {top: 0, left: 0}\n\t * }\n\t * ```\n\t */\n\t onDrag: React.PropTypes.func,\n\n\t /**\n\t * Called when dragging stops.\n\t *\n\t * Example:\n\t *\n\t * ```js\n\t * function (event, ui) {}\n\t * ```\n\t *\n\t * `event` is the Event that was triggered.\n\t * `ui` is an object:\n\t *\n\t * ```js\n\t * {\n\t * position: {top: 0, left: 0}\n\t * }\n\t * ```\n\t */\n\t onStop: React.PropTypes.func,\n\n\t /**\n\t * A workaround option which can be passed if onMouseDown needs to be accessed,\n\t * since it'll always be blocked (due to that there's internal use of onMouseDown)\n\t */\n\t onMouseDown: React.PropTypes.func,\n\t },\n\n\t componentWillReceiveProps: function(newProps) {\n\t // React to changes in the 'start' param.\n\t if (newProps.moveOnStartChange && newProps.start) {\n\t this.setState(this.getInitialState(newProps));\n\t }\n\t },\n\n\t componentWillUnmount: function() {\n\t // Remove any leftover event handlers\n\t removeEvent(document, dragEventFor['move'], this.handleDrag);\n\t removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n\t removeUserSelectStyles(this);\n\t },\n\n\t getDefaultProps: function () {\n\t return {\n\t axis: 'both',\n\t bounds: false,\n\t handle: null,\n\t cancel: null,\n\t grid: null,\n\t moveOnStartChange: false,\n\t start: {x: 0, y: 0},\n\t zIndex: NaN,\n\t enableUserSelectHack: true,\n\t onStart: emptyFunction,\n\t onDrag: emptyFunction,\n\t onStop: emptyFunction,\n\t onMouseDown: emptyFunction\n\t };\n\t },\n\n\t getInitialState: function (props) {\n\t // Handle call from CWRP\n\t props = props || this.props;\n\t return {\n\t // Whether or not we are currently dragging.\n\t dragging: false,\n\n\t // Offset between start top/left and mouse top/left while dragging.\n\t offsetX: 0, offsetY: 0,\n\n\t // Current transform x and y.\n\t clientX: props.start.x, clientY: props.start.y\n\t };\n\t },\n\n\t handleDragStart: function (e) {\n\t // Make it possible to attach event handlers on top of this one\n\t this.props.onMouseDown(e);\n\n\t // Short circuit if handle or cancel prop was provided and selector doesn't match\n\t if ((this.props.handle && !matchesSelector(e.target, this.props.handle)) ||\n\t (this.props.cancel && matchesSelector(e.target, this.props.cancel))) {\n\t return;\n\t }\n\n\t // Call event handler. If it returns explicit false, cancel.\n\t var shouldStart = this.props.onStart(e, createUIEvent(this));\n\t if (shouldStart === false) return;\n\n\t var dragPoint = getControlPosition(e);\n\n\t // Add a style to the body to disable user-select. This prevents text from\n\t // being selected all over the page.\n\t addUserSelectStyles(this);\n\n\t // Initiate dragging. Set the current x and y as offsets\n\t // so we know how much we've moved during the drag. This allows us\n\t // to drag elements around even if they have been moved, without issue.\n\t this.setState({\n\t dragging: true,\n\t offsetX: dragPoint.clientX - this.state.clientX,\n\t offsetY: dragPoint.clientY - this.state.clientY\n\t });\n\n\n\t // Add event handlers\n\t addEvent(document, dragEventFor['move'], this.handleDrag);\n\t addEvent(document, dragEventFor['end'], this.handleDragEnd);\n\t },\n\n\t handleDragEnd: function (e) {\n\t // Short circuit if not currently dragging\n\t if (!this.state.dragging) {\n\t return;\n\t }\n\n\t removeUserSelectStyles(this);\n\n\t // Turn off dragging\n\t this.setState({\n\t dragging: false\n\t });\n\n\t // Call event handler\n\t this.props.onStop(e, createUIEvent(this));\n\n\t // Remove event handlers\n\t removeEvent(document, dragEventFor['move'], this.handleDrag);\n\t removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n\t },\n\n\t handleDrag: function (e) {\n\t var dragPoint = getControlPosition(e);\n\n\t // Calculate X and Y\n\t var clientX = dragPoint.clientX - this.state.offsetX;\n\t var clientY = dragPoint.clientY - this.state.offsetY;\n\n\t // Snap to grid if prop has been provided\n\t if (Array.isArray(this.props.grid)) {\n\t var coords = snapToGrid(this.props.grid, clientX, clientY);\n\t clientX = coords[0], clientY = coords[1];\n\t }\n\n\t if (this.props.bounds) {\n\t var pos = getBoundPosition(this, clientX, clientY);\n\t clientX = pos[0], clientY = pos[1];\n\t }\n\n\t // Call event handler. If it returns explicit false, cancel.\n\t var shouldUpdate = this.props.onDrag(e, createUIEvent(this));\n\t if (shouldUpdate === false) return this.handleDragEnd();\n\n\t // Update transform\n\t this.setState({\n\t clientX: clientX,\n\t clientY: clientY\n\t });\n\t },\n\n\t onMouseDown: function(ev) {\n\t // Prevent 'ghost click' which happens 300ms after touchstart if the event isn't cancelled.\n\t // We don't cancel the event on touchstart because of #37; we might want to make a scrollable item draggable.\n\t // More on ghost clicks: http://ariatemplates.com/blog/2014/05/ghost-clicks-in-mobile-browsers/\n\t if (dragEventFor == eventsFor['touch']) {\n\t return ev.preventDefault();\n\t }\n\n\t return this.handleDragStart.apply(this, arguments);\n\t },\n\n\t onTouchStart: function(ev) {\n\t // We're on a touch device now, so change the event handlers\n\t dragEventFor = eventsFor['touch'];\n\n\t return this.handleDragStart.apply(this, arguments);\n\t },\n\n\t render: function () {\n\t // Create style object. We extend from existing styles so we don't\n\t // remove anything already set (like background, color, etc).\n\t var childStyle = this.props.children.props.style || {};\n\n\t // Add a CSS transform to move the element around. This allows us to move the element around\n\t // without worrying about whether or not it is relatively or absolutely positioned.\n\t // If the item you are dragging already has a transform set, wrap it in a so \n\t // has a clean slate.\n\t var transform = createCSSTransform({\n\t // Set left if horizontal drag is enabled\n\t x: canDragX(this) ?\n\t this.state.clientX :\n\t 0,\n\n\t // Set top if vertical drag is enabled\n\t y: canDragY(this) ?\n\t this.state.clientY :\n\t 0\n\t });\n\n\t // Workaround IE pointer events; see #51\n\t // https://github.com/mzabriskie/react-draggable/issues/51#issuecomment-103488278\n\t var touchHacks = {\n\t touchAction: 'none'\n\t };\n\n\t var style = assign({}, childStyle, transform, touchHacks);\n\n\t // Set zIndex if currently dragging and prop has been provided\n\t if (this.state.dragging && !isNaN(this.props.zIndex)) {\n\t style.zIndex = this.props.zIndex;\n\t }\n\n\t var className = classNames((this.props.children.props.className || ''), 'react-draggable', {\n\t 'react-draggable-dragging': this.state.dragging,\n\t 'react-draggable-dragged': this.state.dragged\n\t });\n\n\t // Reuse the child provided\n\t // This makes it flexible to use whatever element is wanted (div, ul, etc)\n\t return React.cloneElement(React.Children.only(this.props.children), {\n\t style: style,\n\t className: className,\n\n\t onMouseDown: this.onMouseDown,\n\t onTouchStart: this.onTouchStart,\n\t onMouseUp: this.handleDragEnd,\n\t onTouchEnd: this.handleDragEnd\n\t });\n\t }\n\t});\n\n\n/***/ },\n/* 17 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!\n\t Copyright (c) 2015 Jed Watson.\n\t Licensed under the MIT License (MIT), see\n\t http://jedwatson.github.io/classnames\n\t*/\n\n\tfunction classNames() {\n\t\tvar classes = '';\n\t\tvar arg;\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\targ = arguments[i];\n\t\t\tif (!arg) {\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\tif ('string' === typeof arg || 'number' === typeof arg) {\n\t\t\t\tclasses += ' ' + arg;\n\t\t\t} else if (Object.prototype.toString.call(arg) === '[object Array]') {\n\t\t\t\tclasses += ' ' + classNames.apply(null, arg);\n\t\t\t} else if ('object' === typeof arg) {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (!arg.hasOwnProperty(key) || !arg[key]) {\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\t\t\t\t\tclasses += ' ' + key;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn classes.substr(1);\n\t}\n\n\t// safely export classNames for node / browserify\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tmodule.exports = classNames;\n\t}\n\n\t// safely export classNames for RequireJS\n\tif (true) {\n\t\t!(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = function() {\n\t\t\treturn classNames;\n\t\t}.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__), __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n\t}\n\n\n/***/ },\n/* 18 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\n\tvar _slicedToArray = function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } };\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar Resizable = __webpack_require__(8);\n\tvar PureRenderMixin = __webpack_require__(9);\n\n\t// An example use of Resizable.\n\tvar ResizableBox = module.exports = React.createClass({\n\t displayName: 'ResizableBox',\n\t mixins: [PureRenderMixin],\n\n\t propTypes: {\n\t lockAspectRatio: React.PropTypes.bool\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t lockAspectRatio: false,\n\t handleSize: [20, 20]\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t width: this.props.width,\n\t height: this.props.height,\n\t aspectRatio: this.props.width / this.props.height\n\t };\n\t },\n\n\t onResize: function onResize(event, _ref) {\n\t var element = _ref.element;\n\t var size = _ref.size;\n\t var width = size.width;\n\t var height = size.height;\n\n\t var widthChanged = width !== this.state.width,\n\t heightChanged = height !== this.state.height;\n\t if (!widthChanged && !heightChanged) {\n\t return;\n\t }if (this.props.lockAspectRatio) {\n\t var _preserveAspectRatio = this.preserveAspectRatio(width, height);\n\n\t var _preserveAspectRatio2 = _slicedToArray(_preserveAspectRatio, 2);\n\n\t width = _preserveAspectRatio2[0];\n\t height = _preserveAspectRatio2[1];\n\t }\n\n\t this.setState({ width: width, height: height });\n\t },\n\n\t // If you do this, be careful of constraints\n\t preserveAspectRatio: function preserveAspectRatio(width, height) {\n\t var min = this.props.minConstraints;\n\t var max = this.props.maxConstraints;\n\n\t height = width / this.state.aspectRatio;\n\t width = height * this.state.aspectRatio;\n\n\t if (min) {\n\t width = Math.max(min[0], width);\n\t height = Math.max(min[1], height);\n\t }\n\t if (max) {\n\t width = Math.min(max[0], width);\n\t height = Math.min(max[1], height);\n\t }\n\t return [width, height];\n\t },\n\n\t render: function render() {\n\t // Basic wrapper around a Resizable instance.\n\t // If you use Resizable directly, you are responsible for updating the component\n\t // with a new width and height.\n\t var _props = this.props;\n\t var handleSize = _props.handleSize;\n\t var minConstraints = _props.minConstraints;\n\t var maxConstraints = _props.maxConstraints;\n\n\t var props = _objectWithoutProperties(_props, ['handleSize', 'minConstraints', 'maxConstraints']);\n\n\t return React.createElement(\n\t Resizable,\n\t {\n\t minConstraints: minConstraints,\n\t maxConstraints: maxConstraints,\n\t handleSize: handleSize,\n\t width: this.state.width,\n\t height: this.state.height,\n\t onResize: this.onResize,\n\t draggableOpts: this.props.draggableOpts\n\t },\n\t React.createElement(\n\t 'div',\n\t _extends({ style: { width: this.state.width + 'px', height: this.state.height + 'px' } }, props),\n\t this.props.children\n\t )\n\t );\n\t }\n\t});\n\n/***/ },\n/* 19 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar assign = __webpack_require__(3);\n\tvar React = __webpack_require__(1);\n\n\tmodule.exports = function cloneElement(element, props) {\n\t if (props.style && element.props.style) {\n\t props.style = assign({}, element.props.style, props.style);\n\t }\n\t if (props.className && element.props.className) {\n\t props.className = element.props.className + ' ' + props.className;\n\t }\n\t return React.cloneElement(element, props);\n\t};\n\n/***/ },\n/* 20 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tmodule.exports = function() {\n\t throw new Error(\"Don't instantiate Resizable directly! Use require('react-resizable').Resizable\");\n\t};\n\n\tmodule.exports.Resizable = __webpack_require__(8);\n\tmodule.exports.ResizableBox = __webpack_require__(18);\n\n\n/***/ },\n/* 21 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\r\n\tvar React = __webpack_require__(1)\r\n\t , hasOwn = Object.prototype.hasOwnProperty\r\n\t , version = React.version.split('.').map(parseFloat)\r\n\t , RESERVED = {\r\n\t className: resolve(joinClasses),\r\n\t children: function(){},\r\n\t key: function(){},\r\n\t ref: function(){},\r\n\t style: resolve(extend)\r\n\t };\r\n\r\n\tmodule.exports = function cloneWithProps(child, props) {\r\n\t var newProps = mergeProps(props, child.props);\r\n\r\n\t if (!hasOwn.call(newProps, 'children') && hasOwn.call(child.props, 'children'))\r\n\t newProps.children = child.props.children;\r\n\r\n\t // < 0.11\r\n\t if (version[0] === 0 && version[1] < 11)\r\n\t return child.constructor.ConvenienceConstructor(newProps);\r\n\t \r\n\t // 0.11\r\n\t if (version[0] === 0 && version[1] === 11)\r\n\t return child.constructor(newProps);\r\n\r\n\t // 0.12\r\n\t else if (version[0] === 0 && version[1] === 12){\r\n\t MockLegacyFactory.isReactLegacyFactory = true\r\n\t MockLegacyFactory.type = child.type\r\n\t return React.createElement(MockLegacyFactory, newProps);\r\n\t }\r\n\r\n\t // 0.13+\r\n\t return React.createElement(child.type, newProps);\r\n\r\n\t function MockLegacyFactory(){}\r\n\t}\r\n\r\n\tfunction mergeProps(currentProps, childProps) {\r\n\t var newProps = extend(currentProps), key\r\n\r\n\t for (key in childProps) {\r\n\t if (hasOwn.call(RESERVED, key) )\r\n\t RESERVED[key](newProps, childProps[key], key)\r\n\r\n\t else if ( !hasOwn.call(newProps, key) )\r\n\t newProps[key] = childProps[key];\r\n\t }\r\n\t return newProps\r\n\t}\r\n\r\n\tfunction resolve(fn){\r\n\t return function(src, value, key){\r\n\t if( !hasOwn.call(src, key)) src[key] = value\r\n\t else src[key] = fn(src[key], value)\r\n\t }\r\n\t}\r\n\r\n\tfunction joinClasses(a, b){\r\n\t if ( !a ) return b || ''\r\n\t return a + (b ? ' ' + b : '')\r\n\t}\r\n\r\n\tfunction extend() {\r\n\t var target = {};\r\n\t for (var i = 0; i < arguments.length; i++) \r\n\t for (var key in arguments[i]) if (hasOwn.call(arguments[i], key)) \r\n\t target[key] = arguments[i][key] \r\n\t return target\r\n\t}\n\n/***/ },\n/* 22 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t/**\n\t * Copyright 2013-2015, Facebook, Inc.\n\t * All rights reserved.\n\t *\n\t * This source code is licensed under the BSD-style license found in the\n\t * LICENSE file in the root directory of this source tree. An additional grant\n\t * of patent rights can be found in the PATENTS file in the same directory.\n\t *\n\t * @providesModule shallowEqual\n\t */\n\n\t'use strict';\n\n\t/**\n\t * Performs equality by iterating through keys on an object and returning\n\t * false when any key has values which are not strictly equal between\n\t * objA and objB. Returns true when the values of all keys are strictly equal.\n\t *\n\t * @return {boolean}\n\t */\n\tfunction shallowEqual(objA, objB) {\n\t if (objA === objB) {\n\t return true;\n\t }\n\t var key;\n\t // Test for A's keys different from B.\n\t for (key in objA) {\n\t if (objA.hasOwnProperty(key) &&\n\t (!objB.hasOwnProperty(key) || objA[key] !== objB[key])) {\n\t return false;\n\t }\n\t }\n\t // Test for B's keys missing from A.\n\t for (key in objB) {\n\t if (objB.hasOwnProperty(key) && !objA.hasOwnProperty(key)) {\n\t return false;\n\t }\n\t }\n\t return true;\n\t}\n\n\tmodule.exports = shallowEqual;\n\n\n/***/ }\n/******/ ])\n});\n;\n\n\n/** WEBPACK FOOTER **\n ** react-grid-layout.min.js\n **/"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId])\n \t\t\treturn installedModules[moduleId].exports;\n\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\texports: {},\n \t\t\tid: moduleId,\n \t\t\tloaded: false\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.loaded = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(0);\n\n\n/** WEBPACK FOOTER **\n ** webpack/bootstrap ca62fae9c50f0719aeba\n **/","module.exports = require('./lib/ReactGridLayout');\nmodule.exports.Responsive = require('./lib/ResponsiveReactGridLayout');\n\n\n\n/** WEBPACK FOOTER **\n ** ./index-dev.js\n **/","module.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** external \"React\"\n ** module id = 1\n ** module chunks = 0\n **/","'use strict';\n\nvar assign = require('object-assign');\n\nvar utils = module.exports = {\n\n /**\n * Return the bottom coordinate of the layout.\n *\n * @param {Array} layout Layout array.\n * @return {Number} Bottom coordinate.\n */\n bottom(layout) {\n var max = 0, bottomY;\n for (var i = 0, len = layout.length; i < len; i++) {\n bottomY = layout[i].y + layout[i].h;\n if (bottomY > max) max = bottomY;\n }\n return max;\n },\n\n /**\n * Clones a shallow object.\n * @param {Object} obj Object to clone.\n * @return {Object} Cloned object.\n */\n clone(obj) {\n return assign({}, obj);\n },\n\n /**\n * Given two layouts, check if they collide.\n *\n * @param {Object} l1 Layout object.\n * @param {Object} l2 Layout object.\n * @return {Boolean} True if colliding.\n */\n collides(l1, l2) {\n if (l1 === l2) return false; // same element\n if (l1.x + l1.w <= l2.x) return false; // l1 is left of l2\n if (l1.x >= l2.x + l2.w) return false; // l1 is right of l2\n if (l1.y + l1.h <= l2.y) return false; // l1 is above l2\n if (l1.y >= l2.y + l2.h) return false; // l1 is below l2\n return true; // boxes overlap\n },\n\n /**\n * Given a layout, compact it. This involves going down each y coordinate and removing gaps\n * between items.\n *\n * @param {Array} layout Layout.\n * @param {Boolean} verticalCompact Whether or not to compact the layout\n * vertically.\n * @return {Array} Compacted Layout.\n */\n compact(layout, verticalCompact) {\n // Statics go in the compareWith array right away so items flow around them.\n var compareWith = utils.getStatics(layout), out = [];\n // We go through the items by row and column.\n var sorted = utils.sortLayoutItemsByRowCol(layout);\n\n for (var i = 0, len = sorted.length; i < len; i++) {\n var l = sorted[i];\n\n // Don't move static elements\n if (!l.static) {\n l = utils.compactItem(compareWith, l, verticalCompact);\n\n // Add to comparison array. We only collide with items before this one.\n // Statics are already in this array.\n compareWith.push(l);\n }\n\n // Add to output array to make sure they still come out in the right order.\n out[layout.indexOf(l)] = l;\n\n // Clear moved flag, if it exists.\n delete l.moved;\n }\n\n return out;\n },\n\n compactItem(compareWith, l, verticalCompact) {\n if (verticalCompact) {\n // Move the element up as far as it can go without colliding.\n while (l.y > 0 && !utils.getFirstCollision(compareWith, l)) {\n l.y--;\n }\n }\n\n // Move it down, and keep moving it down if it's colliding.\n var collides;\n while((collides = utils.getFirstCollision(compareWith, l))) {\n l.y = collides.y + collides.h;\n }\n return l;\n },\n\n /**\n * Given a layout, make sure all elements fit within its bounds.\n *\n * @param {Array} layout Layout array.\n * @param {Number} bounds Number of columns.\n * @return {[type]} [description]\n */\n correctBounds(layout, bounds) {\n var collidesWith = utils.getStatics(layout);\n for (var i = 0, len = layout.length; i < len; i++) {\n var l = layout[i];\n // Overflows right\n if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w;\n // Overflows left\n if (l.x < 0) {\n l.x = 0;\n l.w = bounds.cols;\n }\n if (!l.static) collidesWith.push(l);\n else {\n // If this is static and collides with other statics, we must move it down.\n // We have to do something nicer than just letting them overlap.\n while(utils.getFirstCollision(collidesWith, l)) {\n l.y++;\n }\n }\n\n }\n return layout;\n },\n\n /**\n * Get a layout item by ID. Used so we can override later on if necessary.\n *\n * @param {Array} layout Layout array.\n * @param {Number} id ID\n * @return {LayoutItem} Item at ID.\n */\n getLayoutItem(layout, id) {\n id = \"\" + id;\n for (var i = 0, len = layout.length; i < len; i++) {\n if (\"\" + layout[i].i === id) return layout[i];\n }\n },\n\n /**\n * Returns the first item this layout collides with.\n * It doesn't appear to matter which order we approach this from, although\n * perhaps that is the wrong thing to do.\n *\n * @param {Object} layoutItem Layout item.\n * @return {Object|undefined} A colliding layout item, or undefined.\n */\n getFirstCollision(layout, layoutItem) {\n for (var i = 0, len = layout.length; i < len; i++) {\n if (utils.collides(layout[i], layoutItem)) return layout[i];\n }\n },\n\n getAllCollisions(layout, layoutItem) {\n var out = [];\n for (var i = 0, len = layout.length; i < len; i++) {\n if (utils.collides(layout[i], layoutItem)) out.push(layout[i]);\n }\n return out;\n },\n\n /**\n * Get all static elements.\n * @param {Array} layout Array of layout objects.\n * @return {Array} Array of static layout items..\n */\n getStatics(layout) {\n var out = [];\n for (var i = 0, len = layout.length; i < len; i++) {\n if (layout[i].static) out.push(layout[i]);\n }\n return out;\n },\n\n /**\n * Move an element. Responsible for doing cascading movements of other elements.\n *\n * @param {Array} layout Full layout to modify.\n * @param {LayoutItem} l element to move.\n * @param {Number} [x] X position in grid units.\n * @param {Number} [y] Y position in grid units.\n * @param {Boolean} [isUserAction] If true, designates that the item we're moving is\n * being dragged/resized by th euser.\n */\n moveElement(layout, l, x, y, isUserAction) {\n if (l.static) return layout;\n\n // Short-circuit if nothing to do.\n if (l.y === y && l.x === x) return layout;\n\n var movingUp = l.y > y;\n // This is quite a bit faster than extending the object\n if (x !== undefined) l.x = x;\n if (y !== undefined) l.y = y;\n l.moved = true;\n\n // If this collides with anything, move it.\n // When doing this comparison, we have to sort the items we compare with\n // to ensure, in the case of multiple collisions, that we're getting the\n // nearest collision.\n var sorted = utils.sortLayoutItemsByRowCol(layout);\n if (movingUp) sorted = sorted.reverse();\n var collisions = utils.getAllCollisions(sorted, l);\n\n // Move each item that collides away from this element.\n for (var i = 0, len = collisions.length; i < len; i++) {\n var collision = collisions[i];\n // console.log('resolving collision between', l.i, 'at', l.y, 'and', collision.i, 'at', collision.y);\n\n // Short circuit so we can't infinite loop\n if (collision.moved) continue;\n\n // This makes it feel a bit more precise by waiting to swap for just a bit when moving up.\n if (l.y > collision.y && l.y - collision.y > collision.h / 4) continue;\n\n // Don't move static items - we have to move *this* element away\n if (collision.static) {\n layout = utils.moveElementAwayFromCollision(layout, collision, l, isUserAction);\n } else {\n layout = utils.moveElementAwayFromCollision(layout, l, collision, isUserAction);\n }\n }\n\n return layout;\n },\n\n /**\n * This is where the magic needs to happen - given a collision, move an element away from the collision.\n * We attempt to move it up if there's room, otherwise it goes below.\n *\n * @param {Array} layout Full layout to modify.\n * @param {LayoutItem} collidesWith Layout item we're colliding with.\n * @param {LayoutItem} itemToMove Layout item we're moving.\n * @param {Boolean} [isUserAction] If true, designates that the item we're moving is being dragged/resized\n * by the user.\n */\n moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAction) {\n\n // If there is enough space above the collision to put this element, move it there.\n // We only do this on the main collision as this can get funky in cascades and cause\n // unwanted swapping behavior.\n if (isUserAction) {\n // Make a mock item so we don't modify the item here, only modify in moveElement.\n var fakeItem = {\n x: itemToMove.x,\n y: itemToMove.y,\n w: itemToMove.w,\n h: itemToMove.h\n };\n fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0);\n if (!utils.getFirstCollision(layout, fakeItem)) {\n return utils.moveElement(layout, itemToMove, undefined, fakeItem.y);\n }\n }\n\n // Previously this was optimized to move below the collision directly, but this can cause problems\n // with cascading moves, as an item may actually leapflog a collision and cause a reversal in order.\n return utils.moveElement(layout, itemToMove, undefined, itemToMove.y + 1);\n },\n\n /**\n * Helper to convert a number to a percentage string.\n *\n * @param {Number} num Any number\n * @return {String} That number as a percentage.\n */\n perc(num) {\n return num * 100 + '%';\n },\n\n setTransform(style, coords) {\n // Replace unitless items with px\n var x = ('' + coords[0]).replace(/(\\d)$/, '$1px');\n var y = ('' + coords[1]).replace(/(\\d)$/, '$1px');\n style.transform = \"translate(\" + x + \",\" + y + \")\";\n style.WebkitTransform = \"translate(\" + x + \",\" + y + \")\";\n style.MozTransform = \"translate(\" + x + \",\" + y + \")\";\n style.msTransform = \"translate(\" + x + \",\" + y + \")\";\n style.OTransform = \"translate(\" + x + \",\" + y + \")\";\n return style;\n },\n\n /**\n * Get layout items sorted from top left to right and down.\n *\n * @return {Array} Array of layout objects.\n * @return {Array} Layout, sorted static items first.\n */\n sortLayoutItemsByRowCol(layout) {\n return [].concat(layout).sort(function(a, b) {\n if (a.y > b.y || (a.y === b.y && a.x > b.x)) {\n return 1;\n }\n return -1;\n });\n },\n\n /**\n * Generate a layout using the initialLayout and children as a template.\n * Missing entries will be added, extraneous ones will be truncated.\n *\n * @param {Array} initialLayout Layout passed in through props.\n * @param {String} breakpoint Current responsive breakpoint.\n * @param {Boolean} verticalCompact Whether or not to compact the layout\n * vertically.\n * @return {Array} Working layout.\n */\n synchronizeLayoutWithChildren(initialLayout, children, cols, verticalCompact) {\n // ensure 'children' is always an array\n if (!Array.isArray(children)) {\n children = [children];\n }\n initialLayout = initialLayout || [];\n\n // Generate one layout item per child.\n var layout = [];\n for (var i = 0, len = children.length; i < len; i++) {\n var child = children[i];\n // Don't overwrite if it already exists.\n var exists = utils.getLayoutItem(initialLayout, child.key);\n if (exists) {\n // Ensure 'i' is always a string\n exists.i = '' + exists.i;\n layout.push(exists);\n continue;\n }\n // New item: attempt to use a layout item from the child, if it exists.\n var g = child.props._grid;\n if (g) {\n utils.validateLayout([g], 'ReactGridLayout.child');\n // Validated; add it to the layout. Bottom 'y' possible is the bottom of the layout.\n // This allows you to do nice stuff like specify {y: Infinity}\n if (verticalCompact) {\n layout.push(assign({}, g, {y: Math.min(utils.bottom(layout), g.y), i: child.key}));\n } else {\n layout.push(assign({}, g, {y: g.y, i:child.key}));\n }\n } else {\n // Nothing provided: ensure this is added to the bottom\n layout.push({w: 1, h: 1, x: 0, y: utils.bottom(layout), i: child.key});\n }\n }\n\n // Correct the layout.\n layout = utils.correctBounds(layout, {cols: cols});\n layout = utils.compact(layout, verticalCompact);\n\n return layout;\n },\n\n /**\n * Validate a layout. Throws errors.\n *\n * @param {Array} layout Array of layout items.\n * @param {String} [contextName] Context name for errors.\n * @throw {Error} Validation error.\n */\n validateLayout(layout, contextName) {\n contextName = contextName || \"Layout\";\n var subProps = ['x', 'y', 'w', 'h'];\n if (!Array.isArray(layout)) throw new Error(contextName + \" must be an array!\");\n for (var i = 0, len = layout.length; i < len; i++) {\n for (var j = 0; j < subProps.length; j++) {\n if (typeof layout[i][subProps[j]] !== 'number') {\n throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].' + subProps[j] + ' must be a Number!');\n }\n }\n if (layout[i].static !== undefined && typeof layout[i].static !== 'boolean') {\n throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].static must be a Boolean!');\n }\n }\n }\n};\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/utils.js\n **/","'use strict';\n\nfunction ToObject(val) {\n\tif (val == null) {\n\t\tthrow new TypeError('Object.assign cannot be called with null or undefined');\n\t}\n\n\treturn Object(val);\n}\n\nmodule.exports = Object.assign || function (target, source) {\n\tvar from;\n\tvar keys;\n\tvar to = ToObject(target);\n\n\tfor (var s = 1; s < arguments.length; s++) {\n\t\tfrom = arguments[s];\n\t\tkeys = Object.keys(Object(from));\n\n\t\tfor (var i = 0; i < keys.length; i++) {\n\t\t\tto[keys[i]] = from[keys[i]];\n\t\t}\n\t}\n\n\treturn to;\n};\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/object-assign/index.js\n ** module id = 3\n ** module chunks = 0\n **/","'use strict';\nvar deepEqual = require('deep-equal');\n\n// Like PureRenderMixin, but with deep comparisons.\nvar PureDeepRenderMixin = {\n shouldComponentUpdate: function(nextProps, nextState) {\n return !deepEqual(this.props, nextProps) ||\n !deepEqual(this.state, nextState);\n }\n};\n\nmodule.exports = PureDeepRenderMixin;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/mixins/PureDeepRenderMixin.js\n **/","'use strict';\nvar React = require('react');\nvar GridItem = require('./GridItem');\nvar utils = require('./utils');\nvar PureDeepRenderMixin = require('./mixins/PureDeepRenderMixin');\nvar WidthListeningMixin = require('./mixins/WidthListeningMixin');\n\n/**\n * A reactive, fluid grid layout with draggable, resizable components.\n */\nvar ReactGridLayout = React.createClass({\n mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n propTypes: {\n //\n // Basic props\n //\n\n // If true, the container height swells and contracts to fit contents\n autoSize: React.PropTypes.bool,\n // # of cols.\n cols: React.PropTypes.number,\n\n // A selector that will not be draggable.\n draggableCancel: React.PropTypes.string,\n // A selector for the draggable handler\n draggableHandle: React.PropTypes.string,\n\n // If true, the layout will compact vertically\n verticalCompact: React.PropTypes.bool,\n\n // layout is an array of object with the format:\n // {x: Number, y: Number, w: Number, h: Number, i: Number}\n layout: function(props, propName, componentName) {\n var layout = props.layout;\n // I hope you're setting the _grid property on the grid items\n if (layout === undefined) return;\n utils.validateLayout(layout, 'layout');\n },\n\n layouts: function(props, propName, componentName) {\n if (props.layouts) {\n throw new Error(\"ReactGridLayout does not use `layouts`: Use ReactGridLayout.Responsive.\");\n }\n },\n\n // margin between items [x, y] in px\n margin: React.PropTypes.array,\n // Rows have a static height, but you can change this based on breakpoints if you like\n rowHeight: React.PropTypes.number,\n\n //\n // Flags\n //\n isDraggable: React.PropTypes.bool,\n isResizable: React.PropTypes.bool,\n // Use CSS transforms instead of top/left\n useCSSTransforms: React.PropTypes.bool,\n\n //\n // Callbacks\n //\n\n // Callback so you can save the layout.\n // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n onLayoutChange: React.PropTypes.func,\n\n // Calls when drag starts. Callback is of the signature (layout, oldItem, newItem, placeholder, e).\n // All callbacks below have the same signature. 'start' and 'stop' callbacks omit the 'placeholder'.\n onDragStart: React.PropTypes.func,\n // Calls on each drag movement.\n onDrag: React.PropTypes.func,\n // Calls when drag is complete.\n onDragStop: React.PropTypes.func,\n //Calls when resize starts.\n onResizeStart: React.PropTypes.func,\n // Calls when resize movement happens.\n onResize: React.PropTypes.func,\n // Calls when resize is complete.\n onResizeStop: React.PropTypes.func,\n\n //\n // Other validations\n //\n\n // Children must not have duplicate keys.\n children: function(props, propName, componentName) {\n React.PropTypes.node.apply(this, arguments);\n var children = props[propName];\n\n // Check children keys for duplicates. Throw if found.\n var keys = {};\n React.Children.forEach(children, function(child, i, list) {\n if (keys[child.key]) {\n throw new Error(\"Duplicate child key found! This will cause problems in ReactGridLayout.\");\n }\n keys[child.key] = true;\n });\n }\n },\n\n getDefaultProps() {\n return {\n autoSize: true,\n cols: 12,\n rowHeight: 150,\n layout: [],\n margin: [10, 10],\n isDraggable: true,\n isResizable: true,\n useCSSTransforms: true,\n verticalCompact: true,\n onLayoutChange: function(){},\n onDragStart: function() {},\n onDrag: function() {},\n onDragStop: function() {},\n onResizeStart: function() {},\n onResize: function() {},\n onResizeStop: function() {}\n };\n },\n\n getInitialState() {\n return {\n activeDrag: null,\n isMounted: false,\n layout: utils.synchronizeLayoutWithChildren(this.props.layout, this.props.children, this.props.cols, this.props.verticalCompact),\n width: this.props.initialWidth\n };\n },\n\n componentDidMount() {\n // Call back with layout on mount. This should be done after correcting the layout width\n // to ensure we don't rerender with the wrong width.\n this.props.onLayoutChange(this.state.layout);\n this.setState({isMounted: true});\n },\n\n componentWillReceiveProps(nextProps) {\n // This allows you to set the width manually if you like.\n // Use manual width changes in combination with `listenToWindowResize: false`\n if (nextProps.width !== this.props.width) this.onWidthChange(nextProps.width);\n\n // If children change, regenerate the layout.\n if (nextProps.children.length !== this.props.children.length) {\n this.setState({\n layout: utils.synchronizeLayoutWithChildren(this.state.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n });\n }\n\n // Allow parent to set layout directly.\n if (nextProps.layout && JSON.stringify(nextProps.layout) !== JSON.stringify(this.state.layout)) {\n this.setState({\n layout: utils.synchronizeLayoutWithChildren(nextProps.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n });\n }\n },\n\n componentDidUpdate(prevProps, prevState) {\n // Call back so we can store the layout\n // Do it only when a resize/drag is not active, otherwise there are way too many callbacks\n if (this.state.layout !== prevState.layout && !this.state.activeDrag) {\n this.props.onLayoutChange(this.state.layout, this.state.layouts);\n }\n },\n\n /**\n * Calculates a pixel value for the container.\n * @return {String} Container height in pixels.\n */\n containerHeight() {\n if (!this.props.autoSize) return;\n return utils.bottom(this.state.layout) * this.props.rowHeight + this.props.margin[1] + 'px';\n },\n\n /**\n * When the width changes, save it to state. This helps with left/width calculations.\n */\n onWidthChange(width) {\n this.setState({width: width});\n },\n\n /**\n * When dragging starts\n * @param {Number} i Index of the child\n * @param {Number} x X position of the move\n * @param {Number} y Y position of the move\n * @param {Event} e The mousedown event\n * @param {Element} element The current dragging DOM element\n * @param {Object} position Drag information\n */\n onDragStart(i, x, y, {e, element, position}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n\n // No need to clone, `l` hasn't changed.\n this.props.onDragStart(layout, l, l, null, e);\n },\n /**\n * Each drag movement create a new dragelement and move the element to the dragged location\n * @param {Number} i Index of the child\n * @param {Number} x X position of the move\n * @param {Number} y Y position of the move\n * @param {Event} e The mousedown event\n * @param {Element} element The current dragging DOM element\n * @param {Object} position Drag information\n */\n onDrag(i, x, y, {e, element, position}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n // Clone layout item so we can pass it to the callback.\n var oldL = utils.clone(l);\n\n // Create placeholder (display only)\n var placeholder = {\n w: l.w, h: l.h, x: l.x, y: l.y, placeholder: true, i: i\n };\n\n // Move the element to the dragged location.\n layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n this.props.onDrag(layout, oldL, l, placeholder, e);\n\n\n this.setState({\n layout: utils.compact(layout, this.props.verticalCompact),\n activeDrag: placeholder\n });\n },\n\n /**\n * When dragging stops, figure out which position the element is closest to and update its x and y.\n * @param {Number} i Index of the child.\n * @param {Number} i Index of the child\n * @param {Number} x X position of the move\n * @param {Number} y Y position of the move\n * @param {Event} e The mousedown event\n * @param {Element} element The current dragging DOM element\n * @param {Object} position Drag information\n */\n onDragStop(i, x, y, {e, element, position}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n var oldL = utils.clone(l);\n\n // Move the element here\n layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n this.props.onDragStop(layout, oldL, l, null, e);\n\n // Set state\n this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: null });\n },\n\n onResizeStart(i, w, h, {e, element, size}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n\n // No need to clone, item hasn't changed\n this.props.onResizeStart(layout, l, l, null, e);\n },\n\n onResize(i, w, h, {e, element, size}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n var oldL = utils.clone(l);\n\n // Set new width and height.\n l.w = w;\n l.h = h;\n\n // Create placeholder element (display only)\n var placeholder = {\n w: w, h: h, x: l.x, y: l.y, placeholder: true, i: i\n };\n\n this.props.onResize(layout, oldL, l, placeholder, e);\n\n // Re-compact the layout and set the drag placeholder.\n this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: placeholder });\n },\n\n onResizeStop(i, x, y, {e, element, size}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n var oldL = utils.clone(l);\n\n this.props.onResizeStop(layout, oldL, l, null, e);\n\n this.setState({ activeDrag: null, layout: utils.compact(layout, this.props.verticalCompact) });\n },\n\n /**\n * Create a placeholder object.\n * @return {Element} Placeholder div.\n */\n placeholder() {\n if (!this.state.activeDrag) return '';\n\n // {...this.state.activeDrag} is pretty slow, actually\n return (\n \n
\n \n );\n },\n\n /**\n * Given a grid item, set its style attributes & surround in a .\n * @param {Element} child React element.\n * @param {Number} i Index of element.\n * @return {Element} Element wrapped in draggable and properly placed.\n */\n processGridItem(child) {\n var i = child.key;\n var l = utils.getLayoutItem(this.state.layout, i);\n\n // watchStart property tells Draggable to react to changes in the start param\n // Must be turned off on the item we're dragging as the changes in `activeDrag` cause rerenders\n var moveOnStartChange = !(this.state.activeDrag && this.state.activeDrag.i === i);\n\n // Parse 'static'. Any properties defined directly on the grid item will take precedence.\n var draggable, resizable;\n if (l.static || this.props.isDraggable === false) draggable = false;\n if (l.static || this.props.isResizable === false) resizable = false;\n\n return (\n \n {child}\n \n );\n },\n\n render() {\n // Calculate classname\n var {className, ...props} = this.props;\n className = 'react-grid-layout ' + (className || '');\n\n return (\n
\n {React.Children.map(this.props.children, this.processGridItem)}\n {this.placeholder()}\n
\n );\n }\n});\n\nmodule.exports = ReactGridLayout;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/ReactGridLayout.jsx\n **/","'use strict';\nvar React = require('react');\n\n/**\n * A simple mixin that provides facility for listening to container resizes.\n */\nvar WidthListeningMixin = {\n\n propTypes: {\n // This allows setting this on the server side\n initialWidth: React.PropTypes.number,\n\n // If false, you should supply width yourself. Good if you want to debounce resize events\n // or reuse a handler from somewhere else.\n listenToWindowResize: React.PropTypes.bool\n },\n\n getDefaultProps: function() {\n return {\n initialWidth: 1280,\n listenToWindowResize: true\n };\n },\n\n componentDidMount: function() {\n if (this.props.listenToWindowResize) {\n window.addEventListener('resize', this.onWindowResize);\n // This is intentional. Once to properly set the breakpoint and resize the elements,\n // and again to compensate for any scrollbar that appeared because of the first step.\n this.onWindowResize();\n this.onWindowResize();\n }\n },\n\n componentWillUnmount() {\n window.removeEventListener('resize', this.onWindowResize);\n },\n\n /**\n * On window resize, update width.\n */\n onWindowResize: function() {\n this.onWidthChange(this.getDOMNode().offsetWidth);\n }\n\n};\n\nmodule.exports = WidthListeningMixin;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/mixins/WidthListeningMixin.js\n **/","module.exports = require('./lib/draggable');\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-draggable/index.js\n ** module id = 7\n ** module chunks = 0\n **/","'use strict';\n\nvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\nvar React = require('react');\nvar Draggable = require('react-draggable');\nvar PureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');\nvar assign = require('object-assign');\nvar cloneElement = require('./cloneElement');\n\nvar Resizable = module.exports = React.createClass({\n displayName: 'Resizable',\n mixins: [PureRenderMixin],\n\n propTypes: {\n // Require that one and only one child be present.\n children: React.PropTypes.element.isRequired,\n // Functions\n onResizeStop: React.PropTypes.func,\n onResizeStart: React.PropTypes.func,\n onResize: React.PropTypes.func,\n\n width: React.PropTypes.number.isRequired,\n height: React.PropTypes.number.isRequired,\n // If you change this, be sure to update your css\n handleSize: React.PropTypes.array,\n // These will be passed wholesale to react-draggable\n draggableOpts: React.PropTypes.object\n },\n\n getDefaultProps: function getDefaultProps() {\n return {\n handleSize: [20, 20]\n };\n },\n\n getInitialState: function getInitialState() {\n return {\n bounds: this.constraintsToBounds(),\n initialWidth: this.props.width,\n initialHeight: this.props.height\n };\n },\n\n constraintsToBounds: function constraintsToBounds() {\n var p = this.props;\n var mins = p.minConstraints || p.handleSize;\n var maxes = p.maxConstraints || [Infinity, Infinity];\n return {\n left: mins[0] - p.width,\n top: mins[1] - p.height,\n right: maxes[0] - p.width,\n bottom: maxes[1] - p.height\n };\n },\n\n /**\n * Wrapper around drag events to provide more useful data.\n *\n * @param {String} handlerName Handler name to wrap.\n * @return {Function} Handler function.\n */\n resizeHandler: function resizeHandler(handlerName) {\n var me = this;\n return function (e, _ref) {\n var node = _ref.node;\n var position = _ref.position;\n\n me.props[handlerName] && me.props[handlerName](e, { node: node, size: calcWH(me.state, position) });\n };\n },\n\n render: function render() {\n var p = this.props;\n\n // What we're doing here is getting the child of this element, and cloning it with this element's props.\n // We are then defining its children as:\n // Its original children (resizable's child's children), and\n // A draggable handle.\n return cloneElement(p.children, assign({}, p, {\n children: [p.children.props.children, React.createElement(\n Draggable,\n _extends({}, p.draggableOpts, {\n onStop: this.resizeHandler('onResizeStop'),\n onStart: this.resizeHandler('onResizeStart'),\n onDrag: this.resizeHandler('onResize'),\n bounds: this.state.bounds\n }),\n React.createElement('span', { className: 'react-resizable-handle' })\n )]\n }));\n }\n});\n\n/**\n * Parse left and top coordinates.\n * @param {Number} options.left Left coordinate.\n * @param {Number} options.top Top coordinate.\n * @return {Object} Coordinates\n */\nfunction calcWH(_ref, _ref2) {\n var initialWidth = _ref.initialWidth;\n var initialHeight = _ref.initialHeight;\n var left = _ref2.left;\n var top = _ref2.top;\n\n return { width: initialWidth + left, height: initialHeight + top };\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/build/Resizable.js\n ** module id = 8\n ** module chunks = 0\n **/","/**\n * Copyright 2013-2015, Facebook, Inc.\n * All rights reserved.\n *\n * This source code is licensed under the BSD-style license found in the\n * LICENSE file in the root directory of this source tree. An additional grant\n * of patent rights can be found in the PATENTS file in the same directory.\n *\n* @providesModule ReactComponentWithPureRenderMixin\n*/\n\n'use strict';\n\nvar shallowEqual = require(\"./shallowEqual\");\n\n/**\n * If your React component's render function is \"pure\", e.g. it will render the\n * same result given the same props and state, provide this Mixin for a\n * considerable performance boost.\n *\n * Most React components have pure render functions.\n *\n * Example:\n *\n * var ReactComponentWithPureRenderMixin =\n * require('ReactComponentWithPureRenderMixin');\n * React.createClass({\n * mixins: [ReactComponentWithPureRenderMixin],\n *\n * render: function() {\n * return
foo
;\n * }\n * });\n *\n * Note: This only checks shallow equality for props and state. If these contain\n * complex data structures this mixin may have false-negatives for deeper\n * differences. Only mixin to components which have simple props and state, or\n * use `forceUpdate()` when you know deep data structures have changed.\n */\nvar ReactComponentWithPureRenderMixin = {\n shouldComponentUpdate: function(nextProps, nextState) {\n return !shallowEqual(this.props, nextProps) ||\n !shallowEqual(this.state, nextState);\n }\n};\n\nmodule.exports = ReactComponentWithPureRenderMixin;\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react/lib/ReactComponentWithPureRenderMixin.js\n ** module id = 9\n ** module chunks = 0\n **/","'use strict';\nvar React = require('react');\nvar cloneWithProps = require('react/lib/cloneWithProps');\nvar utils = require('./utils');\nvar Draggable = require('react-draggable');\nvar Resizable = require('react-resizable').Resizable;\nvar PureDeepRenderMixin = require('./mixins/PureDeepRenderMixin');\n\n/**\n * An individual item within a ReactGridLayout.\n */\nvar GridItem = React.createClass({\n mixins: [PureDeepRenderMixin],\n\n propTypes: {\n // Children must be only a single element\n children: React.PropTypes.element,\n\n // General grid attributes\n cols: React.PropTypes.number.isRequired,\n containerWidth: React.PropTypes.number.isRequired,\n rowHeight: React.PropTypes.number.isRequired,\n margin: React.PropTypes.array.isRequired,\n\n // These are all in grid units\n x: React.PropTypes.number.isRequired,\n y: React.PropTypes.number.isRequired,\n w: React.PropTypes.number.isRequired,\n h: React.PropTypes.number.isRequired,\n\n // All optional\n minW: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.minW > props.w || props.minW > props.maxW) constraintError('minW', props);\n },\n maxW: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.maxW < props.w || props.maxW < props.minW) constraintError('maxW', props);\n },\n minH: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.minH > props.h || props.minH > props.maxH) constraintError('minH', props);\n },\n maxH: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.maxH < props.h || props.maxH < props.minH) constraintError('maxH', props);\n },\n\n // ID is nice to have for callbacks\n i: React.PropTypes.string.isRequired,\n\n // If true, item will be repositioned when x/y/w/h change\n moveOnStartChange: React.PropTypes.bool,\n\n // Functions\n onDragStop: React.PropTypes.func,\n onDragStart: React.PropTypes.func,\n onDrag: React.PropTypes.func,\n onResizeStop: React.PropTypes.func,\n onResizeStart: React.PropTypes.func,\n onResize: React.PropTypes.func,\n\n // Flags\n isDraggable: React.PropTypes.bool,\n isResizable: React.PropTypes.bool,\n // Use CSS transforms instead of top/left\n useCSSTransforms: React.PropTypes.bool,\n isPlaceholder: React.PropTypes.bool,\n\n // Others\n className: React.PropTypes.string,\n // Selector for draggable handle\n handle: React.PropTypes.string,\n // Selector for draggable cancel (see react-draggable)\n cancel: React.PropTypes.string\n },\n\n getDefaultProps() {\n return {\n isDraggable: true,\n isResizable: true,\n useCSSTransforms: true,\n className: '',\n cancel: '',\n minH: 1,\n minW: 1,\n maxH: Infinity,\n maxW: Infinity\n };\n },\n\n getInitialState() {\n return {\n resizing: false,\n className: ''\n };\n },\n\n /**\n * Return position on the page given an x, y, w, h.\n * left, top, width, height are all in pixels.\n * @param {Number} x X coordinate in grid units.\n * @param {Number} y Y coordinate in grid units.\n * @param {Number} w W coordinate in grid units.\n * @param {Number} h H coordinate in grid units.\n * @return {Object} Object containing coords.\n */\n calcPosition(x, y, w, h) {\n var p = this.props;\n var width = p.containerWidth - p.margin[0];\n var out = {\n left: width * (x / p.cols) + p.margin[0],\n top: p.rowHeight * y + p.margin[1],\n width: width * (w / p.cols) - p.margin[0],\n height: h * p.rowHeight - p.margin[1]\n };\n return out;\n },\n\n /**\n * Translate x and y coordinates from pixels to grid units.\n * @param {Number} options.left Left offset in pixels.\n * @param {Number} options.top Top offset in pixels.\n * @return {Object} x and y in grid units.\n */\n calcXY({left, top}) {\n left = left - this.props.margin[0];\n top = top - this.props.margin[1];\n // This is intentional; because so much of the logic on moving boxes up/down relies\n // on an exact y position, we only round the x, not the y.\n var x = Math.round((left / this.props.containerWidth) * this.props.cols);\n var y = Math.floor(top / this.props.rowHeight);\n x = Math.max(Math.min(x, this.props.cols), 0);\n y = Math.max(y, 0);\n return {x, y};\n },\n\n /**\n * Given a height and width in pixel values, calculate grid units.\n * @param {Number} options.height Height in pixels.\n * @param {Number} options.width Width in pixels.\n * @return {Object} w, h as grid units.\n */\n calcWH({height, width}) {\n width = width + this.props.margin[0];\n height = height + this.props.margin[1];\n var w = Math.round((width / this.props.containerWidth) * this.props.cols);\n var h = Math.round(height / this.props.rowHeight);\n w = Math.max(Math.min(w, this.props.cols - this.props.x), 0);\n h = Math.max(h, 0);\n return {w, h};\n },\n\n /**\n * This is where we set the grid item's absolute placement. It gets a little tricky because we want to do it\n * well when server rendering, and the only way to do that properly is to use percentage width/left because\n * we don't know exactly what the browser viewport is.\n * Unfortunately, CSS Transforms, which are great for performance, break in this instance because a percentage\n * left is relative to the item itself, not its container! So we cannot use them on the server rendering pass.\n *\n * @param {Object} pos Position object with width, height, left, top.\n * @return {Object} Style object.\n */\n createStyle(pos) {\n var style = {\n width: pos.width + 'px',\n height: pos.height + 'px',\n left: pos.left + 'px',\n top: pos.top + 'px',\n position: 'absolute'\n };\n\n // This is used for server rendering.\n if (this.props.usePercentages) {\n pos.left = utils.perc(pos.left / this.props.containerWidth);\n style.left = pos.left;\n style.width = utils.perc(pos.width / this.props.containerWidth);\n }\n\n // CSS Transforms support\n if (this.props.useCSSTransforms) {\n utils.setTransform(style, [pos.left, pos.top]);\n delete style.left;\n delete style.top;\n }\n\n return style;\n },\n\n /**\n * Mix a Draggable instance into a child.\n * @param {Element} child Child element.\n * @param {Object} position Position object (pixel values)\n * @return {Element} Child wrapped in Draggable.\n */\n mixinDraggable(child, position) {\n var start = typeof position.left === \"string\" ? undefined : {x: position.left, y: position.top};\n return (\n \n {child}\n \n );\n },\n\n /**\n * Mix a Resizable instance into a child.\n * @param {Element} child Child element.\n * @param {Object} position Position object (pixel values)\n * @return {Element} Child wrapped in Resizable.\n */\n mixinResizable(child, position) {\n var p = this.props;\n // This is the max possible width - doesn't go to infinity because of the width of the window\n var maxWidth = this.calcPosition(0, 0, p.cols - p.x, 0).width;\n\n // Calculate min/max constraints using our min & maxes\n var mins = this.calcPosition(0, 0, p.minW, p.minH);\n var maxes = this.calcPosition(0, 0, p.maxW, p.maxH);\n var minConstraints = [mins.width, mins.height];\n var maxConstraints = [Math.min(maxes.width, maxWidth), Math.min(maxes.height, Infinity)];\n return (\n \n {child}\n \n );\n },\n\n /**\n * Wrapper around drag events to provide more useful data.\n * All drag events call the function with the given handler name,\n * with the signature (index, x, y).\n *\n * @param {String} handlerName Handler name to wrap.\n * @return {Function} Handler function.\n */\n onDragHandler(handlerName) {\n var me = this;\n return function(e, {element, position}) {\n if (!me.props[handlerName]) return;\n // Get new XY\n var {x, y} = me.calcXY(position);\n\n // Cap x at numCols\n x = Math.min(x, me.props.cols - me.props.w);\n\n me.props[handlerName](me.props.i, x, y, {e, element, position});\n };\n },\n\n /**\n * Wrapper around drag events to provide more useful data.\n * All drag events call the function with the given handler name,\n * with the signature (index, x, y).\n *\n * @param {String} handlerName Handler name to wrap.\n * @return {Function} Handler function.\n */\n onResizeHandler(handlerName) {\n var me = this;\n return function(e, {element, size}) {\n if (!me.props[handlerName]) return;\n\n // Get new XY\n var {w, h} = me.calcWH(size);\n\n // Cap w at numCols\n w = Math.min(w, me.props.cols - me.props.x);\n // Ensure w is at least 1\n w = Math.max(w, 1);\n\n // Min/max capping\n w = Math.max(Math.min(w, me.props.maxW), me.props.minW);\n h = Math.max(Math.min(h, me.props.maxH), me.props.minH);\n\n me.setState({resizing: handlerName === 'onResizeStop' ? null : size});\n\n me.props[handlerName](me.props.i, w, h, {e, element, size});\n };\n },\n\n render() {\n var p = this.props, pos = this.calcPosition(p.x, p.y, p.w, p.h);\n if (this.state.resizing) {\n pos.width = this.state.resizing.width;\n pos.height = this.state.resizing.height;\n }\n\n // Create the child element. We clone the existing element but modify its className and style.\n var child = cloneWithProps(this.props.children, {\n // Munge a classname. Use passed in classnames and resizing.\n // React with merge the classNames.\n className: ['react-grid-item', this.props.className, this.state.resizing ? 'resizing' : '',\n this.props.useCSSTransforms ? 'cssTransforms' : ''].join(' '),\n // We can set the width and height on the child, but unfortunately we can't set the position.\n style: this.createStyle(pos)\n });\n\n // Resizable support. This is usually on but the user can toggle it off.\n if (this.props.isResizable) {\n child = this.mixinResizable(child, pos);\n }\n\n // Draggable support. This is always on, except for with placeholders.\n if (this.props.isDraggable) {\n child = this.mixinDraggable(child, pos);\n }\n\n return child;\n }\n});\n\nfunction constraintError(name, props) {\n delete props.children;\n throw new Error(name + ' overrides contraints on gridItem ' + props.i + '. Full props: ' + JSON.stringify(props));\n}\n\nmodule.exports = GridItem;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/GridItem.jsx\n **/","'use strict';\nvar React = require('react');\nvar utils = require('./utils');\nvar responsiveUtils = require('./responsiveUtils');\nvar PureDeepRenderMixin = require('./mixins/PureDeepRenderMixin');\nvar WidthListeningMixin = require('./mixins/WidthListeningMixin');\nvar ReactGridLayout = require('./ReactGridLayout');\n\n/**\n * A wrapper around ReactGridLayout to support responsive breakpoints.\n */\nvar ResponsiveReactGridLayout = React.createClass({\n mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n propTypes: {\n //\n // Basic props\n //\n\n // Optional, but if you are managing width yourself you may want to set the breakpoint\n // yourself as well.\n breakpoint: React.PropTypes.string,\n\n // {name: pxVal}, e.g. {lg: 1200, md: 996, sm: 768, xs: 480}\n breakpoints: React.PropTypes.object,\n\n // # of cols. This is a breakpoint -> cols map\n cols: React.PropTypes.object,\n\n // layouts is an object mapping breakpoints to layouts.\n // e.g. {lg: Layout, md: Layout, ...}\n layouts: function(props, propName, componentName) {\n React.PropTypes.object.isRequired.apply(this, arguments);\n\n var layouts = props.layouts;\n Object.keys(layouts).map(function(k) {\n utils.validateLayout(layouts[k], 'layouts.' + k);\n });\n },\n\n //\n // Callbacks\n //\n\n // Calls back with breakpoint and new # cols\n onBreakpointChange: React.PropTypes.func,\n\n // Callback so you can save the layout.\n // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n onLayoutChange: React.PropTypes.func\n },\n\n getDefaultProps() {\n return {\n breakpoints: {lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0},\n cols: {lg: 12, md: 10, sm: 6, xs: 4, xxs: 2},\n layouts: {},\n onBreakpointChange: function(){},\n onLayoutChange: function(){}\n };\n },\n\n getInitialState() {\n var breakpoint = this.props.breakpoint ||\n responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, this.props.initialWidth);\n var cols = responsiveUtils.getColsFromBreakpoint(breakpoint, this.props.cols);\n\n // Get the initial layout. This can tricky; we try to generate one however possible if one doesn't exist\n // for this layout.\n var initialLayout = responsiveUtils.findOrGenerateResponsiveLayout(\n this.props.layouts, this.props.breakpoints, breakpoint, breakpoint, cols, this.props.verticalCompact);\n\n return {\n layout: initialLayout,\n // storage for layouts obsoleted by breakpoints\n layouts: this.props.layouts || {},\n breakpoint: breakpoint,\n cols: cols,\n width: this.props.initialWidth\n };\n },\n\n componentWillReceiveProps(nextProps) {\n // This allows you to set the width manually if you like.\n // Use manual width changes in combination with `listenToWindowResize: false`\n if (nextProps.width) this.onWidthChange(nextProps.width);\n\n // Allow parent to set breakpoint directly.\n if (nextProps.breakpoint !== this.props.breakpoint) {\n this.onWidthChange(this.state.width);\n }\n\n // Allow parent to set layouts directly.\n if (nextProps.layouts && nextProps.layouts !== this.state.layouts) {\n // Since we're setting an entirely new layout object, we must generate a new responsive layout\n // if one does not exist.\n var newLayout = responsiveUtils.findOrGenerateResponsiveLayout(\n nextProps.layouts, nextProps.breakpoints, this.state.breakpoint, this.state.breakpoint, this.state.cols, this.props.verticalLayout);\n\n this.setState({\n layouts: nextProps.layouts,\n layout: newLayout\n });\n }\n },\n\n /**\n * Bubble this up, add `layouts` object.\n * @param {Array} layout Layout from inner Grid.\n */\n onLayoutChange(layout) {\n this.state.layouts[this.state.breakpoint] = layout;\n this.setState({layout: layout, layouts: this.state.layouts});\n this.props.onLayoutChange(layout, this.state.layouts);\n },\n\n /**\n * When the width changes work through breakpoints and reset state with the new width & breakpoint.\n * Width changes are necessary to figure out the widget widths.\n */\n onWidthChange(width) {\n // Set new breakpoint\n var newState = {width: width};\n newState.breakpoint = this.props.breakpoint ||\n responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, newState.width);\n newState.cols = responsiveUtils.getColsFromBreakpoint(newState.breakpoint, this.props.cols);\n\n // Breakpoint change\n if (newState.cols !== this.state.cols) {\n\n // Store the current layout\n newState.layouts = this.state.layouts;\n newState.layouts[this.state.breakpoint] = JSON.parse(JSON.stringify(this.state.layout));\n\n // Find or generate a new one.\n newState.layout = responsiveUtils.findOrGenerateResponsiveLayout(\n newState.layouts, this.props.breakpoints, newState.breakpoint, this.state.breakpoint, newState.cols, this.props.verticalLayout);\n\n // This adds missing items.\n newState.layout = utils.synchronizeLayoutWithChildren(newState.layout, this.props.children, newState.cols, this.props.verticalCompact);\n\n // Store this new layout as well.\n newState.layouts[newState.breakpoint] = newState.layout;\n\n this.props.onBreakpointChange(newState.breakpoint, newState.cols);\n }\n\n this.setState(newState);\n },\n\n\n render() {\n // Don't pass responsive props to RGL.\n /*jshint unused:false*/\n var {layouts, onBreakpointChange, breakpoints, ...props} = this.props;\n return (\n \n {this.props.children}\n \n );\n }\n});\n\nmodule.exports = ResponsiveReactGridLayout;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/ResponsiveReactGridLayout.jsx\n **/","'use strict';\n\nvar utils = require('./utils');\n\nvar responsiveUtils = module.exports = {\n\n /**\n * Given a width, find the highest breakpoint that matches is valid for it (width > breakpoint).\n *\n * @param {Object} breakpoints Breakpoints object (e.g. {lg: 1200, md: 960, ...})\n * @param {Number} width Screen width.\n * @return {String} Highest breakpoint that is less than width.\n */\n getBreakpointFromWidth(breakpoints, width) {\n var sorted = responsiveUtils.sortBreakpoints(breakpoints);\n var matching = sorted[0];\n for (var i = 1, len = sorted.length; i < len; i++) {\n var breakpointName = sorted[i];\n if (width > breakpoints[breakpointName]) matching = breakpointName;\n }\n return matching;\n },\n\n\n /**\n * Given a breakpoint, get the # of cols set for it.\n * @param {String} breakpoint Breakpoint name.\n * @param {Object} cols Map of breakpoints to cols.\n * @return {Number} Number of cols.\n */\n getColsFromBreakpoint(breakpoint, cols) {\n if (!cols[breakpoint]) {\n throw new Error(\"ResponsiveReactGridLayout: `cols` entry for breakpoint \" + breakpoint + \" is missing!\");\n }\n return cols[breakpoint];\n },\n\n /**\n * Given existing layouts and a new breakpoint, find or generate a new layout.\n *\n * This finds the layout above the new one and generates from it, if it exists.\n *\n * @param {Array} layouts Existing layouts.\n * @param {Array} breakpoints All breakpoints.\n * @param {String} breakpoint New breakpoint.\n * @param {String} breakpoint Last breakpoint (for fallback).\n * @param {Number} cols Column count at new breakpoint.\n * @param {Boolean} verticalCompact Whether or not to compact the layout\n * vertically.\n * @return {Array} New layout.\n */\n findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, lastBreakpoint, cols, verticalCompact) {\n // If it already exists, just return it.\n if (layouts[breakpoint]) return layouts[breakpoint];\n // Find or generate the next layout\n var layout = layouts[lastBreakpoint];\n var breakpointsSorted = responsiveUtils.sortBreakpoints(breakpoints);\n var breakpointsAbove = breakpointsSorted.slice(breakpointsSorted.indexOf(breakpoint));\n for (var i = 0, len = breakpointsAbove.length; i < len; i++) {\n var b = breakpointsAbove[i];\n if (layouts[b]) {\n layout = layouts[b];\n break;\n }\n }\n layout = JSON.parse(JSON.stringify(layout || [])); // clone layout so we don't modify existing items\n return utils.compact(utils.correctBounds(layout, {cols: cols}), verticalCompact);\n },\n\n\n /**\n * Given breakpoints, return an array of breakpoints sorted by width. This is usually\n * e.g. ['xxs', 'xs', 'sm', ...]\n *\n * @param {Object} breakpoints Key/value pair of breakpoint names to widths.\n * @return {Array} Sorted breakpoints.\n */\n sortBreakpoints(breakpoints) {\n var keys = Object.keys(breakpoints);\n return keys.sort(function(a, b) {\n return breakpoints[a] - breakpoints[b];\n });\n }\n};\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/responsiveUtils.js\n **/","var pSlice = Array.prototype.slice;\nvar objectKeys = require('./lib/keys.js');\nvar isArguments = require('./lib/is_arguments.js');\n\nvar deepEqual = module.exports = function (actual, expected, opts) {\n if (!opts) opts = {};\n // 7.1. All identical values are equivalent, as determined by ===.\n if (actual === expected) {\n return true;\n\n } else if (actual instanceof Date && expected instanceof Date) {\n return actual.getTime() === expected.getTime();\n\n // 7.3. Other pairs that do not both pass typeof value == 'object',\n // equivalence is determined by ==.\n } else if (typeof actual != 'object' && typeof expected != 'object') {\n return opts.strict ? actual === expected : actual == expected;\n\n // 7.4. For all other Object pairs, including Array objects, equivalence is\n // determined by having the same number of owned properties (as verified\n // with Object.prototype.hasOwnProperty.call), the same set of keys\n // (although not necessarily the same order), equivalent values for every\n // corresponding key, and an identical 'prototype' property. Note: this\n // accounts for both named and indexed properties on Arrays.\n } else {\n return objEquiv(actual, expected, opts);\n }\n}\n\nfunction isUndefinedOrNull(value) {\n return value === null || value === undefined;\n}\n\nfunction isBuffer (x) {\n if (!x || typeof x !== 'object' || typeof x.length !== 'number') return false;\n if (typeof x.copy !== 'function' || typeof x.slice !== 'function') {\n return false;\n }\n if (x.length > 0 && typeof x[0] !== 'number') return false;\n return true;\n}\n\nfunction objEquiv(a, b, opts) {\n var i, key;\n if (isUndefinedOrNull(a) || isUndefinedOrNull(b))\n return false;\n // an identical 'prototype' property.\n if (a.prototype !== b.prototype) return false;\n //~~~I've managed to break Object.keys through screwy arguments passing.\n // Converting to array solves the problem.\n if (isArguments(a)) {\n if (!isArguments(b)) {\n return false;\n }\n a = pSlice.call(a);\n b = pSlice.call(b);\n return deepEqual(a, b, opts);\n }\n if (isBuffer(a)) {\n if (!isBuffer(b)) {\n return false;\n }\n if (a.length !== b.length) return false;\n for (i = 0; i < a.length; i++) {\n if (a[i] !== b[i]) return false;\n }\n return true;\n }\n try {\n var ka = objectKeys(a),\n kb = objectKeys(b);\n } catch (e) {//happens when one is a string literal and the other isn't\n return false;\n }\n // having the same number of owned properties (keys incorporates\n // hasOwnProperty)\n if (ka.length != kb.length)\n return false;\n //the same set of keys (although not necessarily the same order),\n ka.sort();\n kb.sort();\n //~~~cheap key test\n for (i = ka.length - 1; i >= 0; i--) {\n if (ka[i] != kb[i])\n return false;\n }\n //equivalent values for every corresponding key, and\n //~~~possibly expensive deep test\n for (i = ka.length - 1; i >= 0; i--) {\n key = ka[i];\n if (!deepEqual(a[key], b[key], opts)) return false;\n }\n return typeof a === typeof b;\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/deep-equal/index.js\n ** module id = 13\n ** module chunks = 0\n **/","var supportsArgumentsClass = (function(){\n return Object.prototype.toString.call(arguments)\n})() == '[object Arguments]';\n\nexports = module.exports = supportsArgumentsClass ? supported : unsupported;\n\nexports.supported = supported;\nfunction supported(object) {\n return Object.prototype.toString.call(object) == '[object Arguments]';\n};\n\nexports.unsupported = unsupported;\nfunction unsupported(object){\n return object &&\n typeof object == 'object' &&\n typeof object.length == 'number' &&\n Object.prototype.hasOwnProperty.call(object, 'callee') &&\n !Object.prototype.propertyIsEnumerable.call(object, 'callee') ||\n false;\n};\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/deep-equal/lib/is_arguments.js\n ** module id = 14\n ** module chunks = 0\n **/","exports = module.exports = typeof Object.keys === 'function'\n ? Object.keys : shim;\n\nexports.shim = shim;\nfunction shim (obj) {\n var keys = [];\n for (var key in obj) keys.push(key);\n return keys;\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/deep-equal/lib/keys.js\n ** module id = 15\n ** module chunks = 0\n **/","'use strict';\n\nvar React = require('react');\nvar emptyFunction = function(){};\nvar assign = require('object-assign');\nvar classNames = require('classnames');\n\n//\n// Helpers. See Element definition below this section.\n//\n\nfunction createUIEvent(draggable) {\n // State changes are often (but not always!) async. We want the latest value.\n var state = draggable._pendingState || draggable.state;\n return {\n node: draggable.getDOMNode(),\n position: {\n top: state.clientY,\n left: state.clientX\n }\n };\n}\n\nfunction canDragY(draggable) {\n return draggable.props.axis === 'both' ||\n draggable.props.axis === 'y';\n}\n\nfunction canDragX(draggable) {\n return draggable.props.axis === 'both' ||\n draggable.props.axis === 'x';\n}\n\nfunction isFunction(func) {\n return typeof func === 'function' || Object.prototype.toString.call(func) === '[object Function]';\n}\n\n// @credits https://gist.github.com/rogozhnikoff/a43cfed27c41e4e68cdc\nfunction findInArray(array, callback) {\n for (var i = 0, length = array.length; i < length; i++) {\n if (callback.apply(callback, [array[i], i, array])) return array[i];\n }\n}\n\nfunction matchesSelector(el, selector) {\n var method = findInArray([\n 'matches',\n 'webkitMatchesSelector',\n 'mozMatchesSelector',\n 'msMatchesSelector',\n 'oMatchesSelector'\n ], function(method){\n return isFunction(el[method]);\n });\n\n return el[method].call(el, selector);\n}\n\n/**\n * simple abstraction for dragging events names\n * */\nvar eventsFor = {\n touch: {\n start: 'touchstart',\n move: 'touchmove',\n end: 'touchend'\n },\n mouse: {\n start: 'mousedown',\n move: 'mousemove',\n end: 'mouseup'\n }\n};\n\n// Default to mouse events\nvar dragEventFor = eventsFor['mouse'];\n\n/**\n * get {clientX, clientY} positions of control\n * */\nfunction getControlPosition(e) {\n var position = (e.touches && e.touches[0]) || e;\n return {\n clientX: position.clientX,\n clientY: position.clientY\n };\n}\n\nfunction addEvent(el, event, handler) {\n if (!el) { return; }\n if (el.attachEvent) {\n el.attachEvent('on' + event, handler);\n } else if (el.addEventListener) {\n el.addEventListener(event, handler, true);\n } else {\n el['on' + event] = handler;\n }\n}\n\nfunction removeEvent(el, event, handler) {\n if (!el) { return; }\n if (el.detachEvent) {\n el.detachEvent('on' + event, handler);\n } else if (el.removeEventListener) {\n el.removeEventListener(event, handler, true);\n } else {\n el['on' + event] = null;\n }\n}\n\nfunction outerHeight(node) {\n // This is deliberately excluding margin for our calculations, since we are using\n // offsetTop which is including margin. See getBoundPosition\n var height = node.clientHeight;\n var computedStyle = window.getComputedStyle(node);\n height += int(computedStyle.borderTopWidth);\n height += int(computedStyle.borderBottomWidth);\n return height;\n}\n\nfunction outerWidth(node) {\n // This is deliberately excluding margin for our calculations, since we are using\n // offsetLeft which is including margin. See getBoundPosition\n var width = node.clientWidth;\n var computedStyle = window.getComputedStyle(node);\n width += int(computedStyle.borderLeftWidth);\n width += int(computedStyle.borderRightWidth);\n return width;\n}\nfunction innerHeight(node) {\n var height = node.clientHeight;\n var computedStyle = window.getComputedStyle(node);\n height -= int(computedStyle.paddingTop);\n height -= int(computedStyle.paddingBottom);\n return height;\n}\n\nfunction innerWidth(node) {\n var width = node.clientWidth;\n var computedStyle = window.getComputedStyle(node);\n width -= int(computedStyle.paddingLeft);\n width -= int(computedStyle.paddingRight);\n return width;\n}\n\nfunction isNum(num) {\n return typeof num === 'number' && !isNaN(num);\n}\n\nfunction int(a) {\n return parseInt(a, 10);\n}\n\nfunction getBoundPosition(draggable, clientX, clientY) {\n var bounds = JSON.parse(JSON.stringify(draggable.props.bounds));\n var node = draggable.getDOMNode();\n var parent = node.parentNode;\n\n if (bounds === 'parent') {\n var nodeStyle = window.getComputedStyle(node);\n var parentStyle = window.getComputedStyle(parent);\n // Compute bounds. This is a pain with padding and offsets but this gets it exactly right.\n bounds = {\n left: -node.offsetLeft + int(parentStyle.paddingLeft) +\n int(nodeStyle.borderLeftWidth) + int(nodeStyle.marginLeft),\n top: -node.offsetTop + int(parentStyle.paddingTop) +\n int(nodeStyle.borderTopWidth) + int(nodeStyle.marginTop),\n right: innerWidth(parent) - outerWidth(node) - node.offsetLeft,\n bottom: innerHeight(parent) - outerHeight(node) - node.offsetTop\n };\n }\n\n // Keep x and y below right and bottom limits...\n if (isNum(bounds.right)) clientX = Math.min(clientX, bounds.right);\n if (isNum(bounds.bottom)) clientY = Math.min(clientY, bounds.bottom);\n\n // But above left and top limits.\n if (isNum(bounds.left)) clientX = Math.max(clientX, bounds.left);\n if (isNum(bounds.top)) clientY = Math.max(clientY, bounds.top);\n\n return [clientX, clientY];\n}\n\nfunction snapToGrid(grid, pendingX, pendingY) {\n var x = Math.round(pendingX / grid[0]) * grid[0];\n var y = Math.round(pendingY / grid[1]) * grid[1];\n return [x, y];\n}\n\n// Useful for preventing blue highlights all over everything when dragging.\nvar userSelectStyle = ';user-select: none;-webkit-user-select:none;-moz-user-select:none;' +\n '-o-user-select:none;-ms-user-select:none;';\n\nfunction addUserSelectStyles(draggable) {\n if (!draggable.props.enableUserSelectHack) return;\n var style = document.body.getAttribute('style') || '';\n document.body.setAttribute('style', style + userSelectStyle);\n}\n\nfunction removeUserSelectStyles(draggable) {\n if (!draggable.props.enableUserSelectHack) return;\n var style = document.body.getAttribute('style') || '';\n document.body.setAttribute('style', style.replace(userSelectStyle, ''));\n}\n\nfunction createCSSTransform(style) {\n // Replace unitless items with px\n var x = style.x + 'px';\n var y = style.y + 'px';\n return {\n transform: 'translate(' + x + ',' + y + ')',\n WebkitTransform: 'translate(' + x + ',' + y + ')',\n OTransform: 'translate(' + x + ',' + y + ')',\n msTransform: 'translate(' + x + ',' + y + ')',\n MozTransform: 'translate(' + x + ',' + y + ')'\n };\n}\n\n\n//\n// End Helpers.\n//\n\n//\n// Define \n//\n\nmodule.exports = React.createClass({\n displayName: 'Draggable',\n\n propTypes: {\n /**\n * `axis` determines which axis the draggable can move.\n *\n * 'both' allows movement horizontally and vertically.\n * 'x' limits movement to horizontal axis.\n * 'y' limits movement to vertical axis.\n *\n * Defaults to 'both'.\n */\n axis: React.PropTypes.oneOf(['both', 'x', 'y']),\n\n /**\n * `bounds` determines the range of movement available to the element.\n * Available values are:\n *\n * 'parent' restricts movement within the Draggable's parent node.\n *\n * Alternatively, pass an object with the following properties, all of which are optional:\n *\n * {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}\n *\n * All values are in px.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
Content
\n * \n * );\n * }\n * });\n * ```\n */\n bounds: React.PropTypes.oneOfType([\n React.PropTypes.shape({\n left: React.PropTypes.Number,\n right: React.PropTypes.Number,\n top: React.PropTypes.Number,\n bottom: React.PropTypes.Number\n }),\n React.PropTypes.oneOf(['parent', false])\n ]),\n\n /**\n * By default, we add 'user-select:none' attributes to the document body\n * to prevent ugly text selection during drag. If this is causing problems\n * for your app, set this to `false`.\n */\n enableUserSelectHack: React.PropTypes.bool,\n\n /**\n * `handle` specifies a selector to be used as the handle that initiates drag.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
\n *
Click me to drag
\n *
This is some other content
\n *
\n * \n * );\n * }\n * });\n * ```\n */\n handle: React.PropTypes.string,\n\n /**\n * `cancel` specifies a selector to be used to prevent drag initialization.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return(\n * \n *
\n *
You can't drag from here
\n *
Dragging here works fine
\n *
\n * \n * );\n * }\n * });\n * ```\n */\n cancel: React.PropTypes.string,\n\n /**\n * `grid` specifies the x and y that dragging should snap to.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
I snap to a 25 x 25 grid
\n * \n * );\n * }\n * });\n * ```\n */\n grid: React.PropTypes.arrayOf(React.PropTypes.number),\n\n /**\n * `start` specifies the x and y that the dragged item should start at\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
I start with transformX: 25px and transformY: 25px;
\n * \n * );\n * }\n * });\n * ```\n */\n start: React.PropTypes.shape({\n x: React.PropTypes.number,\n y: React.PropTypes.number\n }),\n\n /**\n * `moveOnStartChange`, if true (default false) will move the element if the `start`\n * property changes.\n */\n moveOnStartChange: React.PropTypes.bool,\n\n\n /**\n * `zIndex` specifies the zIndex to use while dragging.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
I have a zIndex
\n * \n * );\n * }\n * });\n * ```\n */\n zIndex: React.PropTypes.number,\n\n /**\n * Called when dragging starts.\n * If this function returns the boolean false, dragging will be canceled.\n *\n * Example:\n *\n * ```js\n * function (event, ui) {}\n * ```\n *\n * `event` is the Event that was triggered.\n * `ui` is an object:\n *\n * ```js\n * {\n * position: {top: 0, left: 0}\n * }\n * ```\n */\n onStart: React.PropTypes.func,\n\n /**\n * Called while dragging.\n * If this function returns the boolean false, dragging will be canceled.\n *\n * Example:\n *\n * ```js\n * function (event, ui) {}\n * ```\n *\n * `event` is the Event that was triggered.\n * `ui` is an object:\n *\n * ```js\n * {\n * position: {top: 0, left: 0}\n * }\n * ```\n */\n onDrag: React.PropTypes.func,\n\n /**\n * Called when dragging stops.\n *\n * Example:\n *\n * ```js\n * function (event, ui) {}\n * ```\n *\n * `event` is the Event that was triggered.\n * `ui` is an object:\n *\n * ```js\n * {\n * position: {top: 0, left: 0}\n * }\n * ```\n */\n onStop: React.PropTypes.func,\n\n /**\n * A workaround option which can be passed if onMouseDown needs to be accessed,\n * since it'll always be blocked (due to that there's internal use of onMouseDown)\n */\n onMouseDown: React.PropTypes.func,\n },\n\n componentWillReceiveProps: function(newProps) {\n // React to changes in the 'start' param.\n if (newProps.moveOnStartChange && newProps.start) {\n this.setState(this.getInitialState(newProps));\n }\n },\n\n componentWillUnmount: function() {\n // Remove any leftover event handlers\n removeEvent(document, dragEventFor['move'], this.handleDrag);\n removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n removeUserSelectStyles(this);\n },\n\n getDefaultProps: function () {\n return {\n axis: 'both',\n bounds: false,\n handle: null,\n cancel: null,\n grid: null,\n moveOnStartChange: false,\n start: {x: 0, y: 0},\n zIndex: NaN,\n enableUserSelectHack: true,\n onStart: emptyFunction,\n onDrag: emptyFunction,\n onStop: emptyFunction,\n onMouseDown: emptyFunction\n };\n },\n\n getInitialState: function (props) {\n // Handle call from CWRP\n props = props || this.props;\n return {\n // Whether or not we are currently dragging.\n dragging: false,\n\n // Offset between start top/left and mouse top/left while dragging.\n offsetX: 0, offsetY: 0,\n\n // Current transform x and y.\n clientX: props.start.x, clientY: props.start.y\n };\n },\n\n handleDragStart: function (e) {\n // Make it possible to attach event handlers on top of this one\n this.props.onMouseDown(e);\n\n // Short circuit if handle or cancel prop was provided and selector doesn't match\n if ((this.props.handle && !matchesSelector(e.target, this.props.handle)) ||\n (this.props.cancel && matchesSelector(e.target, this.props.cancel))) {\n return;\n }\n\n // Call event handler. If it returns explicit false, cancel.\n var shouldStart = this.props.onStart(e, createUIEvent(this));\n if (shouldStart === false) return;\n\n var dragPoint = getControlPosition(e);\n\n // Add a style to the body to disable user-select. This prevents text from\n // being selected all over the page.\n addUserSelectStyles(this);\n\n // Initiate dragging. Set the current x and y as offsets\n // so we know how much we've moved during the drag. This allows us\n // to drag elements around even if they have been moved, without issue.\n this.setState({\n dragging: true,\n offsetX: dragPoint.clientX - this.state.clientX,\n offsetY: dragPoint.clientY - this.state.clientY\n });\n\n\n // Add event handlers\n addEvent(document, dragEventFor['move'], this.handleDrag);\n addEvent(document, dragEventFor['end'], this.handleDragEnd);\n },\n\n handleDragEnd: function (e) {\n // Short circuit if not currently dragging\n if (!this.state.dragging) {\n return;\n }\n\n removeUserSelectStyles(this);\n\n // Turn off dragging\n this.setState({\n dragging: false\n });\n\n // Call event handler\n this.props.onStop(e, createUIEvent(this));\n\n // Remove event handlers\n removeEvent(document, dragEventFor['move'], this.handleDrag);\n removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n },\n\n handleDrag: function (e) {\n var dragPoint = getControlPosition(e);\n\n // Calculate X and Y\n var clientX = dragPoint.clientX - this.state.offsetX;\n var clientY = dragPoint.clientY - this.state.offsetY;\n\n // Snap to grid if prop has been provided\n if (Array.isArray(this.props.grid)) {\n var coords = snapToGrid(this.props.grid, clientX, clientY);\n clientX = coords[0], clientY = coords[1];\n }\n\n if (this.props.bounds) {\n var pos = getBoundPosition(this, clientX, clientY);\n clientX = pos[0], clientY = pos[1];\n }\n\n // Call event handler. If it returns explicit false, cancel.\n var shouldUpdate = this.props.onDrag(e, createUIEvent(this));\n if (shouldUpdate === false) return this.handleDragEnd();\n\n // Update transform\n this.setState({\n clientX: clientX,\n clientY: clientY\n });\n },\n\n onMouseDown: function(ev) {\n // Prevent 'ghost click' which happens 300ms after touchstart if the event isn't cancelled.\n // We don't cancel the event on touchstart because of #37; we might want to make a scrollable item draggable.\n // More on ghost clicks: http://ariatemplates.com/blog/2014/05/ghost-clicks-in-mobile-browsers/\n if (dragEventFor == eventsFor['touch']) {\n return ev.preventDefault();\n }\n\n return this.handleDragStart.apply(this, arguments);\n },\n\n onTouchStart: function(ev) {\n // We're on a touch device now, so change the event handlers\n dragEventFor = eventsFor['touch'];\n\n return this.handleDragStart.apply(this, arguments);\n },\n\n render: function () {\n // Create style object. We extend from existing styles so we don't\n // remove anything already set (like background, color, etc).\n var childStyle = this.props.children.props.style || {};\n\n // Add a CSS transform to move the element around. This allows us to move the element around\n // without worrying about whether or not it is relatively or absolutely positioned.\n // If the item you are dragging already has a transform set, wrap it in a so \n // has a clean slate.\n var transform = createCSSTransform({\n // Set left if horizontal drag is enabled\n x: canDragX(this) ?\n this.state.clientX :\n 0,\n\n // Set top if vertical drag is enabled\n y: canDragY(this) ?\n this.state.clientY :\n 0\n });\n\n // Workaround IE pointer events; see #51\n // https://github.com/mzabriskie/react-draggable/issues/51#issuecomment-103488278\n var touchHacks = {\n touchAction: 'none'\n };\n\n var style = assign({}, childStyle, transform, touchHacks);\n\n // Set zIndex if currently dragging and prop has been provided\n if (this.state.dragging && !isNaN(this.props.zIndex)) {\n style.zIndex = this.props.zIndex;\n }\n\n var className = classNames((this.props.children.props.className || ''), 'react-draggable', {\n 'react-draggable-dragging': this.state.dragging,\n 'react-draggable-dragged': this.state.dragged\n });\n\n // Reuse the child provided\n // This makes it flexible to use whatever element is wanted (div, ul, etc)\n return React.cloneElement(React.Children.only(this.props.children), {\n style: style,\n className: className,\n\n onMouseDown: this.onMouseDown,\n onTouchStart: this.onTouchStart,\n onMouseUp: this.handleDragEnd,\n onTouchEnd: this.handleDragEnd\n });\n }\n});\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-draggable/lib/draggable.js\n ** module id = 16\n ** module chunks = 0\n **/","/*!\n Copyright (c) 2015 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n\nfunction classNames() {\n\tvar classes = '';\n\tvar arg;\n\n\tfor (var i = 0; i < arguments.length; i++) {\n\t\targ = arguments[i];\n\t\tif (!arg) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tif ('string' === typeof arg || 'number' === typeof arg) {\n\t\t\tclasses += ' ' + arg;\n\t\t} else if (Object.prototype.toString.call(arg) === '[object Array]') {\n\t\t\tclasses += ' ' + classNames.apply(null, arg);\n\t\t} else if ('object' === typeof arg) {\n\t\t\tfor (var key in arg) {\n\t\t\t\tif (!arg.hasOwnProperty(key) || !arg[key]) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\tclasses += ' ' + key;\n\t\t\t}\n\t\t}\n\t}\n\treturn classes.substr(1);\n}\n\n// safely export classNames for node / browserify\nif (typeof module !== 'undefined' && module.exports) {\n\tmodule.exports = classNames;\n}\n\n// safely export classNames for RequireJS\nif (typeof define !== 'undefined' && define.amd) {\n\tdefine('classnames', [], function() {\n\t\treturn classNames;\n\t});\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-draggable/~/classnames/index.js\n ** module id = 17\n ** module chunks = 0\n **/","'use strict';\n\nvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\nvar _slicedToArray = function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } };\n\nvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\nvar React = require('react');\nvar Resizable = require('./Resizable');\nvar PureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');\n\n// An example use of Resizable.\nvar ResizableBox = module.exports = React.createClass({\n displayName: 'ResizableBox',\n mixins: [PureRenderMixin],\n\n propTypes: {\n lockAspectRatio: React.PropTypes.bool\n },\n\n getDefaultProps: function getDefaultProps() {\n return {\n lockAspectRatio: false,\n handleSize: [20, 20]\n };\n },\n\n getInitialState: function getInitialState() {\n return {\n width: this.props.width,\n height: this.props.height,\n aspectRatio: this.props.width / this.props.height\n };\n },\n\n onResize: function onResize(event, _ref) {\n var element = _ref.element;\n var size = _ref.size;\n var width = size.width;\n var height = size.height;\n\n var widthChanged = width !== this.state.width,\n heightChanged = height !== this.state.height;\n if (!widthChanged && !heightChanged) {\n return;\n }if (this.props.lockAspectRatio) {\n var _preserveAspectRatio = this.preserveAspectRatio(width, height);\n\n var _preserveAspectRatio2 = _slicedToArray(_preserveAspectRatio, 2);\n\n width = _preserveAspectRatio2[0];\n height = _preserveAspectRatio2[1];\n }\n\n this.setState({ width: width, height: height });\n },\n\n // If you do this, be careful of constraints\n preserveAspectRatio: function preserveAspectRatio(width, height) {\n var min = this.props.minConstraints;\n var max = this.props.maxConstraints;\n\n height = width / this.state.aspectRatio;\n width = height * this.state.aspectRatio;\n\n if (min) {\n width = Math.max(min[0], width);\n height = Math.max(min[1], height);\n }\n if (max) {\n width = Math.min(max[0], width);\n height = Math.min(max[1], height);\n }\n return [width, height];\n },\n\n render: function render() {\n // Basic wrapper around a Resizable instance.\n // If you use Resizable directly, you are responsible for updating the component\n // with a new width and height.\n var _props = this.props;\n var handleSize = _props.handleSize;\n var minConstraints = _props.minConstraints;\n var maxConstraints = _props.maxConstraints;\n\n var props = _objectWithoutProperties(_props, ['handleSize', 'minConstraints', 'maxConstraints']);\n\n return React.createElement(\n Resizable,\n {\n minConstraints: minConstraints,\n maxConstraints: maxConstraints,\n handleSize: handleSize,\n width: this.state.width,\n height: this.state.height,\n onResize: this.onResize,\n draggableOpts: this.props.draggableOpts\n },\n React.createElement(\n 'div',\n _extends({ style: { width: this.state.width + 'px', height: this.state.height + 'px' } }, props),\n this.props.children\n )\n );\n }\n});\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/build/ResizableBox.js\n ** module id = 18\n ** module chunks = 0\n **/","'use strict';\n\nvar assign = require('object-assign');\nvar React = require('react');\n\nmodule.exports = function cloneElement(element, props) {\n if (props.style && element.props.style) {\n props.style = assign({}, element.props.style, props.style);\n }\n if (props.className && element.props.className) {\n props.className = element.props.className + ' ' + props.className;\n }\n return React.cloneElement(element, props);\n};\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/build/cloneElement.js\n ** module id = 19\n ** module chunks = 0\n **/","'use strict';\nmodule.exports = function() {\n throw new Error(\"Don't instantiate Resizable directly! Use require('react-resizable').Resizable\");\n};\n\nmodule.exports.Resizable = require('./build/Resizable');\nmodule.exports.ResizableBox = require('./build/ResizableBox');\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/index.js\n ** module id = 20\n ** module chunks = 0\n **/","'use strict';\r\nvar React = require('react')\r\n , hasOwn = Object.prototype.hasOwnProperty\r\n , version = React.version.split('.').map(parseFloat)\r\n , RESERVED = {\r\n className: resolve(joinClasses),\r\n children: function(){},\r\n key: function(){},\r\n ref: function(){},\r\n style: resolve(extend)\r\n };\r\n\r\nmodule.exports = function cloneWithProps(child, props) {\r\n var newProps = mergeProps(props, child.props);\r\n\r\n if (!hasOwn.call(newProps, 'children') && hasOwn.call(child.props, 'children'))\r\n newProps.children = child.props.children;\r\n\r\n // < 0.11\r\n if (version[0] === 0 && version[1] < 11)\r\n return child.constructor.ConvenienceConstructor(newProps);\r\n \r\n // 0.11\r\n if (version[0] === 0 && version[1] === 11)\r\n return child.constructor(newProps);\r\n\r\n // 0.12\r\n else if (version[0] === 0 && version[1] === 12){\r\n MockLegacyFactory.isReactLegacyFactory = true\r\n MockLegacyFactory.type = child.type\r\n return React.createElement(MockLegacyFactory, newProps);\r\n }\r\n\r\n // 0.13+\r\n return React.createElement(child.type, newProps);\r\n\r\n function MockLegacyFactory(){}\r\n}\r\n\r\nfunction mergeProps(currentProps, childProps) {\r\n var newProps = extend(currentProps), key\r\n\r\n for (key in childProps) {\r\n if (hasOwn.call(RESERVED, key) )\r\n RESERVED[key](newProps, childProps[key], key)\r\n\r\n else if ( !hasOwn.call(newProps, key) )\r\n newProps[key] = childProps[key];\r\n }\r\n return newProps\r\n}\r\n\r\nfunction resolve(fn){\r\n return function(src, value, key){\r\n if( !hasOwn.call(src, key)) src[key] = value\r\n else src[key] = fn(src[key], value)\r\n }\r\n}\r\n\r\nfunction joinClasses(a, b){\r\n if ( !a ) return b || ''\r\n return a + (b ? ' ' + b : '')\r\n}\r\n\r\nfunction extend() {\r\n var target = {};\r\n for (var i = 0; i < arguments.length; i++) \r\n for (var key in arguments[i]) if (hasOwn.call(arguments[i], key)) \r\n target[key] = arguments[i][key] \r\n return target\r\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react/lib/cloneWithProps.js\n ** module id = 21\n ** module chunks = 0\n **/","/**\n * Copyright 2013-2015, Facebook, Inc.\n * All rights reserved.\n *\n * This source code is licensed under the BSD-style license found in the\n * LICENSE file in the root directory of this source tree. An additional grant\n * of patent rights can be found in the PATENTS file in the same directory.\n *\n * @providesModule shallowEqual\n */\n\n'use strict';\n\n/**\n * Performs equality by iterating through keys on an object and returning\n * false when any key has values which are not strictly equal between\n * objA and objB. Returns true when the values of all keys are strictly equal.\n *\n * @return {boolean}\n */\nfunction shallowEqual(objA, objB) {\n if (objA === objB) {\n return true;\n }\n var key;\n // Test for A's keys different from B.\n for (key in objA) {\n if (objA.hasOwnProperty(key) &&\n (!objB.hasOwnProperty(key) || objA[key] !== objB[key])) {\n return false;\n }\n }\n // Test for B's keys missing from A.\n for (key in objB) {\n if (objB.hasOwnProperty(key) && !objA.hasOwnProperty(key)) {\n return false;\n }\n }\n return true;\n}\n\nmodule.exports = shallowEqual;\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react/lib/shallowEqual.js\n ** module id = 22\n ** module chunks = 0\n **/"],"sourceRoot":""} \ No newline at end of file +{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///react-grid-layout.min.js","webpack:///webpack/bootstrap 846ebd358e525e727e07","webpack:///./index-dev.js","webpack:///external \"React\"","webpack:///./lib/utils.js","webpack:///./~/object-assign/index.js","webpack:///./lib/mixins/PureDeepRenderMixin.js","webpack:///./lib/ReactGridLayout.jsx","webpack:///./lib/mixins/WidthListeningMixin.js","webpack:///./~/react-draggable/index.js","webpack:///./~/react-resizable/build/Resizable.js","webpack:///./~/react/lib/ReactComponentWithPureRenderMixin.js","webpack:///./lib/GridItem.jsx","webpack:///./lib/ResponsiveReactGridLayout.jsx","webpack:///./lib/responsiveUtils.js","webpack:///./~/deep-equal/index.js","webpack:///./~/deep-equal/lib/is_arguments.js","webpack:///./~/deep-equal/lib/keys.js","webpack:///./~/react-draggable/lib/draggable.js","webpack:///./~/react-draggable/~/classnames/index.js","webpack:///./~/react-resizable/build/ResizableBox.js","webpack:///./~/react-resizable/build/cloneElement.js","webpack:///./~/react-resizable/index.js","webpack:///./~/react/lib/cloneWithProps.js","webpack:///./~/react/lib/shallowEqual.js"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE_1__","modules","__webpack_require__","moduleId","installedModules","id","loaded","call","m","c","p","Responsive","assign","utils","bottom","layout","bottomY","max","i","len","length","y","h","clone","obj","collides","l1","l2","x","w","compact","verticalCompact","compareWith","getStatics","out","sorted","sortLayoutItemsByRowCol","l","compactItem","push","indexOf","moved","getFirstCollision","correctBounds","bounds","collidesWith","cols","getLayoutItem","layoutItem","getAllCollisions","moveElement","isUserAction","movingUp","undefined","reverse","collisions","collision","moveElementAwayFromCollision","itemToMove","fakeItem","Math","perc","num","setTransform","style","coords","replace","transform","WebkitTransform","MozTransform","msTransform","OTransform","concat","sort","a","b","synchronizeLayoutWithChildren","initialLayout","children","Array","isArray","child","exists","key","g","props","_grid","validateLayout","min","contextName","subProps","Error","j","ToObject","val","TypeError","Object","target","source","from","keys","to","s","arguments","deepEqual","PureDeepRenderMixin","shouldComponentUpdate","nextProps","nextState","state","_objectWithoutProperties","prototype","hasOwnProperty","_extends","React","GridItem","WidthListeningMixin","ReactGridLayout","createClass","displayName","mixins","propTypes","autoSize","PropTypes","bool","number","draggableCancel","string","draggableHandle","propName","componentName","layouts","margin","array","rowHeight","isDraggable","isResizable","useCSSTransforms","onLayoutChange","func","onDragStart","onDrag","onDragStop","onResizeStart","onResize","onResizeStop","node","apply","Children","forEach","list","getDefaultProps","getInitialState","activeDrag","isMounted","width","initialWidth","componentDidMount","setState","componentWillReceiveProps","onWidthChange","JSON","stringify","componentDidUpdate","prevProps","prevState","containerHeight","_ref","e","element","position","oldL","placeholder","size","createElement","isPlaceholder","className","containerWidth","processGridItem","draggable","resizable","moveOnStartChange","cancel","handle","usePercentages","render","_props","height","map","listenToWindowResize","window","addEventListener","onWindowResize","componentWillUnmount","removeEventListener","getDOMNode","offsetWidth","calcWH","_ref2","initialHeight","left","top","Draggable","PureRenderMixin","cloneElement","isRequired","handleSize","draggableOpts","object","constraintsToBounds","resizing","refs","resetState","mins","minConstraints","maxes","maxConstraints","Infinity","right","resizeHandler","handlerName","me","ref","onStop","onStart","shallowEqual","ReactComponentWithPureRenderMixin","constraintError","name","cloneWithProps","Resizable","minW","maxW","minH","maxH","calcPosition","calcXY","round","floor","createStyle","pos","mixinDraggable","start","onDragHandler","mixinResizable","maxWidth","onResizeHandler","_me$calcXY","console","log","_me$calcWH","join","responsiveUtils","ResponsiveReactGridLayout","breakpoint","breakpoints","k","onBreakpointChange","lg","md","sm","xs","xxs","getBreakpointFromWidth","getColsFromBreakpoint","findOrGenerateResponsiveLayout","newLayout","verticalLayout","newState","parse","sortBreakpoints","matching","breakpointName","lastBreakpoint","breakpointsSorted","breakpointsAbove","slice","isUndefinedOrNull","value","isBuffer","copy","objEquiv","opts","isArguments","pSlice","ka","objectKeys","kb","actual","expected","Date","getTime","strict","supported","toString","unsupported","propertyIsEnumerable","supportsArgumentsClass","shim","createUIEvent","_pendingState","clientY","clientX","canDragY","axis","canDragX","isFunction","findInArray","callback","matchesSelector","el","selector","method","getControlPosition","touches","addEvent","event","handler","attachEvent","removeEvent","detachEvent","outerHeight","clientHeight","computedStyle","getComputedStyle","int","borderTopWidth","borderBottomWidth","outerWidth","clientWidth","borderLeftWidth","borderRightWidth","innerHeight","paddingTop","paddingBottom","innerWidth","paddingLeft","paddingRight","isNum","isNaN","parseInt","getBoundPosition","parent","parentNode","nodeStyle","parentStyle","offsetLeft","marginLeft","offsetTop","marginTop","snapToGrid","grid","pendingX","pendingY","addUserSelectStyles","enableUserSelectHack","document","body","getAttribute","setAttribute","userSelectStyle","removeUserSelectStyles","createCSSTransform","emptyFunction","classNames","eventsFor","touch","move","end","mouse","dragEventFor","oneOf","oneOfType","shape","Number","arrayOf","zIndex","onMouseDown","newProps","handleDrag","handleDragEnd","NaN","dragging","offsetX","offsetY","handleDragStart","shouldStart","dragPoint","shouldUpdate","ev","preventDefault","onTouchStart","childStyle","touchHacks","touchAction","react-draggable-dragging","react-draggable-dragged","dragged","only","onMouseUp","onTouchEnd","arg","classes","substr","__WEBPACK_AMD_DEFINE_ARRAY__","__WEBPACK_AMD_DEFINE_RESULT__","_slicedToArray","arr","Symbol","iterator","_arr","_n","_d","_e","_s","_i","next","done","err","lockAspectRatio","aspectRatio","widthChanged","heightChanged","_preserveAspectRatio","preserveAspectRatio","_preserveAspectRatio2","ResizableBox","mergeProps","currentProps","childProps","extend","hasOwn","RESERVED","resolve","fn","src","joinClasses","version","split","parseFloat","MockLegacyFactory","constructor","ConvenienceConstructor","isReactLegacyFactory","type","objA","objB"],"mappings":"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","file":"react-grid-layout.min.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"React\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"React\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"ReactGridLayout\"] = factory(require(\"React\"));\n\telse\n\t\troot[\"ReactGridLayout\"] = factory(root[\"React\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {\nreturn \n\n\n/** WEBPACK FOOTER **\n ** webpack/universalModuleDefinition\n **/","(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"React\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"React\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"ReactGridLayout\"] = factory(require(\"React\"));\n\telse\n\t\troot[\"ReactGridLayout\"] = factory(root[\"React\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {\nreturn /******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId])\n/******/ \t\t\treturn installedModules[moduleId].exports;\n\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\texports: {},\n/******/ \t\t\tid: moduleId,\n/******/ \t\t\tloaded: false\n/******/ \t\t};\n\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.loaded = true;\n\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n\n\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"\";\n\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(0);\n/******/ })\n/************************************************************************/\n/******/ ([\n/* 0 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tmodule.exports = __webpack_require__(5);\n\tmodule.exports.Responsive = __webpack_require__(11);\n\n/***/ },\n/* 1 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tmodule.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n/***/ },\n/* 2 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar assign = __webpack_require__(3);\n\n\tvar utils = module.exports = {\n\n\t /**\n\t * Return the bottom coordinate of the layout.\n\t *\n\t * @param {Array} layout Layout array.\n\t * @return {Number} Bottom coordinate.\n\t */\n\t bottom: function bottom(layout) {\n\t var max = 0,\n\t bottomY;\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t bottomY = layout[i].y + layout[i].h;\n\t if (bottomY > max) max = bottomY;\n\t }\n\t return max;\n\t },\n\n\t /**\n\t * Clones a shallow object.\n\t * @param {Object} obj Object to clone.\n\t * @return {Object} Cloned object.\n\t */\n\t clone: function clone(obj) {\n\t return assign({}, obj);\n\t },\n\n\t /**\n\t * Given two layouts, check if they collide.\n\t *\n\t * @param {Object} l1 Layout object.\n\t * @param {Object} l2 Layout object.\n\t * @return {Boolean} True if colliding.\n\t */\n\t collides: function collides(l1, l2) {\n\t if (l1 === l2) {\n\t return false;\n\t } // same element\n\t if (l1.x + l1.w <= l2.x) {\n\t return false;\n\t } // l1 is left of l2\n\t if (l1.x >= l2.x + l2.w) {\n\t return false;\n\t } // l1 is right of l2\n\t if (l1.y + l1.h <= l2.y) {\n\t return false;\n\t } // l1 is above l2\n\t if (l1.y >= l2.y + l2.h) {\n\t return false;\n\t } // l1 is below l2\n\t return true; // boxes overlap\n\t },\n\n\t /**\n\t * Given a layout, compact it. This involves going down each y coordinate and removing gaps\n\t * between items.\n\t *\n\t * @param {Array} layout Layout.\n\t * @param {Boolean} verticalCompact Whether or not to compact the layout\n\t * vertically.\n\t * @return {Array} Compacted Layout.\n\t */\n\t compact: function compact(layout, verticalCompact) {\n\t // Statics go in the compareWith array right away so items flow around them.\n\t var compareWith = utils.getStatics(layout),\n\t out = [];\n\t // We go through the items by row and column.\n\t var sorted = utils.sortLayoutItemsByRowCol(layout);\n\n\t for (var i = 0, len = sorted.length; i < len; i++) {\n\t var l = sorted[i];\n\n\t // Don't move static elements\n\t if (!l['static']) {\n\t l = utils.compactItem(compareWith, l, verticalCompact);\n\n\t // Add to comparison array. We only collide with items before this one.\n\t // Statics are already in this array.\n\t compareWith.push(l);\n\t }\n\n\t // Add to output array to make sure they still come out in the right order.\n\t out[layout.indexOf(l)] = l;\n\n\t // Clear moved flag, if it exists.\n\t delete l.moved;\n\t }\n\n\t return out;\n\t },\n\n\t compactItem: function compactItem(compareWith, l, verticalCompact) {\n\t if (verticalCompact) {\n\t // Move the element up as far as it can go without colliding.\n\t while (l.y > 0 && !utils.getFirstCollision(compareWith, l)) {\n\t l.y--;\n\t }\n\t }\n\n\t // Move it down, and keep moving it down if it's colliding.\n\t var collides;\n\t while (collides = utils.getFirstCollision(compareWith, l)) {\n\t l.y = collides.y + collides.h;\n\t }\n\t return l;\n\t },\n\n\t /**\n\t * Given a layout, make sure all elements fit within its bounds.\n\t *\n\t * @param {Array} layout Layout array.\n\t * @param {Number} bounds Number of columns.\n\t * @return {[type]} [description]\n\t */\n\t correctBounds: function correctBounds(layout, bounds) {\n\t var collidesWith = utils.getStatics(layout);\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t var l = layout[i];\n\t // Overflows right\n\t if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w;\n\t // Overflows left\n\t if (l.x < 0) {\n\t l.x = 0;\n\t l.w = bounds.cols;\n\t }\n\t if (!l['static']) collidesWith.push(l);else {\n\t // If this is static and collides with other statics, we must move it down.\n\t // We have to do something nicer than just letting them overlap.\n\t while (utils.getFirstCollision(collidesWith, l)) {\n\t l.y++;\n\t }\n\t }\n\t }\n\t return layout;\n\t },\n\n\t /**\n\t * Get a layout item by ID. Used so we can override later on if necessary.\n\t *\n\t * @param {Array} layout Layout array.\n\t * @param {Number} id ID\n\t * @return {LayoutItem} Item at ID.\n\t */\n\t getLayoutItem: function getLayoutItem(layout, id) {\n\t id = '' + id;\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if ('' + layout[i].i === id) {\n\t return layout[i];\n\t }\n\t }\n\t },\n\n\t /**\n\t * Returns the first item this layout collides with.\n\t * It doesn't appear to matter which order we approach this from, although\n\t * perhaps that is the wrong thing to do.\n\t *\n\t * @param {Object} layoutItem Layout item.\n\t * @return {Object|undefined} A colliding layout item, or undefined.\n\t */\n\t getFirstCollision: function getFirstCollision(layout, layoutItem) {\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if (utils.collides(layout[i], layoutItem)) {\n\t return layout[i];\n\t }\n\t }\n\t },\n\n\t getAllCollisions: function getAllCollisions(layout, layoutItem) {\n\t var out = [];\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if (utils.collides(layout[i], layoutItem)) out.push(layout[i]);\n\t }\n\t return out;\n\t },\n\n\t /**\n\t * Get all static elements.\n\t * @param {Array} layout Array of layout objects.\n\t * @return {Array} Array of static layout items..\n\t */\n\t getStatics: function getStatics(layout) {\n\t var out = [];\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t if (layout[i]['static']) out.push(layout[i]);\n\t }\n\t return out;\n\t },\n\n\t /**\n\t * Move an element. Responsible for doing cascading movements of other elements.\n\t *\n\t * @param {Array} layout Full layout to modify.\n\t * @param {LayoutItem} l element to move.\n\t * @param {Number} [x] X position in grid units.\n\t * @param {Number} [y] Y position in grid units.\n\t * @param {Boolean} [isUserAction] If true, designates that the item we're moving is\n\t * being dragged/resized by th euser.\n\t */\n\t moveElement: function moveElement(layout, l, x, y, isUserAction) {\n\t if (l['static']) {\n\t return layout;\n\t } // Short-circuit if nothing to do.\n\t if (l.y === y && l.x === x) {\n\t return layout;\n\t }var movingUp = l.y > y;\n\t // This is quite a bit faster than extending the object\n\t if (x !== undefined) l.x = x;\n\t if (y !== undefined) l.y = y;\n\t l.moved = true;\n\n\t // If this collides with anything, move it.\n\t // When doing this comparison, we have to sort the items we compare with\n\t // to ensure, in the case of multiple collisions, that we're getting the\n\t // nearest collision.\n\t var sorted = utils.sortLayoutItemsByRowCol(layout);\n\t if (movingUp) sorted = sorted.reverse();\n\t var collisions = utils.getAllCollisions(sorted, l);\n\n\t // Move each item that collides away from this element.\n\t for (var i = 0, len = collisions.length; i < len; i++) {\n\t var collision = collisions[i];\n\t // console.log('resolving collision between', l.i, 'at', l.y, 'and', collision.i, 'at', collision.y);\n\n\t // Short circuit so we can't infinite loop\n\t if (collision.moved) continue;\n\n\t // This makes it feel a bit more precise by waiting to swap for just a bit when moving up.\n\t if (l.y > collision.y && l.y - collision.y > collision.h / 4) continue;\n\n\t // Don't move static items - we have to move *this* element away\n\t if (collision['static']) {\n\t layout = utils.moveElementAwayFromCollision(layout, collision, l, isUserAction);\n\t } else {\n\t layout = utils.moveElementAwayFromCollision(layout, l, collision, isUserAction);\n\t }\n\t }\n\n\t return layout;\n\t },\n\n\t /**\n\t * This is where the magic needs to happen - given a collision, move an element away from the collision.\n\t * We attempt to move it up if there's room, otherwise it goes below.\n\t *\n\t * @param {Array} layout Full layout to modify.\n\t * @param {LayoutItem} collidesWith Layout item we're colliding with.\n\t * @param {LayoutItem} itemToMove Layout item we're moving.\n\t * @param {Boolean} [isUserAction] If true, designates that the item we're moving is being dragged/resized\n\t * by the user.\n\t */\n\t moveElementAwayFromCollision: function moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAction) {\n\n\t // If there is enough space above the collision to put this element, move it there.\n\t // We only do this on the main collision as this can get funky in cascades and cause\n\t // unwanted swapping behavior.\n\t if (isUserAction) {\n\t // Make a mock item so we don't modify the item here, only modify in moveElement.\n\t var fakeItem = {\n\t x: itemToMove.x,\n\t y: itemToMove.y,\n\t w: itemToMove.w,\n\t h: itemToMove.h\n\t };\n\t fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0);\n\t if (!utils.getFirstCollision(layout, fakeItem)) {\n\t return utils.moveElement(layout, itemToMove, undefined, fakeItem.y);\n\t }\n\t }\n\n\t // Previously this was optimized to move below the collision directly, but this can cause problems\n\t // with cascading moves, as an item may actually leapflog a collision and cause a reversal in order.\n\t return utils.moveElement(layout, itemToMove, undefined, itemToMove.y + 1);\n\t },\n\n\t /**\n\t * Helper to convert a number to a percentage string.\n\t *\n\t * @param {Number} num Any number\n\t * @return {String} That number as a percentage.\n\t */\n\t perc: function perc(num) {\n\t return num * 100 + '%';\n\t },\n\n\t setTransform: function setTransform(style, coords) {\n\t // Replace unitless items with px\n\t var x = ('' + coords[0]).replace(/(\\d)$/, '$1px');\n\t var y = ('' + coords[1]).replace(/(\\d)$/, '$1px');\n\t style.transform = 'translate(' + x + ',' + y + ')';\n\t style.WebkitTransform = 'translate(' + x + ',' + y + ')';\n\t style.MozTransform = 'translate(' + x + ',' + y + ')';\n\t style.msTransform = 'translate(' + x + ',' + y + ')';\n\t style.OTransform = 'translate(' + x + ',' + y + ')';\n\t return style;\n\t },\n\n\t /**\n\t * Get layout items sorted from top left to right and down.\n\t *\n\t * @return {Array} Array of layout objects.\n\t * @return {Array} Layout, sorted static items first.\n\t */\n\t sortLayoutItemsByRowCol: function sortLayoutItemsByRowCol(layout) {\n\t return [].concat(layout).sort(function (a, b) {\n\t if (a.y > b.y || a.y === b.y && a.x > b.x) {\n\t return 1;\n\t }\n\t return -1;\n\t });\n\t },\n\n\t /**\n\t * Generate a layout using the initialLayout and children as a template.\n\t * Missing entries will be added, extraneous ones will be truncated.\n\t *\n\t * @param {Array} initialLayout Layout passed in through props.\n\t * @param {String} breakpoint Current responsive breakpoint.\n\t * @param {Boolean} verticalCompact Whether or not to compact the layout\n\t * vertically.\n\t * @return {Array} Working layout.\n\t */\n\t synchronizeLayoutWithChildren: function synchronizeLayoutWithChildren(initialLayout, children, cols, verticalCompact) {\n\t // ensure 'children' is always an array\n\t if (!Array.isArray(children)) {\n\t children = [children];\n\t }\n\t initialLayout = initialLayout || [];\n\n\t // Generate one layout item per child.\n\t var layout = [];\n\t for (var i = 0, len = children.length; i < len; i++) {\n\t var child = children[i];\n\t // Don't overwrite if it already exists.\n\t var exists = utils.getLayoutItem(initialLayout, child.key);\n\t if (exists) {\n\t // Ensure 'i' is always a string\n\t exists.i = '' + exists.i;\n\t layout.push(exists);\n\t continue;\n\t }\n\t // New item: attempt to use a layout item from the child, if it exists.\n\t var g = child.props._grid;\n\t if (g) {\n\t utils.validateLayout([g], 'ReactGridLayout.child');\n\t // Validated; add it to the layout. Bottom 'y' possible is the bottom of the layout.\n\t // This allows you to do nice stuff like specify {y: Infinity}\n\t if (verticalCompact) {\n\t layout.push(assign({}, g, { y: Math.min(utils.bottom(layout), g.y), i: child.key }));\n\t } else {\n\t layout.push(assign({}, g, { y: g.y, i: child.key }));\n\t }\n\t } else {\n\t // Nothing provided: ensure this is added to the bottom\n\t layout.push({ w: 1, h: 1, x: 0, y: utils.bottom(layout), i: child.key });\n\t }\n\t }\n\n\t // Correct the layout.\n\t layout = utils.correctBounds(layout, { cols: cols });\n\t layout = utils.compact(layout, verticalCompact);\n\n\t return layout;\n\t },\n\n\t /**\n\t * Validate a layout. Throws errors.\n\t *\n\t * @param {Array} layout Array of layout items.\n\t * @param {String} [contextName] Context name for errors.\n\t * @throw {Error} Validation error.\n\t */\n\t validateLayout: function validateLayout(layout, contextName) {\n\t contextName = contextName || 'Layout';\n\t var subProps = ['x', 'y', 'w', 'h'];\n\t if (!Array.isArray(layout)) throw new Error(contextName + ' must be an array!');\n\t for (var i = 0, len = layout.length; i < len; i++) {\n\t for (var j = 0; j < subProps.length; j++) {\n\t if (typeof layout[i][subProps[j]] !== 'number') {\n\t throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].' + subProps[j] + ' must be a Number!');\n\t }\n\t }\n\t if (layout[i]['static'] !== undefined && typeof layout[i]['static'] !== 'boolean') {\n\t throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].static must be a Boolean!');\n\t }\n\t }\n\t }\n\t};\n\n/***/ },\n/* 3 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tfunction ToObject(val) {\n\t\tif (val == null) {\n\t\t\tthrow new TypeError('Object.assign cannot be called with null or undefined');\n\t\t}\n\n\t\treturn Object(val);\n\t}\n\n\tmodule.exports = Object.assign || function (target, source) {\n\t\tvar from;\n\t\tvar keys;\n\t\tvar to = ToObject(target);\n\n\t\tfor (var s = 1; s < arguments.length; s++) {\n\t\t\tfrom = arguments[s];\n\t\t\tkeys = Object.keys(Object(from));\n\n\t\t\tfor (var i = 0; i < keys.length; i++) {\n\t\t\t\tto[keys[i]] = from[keys[i]];\n\t\t\t}\n\t\t}\n\n\t\treturn to;\n\t};\n\n\n/***/ },\n/* 4 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tvar deepEqual = __webpack_require__(13);\n\n\t// Like PureRenderMixin, but with deep comparisons.\n\tvar PureDeepRenderMixin = {\n\t shouldComponentUpdate: function shouldComponentUpdate(nextProps, nextState) {\n\t return !deepEqual(this.props, nextProps) || !deepEqual(this.state, nextState);\n\t }\n\t};\n\n\tmodule.exports = PureDeepRenderMixin;\n\n/***/ },\n/* 5 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar GridItem = __webpack_require__(10);\n\tvar utils = __webpack_require__(2);\n\tvar PureDeepRenderMixin = __webpack_require__(4);\n\tvar WidthListeningMixin = __webpack_require__(6);\n\n\t/**\n\t * A reactive, fluid grid layout with draggable, resizable components.\n\t */\n\tvar ReactGridLayout = React.createClass({\n\t displayName: 'ReactGridLayout',\n\n\t mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n\t propTypes: {\n\t //\n\t // Basic props\n\t //\n\n\t // If true, the container height swells and contracts to fit contents\n\t autoSize: React.PropTypes.bool,\n\t // # of cols.\n\t cols: React.PropTypes.number,\n\n\t // A selector that will not be draggable.\n\t draggableCancel: React.PropTypes.string,\n\t // A selector for the draggable handler\n\t draggableHandle: React.PropTypes.string,\n\n\t // If true, the layout will compact vertically\n\t verticalCompact: React.PropTypes.bool,\n\n\t // layout is an array of object with the format:\n\t // {x: Number, y: Number, w: Number, h: Number, i: Number}\n\t layout: function layout(props, propName, componentName) {\n\t var layout = props.layout;\n\t // I hope you're setting the _grid property on the grid items\n\t if (layout === undefined) {\n\t return;\n\t }utils.validateLayout(layout, 'layout');\n\t },\n\n\t layouts: function layouts(props, propName, componentName) {\n\t if (props.layouts) {\n\t throw new Error('ReactGridLayout does not use `layouts`: Use ReactGridLayout.Responsive.');\n\t }\n\t },\n\n\t // margin between items [x, y] in px\n\t margin: React.PropTypes.array,\n\t // Rows have a static height, but you can change this based on breakpoints if you like\n\t rowHeight: React.PropTypes.number,\n\n\t //\n\t // Flags\n\t //\n\t isDraggable: React.PropTypes.bool,\n\t isResizable: React.PropTypes.bool,\n\t // Use CSS transforms instead of top/left\n\t useCSSTransforms: React.PropTypes.bool,\n\n\t //\n\t // Callbacks\n\t //\n\n\t // Callback so you can save the layout.\n\t // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n\t onLayoutChange: React.PropTypes.func,\n\n\t // Calls when drag starts. Callback is of the signature (layout, oldItem, newItem, placeholder, e).\n\t // All callbacks below have the same signature. 'start' and 'stop' callbacks omit the 'placeholder'.\n\t onDragStart: React.PropTypes.func,\n\t // Calls on each drag movement.\n\t onDrag: React.PropTypes.func,\n\t // Calls when drag is complete.\n\t onDragStop: React.PropTypes.func,\n\t //Calls when resize starts.\n\t onResizeStart: React.PropTypes.func,\n\t // Calls when resize movement happens.\n\t onResize: React.PropTypes.func,\n\t // Calls when resize is complete.\n\t onResizeStop: React.PropTypes.func,\n\n\t //\n\t // Other validations\n\t //\n\n\t // Children must not have duplicate keys.\n\t children: function children(props, propName, componentName) {\n\t React.PropTypes.node.apply(this, arguments);\n\t var children = props[propName];\n\n\t // Check children keys for duplicates. Throw if found.\n\t var keys = {};\n\t React.Children.forEach(children, function (child, i, list) {\n\t if (keys[child.key]) {\n\t throw new Error('Duplicate child key found! This will cause problems in ReactGridLayout.');\n\t }\n\t keys[child.key] = true;\n\t });\n\t }\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t autoSize: true,\n\t cols: 12,\n\t rowHeight: 150,\n\t layout: [],\n\t margin: [10, 10],\n\t isDraggable: true,\n\t isResizable: true,\n\t useCSSTransforms: true,\n\t verticalCompact: true,\n\t onLayoutChange: function onLayoutChange() {},\n\t onDragStart: function onDragStart() {},\n\t onDrag: function onDrag() {},\n\t onDragStop: function onDragStop() {},\n\t onResizeStart: function onResizeStart() {},\n\t onResize: function onResize() {},\n\t onResizeStop: function onResizeStop() {}\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t activeDrag: null,\n\t isMounted: false,\n\t layout: utils.synchronizeLayoutWithChildren(this.props.layout, this.props.children, this.props.cols, this.props.verticalCompact),\n\t width: this.props.initialWidth\n\t };\n\t },\n\n\t componentDidMount: function componentDidMount() {\n\t // Call back with layout on mount. This should be done after correcting the layout width\n\t // to ensure we don't rerender with the wrong width.\n\t this.props.onLayoutChange(this.state.layout);\n\t this.setState({ isMounted: true });\n\t },\n\n\t componentWillReceiveProps: function componentWillReceiveProps(nextProps) {\n\t // This allows you to set the width manually if you like.\n\t // Use manual width changes in combination with `listenToWindowResize: false`\n\t if (nextProps.width !== this.props.width) this.onWidthChange(nextProps.width);\n\n\t // If children change, regenerate the layout.\n\t if (nextProps.children.length !== this.props.children.length) {\n\t this.setState({\n\t layout: utils.synchronizeLayoutWithChildren(this.state.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n\t });\n\t }\n\n\t // Allow parent to set layout directly.\n\t if (nextProps.layout && JSON.stringify(nextProps.layout) !== JSON.stringify(this.state.layout)) {\n\t this.setState({\n\t layout: utils.synchronizeLayoutWithChildren(nextProps.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n\t });\n\t }\n\t },\n\n\t componentDidUpdate: function componentDidUpdate(prevProps, prevState) {\n\t // Call back so we can store the layout\n\t // Do it only when a resize/drag is not active, otherwise there are way too many callbacks\n\t if (this.state.layout !== prevState.layout && !this.state.activeDrag) {\n\t this.props.onLayoutChange(this.state.layout, this.state.layouts);\n\t }\n\t },\n\n\t /**\n\t * Calculates a pixel value for the container.\n\t * @return {String} Container height in pixels.\n\t */\n\t containerHeight: function containerHeight() {\n\t if (!this.props.autoSize) {\n\t return;\n\t }return utils.bottom(this.state.layout) * this.props.rowHeight + this.props.margin[1] + 'px';\n\t },\n\n\t /**\n\t * When the width changes, save it to state. This helps with left/width calculations.\n\t */\n\t onWidthChange: function onWidthChange(width) {\n\t this.setState({ width: width });\n\t },\n\n\t /**\n\t * When dragging starts\n\t * @param {Number} i Index of the child\n\t * @param {Number} x X position of the move\n\t * @param {Number} y Y position of the move\n\t * @param {Event} e The mousedown event\n\t * @param {Element} element The current dragging DOM element\n\t * @param {Object} position Drag information\n\t */\n\t onDragStart: function onDragStart(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\n\t // No need to clone, `l` hasn't changed.\n\t this.props.onDragStart(layout, l, l, null, e);\n\t },\n\t /**\n\t * Each drag movement create a new dragelement and move the element to the dragged location\n\t * @param {Number} i Index of the child\n\t * @param {Number} x X position of the move\n\t * @param {Number} y Y position of the move\n\t * @param {Event} e The mousedown event\n\t * @param {Element} element The current dragging DOM element\n\t * @param {Object} position Drag information\n\t */\n\t onDrag: function onDrag(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t // Clone layout item so we can pass it to the callback.\n\t var oldL = utils.clone(l);\n\n\t // Create placeholder (display only)\n\t var placeholder = {\n\t w: l.w, h: l.h, x: l.x, y: l.y, placeholder: true, i: i\n\t };\n\n\t // Move the element to the dragged location.\n\t layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n\t this.props.onDrag(layout, oldL, l, placeholder, e);\n\n\t this.setState({\n\t layout: utils.compact(layout, this.props.verticalCompact),\n\t activeDrag: placeholder\n\t });\n\t },\n\n\t /**\n\t * When dragging stops, figure out which position the element is closest to and update its x and y.\n\t * @param {Number} i Index of the child.\n\t * @param {Number} i Index of the child\n\t * @param {Number} x X position of the move\n\t * @param {Number} y Y position of the move\n\t * @param {Event} e The mousedown event\n\t * @param {Element} element The current dragging DOM element\n\t * @param {Object} position Drag information\n\t */\n\t onDragStop: function onDragStop(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t var oldL = utils.clone(l);\n\n\t // Move the element here\n\t layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n\t this.props.onDragStop(layout, oldL, l, null, e);\n\n\t // Set state\n\t this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: null });\n\t },\n\n\t onResizeStart: function onResizeStart(i, w, h, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\n\t // No need to clone, item hasn't changed\n\t this.props.onResizeStart(layout, l, l, null, e);\n\t },\n\n\t onResize: function onResize(i, w, h, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t var oldL = utils.clone(l);\n\n\t // Set new width and height.\n\t l.w = w;\n\t l.h = h;\n\n\t // Create placeholder element (display only)\n\t var placeholder = {\n\t w: w, h: h, x: l.x, y: l.y, placeholder: true, i: i\n\t };\n\n\t this.props.onResize(layout, oldL, l, placeholder, e);\n\n\t // Re-compact the layout and set the drag placeholder.\n\t this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: placeholder });\n\t },\n\n\t onResizeStop: function onResizeStop(i, x, y, _ref) {\n\t var e = _ref.e;\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t var layout = this.state.layout;\n\t var l = utils.getLayoutItem(layout, i);\n\t var oldL = utils.clone(l);\n\n\t this.props.onResizeStop(layout, oldL, l, null, e);\n\n\t this.setState({ activeDrag: null, layout: utils.compact(layout, this.props.verticalCompact) });\n\t },\n\n\t /**\n\t * Create a placeholder object.\n\t * @return {Element} Placeholder div.\n\t */\n\t placeholder: function placeholder() {\n\t if (!this.state.activeDrag) {\n\t return '';\n\t } // {...this.state.activeDrag} is pretty slow, actually\n\t return React.createElement(\n\t GridItem,\n\t {\n\t w: this.state.activeDrag.w,\n\t h: this.state.activeDrag.h,\n\t x: this.state.activeDrag.x,\n\t y: this.state.activeDrag.y,\n\t i: this.state.activeDrag.i,\n\t isPlaceholder: true,\n\t className: 'react-grid-placeholder',\n\t containerWidth: this.state.width,\n\t cols: this.props.cols,\n\t margin: this.props.margin,\n\t rowHeight: this.props.rowHeight,\n\t isDraggable: false,\n\t isResizable: false,\n\t useCSSTransforms: this.props.useCSSTransforms\n\t },\n\t React.createElement('div', null)\n\t );\n\t },\n\n\t /**\n\t * Given a grid item, set its style attributes & surround in a .\n\t * @param {Element} child React element.\n\t * @param {Number} i Index of element.\n\t * @return {Element} Element wrapped in draggable and properly placed.\n\t */\n\t processGridItem: function processGridItem(child) {\n\t var i = child.key;\n\t var l = utils.getLayoutItem(this.state.layout, i);\n\n\t // watchStart property tells Draggable to react to changes in the start param\n\t // Must be turned off on the item we're dragging as the changes in `activeDrag` cause rerenders\n\t var moveOnStartChange = !(this.state.activeDrag && this.state.activeDrag.i === i);\n\n\t // Parse 'static'. Any properties defined directly on the grid item will take precedence.\n\t var draggable, resizable;\n\t if (l['static'] || this.props.isDraggable === false) draggable = false;\n\t if (l['static'] || this.props.isResizable === false) resizable = false;\n\n\t return React.createElement(\n\t GridItem,\n\t _extends({\n\t containerWidth: this.state.width,\n\t cols: this.props.cols,\n\t margin: this.props.margin,\n\t rowHeight: this.props.rowHeight,\n\t moveOnStartChange: moveOnStartChange,\n\t cancel: this.props.draggableCancel,\n\t handle: this.props.draggableHandle,\n\t onDragStop: this.onDragStop,\n\t onDragStart: this.onDragStart,\n\t onDrag: this.onDrag,\n\t onResizeStart: this.onResizeStart,\n\t onResize: this.onResize,\n\t onResizeStop: this.onResizeStop,\n\t isDraggable: draggable,\n\t isResizable: resizable,\n\t useCSSTransforms: this.props.useCSSTransforms && this.state.isMounted,\n\t usePercentages: !this.state.isMounted\n\t }, l),\n\t child\n\t );\n\t },\n\n\t render: function render() {\n\t // Calculate classname\n\t var _props = this.props;\n\t var className = _props.className;\n\n\t var props = _objectWithoutProperties(_props, ['className']);\n\n\t className = 'react-grid-layout ' + (className || '');\n\n\t return React.createElement(\n\t 'div',\n\t _extends({}, props, { className: className, style: { height: this.containerHeight() } }),\n\t React.Children.map(this.props.children, this.processGridItem),\n\t this.placeholder()\n\t );\n\t }\n\t});\n\n\tmodule.exports = ReactGridLayout;\n\n/***/ },\n/* 6 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tvar React = __webpack_require__(1);\n\n\t/**\n\t * A simple mixin that provides facility for listening to container resizes.\n\t */\n\tvar WidthListeningMixin = {\n\n\t propTypes: {\n\t // This allows setting this on the server side\n\t initialWidth: React.PropTypes.number,\n\n\t // If false, you should supply width yourself. Good if you want to debounce resize events\n\t // or reuse a handler from somewhere else.\n\t listenToWindowResize: React.PropTypes.bool\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t initialWidth: 1280,\n\t listenToWindowResize: true\n\t };\n\t },\n\n\t componentDidMount: function componentDidMount() {\n\t if (this.props.listenToWindowResize) {\n\t window.addEventListener('resize', this.onWindowResize);\n\t // This is intentional. Once to properly set the breakpoint and resize the elements,\n\t // and again to compensate for any scrollbar that appeared because of the first step.\n\t this.onWindowResize();\n\t this.onWindowResize();\n\t }\n\t },\n\n\t componentWillUnmount: function componentWillUnmount() {\n\t window.removeEventListener('resize', this.onWindowResize);\n\t },\n\n\t /**\n\t * On window resize, update width.\n\t */\n\t onWindowResize: function onWindowResize() {\n\t this.onWidthChange(this.getDOMNode().offsetWidth);\n\t }\n\n\t};\n\n\tmodule.exports = WidthListeningMixin;\n\n/***/ },\n/* 7 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tmodule.exports = __webpack_require__(16);\n\n\n/***/ },\n/* 8 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar Draggable = __webpack_require__(7);\n\tvar PureRenderMixin = __webpack_require__(9);\n\tvar assign = __webpack_require__(3);\n\tvar cloneElement = __webpack_require__(19);\n\n\tvar Resizable = module.exports = React.createClass({\n\t displayName: 'Resizable',\n\t mixins: [PureRenderMixin],\n\n\t propTypes: {\n\t // Require that one and only one child be present.\n\t children: React.PropTypes.element.isRequired,\n\t // Functions\n\t onResizeStop: React.PropTypes.func,\n\t onResizeStart: React.PropTypes.func,\n\t onResize: React.PropTypes.func,\n\n\t width: React.PropTypes.number.isRequired,\n\t height: React.PropTypes.number.isRequired,\n\t // If you change this, be sure to update your css\n\t handleSize: React.PropTypes.array,\n\t // These will be passed wholesale to react-draggable\n\t draggableOpts: React.PropTypes.object\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t handleSize: [20, 20]\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t bounds: this.constraintsToBounds(),\n\t initialWidth: this.props.width,\n\t initialHeight: this.props.height\n\t };\n\t },\n\n\t componentWillReceiveProps: function componentWillReceiveProps(props) {\n\t if (!this.state.resizing) {\n\t this.setState({\n\t initialWidth: props.width,\n\t initialHeight: props.height\n\t });\n\t this.refs.draggable.resetState();\n\t }\n\t },\n\n\t constraintsToBounds: function constraintsToBounds() {\n\t var p = this.props;\n\t var mins = p.minConstraints || p.handleSize;\n\t var maxes = p.maxConstraints || [Infinity, Infinity];\n\t return {\n\t left: mins[0] - p.width,\n\t top: mins[1] - p.height,\n\t right: maxes[0] - p.width,\n\t bottom: maxes[1] - p.height\n\t };\n\t },\n\n\t /**\n\t * Wrapper around drag events to provide more useful data.\n\t *\n\t * @param {String} handlerName Handler name to wrap.\n\t * @return {Function} Handler function.\n\t */\n\t resizeHandler: function resizeHandler(handlerName) {\n\t var me = this;\n\t return function (e, _ref) {\n\t var node = _ref.node;\n\t var position = _ref.position;\n\n\t me.props[handlerName] && me.props[handlerName](e, { node: node, size: calcWH(me.state, position) });\n\n\t if (handlerName === 'onResizeStart') {\n\t me.setState({ resizing: true });\n\t } else if (handlerName === 'onResizeStop') {\n\t me.setState({ resizing: false });\n\t }\n\t };\n\t },\n\n\t render: function render() {\n\t var p = this.props,\n\t s = this.state;\n\n\t // What we're doing here is getting the child of this element, and cloning it with this element's props.\n\t // We are then defining its children as:\n\t // Its original children (resizable's child's children), and\n\t // A draggable handle.\n\t return cloneElement(p.children, assign({}, p, {\n\t children: [p.children.props.children, React.createElement(\n\t Draggable,\n\t _extends({}, p.draggableOpts, {\n\t ref: 'draggable',\n\t onStop: this.resizeHandler('onResizeStop'),\n\t onStart: this.resizeHandler('onResizeStart'),\n\t onDrag: this.resizeHandler('onResize'),\n\t bounds: this.state.bounds\n\t }),\n\t React.createElement('span', { className: 'react-resizable-handle' })\n\t )]\n\t }));\n\t }\n\t});\n\n\t/**\n\t * Parse left and top coordinates.\n\t * @param {Number} options.left Left coordinate.\n\t * @param {Number} options.top Top coordinate.\n\t * @return {Object} Coordinates\n\t */\n\tfunction calcWH(_ref, _ref2) {\n\t var initialWidth = _ref.initialWidth;\n\t var initialHeight = _ref.initialHeight;\n\t var left = _ref2.left;\n\t var top = _ref2.top;\n\n\t return { width: initialWidth + left, height: initialHeight + top };\n\t}\n\n/***/ },\n/* 9 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t/**\n\t * Copyright 2013-2015, Facebook, Inc.\n\t * All rights reserved.\n\t *\n\t * This source code is licensed under the BSD-style license found in the\n\t * LICENSE file in the root directory of this source tree. An additional grant\n\t * of patent rights can be found in the PATENTS file in the same directory.\n\t *\n\t* @providesModule ReactComponentWithPureRenderMixin\n\t*/\n\n\t'use strict';\n\n\tvar shallowEqual = __webpack_require__(22);\n\n\t/**\n\t * If your React component's render function is \"pure\", e.g. it will render the\n\t * same result given the same props and state, provide this Mixin for a\n\t * considerable performance boost.\n\t *\n\t * Most React components have pure render functions.\n\t *\n\t * Example:\n\t *\n\t * var ReactComponentWithPureRenderMixin =\n\t * require('ReactComponentWithPureRenderMixin');\n\t * React.createClass({\n\t * mixins: [ReactComponentWithPureRenderMixin],\n\t *\n\t * render: function() {\n\t * return
foo
;\n\t * }\n\t * });\n\t *\n\t * Note: This only checks shallow equality for props and state. If these contain\n\t * complex data structures this mixin may have false-negatives for deeper\n\t * differences. Only mixin to components which have simple props and state, or\n\t * use `forceUpdate()` when you know deep data structures have changed.\n\t */\n\tvar ReactComponentWithPureRenderMixin = {\n\t shouldComponentUpdate: function(nextProps, nextState) {\n\t return !shallowEqual(this.props, nextProps) ||\n\t !shallowEqual(this.state, nextState);\n\t }\n\t};\n\n\tmodule.exports = ReactComponentWithPureRenderMixin;\n\n\n/***/ },\n/* 10 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tvar React = __webpack_require__(1);\n\tvar cloneWithProps = __webpack_require__(21);\n\tvar utils = __webpack_require__(2);\n\tvar Draggable = __webpack_require__(7);\n\tvar Resizable = __webpack_require__(20).Resizable;\n\tvar PureDeepRenderMixin = __webpack_require__(4);\n\n\t/**\n\t * An individual item within a ReactGridLayout.\n\t */\n\tvar GridItem = React.createClass({\n\t displayName: 'GridItem',\n\n\t mixins: [PureDeepRenderMixin],\n\n\t propTypes: {\n\t // Children must be only a single element\n\t children: React.PropTypes.element,\n\n\t // General grid attributes\n\t cols: React.PropTypes.number.isRequired,\n\t containerWidth: React.PropTypes.number.isRequired,\n\t rowHeight: React.PropTypes.number.isRequired,\n\t margin: React.PropTypes.array.isRequired,\n\n\t // These are all in grid units\n\t x: React.PropTypes.number.isRequired,\n\t y: React.PropTypes.number.isRequired,\n\t w: React.PropTypes.number.isRequired,\n\t h: React.PropTypes.number.isRequired,\n\n\t // All optional\n\t minW: function minW(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.minW > props.w || props.minW > props.maxW) constraintError('minW', props);\n\t },\n\t maxW: function maxW(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.maxW < props.w || props.maxW < props.minW) constraintError('maxW', props);\n\t },\n\t minH: function minH(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.minH > props.h || props.minH > props.maxH) constraintError('minH', props);\n\t },\n\t maxH: function maxH(props, propName, componentName) {\n\t React.PropTypes.number.apply(this, arguments);\n\t if (props.maxH < props.h || props.maxH < props.minH) constraintError('maxH', props);\n\t },\n\n\t // ID is nice to have for callbacks\n\t i: React.PropTypes.string.isRequired,\n\n\t // If true, item will be repositioned when x/y/w/h change\n\t moveOnStartChange: React.PropTypes.bool,\n\n\t // Functions\n\t onDragStop: React.PropTypes.func,\n\t onDragStart: React.PropTypes.func,\n\t onDrag: React.PropTypes.func,\n\t onResizeStop: React.PropTypes.func,\n\t onResizeStart: React.PropTypes.func,\n\t onResize: React.PropTypes.func,\n\n\t // Flags\n\t isDraggable: React.PropTypes.bool,\n\t isResizable: React.PropTypes.bool,\n\t // Use CSS transforms instead of top/left\n\t useCSSTransforms: React.PropTypes.bool,\n\t isPlaceholder: React.PropTypes.bool,\n\n\t // Others\n\t className: React.PropTypes.string,\n\t // Selector for draggable handle\n\t handle: React.PropTypes.string,\n\t // Selector for draggable cancel (see react-draggable)\n\t cancel: React.PropTypes.string\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t isDraggable: true,\n\t isResizable: true,\n\t useCSSTransforms: true,\n\t className: '',\n\t cancel: '',\n\t minH: 1,\n\t minW: 1,\n\t maxH: Infinity,\n\t maxW: Infinity\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t resizing: false,\n\t className: ''\n\t };\n\t },\n\n\t /**\n\t * Return position on the page given an x, y, w, h.\n\t * left, top, width, height are all in pixels.\n\t * @param {Number} x X coordinate in grid units.\n\t * @param {Number} y Y coordinate in grid units.\n\t * @param {Number} w W coordinate in grid units.\n\t * @param {Number} h H coordinate in grid units.\n\t * @return {Object} Object containing coords.\n\t */\n\t calcPosition: function calcPosition(x, y, w, h) {\n\t var p = this.props;\n\t var width = p.containerWidth - p.margin[0];\n\t var out = {\n\t left: width * (x / p.cols) + p.margin[0],\n\t top: p.rowHeight * y + p.margin[1],\n\t width: width * (w / p.cols) - p.margin[0],\n\t height: h * p.rowHeight - p.margin[1]\n\t };\n\t return out;\n\t },\n\n\t /**\n\t * Translate x and y coordinates from pixels to grid units.\n\t * @param {Number} options.left Left offset in pixels.\n\t * @param {Number} options.top Top offset in pixels.\n\t * @return {Object} x and y in grid units.\n\t */\n\t calcXY: function calcXY(_ref) {\n\t var left = _ref.left;\n\t var top = _ref.top;\n\n\t left = left - this.props.margin[0];\n\t top = top - this.props.margin[1];\n\t // This is intentional; because so much of the logic on moving boxes up/down relies\n\t // on an exact y position, we only round the x, not the y.\n\t var x = Math.round(left / this.props.containerWidth * this.props.cols);\n\t var y = Math.floor(top / this.props.rowHeight);\n\t x = Math.max(Math.min(x, this.props.cols), 0);\n\t y = Math.max(y, 0);\n\t return { x: x, y: y };\n\t },\n\n\t /**\n\t * Given a height and width in pixel values, calculate grid units.\n\t * @param {Number} options.height Height in pixels.\n\t * @param {Number} options.width Width in pixels.\n\t * @return {Object} w, h as grid units.\n\t */\n\t calcWH: function calcWH(_ref) {\n\t var height = _ref.height;\n\t var width = _ref.width;\n\n\t width = width + this.props.margin[0];\n\t height = height + this.props.margin[1];\n\t var w = Math.round(width / this.props.containerWidth * this.props.cols);\n\t var h = Math.round(height / this.props.rowHeight);\n\t w = Math.max(Math.min(w, this.props.cols - this.props.x), 0);\n\t h = Math.max(h, 0);\n\t return { w: w, h: h };\n\t },\n\n\t /**\n\t * This is where we set the grid item's absolute placement. It gets a little tricky because we want to do it\n\t * well when server rendering, and the only way to do that properly is to use percentage width/left because\n\t * we don't know exactly what the browser viewport is.\n\t * Unfortunately, CSS Transforms, which are great for performance, break in this instance because a percentage\n\t * left is relative to the item itself, not its container! So we cannot use them on the server rendering pass.\n\t *\n\t * @param {Object} pos Position object with width, height, left, top.\n\t * @return {Object} Style object.\n\t */\n\t createStyle: function createStyle(pos) {\n\t var style = {\n\t width: pos.width + 'px',\n\t height: pos.height + 'px',\n\t left: pos.left + 'px',\n\t top: pos.top + 'px',\n\t position: 'absolute'\n\t };\n\n\t // This is used for server rendering.\n\t if (this.props.usePercentages) {\n\t pos.left = utils.perc(pos.left / this.props.containerWidth);\n\t style.left = pos.left;\n\t style.width = utils.perc(pos.width / this.props.containerWidth);\n\t }\n\n\t // CSS Transforms support\n\t if (this.props.useCSSTransforms) {\n\t utils.setTransform(style, [pos.left, pos.top]);\n\t delete style.left;\n\t delete style.top;\n\t }\n\n\t return style;\n\t },\n\n\t /**\n\t * Mix a Draggable instance into a child.\n\t * @param {Element} child Child element.\n\t * @param {Object} position Position object (pixel values)\n\t * @return {Element} Child wrapped in Draggable.\n\t */\n\t mixinDraggable: function mixinDraggable(child, position) {\n\t var start = typeof position.left === 'string' ? undefined : { x: position.left, y: position.top };\n\t return React.createElement(\n\t Draggable,\n\t {\n\t start: start,\n\t // moveOnStartChange={this.props.moveOnStartChange}\n\t onStop: this.onDragHandler('onDragStop'),\n\t onStart: this.onDragHandler('onDragStart'),\n\t onDrag: this.onDragHandler('onDrag'),\n\t handle: this.props.handle,\n\t cancel: '.react-resizable-handle ' + this.props.cancel,\n\t useCSSTransforms: this.props.useCSSTransforms\n\t },\n\t child\n\t );\n\t },\n\n\t /**\n\t * Mix a Resizable instance into a child.\n\t * @param {Element} child Child element.\n\t * @param {Object} position Position object (pixel values)\n\t * @return {Element} Child wrapped in Resizable.\n\t */\n\t mixinResizable: function mixinResizable(child, position) {\n\t var p = this.props;\n\t // This is the max possible width - doesn't go to infinity because of the width of the window\n\t var maxWidth = this.calcPosition(0, 0, p.cols - p.x, 0).width;\n\n\t // Calculate min/max constraints using our min & maxes\n\t var mins = this.calcPosition(0, 0, p.minW, p.minH);\n\t var maxes = this.calcPosition(0, 0, p.maxW, p.maxH);\n\t var minConstraints = [mins.width, mins.height];\n\t var maxConstraints = [Math.min(maxes.width, maxWidth), Math.min(maxes.height, Infinity)];\n\t return React.createElement(\n\t Resizable,\n\t {\n\t width: position.width,\n\t height: position.height,\n\t minConstraints: minConstraints,\n\t maxConstraints: maxConstraints,\n\t onResizeStop: this.onResizeHandler('onResizeStop'),\n\t onResizeStart: this.onResizeHandler('onResizeStart'),\n\t onResize: this.onResizeHandler('onResize')\n\t },\n\t child\n\t );\n\t },\n\n\t /**\n\t * Wrapper around drag events to provide more useful data.\n\t * All drag events call the function with the given handler name,\n\t * with the signature (index, x, y).\n\t *\n\t * @param {String} handlerName Handler name to wrap.\n\t * @return {Function} Handler function.\n\t */\n\t onDragHandler: function onDragHandler(handlerName) {\n\t var me = this;\n\t return function (e, _ref) {\n\t var element = _ref.element;\n\t var position = _ref.position;\n\n\t if (!me.props[handlerName]) return;\n\t // Get new XY\n\n\t var _me$calcXY = me.calcXY(position);\n\n\t var x = _me$calcXY.x;\n\t var y = _me$calcXY.y;\n\n\t // Cap x at numCols\n\t x = Math.min(x, me.props.cols - me.props.w);\n\n\t me.props[handlerName](me.props.i, x, y, { e: e, element: element, position: position });\n\t };\n\t },\n\n\t /**\n\t * Wrapper around drag events to provide more useful data.\n\t * All drag events call the function with the given handler name,\n\t * with the signature (index, x, y).\n\t *\n\t * @param {String} handlerName Handler name to wrap.\n\t * @return {Function} Handler function.\n\t */\n\t onResizeHandler: function onResizeHandler(handlerName) {\n\t var me = this;\n\t return function (e, _ref) {\n\t var element = _ref.element;\n\t var size = _ref.size;\n\n\t if (!me.props[handlerName]) return;\n\n\t console.log(size);\n\n\t // Get new XY\n\n\t var _me$calcWH = me.calcWH(size);\n\n\t var w = _me$calcWH.w;\n\t var h = _me$calcWH.h;\n\n\t // Cap w at numCols\n\t w = Math.min(w, me.props.cols - me.props.x);\n\t // Ensure w is at least 1\n\t w = Math.max(w, 1);\n\n\t // Min/max capping\n\t w = Math.max(Math.min(w, me.props.maxW), me.props.minW);\n\t h = Math.max(Math.min(h, me.props.maxH), me.props.minH);\n\n\t me.setState({ resizing: handlerName === 'onResizeStop' ? null : size });\n\n\t me.props[handlerName](me.props.i, w, h, { e: e, element: element, size: size });\n\t };\n\t },\n\n\t render: function render() {\n\t var p = this.props,\n\t pos = this.calcPosition(p.x, p.y, p.w, p.h);\n\t if (this.state.resizing) {\n\t pos.width = this.state.resizing.width;\n\t pos.height = this.state.resizing.height;\n\t }\n\n\t // Create the child element. We clone the existing element but modify its className and style.\n\t var child = cloneWithProps(this.props.children, {\n\t // Munge a classname. Use passed in classnames and resizing.\n\t // React with merge the classNames.\n\t className: ['react-grid-item', this.props.className, this.state.resizing ? 'resizing' : '', this.props.useCSSTransforms ? 'cssTransforms' : ''].join(' '),\n\t // We can set the width and height on the child, but unfortunately we can't set the position.\n\t style: this.createStyle(pos)\n\t });\n\n\t // Resizable support. This is usually on but the user can toggle it off.\n\t if (this.props.isResizable) {\n\t child = this.mixinResizable(child, pos);\n\t }\n\n\t // Draggable support. This is always on, except for with placeholders.\n\t if (this.props.isDraggable) {\n\t child = this.mixinDraggable(child, pos);\n\t }\n\n\t return child;\n\t }\n\t});\n\n\tfunction constraintError(name, props) {\n\t delete props.children;\n\t throw new Error(name + ' overrides contraints on gridItem ' + props.i + '. Full props: ' + JSON.stringify(props));\n\t}\n\n\tmodule.exports = GridItem;\n\n/***/ },\n/* 11 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar utils = __webpack_require__(2);\n\tvar responsiveUtils = __webpack_require__(12);\n\tvar PureDeepRenderMixin = __webpack_require__(4);\n\tvar WidthListeningMixin = __webpack_require__(6);\n\tvar ReactGridLayout = __webpack_require__(5);\n\n\t/**\n\t * A wrapper around ReactGridLayout to support responsive breakpoints.\n\t */\n\tvar ResponsiveReactGridLayout = React.createClass({\n\t displayName: 'ResponsiveReactGridLayout',\n\n\t mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n\t propTypes: {\n\t //\n\t // Basic props\n\t //\n\n\t // Optional, but if you are managing width yourself you may want to set the breakpoint\n\t // yourself as well.\n\t breakpoint: React.PropTypes.string,\n\n\t // {name: pxVal}, e.g. {lg: 1200, md: 996, sm: 768, xs: 480}\n\t breakpoints: React.PropTypes.object,\n\n\t // # of cols. This is a breakpoint -> cols map\n\t cols: React.PropTypes.object,\n\n\t // layouts is an object mapping breakpoints to layouts.\n\t // e.g. {lg: Layout, md: Layout, ...}\n\t layouts: function layouts(props, propName, componentName) {\n\t React.PropTypes.object.isRequired.apply(this, arguments);\n\n\t var layouts = props.layouts;\n\t Object.keys(layouts).map(function (k) {\n\t utils.validateLayout(layouts[k], 'layouts.' + k);\n\t });\n\t },\n\n\t //\n\t // Callbacks\n\t //\n\n\t // Calls back with breakpoint and new # cols\n\t onBreakpointChange: React.PropTypes.func,\n\n\t // Callback so you can save the layout.\n\t // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n\t onLayoutChange: React.PropTypes.func\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t breakpoints: { lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 },\n\t cols: { lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 },\n\t layouts: {},\n\t onBreakpointChange: function onBreakpointChange() {},\n\t onLayoutChange: function onLayoutChange() {}\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t var breakpoint = this.props.breakpoint || responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, this.props.initialWidth);\n\t var cols = responsiveUtils.getColsFromBreakpoint(breakpoint, this.props.cols);\n\n\t // Get the initial layout. This can tricky; we try to generate one however possible if one doesn't exist\n\t // for this layout.\n\t var initialLayout = responsiveUtils.findOrGenerateResponsiveLayout(this.props.layouts, this.props.breakpoints, breakpoint, breakpoint, cols, this.props.verticalCompact);\n\n\t return {\n\t layout: initialLayout,\n\t // storage for layouts obsoleted by breakpoints\n\t layouts: this.props.layouts || {},\n\t breakpoint: breakpoint,\n\t cols: cols,\n\t width: this.props.initialWidth\n\t };\n\t },\n\n\t componentWillReceiveProps: function componentWillReceiveProps(nextProps) {\n\t // This allows you to set the width manually if you like.\n\t // Use manual width changes in combination with `listenToWindowResize: false`\n\t if (nextProps.width) this.onWidthChange(nextProps.width);\n\n\t // Allow parent to set breakpoint directly.\n\t if (nextProps.breakpoint !== this.props.breakpoint) {\n\t this.onWidthChange(this.state.width);\n\t }\n\n\t // Allow parent to set layouts directly.\n\t if (nextProps.layouts && nextProps.layouts !== this.state.layouts) {\n\t // Since we're setting an entirely new layout object, we must generate a new responsive layout\n\t // if one does not exist.\n\t var newLayout = responsiveUtils.findOrGenerateResponsiveLayout(nextProps.layouts, nextProps.breakpoints, this.state.breakpoint, this.state.breakpoint, this.state.cols, this.props.verticalLayout);\n\n\t this.setState({\n\t layouts: nextProps.layouts,\n\t layout: newLayout\n\t });\n\t }\n\t },\n\n\t /**\n\t * Bubble this up, add `layouts` object.\n\t * @param {Array} layout Layout from inner Grid.\n\t */\n\t onLayoutChange: function onLayoutChange(layout) {\n\t this.state.layouts[this.state.breakpoint] = layout;\n\t this.setState({ layout: layout, layouts: this.state.layouts });\n\t this.props.onLayoutChange(layout, this.state.layouts);\n\t },\n\n\t /**\n\t * When the width changes work through breakpoints and reset state with the new width & breakpoint.\n\t * Width changes are necessary to figure out the widget widths.\n\t */\n\t onWidthChange: function onWidthChange(width) {\n\t // Set new breakpoint\n\t var newState = { width: width };\n\t newState.breakpoint = this.props.breakpoint || responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, newState.width);\n\t newState.cols = responsiveUtils.getColsFromBreakpoint(newState.breakpoint, this.props.cols);\n\n\t // Breakpoint change\n\t if (newState.cols !== this.state.cols) {\n\n\t // Store the current layout\n\t newState.layouts = this.state.layouts;\n\t newState.layouts[this.state.breakpoint] = JSON.parse(JSON.stringify(this.state.layout));\n\n\t // Find or generate a new one.\n\t newState.layout = responsiveUtils.findOrGenerateResponsiveLayout(newState.layouts, this.props.breakpoints, newState.breakpoint, this.state.breakpoint, newState.cols, this.props.verticalLayout);\n\n\t // This adds missing items.\n\t newState.layout = utils.synchronizeLayoutWithChildren(newState.layout, this.props.children, newState.cols, this.props.verticalCompact);\n\n\t // Store this new layout as well.\n\t newState.layouts[newState.breakpoint] = newState.layout;\n\n\t this.props.onBreakpointChange(newState.breakpoint, newState.cols);\n\t }\n\n\t this.setState(newState);\n\t },\n\n\t render: function render() {\n\t // Don't pass responsive props to RGL.\n\t /*jshint unused:false*/\n\t var _props = this.props;\n\t var layouts = _props.layouts;\n\t var onBreakpointChange = _props.onBreakpointChange;\n\t var breakpoints = _props.breakpoints;\n\n\t var props = _objectWithoutProperties(_props, ['layouts', 'onBreakpointChange', 'breakpoints']);\n\n\t return React.createElement(\n\t ReactGridLayout,\n\t _extends({}, props, {\n\t layout: this.state.layout,\n\t cols: this.state.cols,\n\t listenToWindowResize: false,\n\t onLayoutChange: this.onLayoutChange,\n\t width: this.state.width }),\n\t this.props.children\n\t );\n\t }\n\t});\n\n\tmodule.exports = ResponsiveReactGridLayout;\n\n/***/ },\n/* 12 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar utils = __webpack_require__(2);\n\n\tvar responsiveUtils = module.exports = {\n\n\t /**\n\t * Given a width, find the highest breakpoint that matches is valid for it (width > breakpoint).\n\t *\n\t * @param {Object} breakpoints Breakpoints object (e.g. {lg: 1200, md: 960, ...})\n\t * @param {Number} width Screen width.\n\t * @return {String} Highest breakpoint that is less than width.\n\t */\n\t getBreakpointFromWidth: function getBreakpointFromWidth(breakpoints, width) {\n\t var sorted = responsiveUtils.sortBreakpoints(breakpoints);\n\t var matching = sorted[0];\n\t for (var i = 1, len = sorted.length; i < len; i++) {\n\t var breakpointName = sorted[i];\n\t if (width > breakpoints[breakpointName]) matching = breakpointName;\n\t }\n\t return matching;\n\t },\n\n\t /**\n\t * Given a breakpoint, get the # of cols set for it.\n\t * @param {String} breakpoint Breakpoint name.\n\t * @param {Object} cols Map of breakpoints to cols.\n\t * @return {Number} Number of cols.\n\t */\n\t getColsFromBreakpoint: function getColsFromBreakpoint(breakpoint, cols) {\n\t if (!cols[breakpoint]) {\n\t throw new Error('ResponsiveReactGridLayout: `cols` entry for breakpoint ' + breakpoint + ' is missing!');\n\t }\n\t return cols[breakpoint];\n\t },\n\n\t /**\n\t * Given existing layouts and a new breakpoint, find or generate a new layout.\n\t *\n\t * This finds the layout above the new one and generates from it, if it exists.\n\t *\n\t * @param {Array} layouts Existing layouts.\n\t * @param {Array} breakpoints All breakpoints.\n\t * @param {String} breakpoint New breakpoint.\n\t * @param {String} breakpoint Last breakpoint (for fallback).\n\t * @param {Number} cols Column count at new breakpoint.\n\t * @param {Boolean} verticalCompact Whether or not to compact the layout\n\t * vertically.\n\t * @return {Array} New layout.\n\t */\n\t findOrGenerateResponsiveLayout: function findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, lastBreakpoint, cols, verticalCompact) {\n\t // If it already exists, just return it.\n\t if (layouts[breakpoint]) {\n\t return layouts[breakpoint];\n\t } // Find or generate the next layout\n\t var layout = layouts[lastBreakpoint];\n\t var breakpointsSorted = responsiveUtils.sortBreakpoints(breakpoints);\n\t var breakpointsAbove = breakpointsSorted.slice(breakpointsSorted.indexOf(breakpoint));\n\t for (var i = 0, len = breakpointsAbove.length; i < len; i++) {\n\t var b = breakpointsAbove[i];\n\t if (layouts[b]) {\n\t layout = layouts[b];\n\t break;\n\t }\n\t }\n\t layout = JSON.parse(JSON.stringify(layout || [])); // clone layout so we don't modify existing items\n\t return utils.compact(utils.correctBounds(layout, { cols: cols }), verticalCompact);\n\t },\n\n\t /**\n\t * Given breakpoints, return an array of breakpoints sorted by width. This is usually\n\t * e.g. ['xxs', 'xs', 'sm', ...]\n\t *\n\t * @param {Object} breakpoints Key/value pair of breakpoint names to widths.\n\t * @return {Array} Sorted breakpoints.\n\t */\n\t sortBreakpoints: function sortBreakpoints(breakpoints) {\n\t var keys = Object.keys(breakpoints);\n\t return keys.sort(function (a, b) {\n\t return breakpoints[a] - breakpoints[b];\n\t });\n\t }\n\t};\n\n/***/ },\n/* 13 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar pSlice = Array.prototype.slice;\n\tvar objectKeys = __webpack_require__(15);\n\tvar isArguments = __webpack_require__(14);\n\n\tvar deepEqual = module.exports = function (actual, expected, opts) {\n\t if (!opts) opts = {};\n\t // 7.1. All identical values are equivalent, as determined by ===.\n\t if (actual === expected) {\n\t return true;\n\n\t } else if (actual instanceof Date && expected instanceof Date) {\n\t return actual.getTime() === expected.getTime();\n\n\t // 7.3. Other pairs that do not both pass typeof value == 'object',\n\t // equivalence is determined by ==.\n\t } else if (typeof actual != 'object' && typeof expected != 'object') {\n\t return opts.strict ? actual === expected : actual == expected;\n\n\t // 7.4. For all other Object pairs, including Array objects, equivalence is\n\t // determined by having the same number of owned properties (as verified\n\t // with Object.prototype.hasOwnProperty.call), the same set of keys\n\t // (although not necessarily the same order), equivalent values for every\n\t // corresponding key, and an identical 'prototype' property. Note: this\n\t // accounts for both named and indexed properties on Arrays.\n\t } else {\n\t return objEquiv(actual, expected, opts);\n\t }\n\t}\n\n\tfunction isUndefinedOrNull(value) {\n\t return value === null || value === undefined;\n\t}\n\n\tfunction isBuffer (x) {\n\t if (!x || typeof x !== 'object' || typeof x.length !== 'number') return false;\n\t if (typeof x.copy !== 'function' || typeof x.slice !== 'function') {\n\t return false;\n\t }\n\t if (x.length > 0 && typeof x[0] !== 'number') return false;\n\t return true;\n\t}\n\n\tfunction objEquiv(a, b, opts) {\n\t var i, key;\n\t if (isUndefinedOrNull(a) || isUndefinedOrNull(b))\n\t return false;\n\t // an identical 'prototype' property.\n\t if (a.prototype !== b.prototype) return false;\n\t //~~~I've managed to break Object.keys through screwy arguments passing.\n\t // Converting to array solves the problem.\n\t if (isArguments(a)) {\n\t if (!isArguments(b)) {\n\t return false;\n\t }\n\t a = pSlice.call(a);\n\t b = pSlice.call(b);\n\t return deepEqual(a, b, opts);\n\t }\n\t if (isBuffer(a)) {\n\t if (!isBuffer(b)) {\n\t return false;\n\t }\n\t if (a.length !== b.length) return false;\n\t for (i = 0; i < a.length; i++) {\n\t if (a[i] !== b[i]) return false;\n\t }\n\t return true;\n\t }\n\t try {\n\t var ka = objectKeys(a),\n\t kb = objectKeys(b);\n\t } catch (e) {//happens when one is a string literal and the other isn't\n\t return false;\n\t }\n\t // having the same number of owned properties (keys incorporates\n\t // hasOwnProperty)\n\t if (ka.length != kb.length)\n\t return false;\n\t //the same set of keys (although not necessarily the same order),\n\t ka.sort();\n\t kb.sort();\n\t //~~~cheap key test\n\t for (i = ka.length - 1; i >= 0; i--) {\n\t if (ka[i] != kb[i])\n\t return false;\n\t }\n\t //equivalent values for every corresponding key, and\n\t //~~~possibly expensive deep test\n\t for (i = ka.length - 1; i >= 0; i--) {\n\t key = ka[i];\n\t if (!deepEqual(a[key], b[key], opts)) return false;\n\t }\n\t return typeof a === typeof b;\n\t}\n\n\n/***/ },\n/* 14 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar supportsArgumentsClass = (function(){\n\t return Object.prototype.toString.call(arguments)\n\t})() == '[object Arguments]';\n\n\texports = module.exports = supportsArgumentsClass ? supported : unsupported;\n\n\texports.supported = supported;\n\tfunction supported(object) {\n\t return Object.prototype.toString.call(object) == '[object Arguments]';\n\t};\n\n\texports.unsupported = unsupported;\n\tfunction unsupported(object){\n\t return object &&\n\t typeof object == 'object' &&\n\t typeof object.length == 'number' &&\n\t Object.prototype.hasOwnProperty.call(object, 'callee') &&\n\t !Object.prototype.propertyIsEnumerable.call(object, 'callee') ||\n\t false;\n\t};\n\n\n/***/ },\n/* 15 */\n/***/ function(module, exports, __webpack_require__) {\n\n\texports = module.exports = typeof Object.keys === 'function'\n\t ? Object.keys : shim;\n\n\texports.shim = shim;\n\tfunction shim (obj) {\n\t var keys = [];\n\t for (var key in obj) keys.push(key);\n\t return keys;\n\t}\n\n\n/***/ },\n/* 16 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar React = __webpack_require__(1);\n\tvar emptyFunction = function(){};\n\tvar assign = __webpack_require__(3);\n\tvar classNames = __webpack_require__(17);\n\n\t//\n\t// Helpers. See Element definition below this section.\n\t//\n\n\tfunction createUIEvent(draggable) {\n\t // State changes are often (but not always!) async. We want the latest value.\n\t var state = draggable._pendingState || draggable.state;\n\t return {\n\t node: draggable.getDOMNode(),\n\t position: {\n\t top: state.clientY,\n\t left: state.clientX\n\t }\n\t };\n\t}\n\n\tfunction canDragY(draggable) {\n\t return draggable.props.axis === 'both' ||\n\t draggable.props.axis === 'y';\n\t}\n\n\tfunction canDragX(draggable) {\n\t return draggable.props.axis === 'both' ||\n\t draggable.props.axis === 'x';\n\t}\n\n\tfunction isFunction(func) {\n\t return typeof func === 'function' || Object.prototype.toString.call(func) === '[object Function]';\n\t}\n\n\t// @credits https://gist.github.com/rogozhnikoff/a43cfed27c41e4e68cdc\n\tfunction findInArray(array, callback) {\n\t for (var i = 0, length = array.length; i < length; i++) {\n\t if (callback.apply(callback, [array[i], i, array])) return array[i];\n\t }\n\t}\n\n\tfunction matchesSelector(el, selector) {\n\t var method = findInArray([\n\t 'matches',\n\t 'webkitMatchesSelector',\n\t 'mozMatchesSelector',\n\t 'msMatchesSelector',\n\t 'oMatchesSelector'\n\t ], function(method){\n\t return isFunction(el[method]);\n\t });\n\n\t return el[method].call(el, selector);\n\t}\n\n\t/**\n\t * simple abstraction for dragging events names\n\t * */\n\tvar eventsFor = {\n\t touch: {\n\t start: 'touchstart',\n\t move: 'touchmove',\n\t end: 'touchend'\n\t },\n\t mouse: {\n\t start: 'mousedown',\n\t move: 'mousemove',\n\t end: 'mouseup'\n\t }\n\t};\n\n\t// Default to mouse events\n\tvar dragEventFor = eventsFor['mouse'];\n\n\t/**\n\t * get {clientX, clientY} positions of control\n\t * */\n\tfunction getControlPosition(e) {\n\t var position = (e.touches && e.touches[0]) || e;\n\t return {\n\t clientX: position.clientX,\n\t clientY: position.clientY\n\t };\n\t}\n\n\tfunction addEvent(el, event, handler) {\n\t if (!el) { return; }\n\t if (el.attachEvent) {\n\t el.attachEvent('on' + event, handler);\n\t } else if (el.addEventListener) {\n\t el.addEventListener(event, handler, true);\n\t } else {\n\t el['on' + event] = handler;\n\t }\n\t}\n\n\tfunction removeEvent(el, event, handler) {\n\t if (!el) { return; }\n\t if (el.detachEvent) {\n\t el.detachEvent('on' + event, handler);\n\t } else if (el.removeEventListener) {\n\t el.removeEventListener(event, handler, true);\n\t } else {\n\t el['on' + event] = null;\n\t }\n\t}\n\n\tfunction outerHeight(node) {\n\t // This is deliberately excluding margin for our calculations, since we are using\n\t // offsetTop which is including margin. See getBoundPosition\n\t var height = node.clientHeight;\n\t var computedStyle = window.getComputedStyle(node);\n\t height += int(computedStyle.borderTopWidth);\n\t height += int(computedStyle.borderBottomWidth);\n\t return height;\n\t}\n\n\tfunction outerWidth(node) {\n\t // This is deliberately excluding margin for our calculations, since we are using\n\t // offsetLeft which is including margin. See getBoundPosition\n\t var width = node.clientWidth;\n\t var computedStyle = window.getComputedStyle(node);\n\t width += int(computedStyle.borderLeftWidth);\n\t width += int(computedStyle.borderRightWidth);\n\t return width;\n\t}\n\tfunction innerHeight(node) {\n\t var height = node.clientHeight;\n\t var computedStyle = window.getComputedStyle(node);\n\t height -= int(computedStyle.paddingTop);\n\t height -= int(computedStyle.paddingBottom);\n\t return height;\n\t}\n\n\tfunction innerWidth(node) {\n\t var width = node.clientWidth;\n\t var computedStyle = window.getComputedStyle(node);\n\t width -= int(computedStyle.paddingLeft);\n\t width -= int(computedStyle.paddingRight);\n\t return width;\n\t}\n\n\tfunction isNum(num) {\n\t return typeof num === 'number' && !isNaN(num);\n\t}\n\n\tfunction int(a) {\n\t return parseInt(a, 10);\n\t}\n\n\tfunction getBoundPosition(draggable, clientX, clientY) {\n\t var bounds = JSON.parse(JSON.stringify(draggable.props.bounds));\n\t var node = draggable.getDOMNode();\n\t var parent = node.parentNode;\n\n\t if (bounds === 'parent') {\n\t var nodeStyle = window.getComputedStyle(node);\n\t var parentStyle = window.getComputedStyle(parent);\n\t // Compute bounds. This is a pain with padding and offsets but this gets it exactly right.\n\t bounds = {\n\t left: -node.offsetLeft + int(parentStyle.paddingLeft) +\n\t int(nodeStyle.borderLeftWidth) + int(nodeStyle.marginLeft),\n\t top: -node.offsetTop + int(parentStyle.paddingTop) +\n\t int(nodeStyle.borderTopWidth) + int(nodeStyle.marginTop),\n\t right: innerWidth(parent) - outerWidth(node) - node.offsetLeft,\n\t bottom: innerHeight(parent) - outerHeight(node) - node.offsetTop\n\t };\n\t }\n\n\t // Keep x and y below right and bottom limits...\n\t if (isNum(bounds.right)) clientX = Math.min(clientX, bounds.right);\n\t if (isNum(bounds.bottom)) clientY = Math.min(clientY, bounds.bottom);\n\n\t // But above left and top limits.\n\t if (isNum(bounds.left)) clientX = Math.max(clientX, bounds.left);\n\t if (isNum(bounds.top)) clientY = Math.max(clientY, bounds.top);\n\n\t return [clientX, clientY];\n\t}\n\n\tfunction snapToGrid(grid, pendingX, pendingY) {\n\t var x = Math.round(pendingX / grid[0]) * grid[0];\n\t var y = Math.round(pendingY / grid[1]) * grid[1];\n\t return [x, y];\n\t}\n\n\t// Useful for preventing blue highlights all over everything when dragging.\n\tvar userSelectStyle = ';user-select: none;-webkit-user-select:none;-moz-user-select:none;' +\n\t '-o-user-select:none;-ms-user-select:none;';\n\n\tfunction addUserSelectStyles(draggable) {\n\t if (!draggable.props.enableUserSelectHack) return;\n\t var style = document.body.getAttribute('style') || '';\n\t document.body.setAttribute('style', style + userSelectStyle);\n\t}\n\n\tfunction removeUserSelectStyles(draggable) {\n\t if (!draggable.props.enableUserSelectHack) return;\n\t var style = document.body.getAttribute('style') || '';\n\t document.body.setAttribute('style', style.replace(userSelectStyle, ''));\n\t}\n\n\tfunction createCSSTransform(style) {\n\t // Replace unitless items with px\n\t var x = style.x + 'px';\n\t var y = style.y + 'px';\n\t return {\n\t transform: 'translate(' + x + ',' + y + ')',\n\t WebkitTransform: 'translate(' + x + ',' + y + ')',\n\t OTransform: 'translate(' + x + ',' + y + ')',\n\t msTransform: 'translate(' + x + ',' + y + ')',\n\t MozTransform: 'translate(' + x + ',' + y + ')'\n\t };\n\t}\n\n\n\t//\n\t// End Helpers.\n\t//\n\n\t//\n\t// Define \n\t//\n\n\tmodule.exports = React.createClass({\n\t displayName: 'Draggable',\n\n\t propTypes: {\n\t /**\n\t * `axis` determines which axis the draggable can move.\n\t *\n\t * 'both' allows movement horizontally and vertically.\n\t * 'x' limits movement to horizontal axis.\n\t * 'y' limits movement to vertical axis.\n\t *\n\t * Defaults to 'both'.\n\t */\n\t axis: React.PropTypes.oneOf(['both', 'x', 'y']),\n\n\t /**\n\t * `bounds` determines the range of movement available to the element.\n\t * Available values are:\n\t *\n\t * 'parent' restricts movement within the Draggable's parent node.\n\t *\n\t * Alternatively, pass an object with the following properties, all of which are optional:\n\t *\n\t * {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}\n\t *\n\t * All values are in px.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
Content
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t bounds: React.PropTypes.oneOfType([\n\t React.PropTypes.shape({\n\t left: React.PropTypes.Number,\n\t right: React.PropTypes.Number,\n\t top: React.PropTypes.Number,\n\t bottom: React.PropTypes.Number\n\t }),\n\t React.PropTypes.oneOf(['parent', false])\n\t ]),\n\n\t /**\n\t * By default, we add 'user-select:none' attributes to the document body\n\t * to prevent ugly text selection during drag. If this is causing problems\n\t * for your app, set this to `false`.\n\t */\n\t enableUserSelectHack: React.PropTypes.bool,\n\n\t /**\n\t * `handle` specifies a selector to be used as the handle that initiates drag.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
\n\t *
Click me to drag
\n\t *
This is some other content
\n\t *
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t handle: React.PropTypes.string,\n\n\t /**\n\t * `cancel` specifies a selector to be used to prevent drag initialization.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return(\n\t * \n\t *
\n\t *
You can't drag from here
\n\t *
Dragging here works fine
\n\t *
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t cancel: React.PropTypes.string,\n\n\t /**\n\t * `grid` specifies the x and y that dragging should snap to.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
I snap to a 25 x 25 grid
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t grid: React.PropTypes.arrayOf(React.PropTypes.number),\n\n\t /**\n\t * `start` specifies the x and y that the dragged item should start at\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
I start with transformX: 25px and transformY: 25px;
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t start: React.PropTypes.shape({\n\t x: React.PropTypes.number,\n\t y: React.PropTypes.number\n\t }),\n\n\t /**\n\t * `moveOnStartChange`, if true (default false) will move the element if the `start`\n\t * property changes.\n\t */\n\t moveOnStartChange: React.PropTypes.bool,\n\n\n\t /**\n\t * `zIndex` specifies the zIndex to use while dragging.\n\t *\n\t * Example:\n\t *\n\t * ```jsx\n\t * var App = React.createClass({\n\t * render: function () {\n\t * return (\n\t * \n\t *
I have a zIndex
\n\t * \n\t * );\n\t * }\n\t * });\n\t * ```\n\t */\n\t zIndex: React.PropTypes.number,\n\n\t /**\n\t * Called when dragging starts.\n\t * If this function returns the boolean false, dragging will be canceled.\n\t *\n\t * Example:\n\t *\n\t * ```js\n\t * function (event, ui) {}\n\t * ```\n\t *\n\t * `event` is the Event that was triggered.\n\t * `ui` is an object:\n\t *\n\t * ```js\n\t * {\n\t * position: {top: 0, left: 0}\n\t * }\n\t * ```\n\t */\n\t onStart: React.PropTypes.func,\n\n\t /**\n\t * Called while dragging.\n\t * If this function returns the boolean false, dragging will be canceled.\n\t *\n\t * Example:\n\t *\n\t * ```js\n\t * function (event, ui) {}\n\t * ```\n\t *\n\t * `event` is the Event that was triggered.\n\t * `ui` is an object:\n\t *\n\t * ```js\n\t * {\n\t * position: {top: 0, left: 0}\n\t * }\n\t * ```\n\t */\n\t onDrag: React.PropTypes.func,\n\n\t /**\n\t * Called when dragging stops.\n\t *\n\t * Example:\n\t *\n\t * ```js\n\t * function (event, ui) {}\n\t * ```\n\t *\n\t * `event` is the Event that was triggered.\n\t * `ui` is an object:\n\t *\n\t * ```js\n\t * {\n\t * position: {top: 0, left: 0}\n\t * }\n\t * ```\n\t */\n\t onStop: React.PropTypes.func,\n\n\t /**\n\t * A workaround option which can be passed if onMouseDown needs to be accessed,\n\t * since it'll always be blocked (due to that there's internal use of onMouseDown)\n\t */\n\t onMouseDown: React.PropTypes.func,\n\t },\n\n\t componentWillReceiveProps: function(newProps) {\n\t // React to changes in the 'start' param.\n\t if (newProps.moveOnStartChange && newProps.start) {\n\t this.setState(this.getInitialState(newProps));\n\t }\n\t },\n\n\t componentWillUnmount: function() {\n\t // Remove any leftover event handlers\n\t removeEvent(document, dragEventFor['move'], this.handleDrag);\n\t removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n\t removeUserSelectStyles(this);\n\t },\n\n\t getDefaultProps: function () {\n\t return {\n\t axis: 'both',\n\t bounds: false,\n\t handle: null,\n\t cancel: null,\n\t grid: null,\n\t moveOnStartChange: false,\n\t start: {x: 0, y: 0},\n\t zIndex: NaN,\n\t enableUserSelectHack: true,\n\t onStart: emptyFunction,\n\t onDrag: emptyFunction,\n\t onStop: emptyFunction,\n\t onMouseDown: emptyFunction\n\t };\n\t },\n\n\t getInitialState: function (props) {\n\t // Handle call from CWRP\n\t props = props || this.props;\n\t return {\n\t // Whether or not we are currently dragging.\n\t dragging: false,\n\n\t // Offset between start top/left and mouse top/left while dragging.\n\t offsetX: 0, offsetY: 0,\n\n\t // Current transform x and y.\n\t clientX: props.start.x, clientY: props.start.y\n\t };\n\t },\n\n\t handleDragStart: function (e) {\n\t // Make it possible to attach event handlers on top of this one\n\t this.props.onMouseDown(e);\n\n\t // Short circuit if handle or cancel prop was provided and selector doesn't match\n\t if ((this.props.handle && !matchesSelector(e.target, this.props.handle)) ||\n\t (this.props.cancel && matchesSelector(e.target, this.props.cancel))) {\n\t return;\n\t }\n\n\t // Call event handler. If it returns explicit false, cancel.\n\t var shouldStart = this.props.onStart(e, createUIEvent(this));\n\t if (shouldStart === false) return;\n\n\t var dragPoint = getControlPosition(e);\n\n\t // Add a style to the body to disable user-select. This prevents text from\n\t // being selected all over the page.\n\t addUserSelectStyles(this);\n\n\t // Initiate dragging. Set the current x and y as offsets\n\t // so we know how much we've moved during the drag. This allows us\n\t // to drag elements around even if they have been moved, without issue.\n\t this.setState({\n\t dragging: true,\n\t offsetX: dragPoint.clientX - this.state.clientX,\n\t offsetY: dragPoint.clientY - this.state.clientY\n\t });\n\n\n\t // Add event handlers\n\t addEvent(document, dragEventFor['move'], this.handleDrag);\n\t addEvent(document, dragEventFor['end'], this.handleDragEnd);\n\t },\n\n\t handleDragEnd: function (e) {\n\t // Short circuit if not currently dragging\n\t if (!this.state.dragging) {\n\t return;\n\t }\n\n\t removeUserSelectStyles(this);\n\n\t // Turn off dragging\n\t this.setState({\n\t dragging: false\n\t });\n\n\t // Call event handler\n\t this.props.onStop(e, createUIEvent(this));\n\n\t // Remove event handlers\n\t removeEvent(document, dragEventFor['move'], this.handleDrag);\n\t removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n\t },\n\n\t handleDrag: function (e) {\n\t var dragPoint = getControlPosition(e);\n\n\t // Calculate X and Y\n\t var clientX = dragPoint.clientX - this.state.offsetX;\n\t var clientY = dragPoint.clientY - this.state.offsetY;\n\n\t // Snap to grid if prop has been provided\n\t if (Array.isArray(this.props.grid)) {\n\t var coords = snapToGrid(this.props.grid, clientX, clientY);\n\t clientX = coords[0], clientY = coords[1];\n\t }\n\n\t if (this.props.bounds) {\n\t var pos = getBoundPosition(this, clientX, clientY);\n\t clientX = pos[0], clientY = pos[1];\n\t }\n\n\t // Call event handler. If it returns explicit false, cancel.\n\t var shouldUpdate = this.props.onDrag(e, createUIEvent(this));\n\t if (shouldUpdate === false) return this.handleDragEnd();\n\n\t // Update transform\n\t this.setState({\n\t clientX: clientX,\n\t clientY: clientY\n\t });\n\t },\n\n\t onMouseDown: function(ev) {\n\t // Prevent 'ghost click' which happens 300ms after touchstart if the event isn't cancelled.\n\t // We don't cancel the event on touchstart because of #37; we might want to make a scrollable item draggable.\n\t // More on ghost clicks: http://ariatemplates.com/blog/2014/05/ghost-clicks-in-mobile-browsers/\n\t if (dragEventFor == eventsFor['touch']) {\n\t return ev.preventDefault();\n\t }\n\n\t return this.handleDragStart.apply(this, arguments);\n\t },\n\n\t onTouchStart: function(ev) {\n\t // We're on a touch device now, so change the event handlers\n\t dragEventFor = eventsFor['touch'];\n\n\t return this.handleDragStart.apply(this, arguments);\n\t },\n\n\t // Intended for use by a parent component. Resets internal state on this component. Useful for\n\t // and other components in case this element is manually resized and start/moveOnStartChange\n\t // don't work for you.\n\t resetState: function() {\n\t this.setState({\n\t offsetX: 0, offsetY: 0, clientX: 0, clientY: 0\n\t });\n\t },\n\n\t render: function () {\n\t // Create style object. We extend from existing styles so we don't\n\t // remove anything already set (like background, color, etc).\n\t var childStyle = this.props.children.props.style || {};\n\n\t // Add a CSS transform to move the element around. This allows us to move the element around\n\t // without worrying about whether or not it is relatively or absolutely positioned.\n\t // If the item you are dragging already has a transform set, wrap it in a so \n\t // has a clean slate.\n\t var transform = createCSSTransform({\n\t // Set left if horizontal drag is enabled\n\t x: canDragX(this) ?\n\t this.state.clientX :\n\t 0,\n\n\t // Set top if vertical drag is enabled\n\t y: canDragY(this) ?\n\t this.state.clientY :\n\t 0\n\t });\n\n\t // Workaround IE pointer events; see #51\n\t // https://github.com/mzabriskie/react-draggable/issues/51#issuecomment-103488278\n\t var touchHacks = {\n\t touchAction: 'none'\n\t };\n\n\t var style = assign({}, childStyle, transform, touchHacks);\n\n\t // Set zIndex if currently dragging and prop has been provided\n\t if (this.state.dragging && !isNaN(this.props.zIndex)) {\n\t style.zIndex = this.props.zIndex;\n\t }\n\n\t var className = classNames((this.props.children.props.className || ''), 'react-draggable', {\n\t 'react-draggable-dragging': this.state.dragging,\n\t 'react-draggable-dragged': this.state.dragged\n\t });\n\n\t // Reuse the child provided\n\t // This makes it flexible to use whatever element is wanted (div, ul, etc)\n\t return React.cloneElement(React.Children.only(this.props.children), {\n\t style: style,\n\t className: className,\n\n\t onMouseDown: this.onMouseDown,\n\t onTouchStart: this.onTouchStart,\n\t onMouseUp: this.handleDragEnd,\n\t onTouchEnd: this.handleDragEnd\n\t });\n\t }\n\t});\n\n\n/***/ },\n/* 17 */\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!\n\t Copyright (c) 2015 Jed Watson.\n\t Licensed under the MIT License (MIT), see\n\t http://jedwatson.github.io/classnames\n\t*/\n\n\tfunction classNames() {\n\t\tvar classes = '';\n\t\tvar arg;\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\targ = arguments[i];\n\t\t\tif (!arg) {\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\tif ('string' === typeof arg || 'number' === typeof arg) {\n\t\t\t\tclasses += ' ' + arg;\n\t\t\t} else if (Object.prototype.toString.call(arg) === '[object Array]') {\n\t\t\t\tclasses += ' ' + classNames.apply(null, arg);\n\t\t\t} else if ('object' === typeof arg) {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (!arg.hasOwnProperty(key) || !arg[key]) {\n\t\t\t\t\t\tcontinue;\n\t\t\t\t\t}\n\t\t\t\t\tclasses += ' ' + key;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn classes.substr(1);\n\t}\n\n\t// safely export classNames for node / browserify\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tmodule.exports = classNames;\n\t}\n\n\t// safely export classNames for RequireJS\n\tif (true) {\n\t\t!(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = function() {\n\t\t\treturn classNames;\n\t\t}.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__), __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n\t}\n\n\n/***/ },\n/* 18 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\n\tvar _slicedToArray = function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } };\n\n\tvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\n\tvar React = __webpack_require__(1);\n\tvar Resizable = __webpack_require__(8);\n\tvar PureRenderMixin = __webpack_require__(9);\n\n\t// An example use of Resizable.\n\tvar ResizableBox = module.exports = React.createClass({\n\t displayName: 'ResizableBox',\n\t mixins: [PureRenderMixin],\n\n\t propTypes: {\n\t lockAspectRatio: React.PropTypes.bool\n\t },\n\n\t getDefaultProps: function getDefaultProps() {\n\t return {\n\t lockAspectRatio: false,\n\t handleSize: [20, 20]\n\t };\n\t },\n\n\t getInitialState: function getInitialState() {\n\t return {\n\t width: this.props.width,\n\t height: this.props.height,\n\t aspectRatio: this.props.width / this.props.height\n\t };\n\t },\n\n\t onResize: function onResize(event, _ref) {\n\t var element = _ref.element;\n\t var size = _ref.size;\n\t var width = size.width;\n\t var height = size.height;\n\n\t var widthChanged = width !== this.state.width,\n\t heightChanged = height !== this.state.height;\n\t if (!widthChanged && !heightChanged) {\n\t return;\n\t }if (this.props.lockAspectRatio) {\n\t var _preserveAspectRatio = this.preserveAspectRatio(width, height);\n\n\t var _preserveAspectRatio2 = _slicedToArray(_preserveAspectRatio, 2);\n\n\t width = _preserveAspectRatio2[0];\n\t height = _preserveAspectRatio2[1];\n\t }\n\n\t this.setState({ width: width, height: height });\n\t },\n\n\t // If you do this, be careful of constraints\n\t preserveAspectRatio: function preserveAspectRatio(width, height) {\n\t var min = this.props.minConstraints;\n\t var max = this.props.maxConstraints;\n\n\t height = width / this.state.aspectRatio;\n\t width = height * this.state.aspectRatio;\n\n\t if (min) {\n\t width = Math.max(min[0], width);\n\t height = Math.max(min[1], height);\n\t }\n\t if (max) {\n\t width = Math.min(max[0], width);\n\t height = Math.min(max[1], height);\n\t }\n\t return [width, height];\n\t },\n\n\t render: function render() {\n\t // Basic wrapper around a Resizable instance.\n\t // If you use Resizable directly, you are responsible for updating the component\n\t // with a new width and height.\n\t var _props = this.props;\n\t var handleSize = _props.handleSize;\n\t var minConstraints = _props.minConstraints;\n\t var maxConstraints = _props.maxConstraints;\n\n\t var props = _objectWithoutProperties(_props, ['handleSize', 'minConstraints', 'maxConstraints']);\n\n\t return React.createElement(\n\t Resizable,\n\t {\n\t minConstraints: minConstraints,\n\t maxConstraints: maxConstraints,\n\t handleSize: handleSize,\n\t width: this.state.width,\n\t height: this.state.height,\n\t onResize: this.onResize,\n\t draggableOpts: this.props.draggableOpts\n\t },\n\t React.createElement(\n\t 'div',\n\t _extends({ style: { width: this.state.width + 'px', height: this.state.height + 'px' } }, props),\n\t this.props.children\n\t )\n\t );\n\t }\n\t});\n\n/***/ },\n/* 19 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\n\tvar assign = __webpack_require__(3);\n\tvar React = __webpack_require__(1);\n\n\tmodule.exports = function cloneElement(element, props) {\n\t if (props.style && element.props.style) {\n\t props.style = assign({}, element.props.style, props.style);\n\t }\n\t if (props.className && element.props.className) {\n\t props.className = element.props.className + ' ' + props.className;\n\t }\n\t return React.cloneElement(element, props);\n\t};\n\n/***/ },\n/* 20 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\tmodule.exports = function() {\n\t throw new Error(\"Don't instantiate Resizable directly! Use require('react-resizable').Resizable\");\n\t};\n\n\tmodule.exports.Resizable = __webpack_require__(8);\n\tmodule.exports.ResizableBox = __webpack_require__(18);\n\n\n/***/ },\n/* 21 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\r\n\tvar React = __webpack_require__(1)\r\n\t , hasOwn = Object.prototype.hasOwnProperty\r\n\t , version = React.version.split('.').map(parseFloat)\r\n\t , RESERVED = {\r\n\t className: resolve(joinClasses),\r\n\t children: function(){},\r\n\t key: function(){},\r\n\t ref: function(){},\r\n\t style: resolve(extend)\r\n\t };\r\n\r\n\tmodule.exports = function cloneWithProps(child, props) {\r\n\t var newProps = mergeProps(props, child.props);\r\n\r\n\t if (!hasOwn.call(newProps, 'children') && hasOwn.call(child.props, 'children'))\r\n\t newProps.children = child.props.children;\r\n\r\n\t // < 0.11\r\n\t if (version[0] === 0 && version[1] < 11)\r\n\t return child.constructor.ConvenienceConstructor(newProps);\r\n\t \r\n\t // 0.11\r\n\t if (version[0] === 0 && version[1] === 11)\r\n\t return child.constructor(newProps);\r\n\r\n\t // 0.12\r\n\t else if (version[0] === 0 && version[1] === 12){\r\n\t MockLegacyFactory.isReactLegacyFactory = true\r\n\t MockLegacyFactory.type = child.type\r\n\t return React.createElement(MockLegacyFactory, newProps);\r\n\t }\r\n\r\n\t // 0.13+\r\n\t return React.createElement(child.type, newProps);\r\n\r\n\t function MockLegacyFactory(){}\r\n\t}\r\n\r\n\tfunction mergeProps(currentProps, childProps) {\r\n\t var newProps = extend(currentProps), key\r\n\r\n\t for (key in childProps) {\r\n\t if (hasOwn.call(RESERVED, key) )\r\n\t RESERVED[key](newProps, childProps[key], key)\r\n\r\n\t else if ( !hasOwn.call(newProps, key) )\r\n\t newProps[key] = childProps[key];\r\n\t }\r\n\t return newProps\r\n\t}\r\n\r\n\tfunction resolve(fn){\r\n\t return function(src, value, key){\r\n\t if( !hasOwn.call(src, key)) src[key] = value\r\n\t else src[key] = fn(src[key], value)\r\n\t }\r\n\t}\r\n\r\n\tfunction joinClasses(a, b){\r\n\t if ( !a ) return b || ''\r\n\t return a + (b ? ' ' + b : '')\r\n\t}\r\n\r\n\tfunction extend() {\r\n\t var target = {};\r\n\t for (var i = 0; i < arguments.length; i++) \r\n\t for (var key in arguments[i]) if (hasOwn.call(arguments[i], key)) \r\n\t target[key] = arguments[i][key] \r\n\t return target\r\n\t}\n\n/***/ },\n/* 22 */\n/***/ function(module, exports, __webpack_require__) {\n\n\t/**\n\t * Copyright 2013-2015, Facebook, Inc.\n\t * All rights reserved.\n\t *\n\t * This source code is licensed under the BSD-style license found in the\n\t * LICENSE file in the root directory of this source tree. An additional grant\n\t * of patent rights can be found in the PATENTS file in the same directory.\n\t *\n\t * @providesModule shallowEqual\n\t */\n\n\t'use strict';\n\n\t/**\n\t * Performs equality by iterating through keys on an object and returning\n\t * false when any key has values which are not strictly equal between\n\t * objA and objB. Returns true when the values of all keys are strictly equal.\n\t *\n\t * @return {boolean}\n\t */\n\tfunction shallowEqual(objA, objB) {\n\t if (objA === objB) {\n\t return true;\n\t }\n\t var key;\n\t // Test for A's keys different from B.\n\t for (key in objA) {\n\t if (objA.hasOwnProperty(key) &&\n\t (!objB.hasOwnProperty(key) || objA[key] !== objB[key])) {\n\t return false;\n\t }\n\t }\n\t // Test for B's keys missing from A.\n\t for (key in objB) {\n\t if (objB.hasOwnProperty(key) && !objA.hasOwnProperty(key)) {\n\t return false;\n\t }\n\t }\n\t return true;\n\t}\n\n\tmodule.exports = shallowEqual;\n\n\n/***/ }\n/******/ ])\n});\n;\n\n\n/** WEBPACK FOOTER **\n ** react-grid-layout.min.js\n **/"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId])\n \t\t\treturn installedModules[moduleId].exports;\n\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\texports: {},\n \t\t\tid: moduleId,\n \t\t\tloaded: false\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.loaded = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(0);\n\n\n/** WEBPACK FOOTER **\n ** webpack/bootstrap 846ebd358e525e727e07\n **/","module.exports = require('./lib/ReactGridLayout');\nmodule.exports.Responsive = require('./lib/ResponsiveReactGridLayout');\n\n\n\n/** WEBPACK FOOTER **\n ** ./index-dev.js\n **/","module.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** external \"React\"\n ** module id = 1\n ** module chunks = 0\n **/","'use strict';\n\nvar assign = require('object-assign');\n\nvar utils = module.exports = {\n\n /**\n * Return the bottom coordinate of the layout.\n *\n * @param {Array} layout Layout array.\n * @return {Number} Bottom coordinate.\n */\n bottom(layout) {\n var max = 0, bottomY;\n for (var i = 0, len = layout.length; i < len; i++) {\n bottomY = layout[i].y + layout[i].h;\n if (bottomY > max) max = bottomY;\n }\n return max;\n },\n\n /**\n * Clones a shallow object.\n * @param {Object} obj Object to clone.\n * @return {Object} Cloned object.\n */\n clone(obj) {\n return assign({}, obj);\n },\n\n /**\n * Given two layouts, check if they collide.\n *\n * @param {Object} l1 Layout object.\n * @param {Object} l2 Layout object.\n * @return {Boolean} True if colliding.\n */\n collides(l1, l2) {\n if (l1 === l2) return false; // same element\n if (l1.x + l1.w <= l2.x) return false; // l1 is left of l2\n if (l1.x >= l2.x + l2.w) return false; // l1 is right of l2\n if (l1.y + l1.h <= l2.y) return false; // l1 is above l2\n if (l1.y >= l2.y + l2.h) return false; // l1 is below l2\n return true; // boxes overlap\n },\n\n /**\n * Given a layout, compact it. This involves going down each y coordinate and removing gaps\n * between items.\n *\n * @param {Array} layout Layout.\n * @param {Boolean} verticalCompact Whether or not to compact the layout\n * vertically.\n * @return {Array} Compacted Layout.\n */\n compact(layout, verticalCompact) {\n // Statics go in the compareWith array right away so items flow around them.\n var compareWith = utils.getStatics(layout), out = [];\n // We go through the items by row and column.\n var sorted = utils.sortLayoutItemsByRowCol(layout);\n\n for (var i = 0, len = sorted.length; i < len; i++) {\n var l = sorted[i];\n\n // Don't move static elements\n if (!l.static) {\n l = utils.compactItem(compareWith, l, verticalCompact);\n\n // Add to comparison array. We only collide with items before this one.\n // Statics are already in this array.\n compareWith.push(l);\n }\n\n // Add to output array to make sure they still come out in the right order.\n out[layout.indexOf(l)] = l;\n\n // Clear moved flag, if it exists.\n delete l.moved;\n }\n\n return out;\n },\n\n compactItem(compareWith, l, verticalCompact) {\n if (verticalCompact) {\n // Move the element up as far as it can go without colliding.\n while (l.y > 0 && !utils.getFirstCollision(compareWith, l)) {\n l.y--;\n }\n }\n\n // Move it down, and keep moving it down if it's colliding.\n var collides;\n while((collides = utils.getFirstCollision(compareWith, l))) {\n l.y = collides.y + collides.h;\n }\n return l;\n },\n\n /**\n * Given a layout, make sure all elements fit within its bounds.\n *\n * @param {Array} layout Layout array.\n * @param {Number} bounds Number of columns.\n * @return {[type]} [description]\n */\n correctBounds(layout, bounds) {\n var collidesWith = utils.getStatics(layout);\n for (var i = 0, len = layout.length; i < len; i++) {\n var l = layout[i];\n // Overflows right\n if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w;\n // Overflows left\n if (l.x < 0) {\n l.x = 0;\n l.w = bounds.cols;\n }\n if (!l.static) collidesWith.push(l);\n else {\n // If this is static and collides with other statics, we must move it down.\n // We have to do something nicer than just letting them overlap.\n while(utils.getFirstCollision(collidesWith, l)) {\n l.y++;\n }\n }\n\n }\n return layout;\n },\n\n /**\n * Get a layout item by ID. Used so we can override later on if necessary.\n *\n * @param {Array} layout Layout array.\n * @param {Number} id ID\n * @return {LayoutItem} Item at ID.\n */\n getLayoutItem(layout, id) {\n id = \"\" + id;\n for (var i = 0, len = layout.length; i < len; i++) {\n if (\"\" + layout[i].i === id) return layout[i];\n }\n },\n\n /**\n * Returns the first item this layout collides with.\n * It doesn't appear to matter which order we approach this from, although\n * perhaps that is the wrong thing to do.\n *\n * @param {Object} layoutItem Layout item.\n * @return {Object|undefined} A colliding layout item, or undefined.\n */\n getFirstCollision(layout, layoutItem) {\n for (var i = 0, len = layout.length; i < len; i++) {\n if (utils.collides(layout[i], layoutItem)) return layout[i];\n }\n },\n\n getAllCollisions(layout, layoutItem) {\n var out = [];\n for (var i = 0, len = layout.length; i < len; i++) {\n if (utils.collides(layout[i], layoutItem)) out.push(layout[i]);\n }\n return out;\n },\n\n /**\n * Get all static elements.\n * @param {Array} layout Array of layout objects.\n * @return {Array} Array of static layout items..\n */\n getStatics(layout) {\n var out = [];\n for (var i = 0, len = layout.length; i < len; i++) {\n if (layout[i].static) out.push(layout[i]);\n }\n return out;\n },\n\n /**\n * Move an element. Responsible for doing cascading movements of other elements.\n *\n * @param {Array} layout Full layout to modify.\n * @param {LayoutItem} l element to move.\n * @param {Number} [x] X position in grid units.\n * @param {Number} [y] Y position in grid units.\n * @param {Boolean} [isUserAction] If true, designates that the item we're moving is\n * being dragged/resized by th euser.\n */\n moveElement(layout, l, x, y, isUserAction) {\n if (l.static) return layout;\n\n // Short-circuit if nothing to do.\n if (l.y === y && l.x === x) return layout;\n\n var movingUp = l.y > y;\n // This is quite a bit faster than extending the object\n if (x !== undefined) l.x = x;\n if (y !== undefined) l.y = y;\n l.moved = true;\n\n // If this collides with anything, move it.\n // When doing this comparison, we have to sort the items we compare with\n // to ensure, in the case of multiple collisions, that we're getting the\n // nearest collision.\n var sorted = utils.sortLayoutItemsByRowCol(layout);\n if (movingUp) sorted = sorted.reverse();\n var collisions = utils.getAllCollisions(sorted, l);\n\n // Move each item that collides away from this element.\n for (var i = 0, len = collisions.length; i < len; i++) {\n var collision = collisions[i];\n // console.log('resolving collision between', l.i, 'at', l.y, 'and', collision.i, 'at', collision.y);\n\n // Short circuit so we can't infinite loop\n if (collision.moved) continue;\n\n // This makes it feel a bit more precise by waiting to swap for just a bit when moving up.\n if (l.y > collision.y && l.y - collision.y > collision.h / 4) continue;\n\n // Don't move static items - we have to move *this* element away\n if (collision.static) {\n layout = utils.moveElementAwayFromCollision(layout, collision, l, isUserAction);\n } else {\n layout = utils.moveElementAwayFromCollision(layout, l, collision, isUserAction);\n }\n }\n\n return layout;\n },\n\n /**\n * This is where the magic needs to happen - given a collision, move an element away from the collision.\n * We attempt to move it up if there's room, otherwise it goes below.\n *\n * @param {Array} layout Full layout to modify.\n * @param {LayoutItem} collidesWith Layout item we're colliding with.\n * @param {LayoutItem} itemToMove Layout item we're moving.\n * @param {Boolean} [isUserAction] If true, designates that the item we're moving is being dragged/resized\n * by the user.\n */\n moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAction) {\n\n // If there is enough space above the collision to put this element, move it there.\n // We only do this on the main collision as this can get funky in cascades and cause\n // unwanted swapping behavior.\n if (isUserAction) {\n // Make a mock item so we don't modify the item here, only modify in moveElement.\n var fakeItem = {\n x: itemToMove.x,\n y: itemToMove.y,\n w: itemToMove.w,\n h: itemToMove.h\n };\n fakeItem.y = Math.max(collidesWith.y - itemToMove.h, 0);\n if (!utils.getFirstCollision(layout, fakeItem)) {\n return utils.moveElement(layout, itemToMove, undefined, fakeItem.y);\n }\n }\n\n // Previously this was optimized to move below the collision directly, but this can cause problems\n // with cascading moves, as an item may actually leapflog a collision and cause a reversal in order.\n return utils.moveElement(layout, itemToMove, undefined, itemToMove.y + 1);\n },\n\n /**\n * Helper to convert a number to a percentage string.\n *\n * @param {Number} num Any number\n * @return {String} That number as a percentage.\n */\n perc(num) {\n return num * 100 + '%';\n },\n\n setTransform(style, coords) {\n // Replace unitless items with px\n var x = ('' + coords[0]).replace(/(\\d)$/, '$1px');\n var y = ('' + coords[1]).replace(/(\\d)$/, '$1px');\n style.transform = \"translate(\" + x + \",\" + y + \")\";\n style.WebkitTransform = \"translate(\" + x + \",\" + y + \")\";\n style.MozTransform = \"translate(\" + x + \",\" + y + \")\";\n style.msTransform = \"translate(\" + x + \",\" + y + \")\";\n style.OTransform = \"translate(\" + x + \",\" + y + \")\";\n return style;\n },\n\n /**\n * Get layout items sorted from top left to right and down.\n *\n * @return {Array} Array of layout objects.\n * @return {Array} Layout, sorted static items first.\n */\n sortLayoutItemsByRowCol(layout) {\n return [].concat(layout).sort(function(a, b) {\n if (a.y > b.y || (a.y === b.y && a.x > b.x)) {\n return 1;\n }\n return -1;\n });\n },\n\n /**\n * Generate a layout using the initialLayout and children as a template.\n * Missing entries will be added, extraneous ones will be truncated.\n *\n * @param {Array} initialLayout Layout passed in through props.\n * @param {String} breakpoint Current responsive breakpoint.\n * @param {Boolean} verticalCompact Whether or not to compact the layout\n * vertically.\n * @return {Array} Working layout.\n */\n synchronizeLayoutWithChildren(initialLayout, children, cols, verticalCompact) {\n // ensure 'children' is always an array\n if (!Array.isArray(children)) {\n children = [children];\n }\n initialLayout = initialLayout || [];\n\n // Generate one layout item per child.\n var layout = [];\n for (var i = 0, len = children.length; i < len; i++) {\n var child = children[i];\n // Don't overwrite if it already exists.\n var exists = utils.getLayoutItem(initialLayout, child.key);\n if (exists) {\n // Ensure 'i' is always a string\n exists.i = '' + exists.i;\n layout.push(exists);\n continue;\n }\n // New item: attempt to use a layout item from the child, if it exists.\n var g = child.props._grid;\n if (g) {\n utils.validateLayout([g], 'ReactGridLayout.child');\n // Validated; add it to the layout. Bottom 'y' possible is the bottom of the layout.\n // This allows you to do nice stuff like specify {y: Infinity}\n if (verticalCompact) {\n layout.push(assign({}, g, {y: Math.min(utils.bottom(layout), g.y), i: child.key}));\n } else {\n layout.push(assign({}, g, {y: g.y, i:child.key}));\n }\n } else {\n // Nothing provided: ensure this is added to the bottom\n layout.push({w: 1, h: 1, x: 0, y: utils.bottom(layout), i: child.key});\n }\n }\n\n // Correct the layout.\n layout = utils.correctBounds(layout, {cols: cols});\n layout = utils.compact(layout, verticalCompact);\n\n return layout;\n },\n\n /**\n * Validate a layout. Throws errors.\n *\n * @param {Array} layout Array of layout items.\n * @param {String} [contextName] Context name for errors.\n * @throw {Error} Validation error.\n */\n validateLayout(layout, contextName) {\n contextName = contextName || \"Layout\";\n var subProps = ['x', 'y', 'w', 'h'];\n if (!Array.isArray(layout)) throw new Error(contextName + \" must be an array!\");\n for (var i = 0, len = layout.length; i < len; i++) {\n for (var j = 0; j < subProps.length; j++) {\n if (typeof layout[i][subProps[j]] !== 'number') {\n throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].' + subProps[j] + ' must be a Number!');\n }\n }\n if (layout[i].static !== undefined && typeof layout[i].static !== 'boolean') {\n throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].static must be a Boolean!');\n }\n }\n }\n};\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/utils.js\n **/","'use strict';\n\nfunction ToObject(val) {\n\tif (val == null) {\n\t\tthrow new TypeError('Object.assign cannot be called with null or undefined');\n\t}\n\n\treturn Object(val);\n}\n\nmodule.exports = Object.assign || function (target, source) {\n\tvar from;\n\tvar keys;\n\tvar to = ToObject(target);\n\n\tfor (var s = 1; s < arguments.length; s++) {\n\t\tfrom = arguments[s];\n\t\tkeys = Object.keys(Object(from));\n\n\t\tfor (var i = 0; i < keys.length; i++) {\n\t\t\tto[keys[i]] = from[keys[i]];\n\t\t}\n\t}\n\n\treturn to;\n};\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/object-assign/index.js\n ** module id = 3\n ** module chunks = 0\n **/","'use strict';\nvar deepEqual = require('deep-equal');\n\n// Like PureRenderMixin, but with deep comparisons.\nvar PureDeepRenderMixin = {\n shouldComponentUpdate: function(nextProps, nextState) {\n return !deepEqual(this.props, nextProps) ||\n !deepEqual(this.state, nextState);\n }\n};\n\nmodule.exports = PureDeepRenderMixin;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/mixins/PureDeepRenderMixin.js\n **/","'use strict';\nvar React = require('react');\nvar GridItem = require('./GridItem');\nvar utils = require('./utils');\nvar PureDeepRenderMixin = require('./mixins/PureDeepRenderMixin');\nvar WidthListeningMixin = require('./mixins/WidthListeningMixin');\n\n/**\n * A reactive, fluid grid layout with draggable, resizable components.\n */\nvar ReactGridLayout = React.createClass({\n mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n propTypes: {\n //\n // Basic props\n //\n\n // If true, the container height swells and contracts to fit contents\n autoSize: React.PropTypes.bool,\n // # of cols.\n cols: React.PropTypes.number,\n\n // A selector that will not be draggable.\n draggableCancel: React.PropTypes.string,\n // A selector for the draggable handler\n draggableHandle: React.PropTypes.string,\n\n // If true, the layout will compact vertically\n verticalCompact: React.PropTypes.bool,\n\n // layout is an array of object with the format:\n // {x: Number, y: Number, w: Number, h: Number, i: Number}\n layout: function(props, propName, componentName) {\n var layout = props.layout;\n // I hope you're setting the _grid property on the grid items\n if (layout === undefined) return;\n utils.validateLayout(layout, 'layout');\n },\n\n layouts: function(props, propName, componentName) {\n if (props.layouts) {\n throw new Error(\"ReactGridLayout does not use `layouts`: Use ReactGridLayout.Responsive.\");\n }\n },\n\n // margin between items [x, y] in px\n margin: React.PropTypes.array,\n // Rows have a static height, but you can change this based on breakpoints if you like\n rowHeight: React.PropTypes.number,\n\n //\n // Flags\n //\n isDraggable: React.PropTypes.bool,\n isResizable: React.PropTypes.bool,\n // Use CSS transforms instead of top/left\n useCSSTransforms: React.PropTypes.bool,\n\n //\n // Callbacks\n //\n\n // Callback so you can save the layout.\n // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n onLayoutChange: React.PropTypes.func,\n\n // Calls when drag starts. Callback is of the signature (layout, oldItem, newItem, placeholder, e).\n // All callbacks below have the same signature. 'start' and 'stop' callbacks omit the 'placeholder'.\n onDragStart: React.PropTypes.func,\n // Calls on each drag movement.\n onDrag: React.PropTypes.func,\n // Calls when drag is complete.\n onDragStop: React.PropTypes.func,\n //Calls when resize starts.\n onResizeStart: React.PropTypes.func,\n // Calls when resize movement happens.\n onResize: React.PropTypes.func,\n // Calls when resize is complete.\n onResizeStop: React.PropTypes.func,\n\n //\n // Other validations\n //\n\n // Children must not have duplicate keys.\n children: function(props, propName, componentName) {\n React.PropTypes.node.apply(this, arguments);\n var children = props[propName];\n\n // Check children keys for duplicates. Throw if found.\n var keys = {};\n React.Children.forEach(children, function(child, i, list) {\n if (keys[child.key]) {\n throw new Error(\"Duplicate child key found! This will cause problems in ReactGridLayout.\");\n }\n keys[child.key] = true;\n });\n }\n },\n\n getDefaultProps() {\n return {\n autoSize: true,\n cols: 12,\n rowHeight: 150,\n layout: [],\n margin: [10, 10],\n isDraggable: true,\n isResizable: true,\n useCSSTransforms: true,\n verticalCompact: true,\n onLayoutChange: function(){},\n onDragStart: function() {},\n onDrag: function() {},\n onDragStop: function() {},\n onResizeStart: function() {},\n onResize: function() {},\n onResizeStop: function() {}\n };\n },\n\n getInitialState() {\n return {\n activeDrag: null,\n isMounted: false,\n layout: utils.synchronizeLayoutWithChildren(this.props.layout, this.props.children, this.props.cols, this.props.verticalCompact),\n width: this.props.initialWidth\n };\n },\n\n componentDidMount() {\n // Call back with layout on mount. This should be done after correcting the layout width\n // to ensure we don't rerender with the wrong width.\n this.props.onLayoutChange(this.state.layout);\n this.setState({isMounted: true});\n },\n\n componentWillReceiveProps(nextProps) {\n // This allows you to set the width manually if you like.\n // Use manual width changes in combination with `listenToWindowResize: false`\n if (nextProps.width !== this.props.width) this.onWidthChange(nextProps.width);\n\n // If children change, regenerate the layout.\n if (nextProps.children.length !== this.props.children.length) {\n this.setState({\n layout: utils.synchronizeLayoutWithChildren(this.state.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n });\n }\n\n // Allow parent to set layout directly.\n if (nextProps.layout && JSON.stringify(nextProps.layout) !== JSON.stringify(this.state.layout)) {\n this.setState({\n layout: utils.synchronizeLayoutWithChildren(nextProps.layout, nextProps.children, nextProps.cols, this.props.verticalCompact)\n });\n }\n },\n\n componentDidUpdate(prevProps, prevState) {\n // Call back so we can store the layout\n // Do it only when a resize/drag is not active, otherwise there are way too many callbacks\n if (this.state.layout !== prevState.layout && !this.state.activeDrag) {\n this.props.onLayoutChange(this.state.layout, this.state.layouts);\n }\n },\n\n /**\n * Calculates a pixel value for the container.\n * @return {String} Container height in pixels.\n */\n containerHeight() {\n if (!this.props.autoSize) return;\n return utils.bottom(this.state.layout) * this.props.rowHeight + this.props.margin[1] + 'px';\n },\n\n /**\n * When the width changes, save it to state. This helps with left/width calculations.\n */\n onWidthChange(width) {\n this.setState({width: width});\n },\n\n /**\n * When dragging starts\n * @param {Number} i Index of the child\n * @param {Number} x X position of the move\n * @param {Number} y Y position of the move\n * @param {Event} e The mousedown event\n * @param {Element} element The current dragging DOM element\n * @param {Object} position Drag information\n */\n onDragStart(i, x, y, {e, element, position}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n\n // No need to clone, `l` hasn't changed.\n this.props.onDragStart(layout, l, l, null, e);\n },\n /**\n * Each drag movement create a new dragelement and move the element to the dragged location\n * @param {Number} i Index of the child\n * @param {Number} x X position of the move\n * @param {Number} y Y position of the move\n * @param {Event} e The mousedown event\n * @param {Element} element The current dragging DOM element\n * @param {Object} position Drag information\n */\n onDrag(i, x, y, {e, element, position}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n // Clone layout item so we can pass it to the callback.\n var oldL = utils.clone(l);\n\n // Create placeholder (display only)\n var placeholder = {\n w: l.w, h: l.h, x: l.x, y: l.y, placeholder: true, i: i\n };\n\n // Move the element to the dragged location.\n layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n this.props.onDrag(layout, oldL, l, placeholder, e);\n\n\n this.setState({\n layout: utils.compact(layout, this.props.verticalCompact),\n activeDrag: placeholder\n });\n },\n\n /**\n * When dragging stops, figure out which position the element is closest to and update its x and y.\n * @param {Number} i Index of the child.\n * @param {Number} i Index of the child\n * @param {Number} x X position of the move\n * @param {Number} y Y position of the move\n * @param {Event} e The mousedown event\n * @param {Element} element The current dragging DOM element\n * @param {Object} position Drag information\n */\n onDragStop(i, x, y, {e, element, position}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n var oldL = utils.clone(l);\n\n // Move the element here\n layout = utils.moveElement(layout, l, x, y, true /* isUserAction */);\n\n this.props.onDragStop(layout, oldL, l, null, e);\n\n // Set state\n this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: null });\n },\n\n onResizeStart(i, w, h, {e, element, size}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n\n // No need to clone, item hasn't changed\n this.props.onResizeStart(layout, l, l, null, e);\n },\n\n onResize(i, w, h, {e, element, size}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n var oldL = utils.clone(l);\n\n // Set new width and height.\n l.w = w;\n l.h = h;\n\n // Create placeholder element (display only)\n var placeholder = {\n w: w, h: h, x: l.x, y: l.y, placeholder: true, i: i\n };\n\n this.props.onResize(layout, oldL, l, placeholder, e);\n\n // Re-compact the layout and set the drag placeholder.\n this.setState({ layout: utils.compact(layout, this.props.verticalCompact), activeDrag: placeholder });\n },\n\n onResizeStop(i, x, y, {e, element, size}) {\n var layout = this.state.layout;\n var l = utils.getLayoutItem(layout, i);\n var oldL = utils.clone(l);\n\n this.props.onResizeStop(layout, oldL, l, null, e);\n\n this.setState({ activeDrag: null, layout: utils.compact(layout, this.props.verticalCompact) });\n },\n\n /**\n * Create a placeholder object.\n * @return {Element} Placeholder div.\n */\n placeholder() {\n if (!this.state.activeDrag) return '';\n\n // {...this.state.activeDrag} is pretty slow, actually\n return (\n \n
\n \n );\n },\n\n /**\n * Given a grid item, set its style attributes & surround in a .\n * @param {Element} child React element.\n * @param {Number} i Index of element.\n * @return {Element} Element wrapped in draggable and properly placed.\n */\n processGridItem(child) {\n var i = child.key;\n var l = utils.getLayoutItem(this.state.layout, i);\n\n // watchStart property tells Draggable to react to changes in the start param\n // Must be turned off on the item we're dragging as the changes in `activeDrag` cause rerenders\n var moveOnStartChange = !(this.state.activeDrag && this.state.activeDrag.i === i);\n\n // Parse 'static'. Any properties defined directly on the grid item will take precedence.\n var draggable, resizable;\n if (l.static || this.props.isDraggable === false) draggable = false;\n if (l.static || this.props.isResizable === false) resizable = false;\n\n return (\n \n {child}\n \n );\n },\n\n render() {\n // Calculate classname\n var {className, ...props} = this.props;\n className = 'react-grid-layout ' + (className || '');\n\n return (\n
\n {React.Children.map(this.props.children, this.processGridItem)}\n {this.placeholder()}\n
\n );\n }\n});\n\nmodule.exports = ReactGridLayout;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/ReactGridLayout.jsx\n **/","'use strict';\nvar React = require('react');\n\n/**\n * A simple mixin that provides facility for listening to container resizes.\n */\nvar WidthListeningMixin = {\n\n propTypes: {\n // This allows setting this on the server side\n initialWidth: React.PropTypes.number,\n\n // If false, you should supply width yourself. Good if you want to debounce resize events\n // or reuse a handler from somewhere else.\n listenToWindowResize: React.PropTypes.bool\n },\n\n getDefaultProps: function() {\n return {\n initialWidth: 1280,\n listenToWindowResize: true\n };\n },\n\n componentDidMount: function() {\n if (this.props.listenToWindowResize) {\n window.addEventListener('resize', this.onWindowResize);\n // This is intentional. Once to properly set the breakpoint and resize the elements,\n // and again to compensate for any scrollbar that appeared because of the first step.\n this.onWindowResize();\n this.onWindowResize();\n }\n },\n\n componentWillUnmount() {\n window.removeEventListener('resize', this.onWindowResize);\n },\n\n /**\n * On window resize, update width.\n */\n onWindowResize: function() {\n this.onWidthChange(this.getDOMNode().offsetWidth);\n }\n\n};\n\nmodule.exports = WidthListeningMixin;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/mixins/WidthListeningMixin.js\n **/","module.exports = require('./lib/draggable');\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-draggable/index.js\n ** module id = 7\n ** module chunks = 0\n **/","'use strict';\n\nvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\nvar React = require('react');\nvar Draggable = require('react-draggable');\nvar PureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');\nvar assign = require('object-assign');\nvar cloneElement = require('./cloneElement');\n\nvar Resizable = module.exports = React.createClass({\n displayName: 'Resizable',\n mixins: [PureRenderMixin],\n\n propTypes: {\n // Require that one and only one child be present.\n children: React.PropTypes.element.isRequired,\n // Functions\n onResizeStop: React.PropTypes.func,\n onResizeStart: React.PropTypes.func,\n onResize: React.PropTypes.func,\n\n width: React.PropTypes.number.isRequired,\n height: React.PropTypes.number.isRequired,\n // If you change this, be sure to update your css\n handleSize: React.PropTypes.array,\n // These will be passed wholesale to react-draggable\n draggableOpts: React.PropTypes.object\n },\n\n getDefaultProps: function getDefaultProps() {\n return {\n handleSize: [20, 20]\n };\n },\n\n getInitialState: function getInitialState() {\n return {\n bounds: this.constraintsToBounds(),\n initialWidth: this.props.width,\n initialHeight: this.props.height\n };\n },\n\n componentWillReceiveProps: function componentWillReceiveProps(props) {\n if (!this.state.resizing) {\n this.setState({\n initialWidth: props.width,\n initialHeight: props.height\n });\n this.refs.draggable.resetState();\n }\n },\n\n constraintsToBounds: function constraintsToBounds() {\n var p = this.props;\n var mins = p.minConstraints || p.handleSize;\n var maxes = p.maxConstraints || [Infinity, Infinity];\n return {\n left: mins[0] - p.width,\n top: mins[1] - p.height,\n right: maxes[0] - p.width,\n bottom: maxes[1] - p.height\n };\n },\n\n /**\n * Wrapper around drag events to provide more useful data.\n *\n * @param {String} handlerName Handler name to wrap.\n * @return {Function} Handler function.\n */\n resizeHandler: function resizeHandler(handlerName) {\n var me = this;\n return function (e, _ref) {\n var node = _ref.node;\n var position = _ref.position;\n\n me.props[handlerName] && me.props[handlerName](e, { node: node, size: calcWH(me.state, position) });\n\n if (handlerName === 'onResizeStart') {\n me.setState({ resizing: true });\n } else if (handlerName === 'onResizeStop') {\n me.setState({ resizing: false });\n }\n };\n },\n\n render: function render() {\n var p = this.props,\n s = this.state;\n\n // What we're doing here is getting the child of this element, and cloning it with this element's props.\n // We are then defining its children as:\n // Its original children (resizable's child's children), and\n // A draggable handle.\n return cloneElement(p.children, assign({}, p, {\n children: [p.children.props.children, React.createElement(\n Draggable,\n _extends({}, p.draggableOpts, {\n ref: 'draggable',\n onStop: this.resizeHandler('onResizeStop'),\n onStart: this.resizeHandler('onResizeStart'),\n onDrag: this.resizeHandler('onResize'),\n bounds: this.state.bounds\n }),\n React.createElement('span', { className: 'react-resizable-handle' })\n )]\n }));\n }\n});\n\n/**\n * Parse left and top coordinates.\n * @param {Number} options.left Left coordinate.\n * @param {Number} options.top Top coordinate.\n * @return {Object} Coordinates\n */\nfunction calcWH(_ref, _ref2) {\n var initialWidth = _ref.initialWidth;\n var initialHeight = _ref.initialHeight;\n var left = _ref2.left;\n var top = _ref2.top;\n\n return { width: initialWidth + left, height: initialHeight + top };\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/build/Resizable.js\n ** module id = 8\n ** module chunks = 0\n **/","/**\n * Copyright 2013-2015, Facebook, Inc.\n * All rights reserved.\n *\n * This source code is licensed under the BSD-style license found in the\n * LICENSE file in the root directory of this source tree. An additional grant\n * of patent rights can be found in the PATENTS file in the same directory.\n *\n* @providesModule ReactComponentWithPureRenderMixin\n*/\n\n'use strict';\n\nvar shallowEqual = require(\"./shallowEqual\");\n\n/**\n * If your React component's render function is \"pure\", e.g. it will render the\n * same result given the same props and state, provide this Mixin for a\n * considerable performance boost.\n *\n * Most React components have pure render functions.\n *\n * Example:\n *\n * var ReactComponentWithPureRenderMixin =\n * require('ReactComponentWithPureRenderMixin');\n * React.createClass({\n * mixins: [ReactComponentWithPureRenderMixin],\n *\n * render: function() {\n * return
foo
;\n * }\n * });\n *\n * Note: This only checks shallow equality for props and state. If these contain\n * complex data structures this mixin may have false-negatives for deeper\n * differences. Only mixin to components which have simple props and state, or\n * use `forceUpdate()` when you know deep data structures have changed.\n */\nvar ReactComponentWithPureRenderMixin = {\n shouldComponentUpdate: function(nextProps, nextState) {\n return !shallowEqual(this.props, nextProps) ||\n !shallowEqual(this.state, nextState);\n }\n};\n\nmodule.exports = ReactComponentWithPureRenderMixin;\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react/lib/ReactComponentWithPureRenderMixin.js\n ** module id = 9\n ** module chunks = 0\n **/","'use strict';\nvar React = require('react');\nvar cloneWithProps = require('react/lib/cloneWithProps');\nvar utils = require('./utils');\nvar Draggable = require('react-draggable');\nvar Resizable = require('react-resizable').Resizable;\nvar PureDeepRenderMixin = require('./mixins/PureDeepRenderMixin');\n\n/**\n * An individual item within a ReactGridLayout.\n */\nvar GridItem = React.createClass({\n mixins: [PureDeepRenderMixin],\n\n propTypes: {\n // Children must be only a single element\n children: React.PropTypes.element,\n\n // General grid attributes\n cols: React.PropTypes.number.isRequired,\n containerWidth: React.PropTypes.number.isRequired,\n rowHeight: React.PropTypes.number.isRequired,\n margin: React.PropTypes.array.isRequired,\n\n // These are all in grid units\n x: React.PropTypes.number.isRequired,\n y: React.PropTypes.number.isRequired,\n w: React.PropTypes.number.isRequired,\n h: React.PropTypes.number.isRequired,\n\n // All optional\n minW: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.minW > props.w || props.minW > props.maxW) constraintError('minW', props);\n },\n maxW: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.maxW < props.w || props.maxW < props.minW) constraintError('maxW', props);\n },\n minH: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.minH > props.h || props.minH > props.maxH) constraintError('minH', props);\n },\n maxH: function(props, propName, componentName) {\n React.PropTypes.number.apply(this, arguments);\n if (props.maxH < props.h || props.maxH < props.minH) constraintError('maxH', props);\n },\n\n // ID is nice to have for callbacks\n i: React.PropTypes.string.isRequired,\n\n // If true, item will be repositioned when x/y/w/h change\n moveOnStartChange: React.PropTypes.bool,\n\n // Functions\n onDragStop: React.PropTypes.func,\n onDragStart: React.PropTypes.func,\n onDrag: React.PropTypes.func,\n onResizeStop: React.PropTypes.func,\n onResizeStart: React.PropTypes.func,\n onResize: React.PropTypes.func,\n\n // Flags\n isDraggable: React.PropTypes.bool,\n isResizable: React.PropTypes.bool,\n // Use CSS transforms instead of top/left\n useCSSTransforms: React.PropTypes.bool,\n isPlaceholder: React.PropTypes.bool,\n\n // Others\n className: React.PropTypes.string,\n // Selector for draggable handle\n handle: React.PropTypes.string,\n // Selector for draggable cancel (see react-draggable)\n cancel: React.PropTypes.string\n },\n\n getDefaultProps() {\n return {\n isDraggable: true,\n isResizable: true,\n useCSSTransforms: true,\n className: '',\n cancel: '',\n minH: 1,\n minW: 1,\n maxH: Infinity,\n maxW: Infinity\n };\n },\n\n getInitialState() {\n return {\n resizing: false,\n className: ''\n };\n },\n\n /**\n * Return position on the page given an x, y, w, h.\n * left, top, width, height are all in pixels.\n * @param {Number} x X coordinate in grid units.\n * @param {Number} y Y coordinate in grid units.\n * @param {Number} w W coordinate in grid units.\n * @param {Number} h H coordinate in grid units.\n * @return {Object} Object containing coords.\n */\n calcPosition(x, y, w, h) {\n var p = this.props;\n var width = p.containerWidth - p.margin[0];\n var out = {\n left: width * (x / p.cols) + p.margin[0],\n top: p.rowHeight * y + p.margin[1],\n width: width * (w / p.cols) - p.margin[0],\n height: h * p.rowHeight - p.margin[1]\n };\n return out;\n },\n\n /**\n * Translate x and y coordinates from pixels to grid units.\n * @param {Number} options.left Left offset in pixels.\n * @param {Number} options.top Top offset in pixels.\n * @return {Object} x and y in grid units.\n */\n calcXY({left, top}) {\n left = left - this.props.margin[0];\n top = top - this.props.margin[1];\n // This is intentional; because so much of the logic on moving boxes up/down relies\n // on an exact y position, we only round the x, not the y.\n var x = Math.round((left / this.props.containerWidth) * this.props.cols);\n var y = Math.floor(top / this.props.rowHeight);\n x = Math.max(Math.min(x, this.props.cols), 0);\n y = Math.max(y, 0);\n return {x, y};\n },\n\n /**\n * Given a height and width in pixel values, calculate grid units.\n * @param {Number} options.height Height in pixels.\n * @param {Number} options.width Width in pixels.\n * @return {Object} w, h as grid units.\n */\n calcWH({height, width}) {\n width = width + this.props.margin[0];\n height = height + this.props.margin[1];\n var w = Math.round((width / this.props.containerWidth) * this.props.cols);\n var h = Math.round(height / this.props.rowHeight);\n w = Math.max(Math.min(w, this.props.cols - this.props.x), 0);\n h = Math.max(h, 0);\n return {w, h};\n },\n\n /**\n * This is where we set the grid item's absolute placement. It gets a little tricky because we want to do it\n * well when server rendering, and the only way to do that properly is to use percentage width/left because\n * we don't know exactly what the browser viewport is.\n * Unfortunately, CSS Transforms, which are great for performance, break in this instance because a percentage\n * left is relative to the item itself, not its container! So we cannot use them on the server rendering pass.\n *\n * @param {Object} pos Position object with width, height, left, top.\n * @return {Object} Style object.\n */\n createStyle(pos) {\n var style = {\n width: pos.width + 'px',\n height: pos.height + 'px',\n left: pos.left + 'px',\n top: pos.top + 'px',\n position: 'absolute'\n };\n\n // This is used for server rendering.\n if (this.props.usePercentages) {\n pos.left = utils.perc(pos.left / this.props.containerWidth);\n style.left = pos.left;\n style.width = utils.perc(pos.width / this.props.containerWidth);\n }\n\n // CSS Transforms support\n if (this.props.useCSSTransforms) {\n utils.setTransform(style, [pos.left, pos.top]);\n delete style.left;\n delete style.top;\n }\n\n return style;\n },\n\n /**\n * Mix a Draggable instance into a child.\n * @param {Element} child Child element.\n * @param {Object} position Position object (pixel values)\n * @return {Element} Child wrapped in Draggable.\n */\n mixinDraggable(child, position) {\n var start = typeof position.left === \"string\" ? undefined : {x: position.left, y: position.top};\n return (\n \n {child}\n \n );\n },\n\n /**\n * Mix a Resizable instance into a child.\n * @param {Element} child Child element.\n * @param {Object} position Position object (pixel values)\n * @return {Element} Child wrapped in Resizable.\n */\n mixinResizable(child, position) {\n var p = this.props;\n // This is the max possible width - doesn't go to infinity because of the width of the window\n var maxWidth = this.calcPosition(0, 0, p.cols - p.x, 0).width;\n\n // Calculate min/max constraints using our min & maxes\n var mins = this.calcPosition(0, 0, p.minW, p.minH);\n var maxes = this.calcPosition(0, 0, p.maxW, p.maxH);\n var minConstraints = [mins.width, mins.height];\n var maxConstraints = [Math.min(maxes.width, maxWidth), Math.min(maxes.height, Infinity)];\n return (\n \n {child}\n \n );\n },\n\n /**\n * Wrapper around drag events to provide more useful data.\n * All drag events call the function with the given handler name,\n * with the signature (index, x, y).\n *\n * @param {String} handlerName Handler name to wrap.\n * @return {Function} Handler function.\n */\n onDragHandler(handlerName) {\n var me = this;\n return function(e, {element, position}) {\n if (!me.props[handlerName]) return;\n // Get new XY\n var {x, y} = me.calcXY(position);\n\n // Cap x at numCols\n x = Math.min(x, me.props.cols - me.props.w);\n\n me.props[handlerName](me.props.i, x, y, {e, element, position});\n };\n },\n\n /**\n * Wrapper around drag events to provide more useful data.\n * All drag events call the function with the given handler name,\n * with the signature (index, x, y).\n *\n * @param {String} handlerName Handler name to wrap.\n * @return {Function} Handler function.\n */\n onResizeHandler(handlerName) {\n var me = this;\n return function(e, {element, size}) {\n if (!me.props[handlerName]) return;\n\n console.log(size);\n\n // Get new XY\n var {w, h} = me.calcWH(size);\n\n // Cap w at numCols\n w = Math.min(w, me.props.cols - me.props.x);\n // Ensure w is at least 1\n w = Math.max(w, 1);\n\n // Min/max capping\n w = Math.max(Math.min(w, me.props.maxW), me.props.minW);\n h = Math.max(Math.min(h, me.props.maxH), me.props.minH);\n\n me.setState({resizing: handlerName === 'onResizeStop' ? null : size});\n\n me.props[handlerName](me.props.i, w, h, {e, element, size});\n };\n },\n\n render() {\n var p = this.props, pos = this.calcPosition(p.x, p.y, p.w, p.h);\n if (this.state.resizing) {\n pos.width = this.state.resizing.width;\n pos.height = this.state.resizing.height;\n }\n\n // Create the child element. We clone the existing element but modify its className and style.\n var child = cloneWithProps(this.props.children, {\n // Munge a classname. Use passed in classnames and resizing.\n // React with merge the classNames.\n className: ['react-grid-item', this.props.className, this.state.resizing ? 'resizing' : '',\n this.props.useCSSTransforms ? 'cssTransforms' : ''].join(' '),\n // We can set the width and height on the child, but unfortunately we can't set the position.\n style: this.createStyle(pos)\n });\n\n // Resizable support. This is usually on but the user can toggle it off.\n if (this.props.isResizable) {\n child = this.mixinResizable(child, pos);\n }\n\n // Draggable support. This is always on, except for with placeholders.\n if (this.props.isDraggable) {\n child = this.mixinDraggable(child, pos);\n }\n\n return child;\n }\n});\n\nfunction constraintError(name, props) {\n delete props.children;\n throw new Error(name + ' overrides contraints on gridItem ' + props.i + '. Full props: ' + JSON.stringify(props));\n}\n\nmodule.exports = GridItem;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/GridItem.jsx\n **/","'use strict';\nvar React = require('react');\nvar utils = require('./utils');\nvar responsiveUtils = require('./responsiveUtils');\nvar PureDeepRenderMixin = require('./mixins/PureDeepRenderMixin');\nvar WidthListeningMixin = require('./mixins/WidthListeningMixin');\nvar ReactGridLayout = require('./ReactGridLayout');\n\n/**\n * A wrapper around ReactGridLayout to support responsive breakpoints.\n */\nvar ResponsiveReactGridLayout = React.createClass({\n mixins: [PureDeepRenderMixin, WidthListeningMixin],\n\n propTypes: {\n //\n // Basic props\n //\n\n // Optional, but if you are managing width yourself you may want to set the breakpoint\n // yourself as well.\n breakpoint: React.PropTypes.string,\n\n // {name: pxVal}, e.g. {lg: 1200, md: 996, sm: 768, xs: 480}\n breakpoints: React.PropTypes.object,\n\n // # of cols. This is a breakpoint -> cols map\n cols: React.PropTypes.object,\n\n // layouts is an object mapping breakpoints to layouts.\n // e.g. {lg: Layout, md: Layout, ...}\n layouts: function(props, propName, componentName) {\n React.PropTypes.object.isRequired.apply(this, arguments);\n\n var layouts = props.layouts;\n Object.keys(layouts).map(function(k) {\n utils.validateLayout(layouts[k], 'layouts.' + k);\n });\n },\n\n //\n // Callbacks\n //\n\n // Calls back with breakpoint and new # cols\n onBreakpointChange: React.PropTypes.func,\n\n // Callback so you can save the layout.\n // Calls back with (currentLayout, allLayouts). allLayouts are keyed by breakpoint.\n onLayoutChange: React.PropTypes.func\n },\n\n getDefaultProps() {\n return {\n breakpoints: {lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0},\n cols: {lg: 12, md: 10, sm: 6, xs: 4, xxs: 2},\n layouts: {},\n onBreakpointChange: function(){},\n onLayoutChange: function(){}\n };\n },\n\n getInitialState() {\n var breakpoint = this.props.breakpoint ||\n responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, this.props.initialWidth);\n var cols = responsiveUtils.getColsFromBreakpoint(breakpoint, this.props.cols);\n\n // Get the initial layout. This can tricky; we try to generate one however possible if one doesn't exist\n // for this layout.\n var initialLayout = responsiveUtils.findOrGenerateResponsiveLayout(\n this.props.layouts, this.props.breakpoints, breakpoint, breakpoint, cols, this.props.verticalCompact);\n\n return {\n layout: initialLayout,\n // storage for layouts obsoleted by breakpoints\n layouts: this.props.layouts || {},\n breakpoint: breakpoint,\n cols: cols,\n width: this.props.initialWidth\n };\n },\n\n componentWillReceiveProps(nextProps) {\n // This allows you to set the width manually if you like.\n // Use manual width changes in combination with `listenToWindowResize: false`\n if (nextProps.width) this.onWidthChange(nextProps.width);\n\n // Allow parent to set breakpoint directly.\n if (nextProps.breakpoint !== this.props.breakpoint) {\n this.onWidthChange(this.state.width);\n }\n\n // Allow parent to set layouts directly.\n if (nextProps.layouts && nextProps.layouts !== this.state.layouts) {\n // Since we're setting an entirely new layout object, we must generate a new responsive layout\n // if one does not exist.\n var newLayout = responsiveUtils.findOrGenerateResponsiveLayout(\n nextProps.layouts, nextProps.breakpoints, this.state.breakpoint, this.state.breakpoint, this.state.cols, this.props.verticalLayout);\n\n this.setState({\n layouts: nextProps.layouts,\n layout: newLayout\n });\n }\n },\n\n /**\n * Bubble this up, add `layouts` object.\n * @param {Array} layout Layout from inner Grid.\n */\n onLayoutChange(layout) {\n this.state.layouts[this.state.breakpoint] = layout;\n this.setState({layout: layout, layouts: this.state.layouts});\n this.props.onLayoutChange(layout, this.state.layouts);\n },\n\n /**\n * When the width changes work through breakpoints and reset state with the new width & breakpoint.\n * Width changes are necessary to figure out the widget widths.\n */\n onWidthChange(width) {\n // Set new breakpoint\n var newState = {width: width};\n newState.breakpoint = this.props.breakpoint ||\n responsiveUtils.getBreakpointFromWidth(this.props.breakpoints, newState.width);\n newState.cols = responsiveUtils.getColsFromBreakpoint(newState.breakpoint, this.props.cols);\n\n // Breakpoint change\n if (newState.cols !== this.state.cols) {\n\n // Store the current layout\n newState.layouts = this.state.layouts;\n newState.layouts[this.state.breakpoint] = JSON.parse(JSON.stringify(this.state.layout));\n\n // Find or generate a new one.\n newState.layout = responsiveUtils.findOrGenerateResponsiveLayout(\n newState.layouts, this.props.breakpoints, newState.breakpoint, this.state.breakpoint, newState.cols, this.props.verticalLayout);\n\n // This adds missing items.\n newState.layout = utils.synchronizeLayoutWithChildren(newState.layout, this.props.children, newState.cols, this.props.verticalCompact);\n\n // Store this new layout as well.\n newState.layouts[newState.breakpoint] = newState.layout;\n\n this.props.onBreakpointChange(newState.breakpoint, newState.cols);\n }\n\n this.setState(newState);\n },\n\n\n render() {\n // Don't pass responsive props to RGL.\n /*jshint unused:false*/\n var {layouts, onBreakpointChange, breakpoints, ...props} = this.props;\n return (\n \n {this.props.children}\n \n );\n }\n});\n\nmodule.exports = ResponsiveReactGridLayout;\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/ResponsiveReactGridLayout.jsx\n **/","'use strict';\n\nvar utils = require('./utils');\n\nvar responsiveUtils = module.exports = {\n\n /**\n * Given a width, find the highest breakpoint that matches is valid for it (width > breakpoint).\n *\n * @param {Object} breakpoints Breakpoints object (e.g. {lg: 1200, md: 960, ...})\n * @param {Number} width Screen width.\n * @return {String} Highest breakpoint that is less than width.\n */\n getBreakpointFromWidth(breakpoints, width) {\n var sorted = responsiveUtils.sortBreakpoints(breakpoints);\n var matching = sorted[0];\n for (var i = 1, len = sorted.length; i < len; i++) {\n var breakpointName = sorted[i];\n if (width > breakpoints[breakpointName]) matching = breakpointName;\n }\n return matching;\n },\n\n\n /**\n * Given a breakpoint, get the # of cols set for it.\n * @param {String} breakpoint Breakpoint name.\n * @param {Object} cols Map of breakpoints to cols.\n * @return {Number} Number of cols.\n */\n getColsFromBreakpoint(breakpoint, cols) {\n if (!cols[breakpoint]) {\n throw new Error(\"ResponsiveReactGridLayout: `cols` entry for breakpoint \" + breakpoint + \" is missing!\");\n }\n return cols[breakpoint];\n },\n\n /**\n * Given existing layouts and a new breakpoint, find or generate a new layout.\n *\n * This finds the layout above the new one and generates from it, if it exists.\n *\n * @param {Array} layouts Existing layouts.\n * @param {Array} breakpoints All breakpoints.\n * @param {String} breakpoint New breakpoint.\n * @param {String} breakpoint Last breakpoint (for fallback).\n * @param {Number} cols Column count at new breakpoint.\n * @param {Boolean} verticalCompact Whether or not to compact the layout\n * vertically.\n * @return {Array} New layout.\n */\n findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, lastBreakpoint, cols, verticalCompact) {\n // If it already exists, just return it.\n if (layouts[breakpoint]) return layouts[breakpoint];\n // Find or generate the next layout\n var layout = layouts[lastBreakpoint];\n var breakpointsSorted = responsiveUtils.sortBreakpoints(breakpoints);\n var breakpointsAbove = breakpointsSorted.slice(breakpointsSorted.indexOf(breakpoint));\n for (var i = 0, len = breakpointsAbove.length; i < len; i++) {\n var b = breakpointsAbove[i];\n if (layouts[b]) {\n layout = layouts[b];\n break;\n }\n }\n layout = JSON.parse(JSON.stringify(layout || [])); // clone layout so we don't modify existing items\n return utils.compact(utils.correctBounds(layout, {cols: cols}), verticalCompact);\n },\n\n\n /**\n * Given breakpoints, return an array of breakpoints sorted by width. This is usually\n * e.g. ['xxs', 'xs', 'sm', ...]\n *\n * @param {Object} breakpoints Key/value pair of breakpoint names to widths.\n * @return {Array} Sorted breakpoints.\n */\n sortBreakpoints(breakpoints) {\n var keys = Object.keys(breakpoints);\n return keys.sort(function(a, b) {\n return breakpoints[a] - breakpoints[b];\n });\n }\n};\n\n\n\n/** WEBPACK FOOTER **\n ** ./lib/responsiveUtils.js\n **/","var pSlice = Array.prototype.slice;\nvar objectKeys = require('./lib/keys.js');\nvar isArguments = require('./lib/is_arguments.js');\n\nvar deepEqual = module.exports = function (actual, expected, opts) {\n if (!opts) opts = {};\n // 7.1. All identical values are equivalent, as determined by ===.\n if (actual === expected) {\n return true;\n\n } else if (actual instanceof Date && expected instanceof Date) {\n return actual.getTime() === expected.getTime();\n\n // 7.3. Other pairs that do not both pass typeof value == 'object',\n // equivalence is determined by ==.\n } else if (typeof actual != 'object' && typeof expected != 'object') {\n return opts.strict ? actual === expected : actual == expected;\n\n // 7.4. For all other Object pairs, including Array objects, equivalence is\n // determined by having the same number of owned properties (as verified\n // with Object.prototype.hasOwnProperty.call), the same set of keys\n // (although not necessarily the same order), equivalent values for every\n // corresponding key, and an identical 'prototype' property. Note: this\n // accounts for both named and indexed properties on Arrays.\n } else {\n return objEquiv(actual, expected, opts);\n }\n}\n\nfunction isUndefinedOrNull(value) {\n return value === null || value === undefined;\n}\n\nfunction isBuffer (x) {\n if (!x || typeof x !== 'object' || typeof x.length !== 'number') return false;\n if (typeof x.copy !== 'function' || typeof x.slice !== 'function') {\n return false;\n }\n if (x.length > 0 && typeof x[0] !== 'number') return false;\n return true;\n}\n\nfunction objEquiv(a, b, opts) {\n var i, key;\n if (isUndefinedOrNull(a) || isUndefinedOrNull(b))\n return false;\n // an identical 'prototype' property.\n if (a.prototype !== b.prototype) return false;\n //~~~I've managed to break Object.keys through screwy arguments passing.\n // Converting to array solves the problem.\n if (isArguments(a)) {\n if (!isArguments(b)) {\n return false;\n }\n a = pSlice.call(a);\n b = pSlice.call(b);\n return deepEqual(a, b, opts);\n }\n if (isBuffer(a)) {\n if (!isBuffer(b)) {\n return false;\n }\n if (a.length !== b.length) return false;\n for (i = 0; i < a.length; i++) {\n if (a[i] !== b[i]) return false;\n }\n return true;\n }\n try {\n var ka = objectKeys(a),\n kb = objectKeys(b);\n } catch (e) {//happens when one is a string literal and the other isn't\n return false;\n }\n // having the same number of owned properties (keys incorporates\n // hasOwnProperty)\n if (ka.length != kb.length)\n return false;\n //the same set of keys (although not necessarily the same order),\n ka.sort();\n kb.sort();\n //~~~cheap key test\n for (i = ka.length - 1; i >= 0; i--) {\n if (ka[i] != kb[i])\n return false;\n }\n //equivalent values for every corresponding key, and\n //~~~possibly expensive deep test\n for (i = ka.length - 1; i >= 0; i--) {\n key = ka[i];\n if (!deepEqual(a[key], b[key], opts)) return false;\n }\n return typeof a === typeof b;\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/deep-equal/index.js\n ** module id = 13\n ** module chunks = 0\n **/","var supportsArgumentsClass = (function(){\n return Object.prototype.toString.call(arguments)\n})() == '[object Arguments]';\n\nexports = module.exports = supportsArgumentsClass ? supported : unsupported;\n\nexports.supported = supported;\nfunction supported(object) {\n return Object.prototype.toString.call(object) == '[object Arguments]';\n};\n\nexports.unsupported = unsupported;\nfunction unsupported(object){\n return object &&\n typeof object == 'object' &&\n typeof object.length == 'number' &&\n Object.prototype.hasOwnProperty.call(object, 'callee') &&\n !Object.prototype.propertyIsEnumerable.call(object, 'callee') ||\n false;\n};\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/deep-equal/lib/is_arguments.js\n ** module id = 14\n ** module chunks = 0\n **/","exports = module.exports = typeof Object.keys === 'function'\n ? Object.keys : shim;\n\nexports.shim = shim;\nfunction shim (obj) {\n var keys = [];\n for (var key in obj) keys.push(key);\n return keys;\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/deep-equal/lib/keys.js\n ** module id = 15\n ** module chunks = 0\n **/","'use strict';\n\nvar React = require('react');\nvar emptyFunction = function(){};\nvar assign = require('object-assign');\nvar classNames = require('classnames');\n\n//\n// Helpers. See Element definition below this section.\n//\n\nfunction createUIEvent(draggable) {\n // State changes are often (but not always!) async. We want the latest value.\n var state = draggable._pendingState || draggable.state;\n return {\n node: draggable.getDOMNode(),\n position: {\n top: state.clientY,\n left: state.clientX\n }\n };\n}\n\nfunction canDragY(draggable) {\n return draggable.props.axis === 'both' ||\n draggable.props.axis === 'y';\n}\n\nfunction canDragX(draggable) {\n return draggable.props.axis === 'both' ||\n draggable.props.axis === 'x';\n}\n\nfunction isFunction(func) {\n return typeof func === 'function' || Object.prototype.toString.call(func) === '[object Function]';\n}\n\n// @credits https://gist.github.com/rogozhnikoff/a43cfed27c41e4e68cdc\nfunction findInArray(array, callback) {\n for (var i = 0, length = array.length; i < length; i++) {\n if (callback.apply(callback, [array[i], i, array])) return array[i];\n }\n}\n\nfunction matchesSelector(el, selector) {\n var method = findInArray([\n 'matches',\n 'webkitMatchesSelector',\n 'mozMatchesSelector',\n 'msMatchesSelector',\n 'oMatchesSelector'\n ], function(method){\n return isFunction(el[method]);\n });\n\n return el[method].call(el, selector);\n}\n\n/**\n * simple abstraction for dragging events names\n * */\nvar eventsFor = {\n touch: {\n start: 'touchstart',\n move: 'touchmove',\n end: 'touchend'\n },\n mouse: {\n start: 'mousedown',\n move: 'mousemove',\n end: 'mouseup'\n }\n};\n\n// Default to mouse events\nvar dragEventFor = eventsFor['mouse'];\n\n/**\n * get {clientX, clientY} positions of control\n * */\nfunction getControlPosition(e) {\n var position = (e.touches && e.touches[0]) || e;\n return {\n clientX: position.clientX,\n clientY: position.clientY\n };\n}\n\nfunction addEvent(el, event, handler) {\n if (!el) { return; }\n if (el.attachEvent) {\n el.attachEvent('on' + event, handler);\n } else if (el.addEventListener) {\n el.addEventListener(event, handler, true);\n } else {\n el['on' + event] = handler;\n }\n}\n\nfunction removeEvent(el, event, handler) {\n if (!el) { return; }\n if (el.detachEvent) {\n el.detachEvent('on' + event, handler);\n } else if (el.removeEventListener) {\n el.removeEventListener(event, handler, true);\n } else {\n el['on' + event] = null;\n }\n}\n\nfunction outerHeight(node) {\n // This is deliberately excluding margin for our calculations, since we are using\n // offsetTop which is including margin. See getBoundPosition\n var height = node.clientHeight;\n var computedStyle = window.getComputedStyle(node);\n height += int(computedStyle.borderTopWidth);\n height += int(computedStyle.borderBottomWidth);\n return height;\n}\n\nfunction outerWidth(node) {\n // This is deliberately excluding margin for our calculations, since we are using\n // offsetLeft which is including margin. See getBoundPosition\n var width = node.clientWidth;\n var computedStyle = window.getComputedStyle(node);\n width += int(computedStyle.borderLeftWidth);\n width += int(computedStyle.borderRightWidth);\n return width;\n}\nfunction innerHeight(node) {\n var height = node.clientHeight;\n var computedStyle = window.getComputedStyle(node);\n height -= int(computedStyle.paddingTop);\n height -= int(computedStyle.paddingBottom);\n return height;\n}\n\nfunction innerWidth(node) {\n var width = node.clientWidth;\n var computedStyle = window.getComputedStyle(node);\n width -= int(computedStyle.paddingLeft);\n width -= int(computedStyle.paddingRight);\n return width;\n}\n\nfunction isNum(num) {\n return typeof num === 'number' && !isNaN(num);\n}\n\nfunction int(a) {\n return parseInt(a, 10);\n}\n\nfunction getBoundPosition(draggable, clientX, clientY) {\n var bounds = JSON.parse(JSON.stringify(draggable.props.bounds));\n var node = draggable.getDOMNode();\n var parent = node.parentNode;\n\n if (bounds === 'parent') {\n var nodeStyle = window.getComputedStyle(node);\n var parentStyle = window.getComputedStyle(parent);\n // Compute bounds. This is a pain with padding and offsets but this gets it exactly right.\n bounds = {\n left: -node.offsetLeft + int(parentStyle.paddingLeft) +\n int(nodeStyle.borderLeftWidth) + int(nodeStyle.marginLeft),\n top: -node.offsetTop + int(parentStyle.paddingTop) +\n int(nodeStyle.borderTopWidth) + int(nodeStyle.marginTop),\n right: innerWidth(parent) - outerWidth(node) - node.offsetLeft,\n bottom: innerHeight(parent) - outerHeight(node) - node.offsetTop\n };\n }\n\n // Keep x and y below right and bottom limits...\n if (isNum(bounds.right)) clientX = Math.min(clientX, bounds.right);\n if (isNum(bounds.bottom)) clientY = Math.min(clientY, bounds.bottom);\n\n // But above left and top limits.\n if (isNum(bounds.left)) clientX = Math.max(clientX, bounds.left);\n if (isNum(bounds.top)) clientY = Math.max(clientY, bounds.top);\n\n return [clientX, clientY];\n}\n\nfunction snapToGrid(grid, pendingX, pendingY) {\n var x = Math.round(pendingX / grid[0]) * grid[0];\n var y = Math.round(pendingY / grid[1]) * grid[1];\n return [x, y];\n}\n\n// Useful for preventing blue highlights all over everything when dragging.\nvar userSelectStyle = ';user-select: none;-webkit-user-select:none;-moz-user-select:none;' +\n '-o-user-select:none;-ms-user-select:none;';\n\nfunction addUserSelectStyles(draggable) {\n if (!draggable.props.enableUserSelectHack) return;\n var style = document.body.getAttribute('style') || '';\n document.body.setAttribute('style', style + userSelectStyle);\n}\n\nfunction removeUserSelectStyles(draggable) {\n if (!draggable.props.enableUserSelectHack) return;\n var style = document.body.getAttribute('style') || '';\n document.body.setAttribute('style', style.replace(userSelectStyle, ''));\n}\n\nfunction createCSSTransform(style) {\n // Replace unitless items with px\n var x = style.x + 'px';\n var y = style.y + 'px';\n return {\n transform: 'translate(' + x + ',' + y + ')',\n WebkitTransform: 'translate(' + x + ',' + y + ')',\n OTransform: 'translate(' + x + ',' + y + ')',\n msTransform: 'translate(' + x + ',' + y + ')',\n MozTransform: 'translate(' + x + ',' + y + ')'\n };\n}\n\n\n//\n// End Helpers.\n//\n\n//\n// Define \n//\n\nmodule.exports = React.createClass({\n displayName: 'Draggable',\n\n propTypes: {\n /**\n * `axis` determines which axis the draggable can move.\n *\n * 'both' allows movement horizontally and vertically.\n * 'x' limits movement to horizontal axis.\n * 'y' limits movement to vertical axis.\n *\n * Defaults to 'both'.\n */\n axis: React.PropTypes.oneOf(['both', 'x', 'y']),\n\n /**\n * `bounds` determines the range of movement available to the element.\n * Available values are:\n *\n * 'parent' restricts movement within the Draggable's parent node.\n *\n * Alternatively, pass an object with the following properties, all of which are optional:\n *\n * {left: LEFT_BOUND, right: RIGHT_BOUND, bottom: BOTTOM_BOUND, top: TOP_BOUND}\n *\n * All values are in px.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
Content
\n * \n * );\n * }\n * });\n * ```\n */\n bounds: React.PropTypes.oneOfType([\n React.PropTypes.shape({\n left: React.PropTypes.Number,\n right: React.PropTypes.Number,\n top: React.PropTypes.Number,\n bottom: React.PropTypes.Number\n }),\n React.PropTypes.oneOf(['parent', false])\n ]),\n\n /**\n * By default, we add 'user-select:none' attributes to the document body\n * to prevent ugly text selection during drag. If this is causing problems\n * for your app, set this to `false`.\n */\n enableUserSelectHack: React.PropTypes.bool,\n\n /**\n * `handle` specifies a selector to be used as the handle that initiates drag.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
\n *
Click me to drag
\n *
This is some other content
\n *
\n * \n * );\n * }\n * });\n * ```\n */\n handle: React.PropTypes.string,\n\n /**\n * `cancel` specifies a selector to be used to prevent drag initialization.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return(\n * \n *
\n *
You can't drag from here
\n *
Dragging here works fine
\n *
\n * \n * );\n * }\n * });\n * ```\n */\n cancel: React.PropTypes.string,\n\n /**\n * `grid` specifies the x and y that dragging should snap to.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
I snap to a 25 x 25 grid
\n * \n * );\n * }\n * });\n * ```\n */\n grid: React.PropTypes.arrayOf(React.PropTypes.number),\n\n /**\n * `start` specifies the x and y that the dragged item should start at\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
I start with transformX: 25px and transformY: 25px;
\n * \n * );\n * }\n * });\n * ```\n */\n start: React.PropTypes.shape({\n x: React.PropTypes.number,\n y: React.PropTypes.number\n }),\n\n /**\n * `moveOnStartChange`, if true (default false) will move the element if the `start`\n * property changes.\n */\n moveOnStartChange: React.PropTypes.bool,\n\n\n /**\n * `zIndex` specifies the zIndex to use while dragging.\n *\n * Example:\n *\n * ```jsx\n * var App = React.createClass({\n * render: function () {\n * return (\n * \n *
I have a zIndex
\n * \n * );\n * }\n * });\n * ```\n */\n zIndex: React.PropTypes.number,\n\n /**\n * Called when dragging starts.\n * If this function returns the boolean false, dragging will be canceled.\n *\n * Example:\n *\n * ```js\n * function (event, ui) {}\n * ```\n *\n * `event` is the Event that was triggered.\n * `ui` is an object:\n *\n * ```js\n * {\n * position: {top: 0, left: 0}\n * }\n * ```\n */\n onStart: React.PropTypes.func,\n\n /**\n * Called while dragging.\n * If this function returns the boolean false, dragging will be canceled.\n *\n * Example:\n *\n * ```js\n * function (event, ui) {}\n * ```\n *\n * `event` is the Event that was triggered.\n * `ui` is an object:\n *\n * ```js\n * {\n * position: {top: 0, left: 0}\n * }\n * ```\n */\n onDrag: React.PropTypes.func,\n\n /**\n * Called when dragging stops.\n *\n * Example:\n *\n * ```js\n * function (event, ui) {}\n * ```\n *\n * `event` is the Event that was triggered.\n * `ui` is an object:\n *\n * ```js\n * {\n * position: {top: 0, left: 0}\n * }\n * ```\n */\n onStop: React.PropTypes.func,\n\n /**\n * A workaround option which can be passed if onMouseDown needs to be accessed,\n * since it'll always be blocked (due to that there's internal use of onMouseDown)\n */\n onMouseDown: React.PropTypes.func,\n },\n\n componentWillReceiveProps: function(newProps) {\n // React to changes in the 'start' param.\n if (newProps.moveOnStartChange && newProps.start) {\n this.setState(this.getInitialState(newProps));\n }\n },\n\n componentWillUnmount: function() {\n // Remove any leftover event handlers\n removeEvent(document, dragEventFor['move'], this.handleDrag);\n removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n removeUserSelectStyles(this);\n },\n\n getDefaultProps: function () {\n return {\n axis: 'both',\n bounds: false,\n handle: null,\n cancel: null,\n grid: null,\n moveOnStartChange: false,\n start: {x: 0, y: 0},\n zIndex: NaN,\n enableUserSelectHack: true,\n onStart: emptyFunction,\n onDrag: emptyFunction,\n onStop: emptyFunction,\n onMouseDown: emptyFunction\n };\n },\n\n getInitialState: function (props) {\n // Handle call from CWRP\n props = props || this.props;\n return {\n // Whether or not we are currently dragging.\n dragging: false,\n\n // Offset between start top/left and mouse top/left while dragging.\n offsetX: 0, offsetY: 0,\n\n // Current transform x and y.\n clientX: props.start.x, clientY: props.start.y\n };\n },\n\n handleDragStart: function (e) {\n // Make it possible to attach event handlers on top of this one\n this.props.onMouseDown(e);\n\n // Short circuit if handle or cancel prop was provided and selector doesn't match\n if ((this.props.handle && !matchesSelector(e.target, this.props.handle)) ||\n (this.props.cancel && matchesSelector(e.target, this.props.cancel))) {\n return;\n }\n\n // Call event handler. If it returns explicit false, cancel.\n var shouldStart = this.props.onStart(e, createUIEvent(this));\n if (shouldStart === false) return;\n\n var dragPoint = getControlPosition(e);\n\n // Add a style to the body to disable user-select. This prevents text from\n // being selected all over the page.\n addUserSelectStyles(this);\n\n // Initiate dragging. Set the current x and y as offsets\n // so we know how much we've moved during the drag. This allows us\n // to drag elements around even if they have been moved, without issue.\n this.setState({\n dragging: true,\n offsetX: dragPoint.clientX - this.state.clientX,\n offsetY: dragPoint.clientY - this.state.clientY\n });\n\n\n // Add event handlers\n addEvent(document, dragEventFor['move'], this.handleDrag);\n addEvent(document, dragEventFor['end'], this.handleDragEnd);\n },\n\n handleDragEnd: function (e) {\n // Short circuit if not currently dragging\n if (!this.state.dragging) {\n return;\n }\n\n removeUserSelectStyles(this);\n\n // Turn off dragging\n this.setState({\n dragging: false\n });\n\n // Call event handler\n this.props.onStop(e, createUIEvent(this));\n\n // Remove event handlers\n removeEvent(document, dragEventFor['move'], this.handleDrag);\n removeEvent(document, dragEventFor['end'], this.handleDragEnd);\n },\n\n handleDrag: function (e) {\n var dragPoint = getControlPosition(e);\n\n // Calculate X and Y\n var clientX = dragPoint.clientX - this.state.offsetX;\n var clientY = dragPoint.clientY - this.state.offsetY;\n\n // Snap to grid if prop has been provided\n if (Array.isArray(this.props.grid)) {\n var coords = snapToGrid(this.props.grid, clientX, clientY);\n clientX = coords[0], clientY = coords[1];\n }\n\n if (this.props.bounds) {\n var pos = getBoundPosition(this, clientX, clientY);\n clientX = pos[0], clientY = pos[1];\n }\n\n // Call event handler. If it returns explicit false, cancel.\n var shouldUpdate = this.props.onDrag(e, createUIEvent(this));\n if (shouldUpdate === false) return this.handleDragEnd();\n\n // Update transform\n this.setState({\n clientX: clientX,\n clientY: clientY\n });\n },\n\n onMouseDown: function(ev) {\n // Prevent 'ghost click' which happens 300ms after touchstart if the event isn't cancelled.\n // We don't cancel the event on touchstart because of #37; we might want to make a scrollable item draggable.\n // More on ghost clicks: http://ariatemplates.com/blog/2014/05/ghost-clicks-in-mobile-browsers/\n if (dragEventFor == eventsFor['touch']) {\n return ev.preventDefault();\n }\n\n return this.handleDragStart.apply(this, arguments);\n },\n\n onTouchStart: function(ev) {\n // We're on a touch device now, so change the event handlers\n dragEventFor = eventsFor['touch'];\n\n return this.handleDragStart.apply(this, arguments);\n },\n\n // Intended for use by a parent component. Resets internal state on this component. Useful for\n // and other components in case this element is manually resized and start/moveOnStartChange\n // don't work for you.\n resetState: function() {\n this.setState({\n offsetX: 0, offsetY: 0, clientX: 0, clientY: 0\n });\n },\n\n render: function () {\n // Create style object. We extend from existing styles so we don't\n // remove anything already set (like background, color, etc).\n var childStyle = this.props.children.props.style || {};\n\n // Add a CSS transform to move the element around. This allows us to move the element around\n // without worrying about whether or not it is relatively or absolutely positioned.\n // If the item you are dragging already has a transform set, wrap it in a so \n // has a clean slate.\n var transform = createCSSTransform({\n // Set left if horizontal drag is enabled\n x: canDragX(this) ?\n this.state.clientX :\n 0,\n\n // Set top if vertical drag is enabled\n y: canDragY(this) ?\n this.state.clientY :\n 0\n });\n\n // Workaround IE pointer events; see #51\n // https://github.com/mzabriskie/react-draggable/issues/51#issuecomment-103488278\n var touchHacks = {\n touchAction: 'none'\n };\n\n var style = assign({}, childStyle, transform, touchHacks);\n\n // Set zIndex if currently dragging and prop has been provided\n if (this.state.dragging && !isNaN(this.props.zIndex)) {\n style.zIndex = this.props.zIndex;\n }\n\n var className = classNames((this.props.children.props.className || ''), 'react-draggable', {\n 'react-draggable-dragging': this.state.dragging,\n 'react-draggable-dragged': this.state.dragged\n });\n\n // Reuse the child provided\n // This makes it flexible to use whatever element is wanted (div, ul, etc)\n return React.cloneElement(React.Children.only(this.props.children), {\n style: style,\n className: className,\n\n onMouseDown: this.onMouseDown,\n onTouchStart: this.onTouchStart,\n onMouseUp: this.handleDragEnd,\n onTouchEnd: this.handleDragEnd\n });\n }\n});\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-draggable/lib/draggable.js\n ** module id = 16\n ** module chunks = 0\n **/","/*!\n Copyright (c) 2015 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n\nfunction classNames() {\n\tvar classes = '';\n\tvar arg;\n\n\tfor (var i = 0; i < arguments.length; i++) {\n\t\targ = arguments[i];\n\t\tif (!arg) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tif ('string' === typeof arg || 'number' === typeof arg) {\n\t\t\tclasses += ' ' + arg;\n\t\t} else if (Object.prototype.toString.call(arg) === '[object Array]') {\n\t\t\tclasses += ' ' + classNames.apply(null, arg);\n\t\t} else if ('object' === typeof arg) {\n\t\t\tfor (var key in arg) {\n\t\t\t\tif (!arg.hasOwnProperty(key) || !arg[key]) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\tclasses += ' ' + key;\n\t\t\t}\n\t\t}\n\t}\n\treturn classes.substr(1);\n}\n\n// safely export classNames for node / browserify\nif (typeof module !== 'undefined' && module.exports) {\n\tmodule.exports = classNames;\n}\n\n// safely export classNames for RequireJS\nif (typeof define !== 'undefined' && define.amd) {\n\tdefine('classnames', [], function() {\n\t\treturn classNames;\n\t});\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-draggable/~/classnames/index.js\n ** module id = 17\n ** module chunks = 0\n **/","'use strict';\n\nvar _objectWithoutProperties = function (obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; };\n\nvar _slicedToArray = function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } };\n\nvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\nvar React = require('react');\nvar Resizable = require('./Resizable');\nvar PureRenderMixin = require('react/lib/ReactComponentWithPureRenderMixin');\n\n// An example use of Resizable.\nvar ResizableBox = module.exports = React.createClass({\n displayName: 'ResizableBox',\n mixins: [PureRenderMixin],\n\n propTypes: {\n lockAspectRatio: React.PropTypes.bool\n },\n\n getDefaultProps: function getDefaultProps() {\n return {\n lockAspectRatio: false,\n handleSize: [20, 20]\n };\n },\n\n getInitialState: function getInitialState() {\n return {\n width: this.props.width,\n height: this.props.height,\n aspectRatio: this.props.width / this.props.height\n };\n },\n\n onResize: function onResize(event, _ref) {\n var element = _ref.element;\n var size = _ref.size;\n var width = size.width;\n var height = size.height;\n\n var widthChanged = width !== this.state.width,\n heightChanged = height !== this.state.height;\n if (!widthChanged && !heightChanged) {\n return;\n }if (this.props.lockAspectRatio) {\n var _preserveAspectRatio = this.preserveAspectRatio(width, height);\n\n var _preserveAspectRatio2 = _slicedToArray(_preserveAspectRatio, 2);\n\n width = _preserveAspectRatio2[0];\n height = _preserveAspectRatio2[1];\n }\n\n this.setState({ width: width, height: height });\n },\n\n // If you do this, be careful of constraints\n preserveAspectRatio: function preserveAspectRatio(width, height) {\n var min = this.props.minConstraints;\n var max = this.props.maxConstraints;\n\n height = width / this.state.aspectRatio;\n width = height * this.state.aspectRatio;\n\n if (min) {\n width = Math.max(min[0], width);\n height = Math.max(min[1], height);\n }\n if (max) {\n width = Math.min(max[0], width);\n height = Math.min(max[1], height);\n }\n return [width, height];\n },\n\n render: function render() {\n // Basic wrapper around a Resizable instance.\n // If you use Resizable directly, you are responsible for updating the component\n // with a new width and height.\n var _props = this.props;\n var handleSize = _props.handleSize;\n var minConstraints = _props.minConstraints;\n var maxConstraints = _props.maxConstraints;\n\n var props = _objectWithoutProperties(_props, ['handleSize', 'minConstraints', 'maxConstraints']);\n\n return React.createElement(\n Resizable,\n {\n minConstraints: minConstraints,\n maxConstraints: maxConstraints,\n handleSize: handleSize,\n width: this.state.width,\n height: this.state.height,\n onResize: this.onResize,\n draggableOpts: this.props.draggableOpts\n },\n React.createElement(\n 'div',\n _extends({ style: { width: this.state.width + 'px', height: this.state.height + 'px' } }, props),\n this.props.children\n )\n );\n }\n});\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/build/ResizableBox.js\n ** module id = 18\n ** module chunks = 0\n **/","'use strict';\n\nvar assign = require('object-assign');\nvar React = require('react');\n\nmodule.exports = function cloneElement(element, props) {\n if (props.style && element.props.style) {\n props.style = assign({}, element.props.style, props.style);\n }\n if (props.className && element.props.className) {\n props.className = element.props.className + ' ' + props.className;\n }\n return React.cloneElement(element, props);\n};\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/build/cloneElement.js\n ** module id = 19\n ** module chunks = 0\n **/","'use strict';\nmodule.exports = function() {\n throw new Error(\"Don't instantiate Resizable directly! Use require('react-resizable').Resizable\");\n};\n\nmodule.exports.Resizable = require('./build/Resizable');\nmodule.exports.ResizableBox = require('./build/ResizableBox');\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react-resizable/index.js\n ** module id = 20\n ** module chunks = 0\n **/","'use strict';\r\nvar React = require('react')\r\n , hasOwn = Object.prototype.hasOwnProperty\r\n , version = React.version.split('.').map(parseFloat)\r\n , RESERVED = {\r\n className: resolve(joinClasses),\r\n children: function(){},\r\n key: function(){},\r\n ref: function(){},\r\n style: resolve(extend)\r\n };\r\n\r\nmodule.exports = function cloneWithProps(child, props) {\r\n var newProps = mergeProps(props, child.props);\r\n\r\n if (!hasOwn.call(newProps, 'children') && hasOwn.call(child.props, 'children'))\r\n newProps.children = child.props.children;\r\n\r\n // < 0.11\r\n if (version[0] === 0 && version[1] < 11)\r\n return child.constructor.ConvenienceConstructor(newProps);\r\n \r\n // 0.11\r\n if (version[0] === 0 && version[1] === 11)\r\n return child.constructor(newProps);\r\n\r\n // 0.12\r\n else if (version[0] === 0 && version[1] === 12){\r\n MockLegacyFactory.isReactLegacyFactory = true\r\n MockLegacyFactory.type = child.type\r\n return React.createElement(MockLegacyFactory, newProps);\r\n }\r\n\r\n // 0.13+\r\n return React.createElement(child.type, newProps);\r\n\r\n function MockLegacyFactory(){}\r\n}\r\n\r\nfunction mergeProps(currentProps, childProps) {\r\n var newProps = extend(currentProps), key\r\n\r\n for (key in childProps) {\r\n if (hasOwn.call(RESERVED, key) )\r\n RESERVED[key](newProps, childProps[key], key)\r\n\r\n else if ( !hasOwn.call(newProps, key) )\r\n newProps[key] = childProps[key];\r\n }\r\n return newProps\r\n}\r\n\r\nfunction resolve(fn){\r\n return function(src, value, key){\r\n if( !hasOwn.call(src, key)) src[key] = value\r\n else src[key] = fn(src[key], value)\r\n }\r\n}\r\n\r\nfunction joinClasses(a, b){\r\n if ( !a ) return b || ''\r\n return a + (b ? ' ' + b : '')\r\n}\r\n\r\nfunction extend() {\r\n var target = {};\r\n for (var i = 0; i < arguments.length; i++) \r\n for (var key in arguments[i]) if (hasOwn.call(arguments[i], key)) \r\n target[key] = arguments[i][key] \r\n return target\r\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react/lib/cloneWithProps.js\n ** module id = 21\n ** module chunks = 0\n **/","/**\n * Copyright 2013-2015, Facebook, Inc.\n * All rights reserved.\n *\n * This source code is licensed under the BSD-style license found in the\n * LICENSE file in the root directory of this source tree. An additional grant\n * of patent rights can be found in the PATENTS file in the same directory.\n *\n * @providesModule shallowEqual\n */\n\n'use strict';\n\n/**\n * Performs equality by iterating through keys on an object and returning\n * false when any key has values which are not strictly equal between\n * objA and objB. Returns true when the values of all keys are strictly equal.\n *\n * @return {boolean}\n */\nfunction shallowEqual(objA, objB) {\n if (objA === objB) {\n return true;\n }\n var key;\n // Test for A's keys different from B.\n for (key in objA) {\n if (objA.hasOwnProperty(key) &&\n (!objB.hasOwnProperty(key) || objA[key] !== objB[key])) {\n return false;\n }\n }\n // Test for B's keys missing from A.\n for (key in objB) {\n if (objB.hasOwnProperty(key) && !objA.hasOwnProperty(key)) {\n return false;\n }\n }\n return true;\n}\n\nmodule.exports = shallowEqual;\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/react/lib/shallowEqual.js\n ** module id = 22\n ** module chunks = 0\n **/"],"sourceRoot":""} \ No newline at end of file diff --git a/package.json b/package.json index 0b505e515..a2b91abef 100644 --- a/package.json +++ b/package.json @@ -34,8 +34,8 @@ "dependencies": { "deep-equal": "^1.0.0", "object-assign": "^2.0.0", - "react-draggable": "^0.8.0", - "react-resizable": "^0.4.1" + "react-draggable": "^0.8.1", + "react-resizable": "^0.4.2" }, "devDependencies": { "babel": "^5.0.1", diff --git a/test/test-hook.jsx b/test/test-hook.jsx index ee2dfcb9b..1e730cbfc 100644 --- a/test/test-hook.jsx +++ b/test/test-hook.jsx @@ -2,11 +2,10 @@ var React = require('react'); require('style!css!../css/styles.css'); require('style!css!../examples/example-styles.css'); -require('style!css!../node_modules/react-resizable/css/styles.css'); typeof window !== "undefined" && (window.React = React); // for devtools module.exports = function(Layout) { - document.addEventListener("DOMContentLoaded", function(event) { + document.addEventListener("DOMContentLoaded", function(event) { var contentDiv = document.getElementById('content'); var gridProps = window.gridProps || {}; React.render(React.createElement(ExampleLayout, gridProps), contentDiv); @@ -43,7 +42,7 @@ module.exports = function(Layout) {
); } - + }); };