@idraw/board - npm Package Compare versions

Comparing version 0.3.0-alpha.6 to 0.3.0-alpha.7

dist/index.global.min.js

@@ -1,1 +0,1 @@
-var iDrawBoard=function(){'use strict';var t=function(){return t=Object.assign||function(t){for(var e,i=1,o=arguments.length;i<o;i++)for(var n in e=arguments[i])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},t.apply(this,arguments)};function e(t){return'string'==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function i(t){return(Object.prototype.toString.call(t)||'').replace(/(\[object|\])/gi,'').trim()}var o={type:function(t,e){var o=i(t);return!0===e?o.toLocaleLowerCase():o},array:function(t){return'Array'===i(t)},json:function(t){return'Object'===i(t)},function:function(t){return'Function'===i(t)},asyncFunction:function(t){return'AsyncFunction'===i(t)},string:function(t){return'String'===i(t)},number:function(t){return'Number'===i(t)},undefined:function(t){return'Undefined'===i(t)},null:function(t){return'Null'===i(t)},promise:function(t){return'Promise'===i(t)}},n=function(){return n=Object.assign||function(t){for(var e,i=1,o=arguments.length;i<o;i++)for(var n in e=arguments[i])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},n.apply(this,arguments)};function r(t,e,i,o){return new(i||(i=Promise))((function(n,r){function s(t){try{c(o.next(t))}catch(t){r(t)}}function a(t){try{c(o.throw(t))}catch(t){r(t)}}function c(t){var e;t.done?n(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(s,a)}c((o=o.apply(t,e||[])).next())}))}function s(t,e){var i,o,n,r,s={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return r={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(r[Symbol.iterator]=function(){return this}),r;function a(a){return function(c){return function(a){if(i)throw new TypeError("Generator is already executing.");for(;r&&(r=0,a[0]&&(s=0)),s;)try{if(i=1,o&&(n=2&a[0]?o.return:a[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,a[1])).done)return n;switch(o=0,n&&(a=[2&a[0],n.value]),a[0]){case 0:case 1:n=a;break;case 4:return s.label++,{value:a[1],done:!1};case 5:s.label++,o=a[1],a=[0];continue;case 7:a=s.ops.pop(),s.trys.pop();continue;default:if(!(n=s.trys,(n=n.length>0&&n[n.length-1])||6!==a[0]&&2!==a[0])){s=0;continue}if(3===a[0]&&(!n||a[1]>n[0]&&a[1]<n[3])){s.label=a[1];break}if(6===a[0]&&s.label<n[1]){s.label=n[1],n=a;break}if(n&&s.label<n[2]){s.label=n[2],s.ops.push(a);break}n[2]&&s.ops.pop(),s.trys.pop();continue}a=e.call(t,s)}catch(t){a=[6,t],o=0}finally{i=n=0}if(5&a[0])throw a[1];return{value:a[0]?a[1]:void 0,done:!0}}([a,c])}}}function a(t,e){var i=e.width,o=e.height;return new Promise((function(e,n){var r="\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"".concat(i||'',"\" height = \"").concat(o||'',"\">\n      <foreignObject width=\"100%\" height=\"100%\">\n        <div xmlns = \"http://www.w3.org/1999/xhtml\">\n          ").concat(t,"\n        </div>\n      </foreignObject>\n    </svg>\n    "),s=new Blob([r],{type:'image/svg+xml;charset=utf-8'}),a=new FileReader;a.readAsDataURL(s),a.onload=function(t){var i,o=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(o)},a.onerror=function(t){n(t)}}))}function c(t){return new Promise((function(e,i){var o=new Blob([t],{type:'image/svg+xml;charset=utf-8'}),n=new FileReader;n.readAsDataURL(o),n.onload=function(t){var i,o=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(o)},n.onerror=function(t){i(t)}}))}var h=window.Image;function l(t){return new Promise((function(e,i){var o=new h;o.crossOrigin='anonymous',o.onload=function(){e(o)},o.onabort=i,o.onerror=i,o.src=t}))}var u=function(){function t(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}return t.prototype.getContext=function(){return this._ctx},t.prototype.resetSize=function(t){this._opts=n(n({},this._opts),t)},t.prototype.calcDeviceNum=function(t){return t*this._opts.devicePixelRatio},t.prototype.calcScreenNum=function(t){return t/this._opts.devicePixelRatio},t.prototype.getSize=function(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}},t.prototype.setTransform=function(t){this._transform=n(n({},this._transform),t)},t.prototype.getTransform=function(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}},t.prototype.setFillStyle=function(t){this._ctx.fillStyle=t},t.prototype.fill=function(t){return this._ctx.fill(t||'nonzero')},t.prototype.arc=function(t,e,i,o,n,r){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(i),o,n,r)},t.prototype.rect=function(t,e,i,o){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(o))},t.prototype.fillRect=function(t,e,i,o){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(o))},t.prototype.clearRect=function(t,e,i,o){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(o))},t.prototype.beginPath=function(){return this._ctx.beginPath()},t.prototype.closePath=function(){return this._ctx.closePath()},t.prototype.lineTo=function(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))},t.prototype.moveTo=function(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))},t.prototype.arcTo=function(t,e,i,o,n){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(o),this._doSize(n))},t.prototype.setLineWidth=function(t){return this._ctx.lineWidth=this._doSize(t)},t.prototype.setLineDash=function(t){var e=this;return this._ctx.setLineDash(t.map((function(t){return e._doSize(t)})))},t.prototype.isPointInPath=function(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))},t.prototype.isPointInPathWithoutScroll=function(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))},t.prototype.setStrokeStyle=function(t){this._ctx.strokeStyle=t},t.prototype.stroke=function(){return this._ctx.stroke()},t.prototype.translate=function(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))},t.prototype.rotate=function(t){return this._ctx.rotate(t)},t.prototype.drawImage=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var i=t[0],o=t[1],n=t[2],r=t[3],s=t[4],a=t[t.length-4],c=t[t.length-3],h=t[t.length-2],l=t[t.length-1];return 9===t.length?this._ctx.drawImage(i,this._doSize(o),this._doSize(n),this._doSize(r),this._doSize(s),this._doSize(a),this._doSize(c),this._doSize(h),this._doSize(l)):this._ctx.drawImage(i,this._doSize(a),this._doSize(c),this._doSize(h),this._doSize(l))},t.prototype.createPattern=function(t,e){return this._ctx.createPattern(t,e)},t.prototype.measureText=function(t){return this._ctx.measureText(t)},t.prototype.setTextAlign=function(t){this._ctx.textAlign=t},t.prototype.fillText=function(t,e,i,o){return void 0!==o?this._ctx.fillText(t,this._doSize(e),this._doSize(i),this._doSize(o)):this._ctx.fillText(t,this._doSize(e),this._doSize(i))},t.prototype.strokeText=function(t,e,i,o){return void 0!==o?this._ctx.strokeText(t,this._doSize(e),this._doSize(i),this._doSize(o)):this._ctx.strokeText(t,this._doSize(e),this._doSize(i))},t.prototype.setFont=function(t){var e=[];'bold'===t.fontWeight&&e.push("".concat(t.fontWeight)),e.push("".concat(this._doSize(t.fontSize||12),"px")),e.push("".concat(t.fontFamily||'sans-serif')),this._ctx.font="".concat(e.join(' '))},t.prototype.setTextBaseline=function(t){this._ctx.textBaseline=t},t.prototype.setGlobalAlpha=function(t){this._ctx.globalAlpha=t},t.prototype.save=function(){this._ctx.save()},t.prototype.restore=function(){this._ctx.restore()},t.prototype.scale=function(t,e){this._ctx.scale(t,e)},t.prototype.setShadowColor=function(t){this._ctx.shadowColor=t},t.prototype.setShadowOffsetX=function(t){this._ctx.shadowOffsetX=this._doSize(t)},t.prototype.setShadowOffsetY=function(t){this._ctx.shadowOffsetY=this._doSize(t)},t.prototype.setShadowBlur=function(t){this._ctx.shadowBlur=this._doSize(t)},t.prototype.ellipse=function(t,e,i,o,n,r,s,a){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(o),n,r,s,a)},t.prototype._doSize=function(t){return this._opts.devicePixelRatio*t},t.prototype._doX=function(t){var e=this._transform,i=e.scale,o=(t-e.scrollX)/i;return this._doSize(o)},t.prototype._doY=function(t){var e=this._transform,i=e.scale,o=(t-e.scrollY)/i;return this._doSize(o)},t}();function p(t){return'number'==typeof t&&(t>0||t<=0)}function f(t){return'number'==typeof t&&t>=0}function d(t){return'string'==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test("".concat(t))}function v(t){return'string'==typeof t&&/^(data:image\/)/.test("".concat(t))}var _={x:function(t){return p(t)},y:function(t){return p(t)},w:f,h:function(t){return'number'==typeof t&&t>=0},angle:function(t){return'number'==typeof t&&t>=-360&&t<=360},number:p,borderWidth:function(t){return f(t)},borderRadius:function(t){return p(t)&&t>=0},color:function(t){return e(t)},imageSrc:function(t){return v(t)||d(t)},imageURL:d,imageBase64:v,svg:function(t){return'string'==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test("".concat(t).trim())&&/<\/[\s]{0,}svg>$/i.test("".concat(t).trim())},html:function(t){var e=!1;if('string'==typeof t){var i=document.createElement('div');i.innerHTML=t,i.children.length>0&&(e=!0),i=null}return e},text:function(t){return'string'==typeof t},fontSize:function(t){return p(t)&&t>0},lineHeight:function(t){return p(t)&&t>0},textAlign:function(t){return['center','left','right'].includes(t)},fontFamily:function(t){return'string'==typeof t&&t.length>0},fontWeight:function(t){return['bold'].includes(t)},strokeWidth:function(t){return p(t)&&t>0}};function g(t){void 0===t&&(t={});var e=t.borderColor,i=t.borderRadius,o=t.borderWidth;return!(t.hasOwnProperty('borderColor')&&!_.color(e))&&(!(t.hasOwnProperty('borderRadius')&&!_.number(i))&&!(t.hasOwnProperty('borderWidth')&&!_.number(o)))}var y={attrs:function(t){var e=t.x,i=t.y,o=t.w,n=t.h,r=t.angle;return!!(_.x(e)&&_.y(i)&&_.w(o)&&_.h(n)&&_.angle(r))&&(r>=-360&&r<=360)},textDesc:function(t){var e=t.text,i=t.color,o=t.fontSize,n=t.lineHeight,r=t.fontFamily,s=t.textAlign,a=t.fontWeight,c=t.bgColor,h=t.strokeWidth,l=t.strokeColor;return!!_.text(e)&&(!!_.color(i)&&(!!_.fontSize(o)&&(!(t.hasOwnProperty('bgColor')&&!_.color(c))&&(!(t.hasOwnProperty('fontWeight')&&!_.fontWeight(a))&&(!(t.hasOwnProperty('lineHeight')&&!_.lineHeight(n))&&(!(t.hasOwnProperty('fontFamily')&&!_.fontFamily(r))&&(!(t.hasOwnProperty('textAlign')&&!_.textAlign(s))&&(!(t.hasOwnProperty('strokeWidth')&&!_.strokeWidth(h))&&(!(t.hasOwnProperty('strokeColor')&&!_.color(l))&&!!g(t))))))))))},rectDesc:function(t){var e=t.bgColor;return!(t.hasOwnProperty('bgColor')&&!_.color(e))&&!!g(t)},circleDesc:function(t){var e=t.bgColor,i=t.borderColor,o=t.borderWidth;return!(t.hasOwnProperty('bgColor')&&!_.color(e))&&(!(t.hasOwnProperty('borderColor')&&!_.color(i))&&!(t.hasOwnProperty('borderWidth')&&!_.number(o)))},imageDesc:function(t){var e=t.src;return!!_.imageSrc(e)},svgDesc:function(t){var e=t.svg;return!!_.svg(e)},htmlDesc:function(t){var e=t.html;return!!_.html(e)}},S=Object.freeze({__proto__:null,is:_,check:y,delay:function(t){return new Promise((function(e){setTimeout((function(){e()}),t)}))},compose:function(t){return function(e,i){return function o(n){var r=t[n];n===t.length&&i&&(r=i);if(!r)return Promise.resolve();try{return Promise.resolve(r(e,o.bind(null,n+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:function(t,e){var i=-1;return function(){for(var o=[],n=0;n<arguments.length;n++)o[n]=arguments[n];i>0||(i=setTimeout((function(){t.apply(void 0,o),i=-1}),e))}},loadImage:l,loadSVG:function(t){return r(this,void 0,void 0,(function(){return s(this,(function(e){switch(e.label){case 0:return[4,c(t)];case 1:return[4,l(e.sent())];case 2:return[2,e.sent()]}}))}))},loadHTML:function(t,e){return r(this,void 0,void 0,(function(){return s(this,(function(i){switch(i.label){case 0:return[4,a(t=t.replace(/\&/gi,'&amp;'),e)];case 1:return[4,l(i.sent())];case 2:return[2,i.sent()]}}))}))},downloadImageFromCanvas:function(t,e){var i=e.filename,o=e.type,n=void 0===o?'image/jpeg':o,r=t.toDataURL(n),s=document.createElement('a');s.href=r,s.download=i;var a=document.createEvent('MouseEvents');a.initEvent('click',!0,!1),s.dispatchEvent(a)},toColorHexStr:function(t){return'#'+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,'0x'))},isColorStr:e,createUUID:function(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return"".concat(t()).concat(t(),"-").concat(t(),"-").concat(t(),"-").concat(t(),"-").concat(t()).concat(t()).concat(t())},istype:o,deepClone:function(t){return function t(e){var i,o=(i=e,Object.prototype.toString.call(i).replace(/[\]|\[]{1,1}/gi,'').split(' ')[1]);if(['Null','Number','String','Boolean','Undefined'].indexOf(o)>=0)return e;if('Array'===o){var n=[];return e.forEach((function(e){n.push(t(e))})),n}if('Object'===o){var r={};return Object.keys(e).forEach((function(i){r[i]=t(e[i])})),r}}(t)},Context:u}),m=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var i=this._listeners.get(t);if(Array.isArray(i))for(var o=0;o<(null==i?void 0:i.length);o++)if(i[o]===e){i.splice(o,1);break}this._listeners.set(t,i||[])}},t.prototype.trigger=function(t,e){var i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}();var x=function(){function t(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}return t.prototype.set=function(t,e){this._temp[t]=e},t.prototype.get=function(t){return this._temp[t]},t.prototype.clear=function(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}},t}(),b=function(){function t(t,e){this._isMoving=!1,this._temp=new x,this._container=window,this._canvas=t,this._isMoving=!1,this._initEvent(),this._event=new m}return t.prototype.setStatusMap=function(t){this._temp.set('statusMap',t)},t.prototype.on=function(t,e){this._event.on(t,e)},t.prototype.off=function(t,e){this._event.off(t,e)},t.prototype._initEvent=function(){var t=this._canvas,e=this._container;e.addEventListener('mousemove',this._listenWindowMove.bind(this),!1),e.addEventListener('mouseup',this._listenWindowMoveEnd.bind(this),!1),t.addEventListener('mousemove',this._listenHover.bind(this),!1),t.addEventListener('mousedown',this._listenMoveStart.bind(this),!1),t.addEventListener('mousemove',this._listenMove.bind(this),!1),t.addEventListener('mouseup',this._listenMoveEnd.bind(this),!1),t.addEventListener('click',this._listenCanvasClick.bind(this),!1),t.addEventListener('wheel',this._listenCanvasWheel.bind(this),!1),t.addEventListener('mousedown',this._listenCanvasMoveStart.bind(this),!0),t.addEventListener('mouseup',this._listenCanvasMoveEnd.bind(this),!0),t.addEventListener('mouseover',this._listenCanvasMoveOver.bind(this),!0),t.addEventListener('mouseleave',this._listenCanvasMoveLeave.bind(this),!0),this._initParentEvent()},t.prototype._initParentEvent=function(){try{for(var t=window,e=t.origin;t.self!==t.top&&(t.self!==t.parent&&t.origin===e&&t.parent.window.addEventListener('mousemove',this._listSameOriginParentWindow.bind(this),!1),t=t.parent););}catch(t){console.warn(t)}},t.prototype._listenHover=function(t){t.preventDefault();var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.has('hover')&&this._event.trigger('hover',e),this._isMoving=!0},t.prototype._listenMoveStart=function(t){t.preventDefault();var e=this._getPosition(t);this._isVaildPoint(e)&&(this._event.has('point')&&this._event.trigger('point',e),this._event.has('moveStart')&&this._event.trigger('moveStart',e)),this._isMoving=!0},t.prototype._listenMove=function(t){if(t.preventDefault(),t.stopPropagation(),this._event.has('move')&&!0===this._isMoving){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('move',e)}},t.prototype._listenMoveEnd=function(t){if(t.preventDefault(),this._event.has('moveEnd')){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('moveEnd',e)}this._isMoving=!1},t.prototype._listSameOriginParentWindow=function(){this._temp.get('isHoverCanvas')&&this._event.has('leave')&&this._event.trigger('leave',void 0),this._temp.get('isDragCanvas')&&this._event.has('moveEnd')&&this._event.trigger('moveEnd',{x:NaN,y:NaN}),this._isMoving=!1,this._temp.set('isDragCanvas',!1),this._temp.set('isHoverCanvas',!1)},t.prototype._listenCanvasMoveStart=function(){this._temp.get('isHoverCanvas')&&this._temp.set('isDragCanvas',!0)},t.prototype._listenCanvasMoveEnd=function(){this._temp.set('isDragCanvas',!1)},t.prototype._listenCanvasMoveOver=function(){this._temp.set('isHoverCanvas',!0)},t.prototype._listenCanvasMoveLeave=function(){this._temp.set('isHoverCanvas',!1),this._event.has('leave')&&this._event.trigger('leave',void 0)},t.prototype._listenWindowMove=function(t){if(!0===this._temp.get('isDragCanvas')&&(t.preventDefault(),t.stopPropagation(),this._event.has('move')&&!0===this._isMoving)){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('move',e)}},t.prototype._listenWindowMoveEnd=function(t){if(!0!=!this._temp.get('isDragCanvas')){if(t.preventDefault(),this._event.has('moveEnd')){var e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger('moveEnd',e)}this._temp.set('isDragCanvas',!1),this._isMoving=!1}},t.prototype._listenCanvasWheel=function(t){this._event.has('wheelX')&&(t.deltaX>0||t.deltaX<0)&&this._event.trigger('wheelX',t.deltaX),this._event.has('wheelY')&&(t.deltaY>0||t.deltaY<0)&&this._event.trigger('wheelY',t.deltaY);var e=this._temp.get('statusMap'),i=e.canScrollYNext,o=e.canScrollYPrev;(t.deltaX>0&&t.deltaX<0||t.deltaY>0&&!0===i||t.deltaY<0&&!0===o)&&t.preventDefault()},t.prototype._listenCanvasClick=function(t){t.preventDefault();var e=this._getPosition(t),i=Date.now();if(this._isVaildPoint(e)){var o=this._temp.get('prevClickPoint');o&&i-o.t<=500&&Math.abs(o.x-e.x)<=5&&Math.abs(o.y-e.y)<=5?this._event.has('doubleClick')&&this._event.trigger('doubleClick',{x:e.x,y:e.y}):this._temp.set('prevClickPoint',{x:e.x,y:e.y,t:i})}},t.prototype._getPosition=function(t){var e=this._canvas,i=0,o=0;if(t&&t.touches&&t.touches.length>0){var n=t.touches[0];n&&(i=n.clientX,o=n.clientY)}else i=t.clientX,o=t.clientY;return{x:i-e.getBoundingClientRect().left,y:o-e.getBoundingClientRect().top,t:Date.now()}},t.prototype._isVaildPoint=function(t){return z(t.x)&&z(t.y)},t}();function z(t){return t>0||t<0||0===t}var w={lineWidth:12,color:'#a0a0a0'},P=function(){function i(t,e){this._displayCtx=t,this._opts=this._getOpts(e)}return i.prototype.draw=function(t){var e=this._opts,i=e.width,o=e.height,n=this.calc(t),r=this._displayCtx;n.xSize>0&&(r.globalAlpha=.2,r.fillStyle=n.color,r.fillRect(0,this._doSize(o-n.lineSize),this._doSize(i),this._doSize(n.lineSize)),r.globalAlpha=1,C(r,{x:this._doSize(n.translateX),y:this._doSize(o-n.lineSize),w:this._doSize(n.xSize),h:this._doSize(n.lineSize),r:this._doSize(n.lineSize/2),color:n.color})),n.ySize>0&&(r.globalAlpha=.2,r.fillStyle=n.color,r.fillRect(this._doSize(i-n.lineSize),0,this._doSize(n.lineSize),this._doSize(o)),r.globalAlpha=1,C(r,{x:this._doSize(i-n.lineSize),y:this._doSize(n.translateY),w:this._doSize(n.lineSize),h:this._doSize(n.ySize),r:this._doSize(n.lineSize/2),color:n.color})),r.globalAlpha=1},i.prototype.resetSize=function(e){this._opts=t(t({},this._opts),e)},i.prototype.isPointAtScrollY=function(t){var e=this._opts,i=e.width,o=e.height,n=e.scrollConfig,r=this._displayCtx;return r.beginPath(),r.rect(this._doSize(i-n.lineWidth),0,this._doSize(n.lineWidth),this._doSize(o)),r.closePath(),!!r.isPointInPath(this._doSize(t.x),this._doSize(t.y))},i.prototype.isPointAtScrollX=function(t){var e=this._opts,i=e.width,o=e.height,n=e.scrollConfig,r=this._displayCtx;return r.beginPath(),r.rect(0,this._doSize(o-n.lineWidth),this._doSize(i-n.lineWidth),this._doSize(n.lineWidth)),r.closePath(),!!r.isPointInPath(this._doSize(t.x),this._doSize(t.y))},i.prototype.getLineWidth=function(){return this._opts.scrollConfig.lineWidth},i.prototype.calc=function(t){var e=this._opts,i=e.width,o=e.height,n=e.scrollConfig,r=2.5*n.lineWidth,s=n.lineWidth,a=0,c=0;t.left<=0&&t.right<=0&&(a=Math.max(r,i-(Math.abs(t.left)+Math.abs(t.right))))>=i&&(a=0),(t.top<=0||t.bottom<=0)&&(c=Math.max(r,o-(Math.abs(t.top)+Math.abs(t.bottom))))>=o&&(c=0);var h=0;a>0&&(h=a/2+(i-a)*Math.abs(t.left)/(Math.abs(t.left)+Math.abs(t.right)),h=Math.min(Math.max(0,h-a/2),i-a));var l=0;return c>0&&(l=c/2+(o-c)*Math.abs(t.top)/(Math.abs(t.top)+Math.abs(t.bottom)),l=Math.min(Math.max(0,l-c/2),o-c)),{lineSize:s,xSize:a,ySize:c,translateY:l,translateX:h,color:this._opts.scrollConfig.color}},i.prototype._doSize=function(t){return t*this._opts.devicePixelRatio},i.prototype._getOpts=function(i){var o=t({scrollConfig:w},i);return o.scrollConfig||(o.scrollConfig=w),o.scrollConfig.lineWidth>0||(o.scrollConfig.lineWidth=w.lineWidth),o.scrollConfig.lineWidth=Math.max(o.scrollConfig.lineWidth,w.lineWidth),!0!==e(o.scrollConfig.color)&&(o.scrollConfig.color=o.scrollConfig.color),o},i}();function C(t,e){var i=e.x,o=e.y,n=e.w,r=e.h,s=e.color,a=e.r;(n<2*(a=Math.min(a,n/2,r/2))||r<2*a)&&(a=0),t.beginPath(),t.moveTo(i+a,o),t.arcTo(i+n,o,i+n,o+r,a),t.arcTo(i+n,o+r,i,o+r,a),t.arcTo(i,o+r,i,o,a),t.arcTo(i,o,i+n,o,a),t.closePath(),t.fillStyle=s,t.fill()}var M,Y=Symbol('_opts'),X=Symbol('_ctx'),T=function(){function e(t,e){this[Y]=e,this[X]=t}return e.prototype.resetSize=function(e){this[Y]=t(t({},this[Y]),e)},e.prototype.calcScreen=function(){var t=this[X].getTransform().scale,e=this[Y],i=e.width,o=e.height,n=e.contextWidth,r=e.contextHeight,s=e.devicePixelRatio,a=!0,c=!0,h=!0,l=!0;n*t<=i&&(this[X].setTransform({scrollX:(i-n*t)/2}),a=!1,c=!1),r*t<=o&&(this[X].setTransform({scrollY:(o-r*t)/2}),h=!1,l=!1),n*t>=i&&this[X].getTransform().scrollX>0&&(this[X].setTransform({scrollX:0}),a=!1),r*t>=o&&this[X].getTransform().scrollY>0&&(this[X].setTransform({scrollY:0}),h=!1);var u=this[X].getTransform(),p=u.scrollX,f=u.scrollY;p<0&&Math.abs(p)>Math.abs(n*t-i)&&(this[X].setTransform({scrollX:0-Math.abs(n*t-i)}),c=!1),f<0&&Math.abs(f)>Math.abs(r*t-o)&&(this[X].setTransform({scrollY:0-Math.abs(r*t-o)}),l=!1);var d=this[X].getTransform(),v=d.scrollX,_=d.scrollY;return{size:{x:v*t,y:_*t,w:n*t,h:r*t},position:{top:_,bottom:o-(r*t+_),left:v,right:i-(n*t+v)},deviceSize:{x:v*s,y:_*s,w:n*s*t,h:r*s*t},width:this[Y].width,height:this[Y].height,devicePixelRatio:this[Y].devicePixelRatio,canScrollYPrev:h,canScrollYNext:l,canScrollXPrev:a,canScrollXNext:c}},e.prototype.calcScreenScroll=function(t,e,i,o,n){var r=o-i;t<=0&&e<=0&&(r=Math.abs(t)+Math.abs(e));var s=1;return r>0&&(s=r/(o-i)),0-s*n},e}(),W=Symbol('_canvas'),E=Symbol('_displayCanvas'),O=Symbol('_helperCanvas'),D=Symbol('_mount'),R=Symbol('_opts'),k=Symbol('_hasRendered'),A=Symbol('_ctx'),N=Symbol('_helperCtx'),L=Symbol('_watcher'),H=Symbol('_render'),j=Symbol('_parsePrivateOptions'),I=Symbol('_scroller'),F=Symbol('_initEvent'),B=Symbol('_doScrollX'),V=Symbol('_doScrollY'),U=Symbol('_doMoveScroll'),G=Symbol('_resetContext'),$=Symbol('_screen'),q=S.throttle,J=S.Context,K=function(){function e(t,e){this[M]=!1,this[D]=t,this[W]=document.createElement('canvas'),this[O]=document.createElement('canvas'),this[E]=document.createElement('canvas'),this[D].appendChild(this[E]),this[R]=this[j](e);var i=this[W].getContext('2d'),o=this[E].getContext('2d'),n=this[O].getContext('2d');this[A]=new J(i,this[R]),this[N]=new J(n,this[R]),this[$]=new T(this[A],this[R]),this[L]=new b(this[E],this[A]),this[I]=new P(o,{width:e.width,height:e.height,devicePixelRatio:e.devicePixelRatio||1,scrollConfig:e.scrollConfig}),this[H]()}return e.prototype.getDisplayContext2D=function(){return this[E].getContext('2d')},e.prototype.getOriginContext2D=function(){return this[A].getContext()},e.prototype.getHelperContext2D=function(){return this[N].getContext()},e.prototype.getContext=function(){return this[A]},e.prototype.getHelperContext=function(){return this[N]},e.prototype.scale=function(t){t>0&&(this[A].setTransform({scale:t}),this[N].setTransform({scale:t}));var e=this[$].calcScreen();return{position:e.position,size:e.size}},e.prototype.scrollX=function(t){this[L].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[A].setTransform({scrollX:t}),this[N].setTransform({scrollX:t}));var e=this[$].calcScreen(),i=e.position,o=e.size,n=e.canScrollXNext,r=e.canScrollYNext,s=e.canScrollXPrev,a=e.canScrollYPrev;return this[L].setStatusMap({canScrollYPrev:a,canScrollYNext:r,canScrollXPrev:s,canScrollXNext:n}),{position:i,size:o}},e.prototype.scrollY=function(t){this[L].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[A].setTransform({scrollY:t}),this[N].setTransform({scrollY:t}));var e=this[$].calcScreen(),i=e.position,o=e.size,n=e.canScrollXNext,r=e.canScrollYNext,s=e.canScrollXPrev,a=e.canScrollYPrev;return this[L].setStatusMap({canScrollYPrev:a,canScrollYNext:r,canScrollXPrev:s,canScrollXNext:n}),{position:i,size:o}},e.prototype.getTransform=function(){return this[A].getTransform()},e.prototype.draw=function(){this.clear();var t=this[$].calcScreen(),e=t.position,i=t.deviceSize,o=t.size,n=this[E].getContext('2d');return null==n||n.drawImage(this[W],i.x,i.y,i.w,i.h),null==n||n.drawImage(this[O],i.x,i.y,i.w,i.h),!0===this[R].canScroll&&this[I].draw(e),{position:e,size:o}},e.prototype.clear=function(){var t=this[E].getContext('2d');null==t||t.clearRect(0,0,this[E].width,this[E].height)},e.prototype.on=function(t,e){this[L].on(t,e)},e.prototype.off=function(t,e){this[L].off(t,e)},e.prototype.getScreenInfo=function(){return this[$].calcScreen()},e.prototype.setCursor=function(t){this[E].style.cursor=t},e.prototype.resetCursor=function(){this[E].style.cursor='auto'},e.prototype.resetSize=function(e){this[R]=t(t({},this[R]),e),this[G](),this[A].resetSize(e),this[N].resetSize(e),this[$].resetSize(e),this[I].resetSize({width:this[R].width,height:this[R].height,devicePixelRatio:this[R].devicePixelRatio}),this.draw()},e.prototype.getScrollLineWidth=function(){var t=0;return!0===this[R].canScroll&&(t=this[I].getLineWidth()),t},e.prototype.pointScreenToContext=function(t){var e=this.getTransform(),i=e.scrollX,o=e.scrollY,n=e.scale;return{x:(t.x-i)/n,y:(t.y-o)/n}},e.prototype.pointContextToScreen=function(t){var e=this.getTransform(),i=e.scrollX,o=e.scrollY,n=e.scale;return{x:t.x*n+i,y:t.y*n+o}},e.prototype[(M=k,H)]=function(){!0!==this[k]&&(this[G](),this[F](),this[k]=!0)},e.prototype[G]=function(){var e,i,o,n,r,s,a=this[R],c=a.width,h=a.height,l=a.contextWidth,u=a.contextHeight,p=a.devicePixelRatio;this[W].width=l*p,this[W].height=u*p,this[O].width=l*p,this[O].height=u*p,this[E].width=c*p,this[E].height=h*p,e=this[E],i={width:"".concat(c,"px"),height:"".concat(h,"px")},o=function(t){var e={};return(t.getAttribute('style')||'').split(';').forEach((function(t){var i=t.split(':');i[0]&&'string'==typeof i[0]&&(e[i[0]]=i[1]||'')})),e}(e),n=t(t({},o),i),r=Object.keys(n),s='',r.forEach((function(t){s+="".concat(t,":").concat(n[t]||'',";")})),e.setAttribute('style',s)},e.prototype[j]=function(e){return t(t({},{devicePixelRatio:1}),e)},e.prototype[F]=function(){var t=this;if(!0!==this[k]&&!0===this[R].canScroll){this.on('wheelX',q((function(e){t[B](e)}),16)),this.on('wheelY',q((function(e){t[V](e)}),16));var e=null;this.on('moveStart',q((function(i){t[I].isPointAtScrollX(i)?e='x':t[I].isPointAtScrollY(i)&&(e='y')}),16)),this.on('move',q((function(i){e&&t[U](e,i)}),16)),this.on('moveEnd',q((function(i){e&&t[U](e,i),e=null}),16))}},e.prototype[B]=function(t,e){var i=this[R].width,o=e;'number'==typeof o&&(o>0||o<=0)||(o=this[A].getTransform().scrollX);var n=this[$].calcScreen().position,r=this[I].calc(n).xSize,s=this[$].calcScreenScroll(n.left,n.right,r,i,t);this.scrollX(o+s),this.draw()},e.prototype[V]=function(t,e){var i=this[R].height,o=e;'number'==typeof o&&(o>0||o<=0)||(o=this[A].getTransform().scrollY);var n=this[$].calcScreen().position,r=this[I].calc(n).ySize,s=this[$].calcScreenScroll(n.top,n.bottom,r,i,t);this.scrollY(o+s),this.draw()},e.prototype[U]=function(t,e){if(t){var i=this[$].calcScreen().position,o=this[I].calc(i),n=o.xSize,r=o.ySize;'x'===t?this[B](e.x-n/2,0):'y'===t&&this[V](e.y-r/2,0)}},e}();return Object.freeze({__proto__:null,Board:K})}();
+var iDrawBoard=function(){"use strict";function t(t){return"string"==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function e(t){return(Object.prototype.toString.call(t)||"").replace(/(\[object|\])/gi,"").trim()}const i={type(t,i){const s=e(t);return!0===i?s.toLocaleLowerCase():s},array:t=>"Array"===e(t),json:t=>"Object"===e(t),function:t=>"Function"===e(t),asyncFunction:t=>"AsyncFunction"===e(t),string:t=>"String"===e(t),number:t=>"Number"===e(t),undefined:t=>"Undefined"===e(t),null:t=>"Null"===e(t),promise:t=>"Promise"===e(t)};var s=globalThis&&globalThis.__awaiter||function(t,e,i,s){return new(i||(i=Promise))((function(n,o){function r(t){try{l(s.next(t))}catch(t){o(t)}}function h(t){try{l(s.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?n(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,h)}l((s=s.apply(t,e||[])).next())}))};const{Image:n}=window;function o(t){return new Promise(((e,i)=>{const s=new n;s.crossOrigin="anonymous",s.onload=function(){e(s)},s.onabort=i,s.onerror=i,s.src=t}))}function r(t){return"number"==typeof t&&(t>0||t<=0)}function h(t){return"number"==typeof t&&t>=0}function l(t){return"string"==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${t}`)}function a(t){return"string"==typeof t&&/^(data:image\/)/.test(`${t}`)}const c={x:function(t){return r(t)},y:function(t){return r(t)},w:h,h:function(t){return"number"==typeof t&&t>=0},angle:function(t){return"number"==typeof t&&t>=-360&&t<=360},number:r,borderWidth:function(t){return h(t)},borderRadius:function(t){return r(t)&&t>=0},color:function(e){return t(e)},imageSrc:function(t){return a(t)||l(t)},imageURL:l,imageBase64:a,svg:function(t){return"string"==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test(`${t}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${t}`.trim())},html:function(t){let e=!1;if("string"==typeof t){let i=document.createElement("div");i.innerHTML=t,i.children.length>0&&(e=!0),i=null}return e},text:function(t){return"string"==typeof t},fontSize:function(t){return r(t)&&t>0},lineHeight:function(t){return r(t)&&t>0},textAlign:function(t){return["center","left","right"].includes(t)},fontFamily:function(t){return"string"==typeof t&&t.length>0},fontWeight:function(t){return["bold"].includes(t)},strokeWidth:function(t){return r(t)&&t>0}};function d(t={}){const{borderColor:e,borderRadius:i,borderWidth:s}=t;return!(t.hasOwnProperty("borderColor")&&!c.color(e))&&(!(t.hasOwnProperty("borderRadius")&&!c.number(i))&&!(t.hasOwnProperty("borderWidth")&&!c.number(s)))}const _={attrs:function(t){const{x:e,y:i,w:s,h:n,angle:o}=t;return!!(c.x(e)&&c.y(i)&&c.w(s)&&c.h(n)&&c.angle(o))&&(o>=-360&&o<=360)},textDesc:function(t){const{text:e,color:i,fontSize:s,lineHeight:n,fontFamily:o,textAlign:r,fontWeight:h,bgColor:l,strokeWidth:a,strokeColor:_}=t;return!!c.text(e)&&(!!c.color(i)&&(!!c.fontSize(s)&&(!(t.hasOwnProperty("bgColor")&&!c.color(l))&&(!(t.hasOwnProperty("fontWeight")&&!c.fontWeight(h))&&(!(t.hasOwnProperty("lineHeight")&&!c.lineHeight(n))&&(!(t.hasOwnProperty("fontFamily")&&!c.fontFamily(o))&&(!(t.hasOwnProperty("textAlign")&&!c.textAlign(r))&&(!(t.hasOwnProperty("strokeWidth")&&!c.strokeWidth(a))&&(!(t.hasOwnProperty("strokeColor")&&!c.color(_))&&!!d(t))))))))))},rectDesc:function(t){const{bgColor:e}=t;return!(t.hasOwnProperty("bgColor")&&!c.color(e))&&!!d(t)},circleDesc:function(t){const{bgColor:e,borderColor:i,borderWidth:s}=t;return!(t.hasOwnProperty("bgColor")&&!c.color(e))&&(!(t.hasOwnProperty("borderColor")&&!c.color(i))&&!(t.hasOwnProperty("borderWidth")&&!c.number(s)))},imageDesc:function(t){const{src:e}=t;return!!c.imageSrc(e)},svgDesc:function(t){const{svg:e}=t;return!!c.svg(e)},htmlDesc:function(t){const{html:e}=t;return!!c.html(e)}},u={is:c,check:_,delay:function(t){return new Promise((e=>{setTimeout((()=>{e()}),t)}))},compose:function(t){return function(e,i){return function s(n){let o=t[n];n===t.length&&i&&(o=i);if(!o)return Promise.resolve();try{return Promise.resolve(o(e,s.bind(null,n+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:function(t,e){let i=-1;return function(...s){i>0||(i=setTimeout((()=>{t(...s),i=-1}),e))}},loadImage:o,loadSVG:function(t){return s(this,void 0,void 0,(function*(){const e=yield function(t){return new Promise(((e,i)=>{const s=new Blob([t],{type:"image/svg+xml;charset=utf-8"}),n=new FileReader;n.readAsDataURL(s),n.onload=function(t){var i;const s=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(s)},n.onerror=function(t){i(t)}}))}(t);return yield o(e)}))},loadHTML:function(t,e){return s(this,void 0,void 0,(function*(){t=t.replace(/\&/gi,"&amp;");const i=yield function(t,e){const{width:i,height:s}=e;return new Promise(((e,n)=>{const o=new Blob([`\n    <svg xmlns="http://www.w3.org/2000/svg" width="${i||""}" height = "${s||""}">\n      <foreignObject width="100%" height="100%">\n        <div xmlns = "http://www.w3.org/1999/xhtml">\n          ${t}\n        </div>\n      </foreignObject>\n    </svg>\n    `],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(o),r.onload=function(t){var i;const s=null===(i=null==t?void 0:t.target)||void 0===i?void 0:i.result;e(s)},r.onerror=function(t){n(t)}}))}(t,e);return yield o(i)}))},downloadImageFromCanvas:function(t,e){const{filename:i,type:s="image/jpeg"}=e,n=t.toDataURL(s),o=document.createElement("a");o.href=n,o.download=i;const r=document.createEvent("MouseEvents");r.initEvent("click",!0,!1),o.dispatchEvent(r)},toColorHexStr:function(t){return"#"+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,"0x"))},isColorStr:t,createUUID:function(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${t()}${t()}-${t()}-${t()}-${t()}-${t()}${t()}${t()}`},istype:i,deepClone:function(t){return function t(e){const i=(s=e,Object.prototype.toString.call(s).replace(/[\]|\[]{1,1}/gi,"").split(" ")[1]);var s;if(["Null","Number","String","Boolean","Undefined"].indexOf(i)>=0)return e;if("Array"===i){const i=[];return e.forEach((e=>{i.push(t(e))})),i}if("Object"===i){const i={};return Object.keys(e).forEach((s=>{i[s]=t(e[s])})),i}}(t)},Context:class{constructor(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}getContext(){return this._ctx}resetSize(t){this._opts=Object.assign(Object.assign({},this._opts),t)}calcDeviceNum(t){return t*this._opts.devicePixelRatio}calcScreenNum(t){return t/this._opts.devicePixelRatio}getSize(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}}setTransform(t){this._transform=Object.assign(Object.assign({},this._transform),t)}getTransform(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}}setFillStyle(t){this._ctx.fillStyle=t}fill(t){return this._ctx.fill(t||"nonzero")}arc(t,e,i,s,n,o){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(i),s,n,o)}rect(t,e,i,s){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(s))}fillRect(t,e,i,s){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(s))}clearRect(t,e,i,s){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(s))}beginPath(){return this._ctx.beginPath()}closePath(){return this._ctx.closePath()}lineTo(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))}moveTo(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))}arcTo(t,e,i,s,n){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(s),this._doSize(n))}setLineWidth(t){return this._ctx.lineWidth=this._doSize(t)}setLineDash(t){return this._ctx.setLineDash(t.map((t=>this._doSize(t))))}isPointInPath(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))}isPointInPathWithoutScroll(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))}setStrokeStyle(t){this._ctx.strokeStyle=t}stroke(){return this._ctx.stroke()}translate(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))}rotate(t){return this._ctx.rotate(t)}drawImage(...t){const e=t[0],i=t[1],s=t[2],n=t[3],o=t[4],r=t[t.length-4],h=t[t.length-3],l=t[t.length-2],a=t[t.length-1];return 9===t.length?this._ctx.drawImage(e,this._doSize(i),this._doSize(s),this._doSize(n),this._doSize(o),this._doSize(r),this._doSize(h),this._doSize(l),this._doSize(a)):this._ctx.drawImage(e,this._doSize(r),this._doSize(h),this._doSize(l),this._doSize(a))}createPattern(t,e){return this._ctx.createPattern(t,e)}measureText(t){return this._ctx.measureText(t)}setTextAlign(t){this._ctx.textAlign=t}fillText(t,e,i,s){return void 0!==s?this._ctx.fillText(t,this._doSize(e),this._doSize(i),this._doSize(s)):this._ctx.fillText(t,this._doSize(e),this._doSize(i))}strokeText(t,e,i,s){return void 0!==s?this._ctx.strokeText(t,this._doSize(e),this._doSize(i),this._doSize(s)):this._ctx.strokeText(t,this._doSize(e),this._doSize(i))}setFont(t){const e=[];"bold"===t.fontWeight&&e.push(`${t.fontWeight}`),e.push(`${this._doSize(t.fontSize||12)}px`),e.push(`${t.fontFamily||"sans-serif"}`),this._ctx.font=`${e.join(" ")}`}setTextBaseline(t){this._ctx.textBaseline=t}setGlobalAlpha(t){this._ctx.globalAlpha=t}save(){this._ctx.save()}restore(){this._ctx.restore()}scale(t,e){this._ctx.scale(t,e)}setShadowColor(t){this._ctx.shadowColor=t}setShadowOffsetX(t){this._ctx.shadowOffsetX=this._doSize(t)}setShadowOffsetY(t){this._ctx.shadowOffsetY=this._doSize(t)}setShadowBlur(t){this._ctx.shadowBlur=this._doSize(t)}ellipse(t,e,i,s,n,o,r,h){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(i),this._doSize(s),n,o,r,h)}_doSize(t){return this._opts.devicePixelRatio*t}_doX(t){const{scale:e,scrollX:i}=this._transform,s=(t-i)/e;return this._doSize(s)}_doY(t){const{scale:e,scrollY:i}=this._transform,s=(t-i)/e;return this._doSize(s)}}};class g{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);null==i||i.push(e),this._listeners.set(t,i||[])}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const i=this._listeners.get(t);if(Array.isArray(i))for(let t=0;t<(null==i?void 0:i.length);t++)if(i[t]===e){i.splice(t,1);break}this._listeners.set(t,i||[])}}trigger(t,e){const i=this._listeners.get(t);return!!Array.isArray(i)&&(i.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}}class v{constructor(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}clear(){this._temp={prevClickPoint:null,isHoverCanvas:!1,isDragCanvas:!1,statusMap:{canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}}}}class S{constructor(t,e){this._isMoving=!1,this._temp=new v,this._container=window,this._canvas=t,this._isMoving=!1,this._initEvent(),this._event=new g}setStatusMap(t){this._temp.set("statusMap",t)}on(t,e){this._event.on(t,e)}off(t,e){this._event.off(t,e)}_initEvent(){const t=this._canvas,e=this._container;e.addEventListener("mousemove",this._listenWindowMove.bind(this),!1),e.addEventListener("mouseup",this._listenWindowMoveEnd.bind(this),!1),t.addEventListener("mousemove",this._listenHover.bind(this),!1),t.addEventListener("mousedown",this._listenMoveStart.bind(this),!1),t.addEventListener("mousemove",this._listenMove.bind(this),!1),t.addEventListener("mouseup",this._listenMoveEnd.bind(this),!1),t.addEventListener("click",this._listenCanvasClick.bind(this),!1),t.addEventListener("wheel",this._listenCanvasWheel.bind(this),!1),t.addEventListener("mousedown",this._listenCanvasMoveStart.bind(this),!0),t.addEventListener("mouseup",this._listenCanvasMoveEnd.bind(this),!0),t.addEventListener("mouseover",this._listenCanvasMoveOver.bind(this),!0),t.addEventListener("mouseleave",this._listenCanvasMoveLeave.bind(this),!0),this._initParentEvent()}_initParentEvent(){try{let t=window;const e=t.origin;for(;t.self!==t.top&&(t.self!==t.parent&&t.origin===e&&t.parent.window.addEventListener("mousemove",this._listSameOriginParentWindow.bind(this),!1),t=t.parent,t););}catch(t){console.warn(t)}}_listenHover(t){t.preventDefault();const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.has("hover")&&this._event.trigger("hover",e),this._isMoving=!0}_listenMoveStart(t){t.preventDefault();const e=this._getPosition(t);this._isVaildPoint(e)&&(this._event.has("point")&&this._event.trigger("point",e),this._event.has("moveStart")&&this._event.trigger("moveStart",e)),this._isMoving=!0}_listenMove(t){if(t.preventDefault(),t.stopPropagation(),this._event.has("move")&&!0===this._isMoving){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("move",e)}}_listenMoveEnd(t){if(t.preventDefault(),this._event.has("moveEnd")){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("moveEnd",e)}this._isMoving=!1}_listSameOriginParentWindow(){this._temp.get("isHoverCanvas")&&this._event.has("leave")&&this._event.trigger("leave",void 0),this._temp.get("isDragCanvas")&&this._event.has("moveEnd")&&this._event.trigger("moveEnd",{x:NaN,y:NaN}),this._isMoving=!1,this._temp.set("isDragCanvas",!1),this._temp.set("isHoverCanvas",!1)}_listenCanvasMoveStart(){this._temp.get("isHoverCanvas")&&this._temp.set("isDragCanvas",!0)}_listenCanvasMoveEnd(){this._temp.set("isDragCanvas",!1)}_listenCanvasMoveOver(){this._temp.set("isHoverCanvas",!0)}_listenCanvasMoveLeave(){this._temp.set("isHoverCanvas",!1),this._event.has("leave")&&this._event.trigger("leave",void 0)}_listenWindowMove(t){if(!0===this._temp.get("isDragCanvas")&&(t.preventDefault(),t.stopPropagation(),this._event.has("move")&&!0===this._isMoving)){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("move",e)}}_listenWindowMoveEnd(t){if(!0!=!this._temp.get("isDragCanvas")){if(t.preventDefault(),this._event.has("moveEnd")){const e=this._getPosition(t);this._isVaildPoint(e)&&this._event.trigger("moveEnd",e)}this._temp.set("isDragCanvas",!1),this._isMoving=!1}}_listenCanvasWheel(t){this._event.has("wheelX")&&(t.deltaX>0||t.deltaX<0)&&this._event.trigger("wheelX",t.deltaX),this._event.has("wheelY")&&(t.deltaY>0||t.deltaY<0)&&this._event.trigger("wheelY",t.deltaY);const{canScrollYNext:e,canScrollYPrev:i}=this._temp.get("statusMap");(t.deltaX>0&&t.deltaX<0||t.deltaY>0&&!0===e||t.deltaY<0&&!0===i)&&t.preventDefault()}_listenCanvasClick(t){t.preventDefault();const e=this._getPosition(t),i=Date.now();if(this._isVaildPoint(e)){const t=this._temp.get("prevClickPoint");t&&i-t.t<=500&&Math.abs(t.x-e.x)<=5&&Math.abs(t.y-e.y)<=5?this._event.has("doubleClick")&&this._event.trigger("doubleClick",{x:e.x,y:e.y}):this._temp.set("prevClickPoint",{x:e.x,y:e.y,t:i})}}_getPosition(t){const e=this._canvas;let i=0,s=0;if(t&&t.touches&&t.touches.length>0){const e=t.touches[0];e&&(i=e.clientX,s=e.clientY)}else i=t.clientX,s=t.clientY;return{x:i-e.getBoundingClientRect().left,y:s-e.getBoundingClientRect().top,t:Date.now()}}_isVaildPoint(t){return f(t.x)&&f(t.y)}}function f(t){return t>0||t<0||0===t}const m={lineWidth:12,color:"#a0a0a0"};class p{constructor(t,e){this._displayCtx=t,this._opts=this._getOpts(e)}draw(t){const{width:e,height:i}=this._opts,s=this.calc(t),n=this._displayCtx;s.xSize>0&&(n.globalAlpha=.2,n.fillStyle=s.color,n.fillRect(0,this._doSize(i-s.lineSize),this._doSize(e),this._doSize(s.lineSize)),n.globalAlpha=1,x(n,{x:this._doSize(s.translateX),y:this._doSize(i-s.lineSize),w:this._doSize(s.xSize),h:this._doSize(s.lineSize),r:this._doSize(s.lineSize/2),color:s.color})),s.ySize>0&&(n.globalAlpha=.2,n.fillStyle=s.color,n.fillRect(this._doSize(e-s.lineSize),0,this._doSize(s.lineSize),this._doSize(i)),n.globalAlpha=1,x(n,{x:this._doSize(e-s.lineSize),y:this._doSize(s.translateY),w:this._doSize(s.lineSize),h:this._doSize(s.ySize),r:this._doSize(s.lineSize/2),color:s.color})),n.globalAlpha=1}resetSize(t){this._opts={...this._opts,...t}}isPointAtScrollY(t){const{width:e,height:i,scrollConfig:s}=this._opts,n=this._displayCtx;return n.beginPath(),n.rect(this._doSize(e-s.lineWidth),0,this._doSize(s.lineWidth),this._doSize(i)),n.closePath(),!!n.isPointInPath(this._doSize(t.x),this._doSize(t.y))}isPointAtScrollX(t){const{width:e,height:i,scrollConfig:s}=this._opts,n=this._displayCtx;return n.beginPath(),n.rect(0,this._doSize(i-s.lineWidth),this._doSize(e-s.lineWidth),this._doSize(s.lineWidth)),n.closePath(),!!n.isPointInPath(this._doSize(t.x),this._doSize(t.y))}getLineWidth(){return this._opts.scrollConfig.lineWidth}calc(t){const{width:e,height:i,scrollConfig:s}=this._opts,n=2.5*s.lineWidth,o=s.lineWidth;let r=0,h=0;t.left<=0&&t.right<=0&&(r=Math.max(n,e-(Math.abs(t.left)+Math.abs(t.right))),r>=e&&(r=0)),(t.top<=0||t.bottom<=0)&&(h=Math.max(n,i-(Math.abs(t.top)+Math.abs(t.bottom))),h>=i&&(h=0));let l=0;r>0&&(l=r/2+(e-r)*Math.abs(t.left)/(Math.abs(t.left)+Math.abs(t.right)),l=Math.min(Math.max(0,l-r/2),e-r));let a=0;h>0&&(a=h/2+(i-h)*Math.abs(t.top)/(Math.abs(t.top)+Math.abs(t.bottom)),a=Math.min(Math.max(0,a-h/2),i-h));return{lineSize:o,xSize:r,ySize:h,translateY:a,translateX:l,color:this._opts.scrollConfig.color}}_doSize(t){return t*this._opts.devicePixelRatio}_getOpts(e){const i={scrollConfig:m,...e};return i.scrollConfig||(i.scrollConfig=m),i.scrollConfig.lineWidth>0||(i.scrollConfig.lineWidth=m.lineWidth),i.scrollConfig.lineWidth=Math.max(i.scrollConfig.lineWidth,m.lineWidth),!0!==t(i.scrollConfig.color)&&(i.scrollConfig.color=i.scrollConfig.color),i}}function x(t,e){const{x:i,y:s,w:n,h:o,color:r}=e;let h=e.r;h=Math.min(h,n/2,o/2),(n<2*h||o<2*h)&&(h=0),t.beginPath(),t.moveTo(i+h,s),t.arcTo(i+n,s,i+n,s+o,h),t.arcTo(i+n,s+o,i,s+o,h),t.arcTo(i,s+o,i,s,h),t.arcTo(i,s,i+n,s,h),t.closePath(),t.fillStyle=r,t.fill()}const z=Symbol("_opts"),y=Symbol("_ctx");class b{constructor(t,e){this[z]=e,this[y]=t}resetSize(t){this[z]={...this[z],...t}}calcScreen(){const t=this[y].getTransform().scale,{width:e,height:i,contextWidth:s,contextHeight:n,devicePixelRatio:o}=this[z];let r=!0,h=!0,l=!0,a=!0;s*t<=e&&(this[y].setTransform({scrollX:(e-s*t)/2}),r=!1,h=!1),n*t<=i&&(this[y].setTransform({scrollY:(i-n*t)/2}),l=!1,a=!1),s*t>=e&&this[y].getTransform().scrollX>0&&(this[y].setTransform({scrollX:0}),r=!1),n*t>=i&&this[y].getTransform().scrollY>0&&(this[y].setTransform({scrollY:0}),l=!1);const{scrollX:c,scrollY:d}=this[y].getTransform();c<0&&Math.abs(c)>Math.abs(s*t-e)&&(this[y].setTransform({scrollX:0-Math.abs(s*t-e)}),h=!1),d<0&&Math.abs(d)>Math.abs(n*t-i)&&(this[y].setTransform({scrollY:0-Math.abs(n*t-i)}),a=!1);const{scrollX:_,scrollY:u}=this[y].getTransform();return{size:{x:_*t,y:u*t,w:s*t,h:n*t},position:{top:u,bottom:i-(n*t+u),left:_,right:e-(s*t+_)},deviceSize:{x:_*o,y:u*o,w:s*o*t,h:n*o*t},width:this[z].width,height:this[z].height,devicePixelRatio:this[z].devicePixelRatio,canScrollYPrev:l,canScrollYNext:a,canScrollXPrev:r,canScrollXNext:h}}calcScreenScroll(t,e,i,s,n){let o=t,r=s-i;t<=0&&e<=0&&(r=Math.abs(t)+Math.abs(e));let h=1;return r>0&&(h=r/(s-i)),o=0-h*n,o}}const w=Symbol("_canvas"),P=Symbol("_displayCanvas"),C=Symbol("_helperCanvas"),M=Symbol("_mount"),Y=Symbol("_opts"),T=Symbol("_hasRendered"),X=Symbol("_ctx"),W=Symbol("_helperCtx"),E=Symbol("_watcher"),O=Symbol("_render"),D=Symbol("_parsePrivateOptions"),R=Symbol("_scroller"),A=Symbol("_initEvent"),N=Symbol("_doScrollX"),L=Symbol("_doScrollY"),k=Symbol("_doMoveScroll"),$=Symbol("_resetContext"),H=Symbol("_screen");var j;const{throttle:I,Context:F}=u;class B{constructor(t,e){this[j]=!1,this[M]=t,this[w]=document.createElement("canvas"),this[C]=document.createElement("canvas"),this[P]=document.createElement("canvas"),this[M].appendChild(this[P]),this[Y]=this[D](e);const i=this[w].getContext("2d"),s=this[P].getContext("2d"),n=this[C].getContext("2d");this[X]=new F(i,this[Y]),this[W]=new F(n,this[Y]),this[H]=new b(this[X],this[Y]),this[E]=new S(this[P],this[X]),this[R]=new p(s,{width:e.width,height:e.height,devicePixelRatio:e.devicePixelRatio||1,scrollConfig:e.scrollConfig}),this[O]()}getDisplayContext2D(){return this[P].getContext("2d")}getOriginContext2D(){return this[X].getContext()}getHelperContext2D(){return this[W].getContext()}getContext(){return this[X]}getHelperContext(){return this[W]}scale(t){t>0&&(this[X].setTransform({scale:t}),this[W].setTransform({scale:t}));const{position:e,size:i}=this[H].calcScreen();return{position:e,size:i}}scrollX(t){this[E].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[X].setTransform({scrollX:t}),this[W].setTransform({scrollX:t}));const{position:e,size:i,canScrollXNext:s,canScrollYNext:n,canScrollXPrev:o,canScrollYPrev:r}=this[H].calcScreen();return this[E].setStatusMap({canScrollYPrev:r,canScrollYNext:n,canScrollXPrev:o,canScrollXNext:s}),{position:e,size:i}}scrollY(t){this[E].setStatusMap({canScrollYPrev:!0,canScrollYNext:!0,canScrollXPrev:!0,canScrollXNext:!0}),(t>=0||t<0)&&(this[X].setTransform({scrollY:t}),this[W].setTransform({scrollY:t}));const{position:e,size:i,canScrollXNext:s,canScrollYNext:n,canScrollXPrev:o,canScrollYPrev:r}=this[H].calcScreen();return this[E].setStatusMap({canScrollYPrev:r,canScrollYNext:n,canScrollXPrev:o,canScrollXNext:s}),{position:e,size:i}}getTransform(){return this[X].getTransform()}draw(){this.clear();const{position:t,deviceSize:e,size:i}=this[H].calcScreen(),s=this[P].getContext("2d");return null==s||s.drawImage(this[w],e.x,e.y,e.w,e.h),null==s||s.drawImage(this[C],e.x,e.y,e.w,e.h),!0===this[Y].canScroll&&this[R].draw(t),{position:t,size:i}}clear(){const t=this[P].getContext("2d");null==t||t.clearRect(0,0,this[P].width,this[P].height)}on(t,e){this[E].on(t,e)}off(t,e){this[E].off(t,e)}getScreenInfo(){return this[H].calcScreen()}setCursor(t){this[P].style.cursor=t}resetCursor(){this[P].style.cursor="auto"}resetSize(t){this[Y]={...this[Y],...t},this[$](),this[X].resetSize(t),this[W].resetSize(t),this[H].resetSize(t),this[R].resetSize({width:this[Y].width,height:this[Y].height,devicePixelRatio:this[Y].devicePixelRatio}),this.draw()}getScrollLineWidth(){let t=0;return!0===this[Y].canScroll&&(t=this[R].getLineWidth()),t}pointScreenToContext(t){const{scrollX:e,scrollY:i,scale:s}=this.getTransform();return{x:(t.x-e)/s,y:(t.y-i)/s}}pointContextToScreen(t){const{scrollX:e,scrollY:i,scale:s}=this.getTransform();return{x:t.x*s+e,y:t.y*s+i}}[(j=T,O)](){!0!==this[T]&&(this[$](),this[A](),this[T]=!0)}[$](){const{width:t,height:e,contextWidth:i,contextHeight:s,devicePixelRatio:n}=this[Y];this[w].width=i*n,this[w].height=s*n,this[C].width=i*n,this[C].height=s*n,this[P].width=t*n,this[P].height=e*n,function(t,e){const i={...function(t){const e={};return(t.getAttribute("style")||"").split(";").forEach((t=>{const i=t.split(":");i[0]&&"string"==typeof i[0]&&(e[i[0]]=i[1]||"")})),e}(t),...e},s=Object.keys(i);let n="";s.forEach((t=>{n+=`${t}:${i[t]||""};`})),t.setAttribute("style",n)}(this[P],{width:`${t}px`,height:`${e}px`})}[D](t){return{devicePixelRatio:1,...t}}[A](){if(!0!==this[T]&&!0===this[Y].canScroll){this.on("wheelX",I((t=>{this[N](t)}),16)),this.on("wheelY",I((t=>{this[L](t)}),16));let t=null;this.on("moveStart",I((e=>{this[R].isPointAtScrollX(e)?t="x":this[R].isPointAtScrollY(e)&&(t="y")}),16)),this.on("move",I((e=>{t&&this[k](t,e)}),16)),this.on("moveEnd",I((e=>{t&&this[k](t,e),t=null}),16))}}[N](t,e){const{width:i}=this[Y];let s=e;"number"==typeof s&&(s>0||s<=0)||(s=this[X].getTransform().scrollX);const{position:n}=this[H].calcScreen(),{xSize:o}=this[R].calc(n),r=this[H].calcScreenScroll(n.left,n.right,o,i,t);this.scrollX(s+r),this.draw()}[L](t,e){const{height:i}=this[Y];let s=e;"number"==typeof s&&(s>0||s<=0)||(s=this[X].getTransform().scrollY);const{position:n}=this[H].calcScreen(),{ySize:o}=this[R].calc(n),r=this[H].calcScreenScroll(n.top,n.bottom,o,i,t);this.scrollY(s+r),this.draw()}[k](t,e){if(!t)return;const{position:i}=this[H].calcScreen(),{xSize:s,ySize:n}=this[R].calc(i);"x"===t?this[N](e.x-s/2,0):"y"===t&&this[L](e.y-n/2,0)}}return B}();

package.json

 {
   "name": "@idraw/board",
-  "version": "0.3.0-alpha.6",
+  "version": "0.3.0-alpha.7",
   "description": "",
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.esm.js",
+  "main": "dist/esm/index.js",
+  "module": "dist/esm/index.js",
   "unpkg": "dist/index.global.js",
-  "types": "dist/index.d.ts",
-  "scripts": {
-    "dev": "vite dev"
-  },
+  "types": "dist/esm/index.d.ts",
   "files": [
-    "dist/*.ts",
-    "dist/*.js",
-    "esm/*.ts",
-    "esm/*.js"
+    "dist/**/*.ts",
+    "dist/**/*.js"
   ],
@@ -29,6 +24,6 @@ "repository": {
   "devDependencies": {
-    "@idraw/types": "^0.3.0-alpha.6"
+    "@idraw/types": "^0.3.0-alpha.7"
   },
   "dependencies": {
-    "@idraw/util": "^0.3.0-alpha.6"
+    "@idraw/util": "^0.3.0-alpha.7"
   },
@@ -38,3 +33,3 @@ "publishConfig": {
   },
-  "gitHead": "222e6dc1a651ab1297bf98031cee90dce5f99ec5"
+  "gitHead": "49aec2789cf645101e6d1c7f3528e2fcf99c4bfd"
 }

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of package files

27

increased by80%

Worsened metrics

Total package byte prevSize

122354

decreased by-46.3%

Lines of code

2969

decreased by-41.39%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• Updated@idraw/util@^0.3.0-alpha.7