react-canvas-draw
Version:
A simple yet powerful canvas-drawing component for React.
6 lines • 38.9 kB
JavaScript
/*!
* react-canvas-draw v1.2.1 - https://embiem.github.io/react-canvas-draw/
* MIT Licensed
*/
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.ReactCanvasDraw=t(require("react")):e.ReactCanvasDraw=t(e.React)}(window,(function(e){return function(e){var t={};function n(i){if(t[i])return t[i].exports;var r=t[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(i,r,function(t){return e[t]}.bind(null,r));return i},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=7)}([function(t,n){t.exports=e},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i,r=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),a=n(2),o=(i=a)&&i.__esModule?i:{default:i};function s(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function c(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}var u=function(e){function t(){return s(this,t),c(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),r(t,[{key:"update",value:function(e){this.x=e.x,this.y=e.y}},{key:"moveByAngle",value:function(e,t){var n=e+Math.PI/2;this.x=this.x+Math.sin(n)*t,this.y=this.y-Math.cos(n)*t}},{key:"equalsTo",value:function(e){return this.x===e.x&&this.y===e.y}},{key:"getDifferenceTo",value:function(e){return new o.default(this.x-e.x,this.y-e.y)}},{key:"getDistanceTo",value:function(e){var t=this.getDifferenceTo(e);return Math.sqrt(Math.pow(t.x,2)+Math.pow(t.y,2))}},{key:"getAngleTo",value:function(e){var t=this.getDifferenceTo(e);return Math.atan2(t.y,t.x)}},{key:"toObject",value:function(){return{x:this.x,y:this.y}}}]),t}(o.default);t.default=u},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.default=function e(t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.x=t,this.y=n}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}();var r=function(){function e(t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.x=t,this.y=n}return i(e,[{key:"update",value:function(e){this.x=e.x,this.y=e.y}},{key:"getDifferenceTo",value:function(t){return new e(this.x-t.x,this.y-t.y)}},{key:"getDistanceTo",value:function(e){var t=this.getDifferenceTo(e);return Math.sqrt(Math.pow(t.x,2)+Math.pow(t.y,2))}}]),e}();t.default=r},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.LazyPoint=t.Point=t.LazyBrush=void 0;var i=o(n(8)),r=o(n(2)),a=o(n(1));function o(e){return e&&e.__esModule?e:{default:e}}t.LazyBrush=i.default,t.Point=r.default,t.LazyPoint=a.default},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.Point=t.Catenary=void 0;var i=a(n(9)),r=a(n(3));function a(e){return e&&e.__esModule?e:{default:e}}t.Catenary=i.default,t.Point=r.default},function(e,t,n){"use strict";(function(e){var n=function(){if("undefined"!=typeof Map)return Map;function e(e,t){var n=-1;return e.some((function(e,i){return e[0]===t&&(n=i,!0)})),n}return function(){function t(){this.__entries__=[]}return Object.defineProperty(t.prototype,"size",{get:function(){return this.__entries__.length},enumerable:!0,configurable:!0}),t.prototype.get=function(t){var n=e(this.__entries__,t),i=this.__entries__[n];return i&&i[1]},t.prototype.set=function(t,n){var i=e(this.__entries__,t);~i?this.__entries__[i][1]=n:this.__entries__.push([t,n])},t.prototype.delete=function(t){var n=this.__entries__,i=e(n,t);~i&&n.splice(i,1)},t.prototype.has=function(t){return!!~e(this.__entries__,t)},t.prototype.clear=function(){this.__entries__.splice(0)},t.prototype.forEach=function(e,t){void 0===t&&(t=null);for(var n=0,i=this.__entries__;n<i.length;n++){var r=i[n];e.call(t,r[1],r[0])}},t}()}(),i="undefined"!=typeof window&&"undefined"!=typeof document&&window.document===document,r=void 0!==e&&e.Math===Math?e:"undefined"!=typeof self&&self.Math===Math?self:"undefined"!=typeof window&&window.Math===Math?window:Function("return this")(),a="function"==typeof requestAnimationFrame?requestAnimationFrame.bind(r):function(e){return setTimeout((function(){return e(Date.now())}),1e3/60)};var o=["top","right","bottom","left","width","height","size","weight"],s="undefined"!=typeof MutationObserver,c=function(){function e(){this.connected_=!1,this.mutationEventsAdded_=!1,this.mutationsObserver_=null,this.observers_=[],this.onTransitionEnd_=this.onTransitionEnd_.bind(this),this.refresh=function(e,t){var n=!1,i=!1,r=0;function o(){n&&(n=!1,e()),i&&c()}function s(){a(o)}function c(){var e=Date.now();if(n){if(e-r<2)return;i=!0}else n=!0,i=!1,setTimeout(s,t);r=e}return c}(this.refresh.bind(this),20)}return e.prototype.addObserver=function(e){~this.observers_.indexOf(e)||this.observers_.push(e),this.connected_||this.connect_()},e.prototype.removeObserver=function(e){var t=this.observers_,n=t.indexOf(e);~n&&t.splice(n,1),!t.length&&this.connected_&&this.disconnect_()},e.prototype.refresh=function(){this.updateObservers_()&&this.refresh()},e.prototype.updateObservers_=function(){var e=this.observers_.filter((function(e){return e.gatherActive(),e.hasActive()}));return e.forEach((function(e){return e.broadcastActive()})),e.length>0},e.prototype.connect_=function(){i&&!this.connected_&&(document.addEventListener("transitionend",this.onTransitionEnd_),window.addEventListener("resize",this.refresh),s?(this.mutationsObserver_=new MutationObserver(this.refresh),this.mutationsObserver_.observe(document,{attributes:!0,childList:!0,characterData:!0,subtree:!0})):(document.addEventListener("DOMSubtreeModified",this.refresh),this.mutationEventsAdded_=!0),this.connected_=!0)},e.prototype.disconnect_=function(){i&&this.connected_&&(document.removeEventListener("transitionend",this.onTransitionEnd_),window.removeEventListener("resize",this.refresh),this.mutationsObserver_&&this.mutationsObserver_.disconnect(),this.mutationEventsAdded_&&document.removeEventListener("DOMSubtreeModified",this.refresh),this.mutationsObserver_=null,this.mutationEventsAdded_=!1,this.connected_=!1)},e.prototype.onTransitionEnd_=function(e){var t=e.propertyName,n=void 0===t?"":t;o.some((function(e){return!!~n.indexOf(e)}))&&this.refresh()},e.getInstance=function(){return this.instance_||(this.instance_=new e),this.instance_},e.instance_=null,e}(),u=function(e,t){for(var n=0,i=Object.keys(t);n<i.length;n++){var r=i[n];Object.defineProperty(e,r,{value:t[r],enumerable:!1,writable:!1,configurable:!0})}return e},h=function(e){return e&&e.ownerDocument&&e.ownerDocument.defaultView||r},l=y(0,0,0,0);function d(e){return parseFloat(e)||0}function f(e){for(var t=[],n=1;n<arguments.length;n++)t[n-1]=arguments[n];return t.reduce((function(t,n){return t+d(e["border-"+n+"-width"])}),0)}function v(e){var t=e.clientWidth,n=e.clientHeight;if(!t&&!n)return l;var i=h(e).getComputedStyle(e),r=function(e){for(var t={},n=0,i=["top","right","bottom","left"];n<i.length;n++){var r=i[n],a=e["padding-"+r];t[r]=d(a)}return t}(i),a=r.left+r.right,o=r.top+r.bottom,s=d(i.width),c=d(i.height);if("border-box"===i.boxSizing&&(Math.round(s+a)!==t&&(s-=f(i,"left","right")+a),Math.round(c+o)!==n&&(c-=f(i,"top","bottom")+o)),!function(e){return e===h(e).document.documentElement}(e)){var u=Math.round(s+a)-t,v=Math.round(c+o)-n;1!==Math.abs(u)&&(s-=u),1!==Math.abs(v)&&(c-=v)}return y(r.left,r.top,s,c)}var p="undefined"!=typeof SVGGraphicsElement?function(e){return e instanceof h(e).SVGGraphicsElement}:function(e){return e instanceof h(e).SVGElement&&"function"==typeof e.getBBox};function w(e){return i?p(e)?function(e){var t=e.getBBox();return y(0,0,t.width,t.height)}(e):v(e):l}function y(e,t,n,i){return{x:e,y:t,width:n,height:i}}var g=function(){function e(e){this.broadcastWidth=0,this.broadcastHeight=0,this.contentRect_=y(0,0,0,0),this.target=e}return e.prototype.isActive=function(){var e=w(this.target);return this.contentRect_=e,e.width!==this.broadcastWidth||e.height!==this.broadcastHeight},e.prototype.broadcastRect=function(){var e=this.contentRect_;return this.broadcastWidth=e.width,this.broadcastHeight=e.height,e},e}(),m=function(e,t){var n,i,r,a,o,s,c,h=(i=(n=t).x,r=n.y,a=n.width,o=n.height,s="undefined"!=typeof DOMRectReadOnly?DOMRectReadOnly:Object,c=Object.create(s.prototype),u(c,{x:i,y:r,width:a,height:o,top:r,right:i+a,bottom:o+r,left:i}),c);u(this,{target:e,contentRect:h})},b=function(){function e(e,t,i){if(this.activeObservations_=[],this.observations_=new n,"function"!=typeof e)throw new TypeError("The callback provided as parameter 1 is not a function.");this.callback_=e,this.controller_=t,this.callbackCtx_=i}return e.prototype.observe=function(e){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(e instanceof h(e).Element))throw new TypeError('parameter 1 is not of type "Element".');var t=this.observations_;t.has(e)||(t.set(e,new g(e)),this.controller_.addObserver(this),this.controller_.refresh())}},e.prototype.unobserve=function(e){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(e instanceof h(e).Element))throw new TypeError('parameter 1 is not of type "Element".');var t=this.observations_;t.has(e)&&(t.delete(e),t.size||this.controller_.removeObserver(this))}},e.prototype.disconnect=function(){this.clearActive(),this.observations_.clear(),this.controller_.removeObserver(this)},e.prototype.gatherActive=function(){var e=this;this.clearActive(),this.observations_.forEach((function(t){t.isActive()&&e.activeObservations_.push(t)}))},e.prototype.broadcastActive=function(){if(this.hasActive()){var e=this.callbackCtx_,t=this.activeObservations_.map((function(e){return new m(e.target,e.broadcastRect())}));this.callback_.call(e,t,e),this.clearActive()}},e.prototype.clearActive=function(){this.activeObservations_.splice(0)},e.prototype.hasActive=function(){return this.activeObservations_.length>0},e}(),_="undefined"!=typeof WeakMap?new WeakMap:new n,x=function e(t){if(!(this instanceof e))throw new TypeError("Cannot call a class as a function.");if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");var n=c.getInstance(),i=new b(t,n,this);_.set(this,i)};["observe","unobserve","disconnect"].forEach((function(e){x.prototype[e]=function(){var t;return(t=_.get(this))[e].apply(t,arguments)}}));var M=void 0!==r.ResizeObserver?r.ResizeObserver:x;t.a=M}).call(this,n(10))},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i,r=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),a=n(1),o=(i=a)&&i.__esModule?i:{default:i};function s(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var c=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=t.radius,i=void 0===n?30:n,r=t.enabled,a=void 0===r||r,c=t.initialPoint,u=void 0===c?{x:0,y:0}:c;s(this,e),this.radius=i,this._isEnabled=a,this.pointer=new o.default(u.x,u.y),this.brush=new o.default(u.x,u.y),this.angle=0,this.distance=0,this._hasMoved=!1}return r(e,[{key:"enable",value:function(){this._isEnabled=!0}},{key:"disable",value:function(){this._isEnabled=!1}},{key:"isEnabled",value:function(){return this._isEnabled}},{key:"setRadius",value:function(e){this.radius=e}},{key:"getRadius",value:function(){return this.radius}},{key:"getBrushCoordinates",value:function(){return this.brush.toObject()}},{key:"getPointerCoordinates",value:function(){return this.pointer.toObject()}},{key:"getBrush",value:function(){return this.brush}},{key:"getPointer",value:function(){return this.pointer}},{key:"getAngle",value:function(){return this.angle}},{key:"getDistance",value:function(){return this.distance}},{key:"brushHasMoved",value:function(){return this._hasMoved}},{key:"update",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=t.both,i=void 0!==n&&n;return this._hasMoved=!1,!(this.pointer.equalsTo(e)&&!i)&&(this.pointer.update(e),i?(this._hasMoved=!0,this.brush.update(e),!0):(this._isEnabled?(this.distance=this.pointer.getDistanceTo(this.brush),this.angle=this.pointer.getAngleTo(this.brush),this.distance>this.radius&&(this.brush.moveByAngle(this.angle,this.distance-this.radius),this._hasMoved=!0)):(this.distance=0,this.angle=0,this.brush.update(e),this._hasMoved=!0),!0))}}]),e}();t.default=c},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var i,r=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),a=n(3),o=(i=a)&&i.__esModule?i:{default:i};function s(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var c=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=t.segments,i=void 0===n?50:n,r=t.iterationLimit,a=void 0===r?100:r;s(this,e),this.p1=new o.default,this.p2=new o.default,this.segments=i,this.iterationLimit=a}return r(e,[{key:"drawToCanvas",value:function(e,t,n,i){this.p1.update(t),this.p2.update(n);var r=this.p1.x>this.p2.x,a=r?this.p2:this.p1,o=r?this.p1:this.p2,s=[],c=!0;if(a.getDistanceTo(o)<i)if(o.x-a.x>.01){var u=o.x-a.x,h=o.y-a.y,l=-this.getCatenaryParameter(u,h,i,this.iterationLimit),d=.5*(l*Math.log((i+h)/(i-h))-u),f=l*Math.cosh(d/l),v=a.x-d,p=a.y-f;s=this.getCurve(l,a,o,v,p,this.segments),c=!1}else{var w=.5*(a.x+o.x),y=.5*(a.y+o.y+i);s=[[a.x,a.y],[w,y],[o.x,o.y]]}else s=[[a.x,a.y],[o.x,o.y]];return c?this.drawLine(s,e):this.drawCurve(s,e),s}},{key:"getCatenaryParameter",value:function(e,t,n,i){for(var r=Math.sqrt(n*n-t*t)/e,a=Math.acosh(r)+1,o=-1,s=0;Math.abs(a-o)>1e-6&&s<i;)o=a,a-=(Math.sinh(a)-r*a)/(Math.cosh(a)-r),s++;return e/(2*a)}},{key:"getCurve",value:function(e,t,n,i,r,a){for(var o=[t.x,e*Math.cosh((t.x-i)/e)+r],s=n.x-t.x,c=a-1,u=0;u<c;u++){var h=t.x+s*(u+.5)/c,l=e*Math.cosh((h-i)/e)+r;o.push(h,l)}return o.push(n.x,e*Math.cosh((n.x-i)/e)+r),o}},{key:"drawLine",value:function(e,t){t.moveTo(e[0][0],e[0][1]),t.lineTo(e[1][0],e[1][1])}},{key:"drawCurve",value:function(e,t){var n=.5*e.length-1,i=e[2],r=e[3],a=[];t.moveTo(e[0],e[1]);for(var o=2;o<n;o++){var s=e[2*o],c=e[2*o+1],u=.5*(s+i),h=.5*(c+r);a.push([i,r,u,h]),t.quadraticCurveTo(i,r,u,h),i=s,r=c}return n=e.length,t.quadraticCurveTo(e[n-4],e[n-3],e[n-2],e[n-1]),a}}]),e}();t.default=c},function(e,t){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(e){"object"==typeof window&&(n=window)}e.exports=n},function(e,t,n){"use strict";n.r(t),n.d(t,"default",(function(){return V}));var i=n(0),r=n.n(i),a=n(4),o=n(5),s=n(6);function c(){return(c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e}).apply(this,arguments)}function u(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function h(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var l=Object.freeze({x:0,y:0,untransformedX:0,untransformedY:0}),d=Object.freeze({canvasWidth:0,canvasHeight:0,left:0,top:0,right:0,bottom:0,viewMin:l,viewMax:l}),f=Object.freeze({a:1,b:0,c:0,d:1,e:0,f:0});var v=function(){function e(e){var t=this,n=e.scaleExtents,i=e.documentSize;h(this,"_scaleExtents",void 0),h(this,"_documentSize",void 0),h(this,"_canvas",null),h(this,"_view",{scale:1,x:0,y:0}),h(this,"_viewChangeListeners",new Set),h(this,"setScale",(function(e){t.setView({scale:e})})),h(this,"clampView",(function(e){var n=e.scale,i=e.x,r=e.y,a=t.scaleExtents,o=a.min,s=a.max,c=t.documentSize,u=c.width,h=c.height,l=t.canvasRect||d,f=l.left,v=l.top,p=l.right-f,w=l.bottom-v,y=p/2,g=-(u*t._view.scale-p/2),m=w/2,b=-(h*t._view.scale-w/2);return{scale:Math.min(Math.max(n,o),s),x:Math.min(Math.max(i,g),y),y:Math.min(Math.max(r,b),m)}})),h(this,"resetView",(function(){t.setView({scale:1,x:0,y:0})})),h(this,"setView",(function(e){var n=t.clampView(c({},t._view,e||{})),i=t._view,r=i.scale,a=i.x,o=i.y;return n.scale===r&&n.x===a&&n.y===o||(t._view=n,t._viewChangeListeners.forEach((function(e){return e&&e(n)}))),c({},t._view)})),h(this,"scaleAtClientPoint",(function(e,n){var i=t.clientPointToViewPoint(n),r=t.clampView(c({},t._view,{scale:t._view.scale+e})),a=t.viewPointToClientPoint(i,r);return r.x=t._view.x-(a.clientX-n.clientX),r.y=t._view.y-(a.clientY-n.clientY),t.setView(r)})),h(this,"clientPointToViewPoint",(function(e,n){var i=e.clientX,r=e.clientY;void 0===n&&(n=t._view);var a=t.canvasRect||d,o=i-a.left,s=r-a.top;return{x:(o-n.x)/n.scale,y:(s-n.y)/n.scale,relativeClientX:o,relativeClientY:s}})),h(this,"viewPointToClientPoint",(function(e,n){var i=e.x,r=e.y;void 0===n&&(n=t._view);var a=t.canvasRect||d,o=a.left,s=a.top,c=i*n.scale+n.x,u=r*n.scale+n.y,h=c+o,l=u+s;return{clientX:h,clientY:l,relativeX:c,relativeY:u,x:h,y:l}})),h(this,"attachViewChangeListener",(function(e){t._viewChangeListeners.add(e)})),this._scaleExtents=n,this._documentSize=i}var t,n,i;return t=e,(n=[{key:"canvas",get:function(){return this._canvas},set:function(e){this._canvas=e,this.setView()}},{key:"scale",get:function(){return this._view.scale}},{key:"x",get:function(){return this._view.x},set:function(e){this.setView({x:e})}},{key:"y",get:function(){return this._view.y},set:function(e){this.setView({y:e})}},{key:"view",get:function(){return c({},this._view)}},{key:"scaleExtents",get:function(){return c({},this._scaleExtents)},set:function(e){var t=e.min,n=e.max;this._scaleExtents={min:t,max:n},this.setView()}},{key:"documentSize",get:function(){return c({},this._documentSize)},set:function(e){var t=e.width,n=e.height;this._documentSize={width:t,height:n},this.setView()}},{key:"transformMatrix",get:function(){return{a:this._view.scale,b:0,c:0,d:this._view.scale,e:this._view.x,f:this._view.y}}},{key:"canvasBounds",get:function(){if(this._canvas){var e=this._canvas.getBoundingClientRect(),t=e.left,n=e.top,i=e.right,r=e.bottom;return{viewMin:this.clientPointToViewPoint({clientX:t,clientY:n}),viewMax:this.clientPointToViewPoint({clientX:i,clientY:r}),left:t,top:n,right:i,bottom:r,canvasWidth:this._canvas.width,canvasHeight:this._canvas.height}}}},{key:"canvasRect",get:function(){return this.canvas?this.canvas.getBoundingClientRect():void 0}}])&&u(t.prototype,n),i&&u(t,i),e}();function p(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var w=function(e){e.preventDefault()},y=function(){var e=this;p(this,"handleMouseWheel",(function(t,n){var i=n.props,r=i.disabled,a=i.enablePanAndZoom,o=i.mouseZoomFactor;return r?new g:(a&&t.ctrlKey&&(t.preventDefault(),n.coordSystem.scaleAtClientPoint(o*t.deltaY,O(t))),e)})),p(this,"handleDrawStart",(function(e,t){return t.props.disabled?new g:e.ctrlKey&&t.props.enablePanAndZoom?(new m).handleDrawStart(e,t):(new b).handleDrawStart(e,t)})),p(this,"handleDrawMove",(function(t,n){if(n.props.disabled)return new g;var i=C(n.coordSystem,t),r=i.x,a=i.y;return n.lazy.update({x:r,y:a}),e})),p(this,"handleDrawEnd",(function(t,n){return n.props.disabled?new g:e}))},g=function(){var e=this;p(this,"handleMouseWheel",(function(t,n){return n.props.disabled?e:(new y).handleMouseWheel(t,n)})),p(this,"handleDrawStart",(function(t,n){return n.props.disabled?e:(new y).handleDrawStart(t,n)})),p(this,"handleDrawMove",(function(t,n){return n.props.disabled?e:(new y).handleDrawMove(t,n)})),p(this,"handleDrawEnd",(function(t,n){return n.props.disabled?e:(new y).handleDrawEnd(t,n)}))},m=function(){var e=this;p(this,"handleMouseWheel",w.bind(this)),p(this,"handleDrawStart",(function(t,n){return t.preventDefault(),e.dragStart=O(t),e.panStart={x:n.coordSystem.x,y:n.coordSystem.y},e})),p(this,"handleDrawMove",(function(t,n){t.preventDefault();var i=O(t),r=i.clientX,a=i.clientY,o=r-e.dragStart.clientX,s=a-e.dragStart.clientY;return n.coordSystem.setView({x:e.panStart.x+o,y:e.panStart.y+s}),e})),p(this,"handleDrawEnd",(function(){return new y}))},b=function(){var e=this;p(this,"handleMouseWheel",w.bind(this)),p(this,"handleDrawStart",(function(t,n){var i=n.props.enablePanAndZoom;return t.preventDefault(),t.touches&&t.touches.length&&i?i&&t.touches&&t.touches.length>=2?(new _).handleDrawStart(t,n):e.handleDrawMove(t,n):(new D).handleDrawStart(t,n)})),p(this,"handleDrawMove",(function(t,n){if(t.preventDefault(),t.touches&&t.touches.length>=2)return(new _).handleDrawStart(t,n);var i=O(t);if((e.deferredPoints.push(i),(new Date).valueOf()-e.startTimestamp<250)&&(null===e.startClientPoint&&(e.startClientPoint=i),Math.abs(i.clientX-e.startClientPoint.clientX)+Math.abs(i.clientY-e.startClientPoint.clientY)<10))return e;return e.issueDeferredPoints(n)})),p(this,"handleDrawEnd",(function(t,n){return e.issueDeferredPoints(n).handleDrawEnd(t,n)})),p(this,"issueDeferredPoints",(function(t){for(var n=new D,i=0;i<e.deferredPoints.length;i++){var r=e.deferredPoints[i],a=new S(r);n=(0===i?n.handleDrawStart:n.handleDrawMove)(a,t)}return n})),this.startClientPoint=null,this.startTimestamp=(new Date).valueOf(),this.deferredPoints=[]},_=function(){var e=this;p(this,"handleMouseWheel",w.bind(this)),p(this,"handleDrawStart",(function(t,n){return t.preventDefault(),!t.touches||t.touches.length<2?new y:(e.start=e.getTouchMetrics(t),e.panStart={x:n.coordSystem.x,y:n.coordSystem.y},e.scaleStart=n.coordSystem.scale,e)})),p(this,"handleDrawMove",(function(t,n){if(t.preventDefault(),!t.touches||t.touches.length<2)return new y;var i=e.recentMetrics=e.getTouchMetrics(t),r=i.centroid,a=i.distance;if(Math.abs(a-e.start.distance)>=10)return new M(e).handleDrawMove(t,n);var o=r.clientX-e.start.centroid.clientX,s=r.clientY-e.start.centroid.clientY;return Math.abs(o)+Math.abs(s)>=10?new x(e).handleDrawMove(t,n):e})),p(this,"handleDrawEnd",(function(){return new y})),p(this,"getTouchMetrics",(function(e){var t=O(e.touches[0]),n=t.clientX,i=t.clientY,r=O(e.touches[1]),a=r.clientX,o=r.clientY,s=a-n,c=o-i;return{t1:{clientX:n,clientY:i},t2:{clientX:a,clientY:o},distance:Math.sqrt(s*s+c*c),centroid:{clientX:(n+a)/2,clientY:(i+o)/2}}}))},x=function(e){var t=this;p(this,"handleMouseWheel",w.bind(this)),p(this,"handleDrawStart",(function(){return t})),p(this,"handleDrawMove",(function(e,n){if(e.preventDefault(),!e.touches||e.touches.length<2)return new y;var i=t.scaleOrPanState,r=i.recentMetrics=i.getTouchMetrics(e),a=r.centroid,o=(r.distance,a.clientX-i.start.centroid.clientX),s=a.clientY-i.start.centroid.clientY;return n.setView({x:i.panStart.x+o,y:i.panStart.y+s}),t})),p(this,"handleDrawEnd",(function(){return new y})),this.scaleOrPanState=e},M=function(e){var t=this;p(this,"handleMouseWheel",w.bind(this)),p(this,"handleDrawStart",(function(){return t})),p(this,"handleDrawMove",(function(e,n){if(e.preventDefault(),!e.touches||e.touches.length<2)return new y;var i=t.scaleOrPanState,r=i.recentMetrics=i.getTouchMetrics(e),a=r.centroid,o=r.distance,s=i.scaleStart*(o/i.start.distance)-n.coordSystem.scale;return n.coordSystem.scaleAtClientPoint(s,a),t})),p(this,"handleDrawEnd",(function(){return new y})),this.scaleOrPanState=e},D=function(){var e=this;p(this,"handleMouseWheel",w.bind(this)),p(this,"handleDrawStart",(function(t,n){if(t.preventDefault(),t.touches&&t.touches.length){var i=C(n.coordSystem,t),r=i.x,a=i.y;n.lazy.update({x:r,y:a},{both:!0})}return e.handleDrawMove(t,n)})),p(this,"handleDrawMove",(function(t,n){t.preventDefault();var i=C(n.coordSystem,t),r=i.x,a=i.y;n.lazy.update({x:r,y:a});var o=!n.lazy.isEnabled();return e.isDrawing&&!o||(n.points.push(n.clampPointToDocument(n.lazy.brush.toObject())),e.isDrawing=!0),n.points.push(n.clampPointToDocument(n.lazy.brush.toObject())),n.drawPoints({points:n.points,brushColor:n.props.brushColor,brushRadius:n.props.brushRadius}),e})),p(this,"handleDrawEnd",(function(t,n){return t.preventDefault(),e.handleDrawMove(t,n),n.saveLine(),new y})),this.isDrawing=!1},S=function(e){var t=e.clientX,n=e.clientY;p(this,"preventDefault",(function(){})),this.clientX=t,this.clientY=n,this.touches=[{clientX:t,clientY:n}]};function O(e){var t=e.clientX,n=e.clientY;return e.changedTouches&&e.changedTouches.length>0&&(t=e.changedTouches[0].clientX,n=e.changedTouches[0].clientY),{clientX:t,clientY:n}}function C(e,t){return e.clientPointToViewPoint(O(t))}var E=!1;try{var P={get passive(){return E=!0,!1}};window.addEventListener("test",P,P),window.removeEventListener("test",P,P)}catch(e){E=!1}function T(e,t){var n;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(n=function(e,t){if(!e)return;if("string"==typeof e)return k(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return k(e,t)}(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var i=0;return function(){return i>=e.length?{done:!0}:{done:!1,value:e[i++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}return(n=e[Symbol.iterator]()).next.bind(n)}function k(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,i=new Array(t);n<t;n++)i[n]=e[n];return i}function R(){return(R=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e}).apply(this,arguments)}function L(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function z(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function j(e,t){return{x:e.x+(t.x-e.x)/2,y:e.y+(t.y-e.y)/2}}var W={display:"block",position:"absolute"},A=["grid","drawing","temp","interface"],V=function(e){var t,n;function i(t){var n;return z(L(n=e.call(this,t)||this),"undo",(function(){var e=[];n.lines.length?e=n.lines.slice(0,-1):n.erasedLines.length&&(e=n.erasedLines.pop()),n.clearExceptErasedLines(),n.simulateDrawingLines({lines:e,immediate:!0}),n.triggerOnChange()})),z(L(n),"eraseAll",(function(){n.erasedLines.push([].concat(n.lines)),n.clearExceptErasedLines(),n.triggerOnChange()})),z(L(n),"clear",(function(){n.erasedLines=[],n.clearExceptErasedLines(),n.resetView()})),z(L(n),"resetView",(function(){return n.coordSystem.resetView()})),z(L(n),"setView",(function(e){return n.coordSystem.setView(e)})),z(L(n),"getSaveData",(function(){return JSON.stringify({lines:n.lines,width:n.props.canvasWidth,height:n.props.canvasHeight})})),z(L(n),"getDataURL",(function(e,t,i){var r=n.canvas.drawing,a=r.getContext("2d"),o=r.width,s=r.height,c=a.getImageData(0,0,o,s),u=a.globalCompositeOperation;if(a.globalCompositeOperation="destination-over",t){if(!n.props.imgSrc)return"Background image source not set";n.drawImage()}else null!=i&&(a.fillStyle=i,a.fillRect(0,0,o,s));e||(e="png");var h=r.toDataURL("image/"+e);return a.clearRect(0,0,o,s),a.putImageData(c,0,0),a.globalCompositeOperation=u,h})),z(L(n),"loadSaveData",(function(e,t){if(void 0===t&&(t=n.props.immediateLoading),"string"!=typeof e)throw new Error("saveData needs to be of type string!");var i=JSON.parse(e),r=i.lines,a=i.width,o=i.height;if(!r||"function"!=typeof r.push)throw new Error("saveData.lines needs to be an array!");if(n.clear(),a===n.props.canvasWidth&&o===n.props.canvasHeight)n.simulateDrawingLines({lines:r,immediate:t});else{var s=n.props.canvasWidth/a,c=n.props.canvasHeight/o,u=(s+c)/2;n.simulateDrawingLines({lines:r.map((function(e){return R({},e,{points:e.points.map((function(e){return{x:e.x*s,y:e.y*c}})),brushRadius:e.brushRadius*u})})),immediate:t})}})),z(L(n),"componentWillUnmount",(function(){n.canvasObserver.unobserve(n.canvasContainer),n.canvas.interface&&n.canvas.interface.removeEventListener("wheel",n.handleWheel)})),z(L(n),"handleWheel",(function(e){n.interactionSM=n.interactionSM.handleMouseWheel(e,L(n))})),z(L(n),"handleDrawStart",(function(e){n.interactionSM=n.interactionSM.handleDrawStart(e,L(n)),n.mouseHasMoved=!0})),z(L(n),"handleDrawMove",(function(e){n.interactionSM=n.interactionSM.handleDrawMove(e,L(n)),n.mouseHasMoved=!0})),z(L(n),"handleDrawEnd",(function(e){n.interactionSM=n.interactionSM.handleDrawEnd(e,L(n)),n.mouseHasMoved=!0})),z(L(n),"applyView",(function(){if(n.ctx.drawing&&(A.map((function(e){return n.ctx[e]})).forEach((function(e){n.clearWindow(e);var t=n.coordSystem.transformMatrix;e.setTransform(t.a,t.b,t.c,t.d,t.e,t.f)})),!n.deferRedrawOnViewChange)){n.drawGrid(n.ctx.grid),n.redrawImage(),n.loop({once:!0});var e=n.lines;n.lines=[],n.simulateDrawingLines({lines:e,immediate:!0})}})),z(L(n),"handleCanvasResize",(function(e){var t=n.getSaveData();n.deferRedrawOnViewChange=!0;try{for(var i,r=T(e);!(i=r()).done;){var a=i.value.contentRect,o=a.width,s=a.height;n.setCanvasSize(n.canvas.interface,o,s),n.setCanvasSize(n.canvas.drawing,o,s),n.setCanvasSize(n.canvas.temp,o,s),n.setCanvasSize(n.canvas.grid,o,s),n.coordSystem.documentSize={width:o,height:s},n.drawGrid(n.ctx.grid),n.drawImage(),n.loop({once:!0})}n.loadSaveData(t,!0)}finally{n.deferRedrawOnViewChange=!1}})),z(L(n),"clampPointToDocument",(function(e){return n.props.clampLinesToDocument?{x:Math.max(Math.min(e.x,n.props.canvasWidth),0),y:Math.max(Math.min(e.y,n.props.canvasHeight),0)}:e})),z(L(n),"redrawImage",(function(){n.image&&n.image.complete&&function(e){var t=void 0===e?{}:e,n=t.ctx,i=t.img,r=t.x,a=t.y,o=t.w,s=t.h,c=t.offsetX,u=t.offsetY;"number"!=typeof r&&(r=0),"number"!=typeof a&&(a=0),"number"!=typeof o&&(o=n.canvas.width),"number"!=typeof s&&(s=n.canvas.height),"number"!=typeof c&&(c=.5),"number"!=typeof u&&(u=.5),c<0&&(c=0),u<0&&(u=0),c>1&&(c=1),u>1&&(u=1);var h,l,d,f,v=i.width,p=i.height,w=Math.min(o/v,s/p),y=v*w,g=p*w,m=1;y<o&&(m=o/y),Math.abs(m-1)<1e-14&&g<s&&(m=s/g),(h=(v-(d=v/((y*=m)/o)))*c)<0&&(h=0),(l=(p-(f=p/((g*=m)/s)))*u)<0&&(l=0),d>v&&(d=v),f>p&&(f=p),n.drawImage(i,h,l,d,f,r,a,o,s)}({ctx:n.ctx.grid,img:n.image})})),z(L(n),"simulateDrawingLines",(function(e){var t=e.lines,i=e.immediate,r=0,a=i?0:n.props.loadTimeOffset;t.forEach((function(e){var t=e.points,o=e.brushColor,s=e.brushRadius;if(i)return n.drawPoints({points:t,brushColor:o,brushRadius:s}),n.points=t,void n.saveLine({brushColor:o,brushRadius:s});for(var c=function(e){r+=a,window.setTimeout((function(){n.drawPoints({points:t.slice(0,e+1),brushColor:o,brushRadius:s})}),r)},u=1;u<t.length;u++)c(u);r+=a,window.setTimeout((function(){n.points=t,n.saveLine({brushColor:o,brushRadius:s})}),r)}))})),z(L(n),"setCanvasSize",(function(e,t,n){e.width=t,e.height=n,e.style.width=t,e.style.height=n})),z(L(n),"drawPoints",(function(e){var t=e.points,i=e.brushColor,r=e.brushRadius;n.ctx.temp.lineJoin="round",n.ctx.temp.lineCap="round",n.ctx.temp.strokeStyle=i,n.clearWindow(n.ctx.temp),n.ctx.temp.lineWidth=2*r;var a=t[0],o=t[1];n.ctx.temp.moveTo(o.x,o.y),n.ctx.temp.beginPath();for(var s=1,c=t.length;s<c;s++){var u=j(a,o);n.ctx.temp.quadraticCurveTo(a.x,a.y,u.x,u.y),a=t[s],o=t[s+1]}n.ctx.temp.lineTo(a.x,a.y),n.ctx.temp.stroke()})),z(L(n),"saveLine",(function(e){var t=void 0===e?{}:e,i=t.brushColor,r=t.brushRadius;n.points.length<2||(n.lines.push({points:[].concat(n.points),brushColor:i||n.props.brushColor,brushRadius:r||n.props.brushRadius}),n.points.length=0,n.inClientSpace([n.ctx.drawing,n.ctx.temp],(function(){n.ctx.drawing.drawImage(n.canvas.temp,0,0,n.canvas.drawing.width,n.canvas.drawing.height)})),n.clearWindow(n.ctx.temp),n.triggerOnChange())})),z(L(n),"triggerOnChange",(function(){n.props.onChange&&n.props.onChange(L(n))})),z(L(n),"clearWindow",(function(e){n.inClientSpace([e],(function(){return e.clearRect(0,0,e.canvas.width,e.canvas.height)}))})),z(L(n),"clearExceptErasedLines",(function(){n.lines=[],n.valuesChanged=!0,n.clearWindow(n.ctx.drawing),n.clearWindow(n.ctx.temp)})),z(L(n),"loop",(function(e){var t=(void 0===e?{}:e).once,i=void 0!==t&&t;if(n.mouseHasMoved||n.valuesChanged){var r=n.lazy.getPointerCoordinates(),a=n.lazy.getBrushCoordinates();n.drawInterface(n.ctx.interface,r,a),n.mouseHasMoved=!1,n.valuesChanged=!1}i||window.requestAnimationFrame((function(){n.loop()}))})),z(L(n),"inClientSpace",(function(e,t){e.forEach((function(e){e.save(),e.setTransform(f.a,f.b,f.c,f.d,f.e,f.f)}));try{t()}finally{e.forEach((function(e){return e.restore()}))}})),z(L(n),"drawImage",(function(){n.props.imgSrc&&(n.image=new Image,n.image.crossOrigin="anonymous",n.image.onload=n.redrawImage,n.image.src=n.props.imgSrc)})),z(L(n),"drawGrid",(function(e){if(!n.props.hideGrid){n.clearWindow(e);var t=n.coordSystem.canvasBounds,i=t.viewMin,r=t.viewMax,a=25*Math.floor(i.x/25-1),o=25*Math.floor(i.y/25-1),s=r.x+25,c=r.y+25;if(e.beginPath(),e.setLineDash([5,1]),e.setLineDash([]),e.strokeStyle=n.props.gridColor,e.lineWidth=n.props.gridLineWidth,!n.props.hideGridX){for(var u=a,h=n.props.gridSizeX;u<s;)u+=h,e.moveTo(u,o),e.lineTo(u,c);e.stroke()}if(!n.props.hideGridY){for(var l=o,d=n.props.gridSizeY;l<c;)l+=d,e.moveTo(a,l),e.lineTo(s,l);e.stroke()}}})),z(L(n),"drawInterface",(function(e,t,i){n.props.hideInterface||(n.clearWindow(e),e.beginPath(),e.fillStyle=n.props.brushColor,e.arc(i.x,i.y,n.props.brushRadius,0,2*Math.PI,!0),e.fill(),e.beginPath(),e.fillStyle=n.props.catenaryColor,e.arc(t.x,t.y,4,0,2*Math.PI,!0),e.fill(),n.lazy.isEnabled()&&(e.beginPath(),e.lineWidth=2,e.lineCap="round",e.setLineDash([2,4]),e.strokeStyle=n.props.catenaryColor,n.catenary.drawToCanvas(n.ctx.interface,i,t,n.chainLength),e.stroke()),e.beginPath(),e.fillStyle=n.props.catenaryColor,e.arc(i.x,i.y,2,0,2*Math.PI,!0),e.fill())})),n.canvas={},n.ctx={},n.catenary=new o.Catenary,n.points=[],n.lines=[],n.erasedLines=[],n.mouseHasMoved=!0,n.valuesChanged=!0,n.isDrawing=!1,n.isPressing=!1,n.deferRedrawOnViewChange=!1,n.interactionSM=new y,n.coordSystem=new v({scaleExtents:t.zoomExtents,documentSize:{width:t.canvasWidth,height:t.canvasHeight}}),n.coordSystem.attachViewChangeListener(n.applyView.bind(L(n))),n}n=e,(t=i).prototype=Object.create(n.prototype),t.prototype.constructor=t,t.__proto__=n;var c=i.prototype;return c.componentDidMount=function(){var e,t=this;this.lazy=new a.LazyBrush({radius:this.props.lazyRadius*window.devicePixelRatio,enabled:!0,initialPoint:{x:window.innerWidth/2,y:window.innerHeight/2}}),this.chainLength=this.props.lazyRadius*window.devicePixelRatio,this.canvasObserver=new s.a((function(e,n){return t.handleCanvasResize(e,n)})),this.canvasObserver.observe(this.canvasContainer),this.drawImage(),this.loop(),window.setTimeout((function(){var e=window.innerWidth/2,n=window.innerHeight/2;t.lazy.update({x:e-t.chainLength/4,y:n},{both:!0}),t.lazy.update({x:e+t.chainLength/4,y:n},{both:!1}),t.mouseHasMoved=!0,t.valuesChanged=!0,t.clearExceptErasedLines(),t.props.saveData&&t.loadSaveData(t.props.saveData)}),100),this.canvas.interface&&this.canvas.interface.addEventListener("wheel",this.handleWheel,E?{passive:e}:e)},c.componentDidUpdate=function(e){e.lazyRadius!==this.props.lazyRadius&&(this.chainLength=this.props.lazyRadius*window.devicePixelRatio,this.lazy.setRadius(this.props.lazyRadius*window.devicePixelRatio)),e.saveData!==this.props.saveData&&this.loadSaveData(this.props.saveData),JSON.stringify(e)!==JSON.stringify(this.props)&&(this.valuesChanged=!0),this.coordSystem.scaleExtents=this.props.zoomExtents,this.props.enablePanAndZoom||this.coordSystem.resetView(),e.imgSrc!==this.props.imgSrc&&this.drawImage()},c.render=function(){var e=this;return r.a.createElement("div",{className:this.props.className,style:R({display:"block",background:this.props.backgroundColor,touchAction:"none",width:this.props.canvasWidth,height:this.props.canvasHeight},this.props.style),ref:function(t){t&&(e.canvasContainer=t)}},A.map((function(t){var n="interface"===t;return r.a.createElement("canvas",{key:t,ref:function(i){i&&(e.canvas[t]=i,e.ctx[t]=i.getContext("2d"),n&&(e.coordSystem.canvas=i))},style:R({},W),onMouseDown:n?e.handleDrawStart:void 0,onMouseMove:n?e.handleDrawMove:void 0,onMouseUp:n?e.handleDrawEnd:void 0,onMouseOut:n?e.handleDrawEnd:void 0,onTouchStart:n?e.handleDrawStart:void 0,onTouchMove:n?e.handleDrawMove:void 0,onTouchEnd:n?e.handleDrawEnd:void 0,onTouchCancel:n?e.handleDrawEnd:void 0})})))},i}(i.PureComponent);z(V,"defaultProps",{onChange:null,loadTimeOffset:5,lazyRadius:12,brushRadius:10,brushColor:"#444",catenaryColor:"#0a0302",gridColor:"rgba(150,150,150,0.17)",backgroundColor:"#FFF",hideGrid:!1,canvasWidth:400,canvasHeight:400,disabled:!1,imgSrc:"",saveData:"",immediateLoading:!1,hideInterface:!1,gridSizeX:25,gridSizeY:25,gridLineWidth:.5,hideGridX:!1,hideGridY:!1,enablePanAndZoom:!1,mouseZoomFactor:.01,zoomExtents:{min:.33,max:3},clampLinesToDocument:!1})}]).default}));
//# sourceMappingURL=react-canvas-draw.min.js.map