UNPKG

pikaso

Version:

Seamless, Fully-typed and Fully-tested HTML5 Canvas Library

pikasojs/pikaso

1 lines • 265 kB

JavaScript

"use strict";function t(t){var e=Object.create(null);return t&&Object.keys(t).forEach(function(i){if("default"!==i){var n=Object.getOwnPropertyDescriptor(t,i);Object.defineProperty(e,i,n.get?n:{enumerable:!0,get:function(){return t[i]}})}}),e.default=t,Object.freeze(e)}var e=t(require("canvas"));const i=Math.PI/180;const n="undefined"!=typeof global?global:"undefined"!=typeof window?window:"undefined"!=typeof WorkerGlobalScope?self:{},r={_global:n,version:"10.2.0",isBrowser:"undefined"!=typeof window&&("[object Window]"==={}.toString.call(window)||"[object global]"==={}.toString.call(window)),isUnminified:/param/.test(function(t){}.toString()),dblClickWindow:400,getAngle:t=>r.angleDeg?t*i:t,enableTrace:!1,pointerEventsEnabled:!0,autoDrawEnabled:!0,hitOnDragEnabled:!1,capturePointerEventsEnabled:!1,_mouseListenClick:!1,_touchListenClick:!1,_pointerListenClick:!1,_mouseInDblClickWindow:!1,_touchInDblClickWindow:!1,_pointerInDblClickWindow:!1,_mouseDblClickPointerId:null,_touchDblClickPointerId:null,_pointerDblClickPointerId:null,_renderBackend:"web",legacyTextRendering:!1,pixelRatio:"undefined"!=typeof window&&window.devicePixelRatio||1,dragDistance:3,angleDeg:!0,showWarnings:!0,dragButtons:[0,1],isDragging:()=>r.DD.isDragging,isTransforming(){var t,e;return null!==(e=null===(t=r.Transformer)||void 0===t?void 0:t.isTransforming())&&void 0!==e&&e},isDragReady:()=>!!r.DD.node,releaseCanvasOnDestroy:!0,document:n.document,_injectGlobal(t){void 0!==n.Konva&&console.error("Several Konva instances detected. It is not recommended to use multiple Konva instances in the same environment."),n.Konva=t}},s=t=>{r[t.prototype.getClassName()]=t};r._injectGlobal(r);const o=()=>{if("undefined"==typeof document)throw new Error('Konva.js unsupported environment.\n\nLooks like you are trying to use Konva.js in Node.js environment. because "document" object is undefined.\n\nTo use Konva.js in Node.js environment, you need to use the "canvas-backend" or "skia-backend" module.\n\nbash: npm install canvas\njs: import "konva/canvas-backend";\n\nor\n\nbash: npm install skia-canvas\njs: import "konva/skia-backend";\n')};class a{constructor(t=[1,0,0,1,0,0]){this.dirty=!1,this.m=t&&t.slice()||[1,0,0,1,0,0]}reset(){this.m[0]=1,this.m[1]=0,this.m[2]=0,this.m[3]=1,this.m[4]=0,this.m[5]=0}copy(){return new a(this.m)}copyInto(t){t.m[0]=this.m[0],t.m[1]=this.m[1],t.m[2]=this.m[2],t.m[3]=this.m[3],t.m[4]=this.m[4],t.m[5]=this.m[5]}point(t){const e=this.m;return{x:e[0]*t.x+e[2]*t.y+e[4],y:e[1]*t.x+e[3]*t.y+e[5]}}translate(t,e){return this.m[4]+=this.m[0]*t+this.m[2]*e,this.m[5]+=this.m[1]*t+this.m[3]*e,this}scale(t,e){return this.m[0]*=t,this.m[1]*=t,this.m[2]*=e,this.m[3]*=e,this}rotate(t){const e=Math.cos(t),i=Math.sin(t),n=this.m[0]*e+this.m[2]*i,r=this.m[1]*e+this.m[3]*i,s=this.m[0]*-i+this.m[2]*e,o=this.m[1]*-i+this.m[3]*e;return this.m[0]=n,this.m[1]=r,this.m[2]=s,this.m[3]=o,this}getTranslation(){return{x:this.m[4],y:this.m[5]}}skew(t,e){const i=this.m[0]+this.m[2]*e,n=this.m[1]+this.m[3]*e,r=this.m[2]+this.m[0]*t,s=this.m[3]+this.m[1]*t;return this.m[0]=i,this.m[1]=n,this.m[2]=r,this.m[3]=s,this}multiply(t){const e=this.m[0]*t.m[0]+this.m[2]*t.m[1],i=this.m[1]*t.m[0]+this.m[3]*t.m[1],n=this.m[0]*t.m[2]+this.m[2]*t.m[3],r=this.m[1]*t.m[2]+this.m[3]*t.m[3],s=this.m[0]*t.m[4]+this.m[2]*t.m[5]+this.m[4],o=this.m[1]*t.m[4]+this.m[3]*t.m[5]+this.m[5];return this.m[0]=e,this.m[1]=i,this.m[2]=n,this.m[3]=r,this.m[4]=s,this.m[5]=o,this}invert(){const t=1/(this.m[0]*this.m[3]-this.m[1]*this.m[2]),e=this.m[3]*t,i=-this.m[1]*t,n=-this.m[2]*t,r=this.m[0]*t,s=t*(this.m[2]*this.m[5]-this.m[3]*this.m[4]),o=t*(this.m[1]*this.m[4]-this.m[0]*this.m[5]);return this.m[0]=e,this.m[1]=i,this.m[2]=n,this.m[3]=r,this.m[4]=s,this.m[5]=o,this}getMatrix(){return this.m}decompose(){const t=this.m[0],e=this.m[1],i=this.m[2],n=this.m[3],r=t*n-e*i,s={x:this.m[4],y:this.m[5],rotation:0,scaleX:0,scaleY:0,skewX:0,skewY:0};if(0!=t||0!=e){const o=Math.sqrt(t*t+e*e);s.rotation=e>0?Math.acos(t/o):-Math.acos(t/o),s.scaleX=o,s.scaleY=r/o,s.skewX=(t*i+e*n)/r,s.skewY=0}else if(0!=i||0!=n){const o=Math.sqrt(i*i+n*n);s.rotation=Math.PI/2-(n>0?Math.acos(-i/o):-Math.acos(i/o)),s.scaleX=r/o,s.scaleY=o,s.skewX=0,s.skewY=(t*i+e*n)/r}return s.rotation=m._getRotation(s.rotation),s}}const h=Math.PI/180,l=180/Math.PI,d="#",c="Konva error: ",u={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,132,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,255,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,203],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[119,128,144],slategrey:[119,128,144],snow:[255,255,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],transparent:[255,255,255,0],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,5]},g=/rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/;let p=[],f=null;const y="undefined"!=typeof requestAnimationFrame&&requestAnimationFrame||function(t){setTimeout(t,16)},m={_isElement:t=>!(!t||1!=t.nodeType),_isFunction:t=>!!(t&&t.constructor&&t.call&&t.apply),_isPlainObject:t=>!!t&&t.constructor===Object,_isArray:t=>"[object Array]"===Object.prototype.toString.call(t),_isNumber:t=>"[object Number]"===Object.prototype.toString.call(t)&&!isNaN(t)&&isFinite(t),_isString:t=>"[object String]"===Object.prototype.toString.call(t),_isBoolean:t=>"[object Boolean]"===Object.prototype.toString.call(t),isObject:t=>t instanceof Object,isValidSelector(t){if("string"!=typeof t)return!1;const e=t[0];return"#"===e||"."===e||e===e.toUpperCase()},_sign:t=>0===t||t>0?1:-1,requestAnimFrame(t){p.push(t),1===p.length&&y(function(){const t=p;p=[],t.forEach(function(t){t()})})},createCanvasElement(){o();const t=document.createElement("canvas");try{t.style=t.style||{}}catch(t){}return t},createImageElement:()=>(o(),document.createElement("img")),_isInDocument(t){for(;t=t.parentNode;)if(t==document)return!0;return!1},_urlToImage(t,e){const i=m.createImageElement();i.onload=function(){e(i)},i.src=t},_rgbToHex:(t,e,i)=>((1<<24)+(t<<16)+(e<<8)+i).toString(16).slice(1),_hexToRgb(t){t=t.replace(d,"");const e=parseInt(t,16);return{r:e>>16&255,g:e>>8&255,b:255&e}},getRandomColor(){let t=(16777215*Math.random()|0).toString(16);for(;t.length<6;)t="0"+t;return d+t},isCanvasFarblingActive(){if(null!==f)return f;if("undefined"==typeof document)return f=!1,!1;const t=this.createCanvasElement();t.width=10,t.height=10;const e=t.getContext("2d",{willReadFrequently:!0});e.clearRect(0,0,10,10),e.fillStyle="#282828",e.fillRect(0,0,10,10);const i=e.getImageData(0,0,10,10).data;let n=!1;for(let t=0;t<100;t++)if(40!==i[4*t]||40!==i[4*t+1]||40!==i[4*t+2]||255!==i[4*t+3]){n=!0;break}return f=n,this.releaseCanvas(t),f},getHitColor(){const t=this.getRandomColor();return this.isCanvasFarblingActive()?this.getSnappedHexColor(t):t},getHitColorKey(t,e,i){return this.isCanvasFarblingActive()&&(t=5*Math.round(t/5),e=5*Math.round(e/5),i=5*Math.round(i/5)),d+this._rgbToHex(t,e,i)},getSnappedHexColor(t){const e=this._hexToRgb(t);return d+this._rgbToHex(5*Math.round(e.r/5),5*Math.round(e.g/5),5*Math.round(e.b/5))},getRGB(t){let e;return t in u?(e=u[t],{r:e[0],g:e[1],b:e[2]}):t[0]===d?this._hexToRgb(t.substring(1)):"rgb("===t.substr(0,4)?(e=g.exec(t.replace(/ /g,"")),{r:parseInt(e[1],10),g:parseInt(e[2],10),b:parseInt(e[3],10)}):{r:0,g:0,b:0}},colorToRGBA:t=>(t=t||"black",m._namedColorToRBA(t)||m._hex3ColorToRGBA(t)||m._hex4ColorToRGBA(t)||m._hex6ColorToRGBA(t)||m._hex8ColorToRGBA(t)||m._rgbColorToRGBA(t)||m._rgbaColorToRGBA(t)||m._hslColorToRGBA(t)),_namedColorToRBA(t){const e=u[t.toLowerCase()];return e?{r:e[0],g:e[1],b:e[2],a:1}:null},_rgbColorToRGBA(t){if(0===t.indexOf("rgb(")){const e=(t=t.match(/rgb\(([^)]+)\)/)[1]).split(/ *, */).map(Number);return{r:e[0],g:e[1],b:e[2],a:1}}},_rgbaColorToRGBA(t){if(0===t.indexOf("rgba(")){const e=(t=t.match(/rgba\(([^)]+)\)/)[1]).split(/ *, */).map((t,e)=>"%"===t.slice(-1)?3===e?parseInt(t)/100:parseInt(t)/100*255:Number(t));return{r:e[0],g:e[1],b:e[2],a:e[3]}}},_hex8ColorToRGBA(t){if("#"===t[0]&&9===t.length)return{r:parseInt(t.slice(1,3),16),g:parseInt(t.slice(3,5),16),b:parseInt(t.slice(5,7),16),a:parseInt(t.slice(7,9),16)/255}},_hex6ColorToRGBA(t){if("#"===t[0]&&7===t.length)return{r:parseInt(t.slice(1,3),16),g:parseInt(t.slice(3,5),16),b:parseInt(t.slice(5,7),16),a:1}},_hex4ColorToRGBA(t){if("#"===t[0]&&5===t.length)return{r:parseInt(t[1]+t[1],16),g:parseInt(t[2]+t[2],16),b:parseInt(t[3]+t[3],16),a:parseInt(t[4]+t[4],16)/255}},_hex3ColorToRGBA(t){if("#"===t[0]&&4===t.length)return{r:parseInt(t[1]+t[1],16),g:parseInt(t[2]+t[2],16),b:parseInt(t[3]+t[3],16),a:1}},_hslColorToRGBA(t){if(/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.test(t)){const[e,...i]=/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(t),n=Number(i[0])/360,r=Number(i[1])/100,s=Number(i[2])/100;let o,a,h;if(0===r)return h=255*s,{r:Math.round(h),g:Math.round(h),b:Math.round(h),a:1};o=s<.5?s*(1+r):s+r-s*r;const l=2*s-o,d=[0,0,0];for(let t=0;t<3;t++)a=n+1/3*-(t-1),a<0&&a++,a>1&&a--,h=6*a<1?l+6*(o-l)*a:2*a<1?o:3*a<2?l+(o-l)*(2/3-a)*6:l,d[t]=255*h;return{r:Math.round(d[0]),g:Math.round(d[1]),b:Math.round(d[2]),a:1}}},haveIntersection:(t,e)=>!(e.x>t.x+t.width||e.x+e.width<t.x||e.y>t.y+t.height||e.y+e.height<t.y),cloneObject(t){const e={};for(const i in t)this._isPlainObject(t[i])?e[i]=this.cloneObject(t[i]):this._isArray(t[i])?e[i]=this.cloneArray(t[i]):e[i]=t[i];return e},cloneArray:t=>t.slice(0),degToRad:t=>t*h,radToDeg:t=>t*l,_degToRad:t=>(m.warn("Util._degToRad is removed. Please use public Util.degToRad instead."),m.degToRad(t)),_radToDeg:t=>(m.warn("Util._radToDeg is removed. Please use public Util.radToDeg instead."),m.radToDeg(t)),_getRotation:t=>r.angleDeg?m.radToDeg(t):t,_capitalize:t=>t.charAt(0).toUpperCase()+t.slice(1),throw(t){throw new Error(c+t)},error(t){console.error(c+t)},warn(t){r.showWarnings&&console.warn("Konva warning: "+t)},each(t,e){for(const i in t)e(i,t[i])},_inRange:(t,e,i)=>e<=t&&t<i,_getProjectionToSegment(t,e,i,n,r,s){let o,a,h;const l=(t-i)*(t-i)+(e-n)*(e-n);if(0==l)o=t,a=e,h=(r-i)*(r-i)+(s-n)*(s-n);else{const d=((r-t)*(i-t)+(s-e)*(n-e))/l;d<0?(o=t,a=e,h=(t-r)*(t-r)+(e-s)*(e-s)):d>1?(o=i,a=n,h=(i-r)*(i-r)+(n-s)*(n-s)):(o=t+d*(i-t),a=e+d*(n-e),h=(o-r)*(o-r)+(a-s)*(a-s))}return[o,a,h]},_getProjectionToLine(t,e,i){const n=m.cloneObject(t);let r=Number.MAX_VALUE;return e.forEach(function(s,o){if(!i&&o===e.length-1)return;const a=e[(o+1)%e.length],h=m._getProjectionToSegment(s.x,s.y,a.x,a.y,t.x,t.y),l=h[0],d=h[1],c=h[2];c<r&&(n.x=l,n.y=d,r=c)}),n},_prepareArrayForTween(t,e,i){const n=[],r=[];if(t.length>e.length){const i=e;e=t,t=i}for(let e=0;e<t.length;e+=2)n.push({x:t[e],y:t[e+1]});for(let t=0;t<e.length;t+=2)r.push({x:e[t],y:e[t+1]});const s=[];return r.forEach(function(t){const e=m._getProjectionToLine(t,n,i);s.push(e.x),s.push(e.y)}),s},_prepareToStringify(t){let e;t.visitedByCircularReferenceRemoval=!0;for(const i in t)if(t.hasOwnProperty(i)&&t[i]&&"object"==typeof t[i])if(e=Object.getOwnPropertyDescriptor(t,i),t[i].visitedByCircularReferenceRemoval||m._isElement(t[i])){if(!e.configurable)return null;delete t[i]}else if(null===m._prepareToStringify(t[i])){if(!e.configurable)return null;delete t[i]}return delete t.visitedByCircularReferenceRemoval,t},_assign(t,e){for(const i in e)t[i]=e[i];return t},_getFirstPointerId:t=>t.touches?t.changedTouches[0].identifier:t.pointerId||999,releaseCanvas(...t){r.releaseCanvasOnDestroy&&t.forEach(t=>{t.width=0,t.height=0})},drawRoundedRectPath(t,e,i,n){let r=e<0?e:0,s=i<0?i:0;e=Math.abs(e),i=Math.abs(i);let o=0,a=0,h=0,l=0;"number"==typeof n?o=a=h=l=Math.min(n,e/2,i/2):(o=Math.min(n[0]||0,e/2,i/2),a=Math.min(n[1]||0,e/2,i/2),l=Math.min(n[2]||0,e/2,i/2),h=Math.min(n[3]||0,e/2,i/2)),t.moveTo(r+o,s),t.lineTo(r+e-a,s),t.arc(r+e-a,s+a,a,3*Math.PI/2,0,!1),t.lineTo(r+e,s+i-l),t.arc(r+e-l,s+i-l,l,0,Math.PI/2,!1),t.lineTo(r+h,s+i),t.arc(r+h,s+i-h,h,Math.PI/2,Math.PI,!1),t.lineTo(r,s+o),t.arc(r+o,s+o,o,Math.PI,3*Math.PI/2,!1)},drawRoundedPolygonPath(t,e,i,n,r){n=Math.abs(n);for(let s=0;s<i;s++){const o=e[(s-1+i)%i],a=e[s],h=e[(s+1)%i],l={x:a.x-o.x,y:a.y-o.y},d={x:h.x-a.x,y:h.y-a.y},c=Math.hypot(l.x,l.y),u=Math.hypot(d.x,d.y);let g;g="number"==typeof r?r:s<r.length?r[s]:0;g=n*Math.cos(Math.PI/i)*Math.min(1,g/n*2);const p={x:l.x/c,y:l.y/c},f={x:d.x/u,y:d.y/u},y={x:a.x-p.x*g,y:a.y-p.y*g},m={x:a.x+f.x*g,y:a.y+f.y*g};0===s?t.moveTo(y.x,y.y):t.lineTo(y.x,y.y),t.arcTo(a.x,a.y,m.x,m.y,g)}}};const v=["arc","arcTo","beginPath","bezierCurveTo","clearRect","clip","closePath","createLinearGradient","createPattern","createRadialGradient","drawImage","ellipse","fill","fillText","getImageData","createImageData","lineTo","moveTo","putImageData","quadraticCurveTo","rect","roundRect","restore","rotate","save","scale","setLineDash","setTransform","stroke","strokeText","transform","translate"];let b,x=null;function w(){if(null!==x)return x;try{const t=m.createCanvasElement().getContext("2d");return t?!!t&&"filter"in t:(x=!1,!1)}catch(t){return x=!1,!1}}class _{constructor(t){this.canvas=t,r.enableTrace&&(this.traceArr=[],this._enableTrace())}fillShape(t){t.fillEnabled()&&this._fill(t)}_fill(t){}strokeShape(t){t.hasStroke()&&this._stroke(t)}_stroke(t){}fillStrokeShape(t){t.attrs.fillAfterStrokeEnabled?(this.strokeShape(t),this.fillShape(t)):(this.fillShape(t),this.strokeShape(t))}getTrace(t,e){let i,n,r,s,o=this.traceArr,a=o.length,h="";for(i=0;i<a;i++)n=o[i],r=n.method,r?(s=n.args,h+=r,t?h+="()":m._isArray(s[0])?h+="(["+s.join(",")+"])":(e&&(s=s.map(t=>"number"==typeof t?Math.floor(t):t)),h+="("+s.join(",")+")")):(h+=n.property,t||(h+="="+n.val)),h+=";";return h}clearTrace(){this.traceArr=[]}_trace(t){let e,i=this.traceArr;i.push(t),e=i.length,e>=100&&i.shift()}reset(){const t=this.getCanvas().getPixelRatio();this.setTransform(1*t,0,0,1*t,0,0)}getCanvas(){return this.canvas}clear(t){const e=this.getCanvas();t?this.clearRect(t.x||0,t.y||0,t.width||0,t.height||0):this.clearRect(0,0,e.getWidth()/e.pixelRatio,e.getHeight()/e.pixelRatio)}_applyLineCap(t){const e=t.attrs.lineCap;e&&this.setAttr("lineCap",e)}_applyOpacity(t){const e=t.getAbsoluteOpacity();1!==e&&this.setAttr("globalAlpha",e)}_applyLineJoin(t){const e=t.attrs.lineJoin;e&&this.setAttr("lineJoin",e)}_applyMiterLimit(t){const e=t.attrs.miterLimit;null!=e&&this.setAttr("miterLimit",e)}setAttr(t,e){this._context[t]=e}arc(t,e,i,n,r,s){this._context.arc(t,e,i,n,r,s)}arcTo(t,e,i,n,r){this._context.arcTo(t,e,i,n,r)}beginPath(){this._context.beginPath()}bezierCurveTo(t,e,i,n,r,s){this._context.bezierCurveTo(t,e,i,n,r,s)}clearRect(t,e,i,n){this._context.clearRect(t,e,i,n)}clip(...t){this._context.clip.apply(this._context,t)}closePath(){this._context.closePath()}createImageData(t,e){const i=arguments;return 2===i.length?this._context.createImageData(t,e):1===i.length?this._context.createImageData(t):void 0}createLinearGradient(t,e,i,n){return this._context.createLinearGradient(t,e,i,n)}createPattern(t,e){return this._context.createPattern(t,e)}createRadialGradient(t,e,i,n,r,s){return this._context.createRadialGradient(t,e,i,n,r,s)}drawImage(t,e,i,n,r,s,o,a,h){const l=arguments,d=this._context;3===l.length?d.drawImage(t,e,i):5===l.length?d.drawImage(t,e,i,n,r):9===l.length&&d.drawImage(t,e,i,n,r,s,o,a,h)}ellipse(t,e,i,n,r,s,o,a){this._context.ellipse(t,e,i,n,r,s,o,a)}isPointInPath(t,e,i,n){return i?this._context.isPointInPath(i,t,e,n):this._context.isPointInPath(t,e,n)}fill(...t){this._context.fill.apply(this._context,t)}fillRect(t,e,i,n){this._context.fillRect(t,e,i,n)}strokeRect(t,e,i,n){this._context.strokeRect(t,e,i,n)}fillText(t,e,i,n){n?this._context.fillText(t,e,i,n):this._context.fillText(t,e,i)}measureText(t){return this._context.measureText(t)}getImageData(t,e,i,n){return this._context.getImageData(t,e,i,n)}lineTo(t,e){this._context.lineTo(t,e)}moveTo(t,e){this._context.moveTo(t,e)}rect(t,e,i,n){this._context.rect(t,e,i,n)}roundRect(t,e,i,n,r){this._context.roundRect(t,e,i,n,r)}putImageData(t,e,i){this._context.putImageData(t,e,i)}quadraticCurveTo(t,e,i,n){this._context.quadraticCurveTo(t,e,i,n)}restore(){this._context.restore()}rotate(t){this._context.rotate(t)}save(){this._context.save()}scale(t,e){this._context.scale(t,e)}setLineDash(t){this._context.setLineDash?this._context.setLineDash(t):"mozDash"in this._context?this._context.mozDash=t:"webkitLineDash"in this._context&&(this._context.webkitLineDash=t)}getLineDash(){return this._context.getLineDash()}setTransform(t,e,i,n,r,s){this._context.setTransform(t,e,i,n,r,s)}stroke(t){t?this._context.stroke(t):this._context.stroke()}strokeText(t,e,i,n){this._context.strokeText(t,e,i,n)}transform(t,e,i,n,r,s){this._context.transform(t,e,i,n,r,s)}translate(t,e){this._context.translate(t,e)}_enableTrace(){let t,e,i=this,n=v.length,r=this.setAttr;const s=function(t){let n,r=i[t];i[t]=function(){return e=function(t){const e=[],i=t.length,n=m;for(let r=0;r<i;r++){let i=t[r];n._isNumber(i)?i=Math.round(1e3*i)/1e3:n._isString(i)||(i+=""),e.push(i)}return e}(Array.prototype.slice.call(arguments,0)),n=r.apply(i,arguments),i._trace({method:t,args:e}),n}};for(t=0;t<n;t++)s(v[t]);i.setAttr=function(){r.apply(i,arguments);const t=arguments[0];let e=arguments[1];"shadowOffsetX"!==t&&"shadowOffsetY"!==t&&"shadowBlur"!==t||(e/=this.canvas.getPixelRatio()),i._trace({property:t,val:e})}}_applyGlobalCompositeOperation(t){const e=t.attrs.globalCompositeOperation;!e||"source-over"===e||this.setAttr("globalCompositeOperation",e)}}["fillStyle","strokeStyle","shadowColor","shadowBlur","shadowOffsetX","shadowOffsetY","letterSpacing","lineCap","lineDashOffset","lineJoin","lineWidth","miterLimit","direction","font","textAlign","textBaseline","globalAlpha","globalCompositeOperation","imageSmoothingEnabled","filter"].forEach(function(t){Object.defineProperty(_.prototype,t,{get(){return this._context[t]},set(e){this._context[t]=e}})});class S extends _{constructor(t,{willReadFrequently:e=!1}={}){super(t),this._context=t._canvas.getContext("2d",{willReadFrequently:e})}_fillColor(t){const e=t.fill();this.setAttr("fillStyle",e),t._fillFunc(this)}_fillPattern(t){this.setAttr("fillStyle",t._getFillPattern()),t._fillFunc(this)}_fillLinearGradient(t){const e=t._getLinearGradient();e&&(this.setAttr("fillStyle",e),t._fillFunc(this))}_fillRadialGradient(t){const e=t._getRadialGradient();e&&(this.setAttr("fillStyle",e),t._fillFunc(this))}_fill(t){const e=t.fill(),i=t.getFillPriority();if(e&&"color"===i)return void this._fillColor(t);const n=t.getFillPatternImage();if(n&&"pattern"===i)return void this._fillPattern(t);const r=t.getFillLinearGradientColorStops();if(r&&"linear-gradient"===i)return void this._fillLinearGradient(t);const s=t.getFillRadialGradientColorStops();s&&"radial-gradient"===i?this._fillRadialGradient(t):e?this._fillColor(t):n?this._fillPattern(t):r?this._fillLinearGradient(t):s&&this._fillRadialGradient(t)}_strokeLinearGradient(t){const e=t.getStrokeLinearGradientStartPoint(),i=t.getStrokeLinearGradientEndPoint(),n=t.getStrokeLinearGradientColorStops(),r=this.createLinearGradient(e.x,e.y,i.x,i.y);if(n){for(let t=0;t<n.length;t+=2)r.addColorStop(n[t],n[t+1]);this.setAttr("strokeStyle",r)}}_stroke(t){const e=t.dash(),i=t.getStrokeScaleEnabled();if(t.hasStroke()){if(!i){this.save();const t=this.getCanvas().getPixelRatio();this.setTransform(t,0,0,t,0,0)}this._applyLineCap(t),e&&t.dashEnabled()&&(this.setLineDash(e),this.setAttr("lineDashOffset",t.dashOffset())),this.setAttr("lineWidth",t.strokeWidth()),t.getShadowForStrokeEnabled()||this.setAttr("shadowColor","rgba(0,0,0,0)");t.getStrokeLinearGradientColorStops()?this._strokeLinearGradient(t):this.setAttr("strokeStyle",t.stroke()),t._strokeFunc(this),i||this.restore()}}_applyShadow(t){var e,i,n;const r=null!==(e=t.getShadowRGBA())&&void 0!==e?e:"black",s=null!==(i=t.getShadowBlur())&&void 0!==i?i:5,o=null!==(n=t.getShadowOffset())&&void 0!==n?n:{x:0,y:0},a=t.getAbsoluteScale(),h=this.canvas.getPixelRatio(),l=a.x*h,d=a.y*h;this.setAttr("shadowColor",r),this.setAttr("shadowBlur",s*Math.min(Math.abs(l),Math.abs(d))),this.setAttr("shadowOffsetX",o.x*l),this.setAttr("shadowOffsetY",o.y*d)}}class C extends _{constructor(t){super(t),this._context=t._canvas.getContext("2d",{willReadFrequently:!0})}_fill(t){this.save(),this.setAttr("fillStyle",t.colorKey),t._fillFuncHit(this),this.restore()}strokeShape(t){t.hasHitStroke()&&this._stroke(t)}_stroke(t){if(t.hasHitStroke()){const e=t.getStrokeScaleEnabled();if(!e){this.save();const t=this.getCanvas().getPixelRatio();this.setTransform(t,0,0,t,0,0)}this._applyLineCap(t);const i=t.hitStrokeWidth(),n="auto"===i?t.strokeWidth():i;this.setAttr("lineWidth",n),this.setAttr("strokeStyle",t.colorKey),t._strokeFuncHit(this),e||this.restore()}}}class P{constructor(t){this.pixelRatio=1,this.width=0,this.height=0,this.isCache=!1;const e=(t||{}).pixelRatio||r.pixelRatio||function(){if(b)return b;const t=m.createCanvasElement(),e=t.getContext("2d");return b=(r._global.devicePixelRatio||1)/(e.webkitBackingStorePixelRatio||e.mozBackingStorePixelRatio||e.msBackingStorePixelRatio||e.oBackingStorePixelRatio||e.backingStorePixelRatio||1),m.releaseCanvas(t),b}();this.pixelRatio=e,this._canvas=m.createCanvasElement(),this._canvas.style.padding="0",this._canvas.style.margin="0",this._canvas.style.border="0",this._canvas.style.background="transparent",this._canvas.style.position="absolute",this._canvas.style.top="0",this._canvas.style.left="0"}getContext(){return this.context}getPixelRatio(){return this.pixelRatio}setPixelRatio(t){const e=this.pixelRatio;this.pixelRatio=t,this.setSize(this.getWidth()/e,this.getHeight()/e)}setWidth(t){this.width=this._canvas.width=t*this.pixelRatio,this._canvas.style.width=t+"px";const e=this.pixelRatio;this.getContext()._context.scale(e,e)}setHeight(t){this.height=this._canvas.height=t*this.pixelRatio,this._canvas.style.height=t+"px";const e=this.pixelRatio;this.getContext()._context.scale(e,e)}getWidth(){return this.width}getHeight(){return this.height}setSize(t,e){this.setWidth(t||0),this.setHeight(e||0)}toDataURL(t,e){try{return this._canvas.toDataURL(t,e)}catch(t){try{return this._canvas.toDataURL()}catch(t){return m.error("Unable to get data URL. "+t.message+" For more info read https://konvajs.org/docs/posts/Tainted_Canvas.html."),""}}}}class k extends P{constructor(t={width:0,height:0,willReadFrequently:!1}){super(t),this.context=new S(this,{willReadFrequently:t.willReadFrequently}),this.setSize(t.width,t.height)}}class A extends P{constructor(t={width:0,height:0}){super(t),this.hitCanvas=!0,this.context=new C(this),this.setSize(t.width,t.height)}}const T={get isDragging(){let t=!1;return T._dragElements.forEach(e=>{"dragging"===e.dragStatus&&(t=!0)}),t},justDragged:!1,get node(){let t;return T._dragElements.forEach(e=>{t=e.node}),t},_dragElements:new Map,_drag(t){const e=[];T._dragElements.forEach((i,n)=>{const{node:r}=i,s=r.getStage();s.setPointersPositions(t),void 0===i.pointerId&&(i.pointerId=m._getFirstPointerId(t));const o=s._changedPointerPositions.find(t=>t.id===i.pointerId);if(o){if("dragging"!==i.dragStatus){const e=r.dragDistance();if(Math.max(Math.abs(o.x-i.startPointerPos.x),Math.abs(o.y-i.startPointerPos.y))<e)return;if(r.startDrag({evt:t}),!r.isDragging())return}r._setDragPosition(t,i),e.push(r)}}),e.forEach(e=>{e.fire("dragmove",{type:"dragmove",target:e,evt:t},!0)})},_endDragBefore(t){const e=[];T._dragElements.forEach(i=>{const{node:n}=i,s=n.getStage();t&&s.setPointersPositions(t);if(!s._changedPointerPositions.find(t=>t.id===i.pointerId))return;"dragging"!==i.dragStatus&&"stopped"!==i.dragStatus||(T.justDragged=!0,r._mouseListenClick=!1,r._touchListenClick=!1,r._pointerListenClick=!1,i.dragStatus="stopped");const o=i.node.getLayer()||i.node instanceof r.Stage&&i.node;o&&-1===e.indexOf(o)&&e.push(o)}),e.forEach(t=>{t.draw()})},_endDragAfter(t){T._dragElements.forEach((e,i)=>{"stopped"===e.dragStatus&&e.node.fire("dragend",{type:"dragend",target:e.node,evt:t},!0),"dragging"!==e.dragStatus&&T._dragElements.delete(i)})}};function M(t){return m._isString(t)?'"'+t+'"':"[object Number]"===Object.prototype.toString.call(t)||m._isBoolean(t)?t:Object.prototype.toString.call(t)}function D(t){return t>255?255:t<0?0:Math.round(t)}function E(){if(r.isUnminified)return function(t,e){return m._isNumber(t)||m.warn(M(t)+' is a not valid value for "'+e+'" attribute. The value should be a number.'),t}}function R(t){if(r.isUnminified)return function(e,i){let n=m._isNumber(e),r=m._isArray(e)&&e.length==t;return n||r||m.warn(M(e)+' is a not valid value for "'+i+'" attribute. The value should be a number or Array<number>('+t+")"),e}}function G(){if(r.isUnminified)return function(t,e){return m._isNumber(t)||"auto"===t||m.warn(M(t)+' is a not valid value for "'+e+'" attribute. The value should be a number or "auto".'),t}}function O(){if(r.isUnminified)return function(t,e){return m._isString(t)||m.warn(M(t)+' is a not valid value for "'+e+'" attribute. The value should be a string.'),t}}function L(){if(r.isUnminified)return function(t,e){const i=m._isString(t),n="[object CanvasGradient]"===Object.prototype.toString.call(t)||t&&t.addColorStop;return i||n||m.warn(M(t)+' is a not valid value for "'+e+'" attribute. The value should be a string or a native gradient.'),t}}function I(){if(r.isUnminified)return function(t,e){return!0===t||!1===t||m.warn(M(t)+' is a not valid value for "'+e+'" attribute. The value should be a boolean.'),t}}r.isBrowser&&(window.addEventListener("mouseup",T._endDragBefore,!0),window.addEventListener("touchend",T._endDragBefore,!0),window.addEventListener("touchcancel",T._endDragBefore,!0),window.addEventListener("mousemove",T._drag),window.addEventListener("touchmove",T._drag),window.addEventListener("mouseup",T._endDragAfter,!1),window.addEventListener("touchend",T._endDragAfter,!1),window.addEventListener("touchcancel",T._endDragAfter,!1));const F="get",N="set",B={addGetterSetter(t,e,i,n,r){B.addGetter(t,e,i),B.addSetter(t,e,n,r),B.addOverloadedGetterSetter(t,e)},addGetter(t,e,i){const n=F+m._capitalize(e);t.prototype[n]=t.prototype[n]||function(){const t=this.attrs[e];return void 0===t?i:t}},addSetter(t,e,i,n){const r=N+m._capitalize(e);t.prototype[r]||B.overWriteSetter(t,e,i,n)},overWriteSetter(t,e,i,n){const r=N+m._capitalize(e);t.prototype[r]=function(t){return i&&null!=t&&(t=i.call(this,t,e)),this._setAttr(e,t),n&&n.call(this),this}},addComponentsGetterSetter(t,e,i,n,s){const o=i.length,a=m._capitalize,h=F+a(e),l=N+a(e);t.prototype[h]=function(){const t={};for(let n=0;n<o;n++){const r=i[n];t[r]=this.getAttr(e+a(r))}return t};const d=function(t){if(r.isUnminified)return function(e,i){return null==e||m.isObject(e)||m.warn(M(e)+' is a not valid value for "'+i+'" attribute. The value should be an object with properties '+t),e}}(i);t.prototype[l]=function(t){const r=this.attrs[e];n&&(t=n.call(this,t,e)),d&&d.call(this,t,e);for(const i in t)t.hasOwnProperty(i)&&this._setAttr(e+a(i),t[i]);return t||i.forEach(t=>{this._setAttr(e+a(t),void 0)}),this._fireChangeEvent(e,r,t),s&&s.call(this),this},B.addOverloadedGetterSetter(t,e)},addOverloadedGetterSetter(t,e){const i=m._capitalize(e),n=N+i,r=F+i;t.prototype[e]=function(){return arguments.length?(this[n](arguments[0]),this):this[r]()}},addDeprecatedGetterSetter(t,e,i,n){m.error("Adding deprecated "+e);const r=F+m._capitalize(e),s=e+" property is deprecated and will be removed soon. Look at Konva change log for more information.";t.prototype[r]=function(){m.error(s);const t=this.attrs[e];return void 0===t?i:t},B.addSetter(t,e,n,function(){m.error(s)}),B.addOverloadedGetterSetter(t,e)},backCompat(t,e){m.each(e,function(e,i){const n=t.prototype[i],r=F+m._capitalize(e),s=N+m._capitalize(e);function o(){n.apply(this,arguments),m.error('"'+e+'" method is deprecated and will be removed soon. Use ""'+i+'" instead.')}t.prototype[e]=o,t.prototype[r]=o,t.prototype[s]=o})},afterSetFilter(){this._filterUpToDate=!1}};function z(t){const e=/(\w+)\(([^)]+)\)/g;let i;for(;null!==(i=e.exec(t));){const[,t,e]=i;switch(t){case"blur":{const t=parseFloat(e.replace("px",""));return function(e){this.blurRadius(.5*t);const i=r.Filters;i&&i.Blur&&i.Blur.call(this,e)}}case"brightness":{const t=e.includes("%")?parseFloat(e)/100:parseFloat(e);return function(e){this.brightness(t);const i=r.Filters;i&&i.Brightness&&i.Brightness.call(this,e)}}case"contrast":{const t=parseFloat(e);return function(e){const i=100*(Math.sqrt(t)-1);this.contrast(i);const n=r.Filters;n&&n.Contrast&&n.Contrast.call(this,e)}}case"grayscale":return function(t){const e=r.Filters;e&&e.Grayscale&&e.Grayscale.call(this,t)};case"sepia":return function(t){const e=r.Filters;e&&e.Sepia&&e.Sepia.call(this,t)};case"invert":return function(t){const e=r.Filters;e&&e.Invert&&e.Invert.call(this,t)};default:m.warn(`CSS filter "${t}" is not supported in fallback mode. Consider using function filters for better compatibility.`)}}return()=>{}}const j="absoluteOpacity",H="allEventListeners",W="absoluteTransform",Y="absoluteScale",X="canvas",U="listening",q="Shape",K=" ",V="stage",Z="transform",J="visible",Q=["xChange.konva","yChange.konva","scaleXChange.konva","scaleYChange.konva","skewXChange.konva","skewYChange.konva","rotationChange.konva","offsetXChange.konva","offsetYChange.konva","transformsEnabledChange.konva"].join(K);let $=1;class tt{constructor(t){this._id=$++,this.eventListeners={},this.attrs={},this.index=0,this._allEventListeners=null,this.parent=null,this._cache=new Map,this._attachedDepsListeners=new Map,this._lastPos=null,this._batchingTransformChange=!1,this._needClearTransformCache=!1,this._filterUpToDate=!1,this._isUnderCache=!1,this._dragEventId=null,this._shouldFireChangeEvents=!1,this.setAttrs(t),this._shouldFireChangeEvents=!0}hasChildren(){return!1}_clearCache(t){t!==Z&&t!==W||!this._cache.get(t)?t?this._cache.delete(t):this._cache.clear():this._cache.get(t).dirty=!0}_getCache(t,e){let i=this._cache.get(t);return(void 0===i||(t===Z||t===W)&&!0===i.dirty)&&(i=e.call(this),this._cache.set(t,i)),i}_calculate(t,e,i){if(!this._attachedDepsListeners.get(t)){const i=e.map(t=>t+"Change.konva").join(K);this.on(i,()=>{this._clearCache(t)}),this._attachedDepsListeners.set(t,!0)}return this._getCache(t,i)}_getCanvasCache(){return this._cache.get(X)}_clearSelfAndDescendantCache(t){this._clearCache(t),t===W&&this.fire("absoluteTransformChange")}clearCache(){if(this._cache.has(X)){const{scene:t,filter:e,hit:i}=this._cache.get(X);m.releaseCanvas(t._canvas,e._canvas,i._canvas),this._cache.delete(X)}return this._clearSelfAndDescendantCache(),this._requestDraw(),this}cache(t){const e=t||{};let i={};void 0!==e.x&&void 0!==e.y&&void 0!==e.width&&void 0!==e.height||(i=this.getClientRect({skipTransform:!0,relativeTo:this.getParent()||void 0}));let n=Math.ceil(e.width||i.width),r=Math.ceil(e.height||i.height),s=e.pixelRatio,o=void 0===e.x?Math.floor(i.x):e.x,a=void 0===e.y?Math.floor(i.y):e.y,h=e.offset||0,l=e.drawBorder||!1,d=e.hitCanvasPixelRatio||1;if(!n||!r)return void m.error("Can not cache the node. Width or height of the node equals 0. Caching is skipped.");n+=2*h+(Math.abs(Math.round(i.x)-o)>.5?1:0),r+=2*h+(Math.abs(Math.round(i.y)-a)>.5?1:0),o-=h,a-=h;const c=new k({pixelRatio:s,width:n,height:r}),u=new k({pixelRatio:s,width:0,height:0,willReadFrequently:!0}),g=new A({pixelRatio:d,width:n,height:r}),p=c.getContext(),f=g.getContext(),y=new k({width:c.width/c.pixelRatio+Math.abs(o),height:c.height/c.pixelRatio+Math.abs(a),pixelRatio:c.pixelRatio}),v=y.getContext();return g.isCache=!0,c.isCache=!0,this._cache.delete(X),this._filterUpToDate=!1,!1===e.imageSmoothingEnabled&&(c.getContext()._context.imageSmoothingEnabled=!1,u.getContext()._context.imageSmoothingEnabled=!1),p.save(),f.save(),v.save(),p.translate(-o,-a),f.translate(-o,-a),v.translate(-o,-a),y.x=o,y.y=a,this._isUnderCache=!0,this._clearSelfAndDescendantCache(j),this._clearSelfAndDescendantCache(Y),this.drawScene(c,this,y),this.drawHit(g,this),this._isUnderCache=!1,p.restore(),f.restore(),l&&(p.save(),p.beginPath(),p.rect(0,0,n,r),p.closePath(),p.setAttr("strokeStyle","red"),p.setAttr("lineWidth",5),p.stroke(),p.restore()),m.releaseCanvas(y._canvas),this._cache.set(X,{scene:c,filter:u,hit:g,x:o,y:a}),this._requestDraw(),this}isCached(){return this._cache.has(X)}getClientRect(t){throw new Error('abstract "getClientRect" method call')}_transformedRect(t,e){const i=[{x:t.x,y:t.y},{x:t.x+t.width,y:t.y},{x:t.x+t.width,y:t.y+t.height},{x:t.x,y:t.y+t.height}];let n=1/0,r=1/0,s=-1/0,o=-1/0;const a=this.getAbsoluteTransform(e);return i.forEach(function(t){const e=a.point(t);void 0===n&&(n=s=e.x,r=o=e.y),n=Math.min(n,e.x),r=Math.min(r,e.y),s=Math.max(s,e.x),o=Math.max(o,e.y)}),{x:n,y:r,width:s-n,height:o-r}}_drawCachedSceneCanvas(t){t.save(),t._applyOpacity(this),t._applyGlobalCompositeOperation(this);const e=this._getCanvasCache();t.translate(e.x,e.y);const i=this._getCachedSceneCanvas(),n=i.pixelRatio;t.drawImage(i._canvas,0,0,i.width/n,i.height/n),t.restore()}_drawCachedHitCanvas(t){const e=this._getCanvasCache(),i=e.hit;t.save(),t.translate(e.x,e.y),t.drawImage(i._canvas,0,0,i.width/i.pixelRatio,i.height/i.pixelRatio),t.restore()}_getCachedSceneCanvas(){let t,e,i,n,r=this.filters(),s=this._getCanvasCache(),o=s.scene,a=s.filter,h=a.getContext();if(!r||0===r.length)return o;if(this._filterUpToDate)return a;let l=!0;for(let t=0;t<r.length;t++)if("string"==typeof r[t]&&w(),"string"!=typeof r[t]||!w()){l=!1;break}const d=o.pixelRatio;if(a.setSize(o.width/o.pixelRatio,o.height/o.pixelRatio),l){const t=r.join(" ");return h.save(),h.setAttr("filter",t),h.drawImage(o._canvas,0,0,o.getWidth()/d,o.getHeight()/d),h.restore(),this._filterUpToDate=!0,a}try{for(t=r.length,h.clear(),h.drawImage(o._canvas,0,0,o.getWidth()/d,o.getHeight()/d),e=h.getImageData(0,0,a.getWidth(),a.getHeight()),i=0;i<t;i++)n=r[i],"string"==typeof n&&(n=z(n)),n.call(this,e),h.putImageData(e,0,0)}catch(t){m.error("Unable to apply filter. "+t.message+" This post my help you https://konvajs.org/docs/posts/Tainted_Canvas.html.")}return this._filterUpToDate=!0,a}on(t,e){if(this._cache&&this._cache.delete(H),3===arguments.length)return this._delegate.apply(this,arguments);const i=t.split(K);for(let t=0;t<i.length;t++){const n=i[t].split("."),r=n[0],s=n[1]||"";this.eventListeners[r]||(this.eventListeners[r]=[]),this.eventListeners[r].push({name:s,handler:e})}return this}off(t,e){let i,n,r,s,o,a,h=(t||"").split(K),l=h.length;if(this._cache&&this._cache.delete(H),!t)for(n in this.eventListeners)this._off(n);for(i=0;i<l;i++)if(r=h[i],s=r.split("."),o=s[0],a=s[1],o)this.eventListeners[o]&&this._off(o,a,e);else for(n in this.eventListeners)this._off(n,a,e);return this}dispatchEvent(t){const e={target:this,type:t.type,evt:t};return this.fire(t.type,e),this}addEventListener(t,e){return this.on(t,function(t){e.call(this,t.evt)}),this}removeEventListener(t){return this.off(t),this}_delegate(t,e,i){const n=this;this.on(t,function(t){const r=t.target.findAncestors(e,!0,n);for(let e=0;e<r.length;e++)(t=m.cloneObject(t)).currentTarget=r[e],i.call(r[e],t)})}remove(){return this.isDragging()&&this.stopDrag(),T._dragElements.delete(this._id),this._remove(),this}_clearCaches(){this._clearSelfAndDescendantCache(W),this._clearSelfAndDescendantCache(j),this._clearSelfAndDescendantCache(Y),this._clearSelfAndDescendantCache(V),this._clearSelfAndDescendantCache(J),this._clearSelfAndDescendantCache(U)}_remove(){this._clearCaches();const t=this.getParent();t&&t.children&&(t.children.splice(this.index,1),t._setChildrenIndices(),this.parent=null)}destroy(){return this.remove(),this.clearCache(),this}getAttr(t){const e="get"+m._capitalize(t);return m._isFunction(this[e])?this[e]():this.attrs[t]}getAncestors(){let t=this.getParent(),e=[];for(;t;)e.push(t),t=t.getParent();return e}getAttrs(){return this.attrs||{}}setAttrs(t){return this._batchTransformChanges(()=>{let e,i;if(!t)return this;for(e in t)"children"!==e&&(i="set"+m._capitalize(e),m._isFunction(this[i])?this[i](t[e]):this._setAttr(e,t[e]))}),this}isListening(){return this._getCache(U,this._isListening)}_isListening(t){if(!this.listening())return!1;const e=this.getParent();return!e||e===t||this===t||e._isListening(t)}isVisible(){return this._getCache(J,this._isVisible)}_isVisible(t){if(!this.visible())return!1;const e=this.getParent();return!e||e===t||this===t||e._isVisible(t)}shouldDrawHit(t,e=!1){if(t)return this._isVisible(t)&&this._isListening(t);const i=this.getLayer();let n=!1;T._dragElements.forEach(t=>{"dragging"===t.dragStatus&&("Stage"===t.node.nodeType||t.node.getLayer()===i)&&(n=!0)});const s=!e&&!r.hitOnDragEnabled&&(n||r.isTransforming());return this.isListening()&&this.isVisible()&&!s}show(){return this.visible(!0),this}hide(){return this.visible(!1),this}getZIndex(){return this.index||0}getAbsoluteZIndex(){let t,e,i,n,r=this.getDepth(),s=this,o=0;const a=this.getStage();return"Stage"!==s.nodeType&&a&&function a(h){for(t=[],e=h.length,i=0;i<e;i++)n=h[i],o++,n.nodeType!==q&&(t=t.concat(n.getChildren().slice())),n._id===s._id&&(i=e);t.length>0&&t[0].getDepth()<=r&&a(t)}(a.getChildren()),o}getDepth(){let t=0,e=this.parent;for(;e;)t++,e=e.parent;return t}_batchTransformChanges(t){this._batchingTransformChange=!0,t(),this._batchingTransformChange=!1,this._needClearTransformCache&&(this._clearCache(Z),this._clearSelfAndDescendantCache(W)),this._needClearTransformCache=!1}setPosition(t){return this._batchTransformChanges(()=>{this.x(t.x),this.y(t.y)}),this}getPosition(){return{x:this.x(),y:this.y()}}getRelativePointerPosition(){const t=this.getStage();if(!t)return null;const e=t.getPointerPosition();if(!e)return null;const i=this.getAbsoluteTransform().copy();return i.invert(),i.point(e)}getAbsolutePosition(t){let e=!1,i=this.parent;for(;i;){if(i.isCached()){e=!0;break}i=i.parent}e&&!t&&(t=!0);const n=this.getAbsoluteTransform(t).getMatrix(),r=new a,s=this.offset();return r.m=n.slice(),r.translate(s.x,s.y),r.getTranslation()}setAbsolutePosition(t){const{x:e,y:i,...n}=this._clearTransform();this.attrs.x=e,this.attrs.y=i,this._clearCache(Z);const r=this._getAbsoluteTransform().copy();return r.invert(),r.translate(t.x,t.y),t={x:this.attrs.x+r.getTranslation().x,y:this.attrs.y+r.getTranslation().y},this._setTransform(n),this.setPosition({x:t.x,y:t.y}),this._clearCache(Z),this._clearSelfAndDescendantCache(W),this}_setTransform(t){let e;for(e in t)this.attrs[e]=t[e]}_clearTransform(){const t={x:this.x(),y:this.y(),rotation:this.rotation(),scaleX:this.scaleX(),scaleY:this.scaleY(),offsetX:this.offsetX(),offsetY:this.offsetY(),skewX:this.skewX(),skewY:this.skewY()};return this.attrs.x=0,this.attrs.y=0,this.attrs.rotation=0,this.attrs.scaleX=1,this.attrs.scaleY=1,this.attrs.offsetX=0,this.attrs.offsetY=0,this.attrs.skewX=0,this.attrs.skewY=0,t}move(t){let e=t.x,i=t.y,n=this.x(),r=this.y();return void 0!==e&&(n+=e),void 0!==i&&(r+=i),this.setPosition({x:n,y:r}),this}_eachAncestorReverse(t,e){let i,n,r=[],s=this.getParent();if(!e||e._id!==this._id){for(r.unshift(this);s&&(!e||s._id!==e._id);)r.unshift(s),s=s.parent;for(i=r.length,n=0;n<i;n++)t(r[n])}}rotate(t){return this.rotation(this.rotation()+t),this}moveToTop(){if(!this.parent)return m.warn("Node has no parent. moveToTop function is ignored."),!1;const t=this.index;return t<this.parent.getChildren().length-1&&(this.parent.children.splice(t,1),this.parent.children.push(this),this.parent._setChildrenIndices(),!0)}moveUp(){if(!this.parent)return m.warn("Node has no parent. moveUp function is ignored."),!1;const t=this.index;return t<this.parent.getChildren().length-1&&(this.parent.children.splice(t,1),this.parent.children.splice(t+1,0,this),this.parent._setChildrenIndices(),!0)}moveDown(){if(!this.parent)return m.warn("Node has no parent. moveDown function is ignored."),!1;const t=this.index;return t>0&&(this.parent.children.splice(t,1),this.parent.children.splice(t-1,0,this),this.parent._setChildrenIndices(),!0)}moveToBottom(){if(!this.parent)return m.warn("Node has no parent. moveToBottom function is ignored."),!1;const t=this.index;return t>0&&(this.parent.children.splice(t,1),this.parent.children.unshift(this),this.parent._setChildrenIndices(),!0)}setZIndex(t){if(!this.parent)return m.warn("Node has no parent. zIndex parameter is ignored."),this;(t<0||t>=this.parent.children.length)&&m.warn("Unexpected value "+t+" for zIndex property. zIndex is just index of a node in children of its parent. Expected value is from 0 to "+(this.parent.children.length-1)+".");const e=this.index;return this.parent.children.splice(e,1),this.parent.children.splice(t,0,this),this.parent._setChildrenIndices(),this}getAbsoluteOpacity(){return this._getCache(j,this._getAbsoluteOpacity)}_getAbsoluteOpacity(){let t=this.opacity();const e=this.getParent();return e&&!e._isUnderCache&&(t*=e.getAbsoluteOpacity()),t}moveTo(t){return this.getParent()!==t&&(this._remove(),t.add(this)),this}toObject(){let t,e,i,n,r,s=this.getAttrs();const o={attrs:{},className:this.getClassName()};for(t in s)e=s[t],r=m.isObject(e)&&!m._isPlainObject(e)&&!m._isArray(e),r||(i="function"==typeof this[t]&&this[t],delete s[t],n=i?i.call(this):null,s[t]=e,n!==e&&(o.attrs[t]=e));return m._prepareToStringify(o)}toJSON(){return JSON.stringify(this.toObject())}getParent(){return this.parent}findAncestors(t,e,i){const n=[];e&&this._isMatch(t)&&n.push(this);let r=this.parent;for(;r;){if(r===i)return n;r._isMatch(t)&&n.push(r),r=r.parent}return n}isAncestorOf(t){return!1}findAncestor(t,e,i){return this.findAncestors(t,e,i)[0]}_isMatch(t){if(!t)return!1;if("function"==typeof t)return t(this);let e,i,n=t.replace(/ /g,"").split(","),r=n.length;for(e=0;e<r;e++)if(i=n[e],m.isValidSelector(i)||(m.warn('Selector "'+i+'" is invalid. Allowed selectors examples are "#foo", ".bar" or "Group".'),m.warn('If you have a custom shape with such className, please change it to start with upper letter like "Triangle".'),m.warn("Konva is awesome, right?")),"#"===i.charAt(0)){if(this.id()===i.slice(1))return!0}else if("."===i.charAt(0)){if(this.hasName(i.slice(1)))return!0}else if(this.className===i||this.nodeType===i)return!0;return!1}getLayer(){const t=this.getParent();return t?t.getLayer():null}getStage(){return this._getCache(V,this._getStage)}_getStage(){const t=this.getParent();return t?t.getStage():null}fire(t,e={},i){return e.target=e.target||this,i?this._fireAndBubble(t,e):this._fire(t,e),this}getAbsoluteTransform(t){return t?this._getAbsoluteTransform(t):this._getCache(W,this._getAbsoluteTransform)}_getAbsoluteTransform(t){let e;if(t)return e=new a,this._eachAncestorReverse(function(t){const i=t.transformsEnabled();"all"===i?e.multiply(t.getTransform()):"position"===i&&e.translate(t.x()-t.offsetX(),t.y()-t.offsetY())},t),e;{e=this._cache.get(W)||new a,this.parent?this.parent.getAbsoluteTransform().copyInto(e):e.reset();const t=this.transformsEnabled();if("all"===t)e.multiply(this.getTransform());else if("position"===t){const t=this.attrs.x||0,i=this.attrs.y||0,n=this.attrs.offsetX||0,r=this.attrs.offsetY||0;e.translate(t-n,i-r)}return e.dirty=!1,e}}getAbsoluteScale(t){let e=this;for(;e;)e._isUnderCache&&(t=e),e=e.getParent();const i=this.getAbsoluteTransform(t).decompose();return{x:i.scaleX,y:i.scaleY}}getAbsoluteRotation(){return this.getAbsoluteTransform().decompose().rotation}getTransform(){return this._getCache(Z,this._getTransform)}_getTransform(){var t,e;const i=this._cache.get(Z)||new a;i.reset();const n=this.x(),s=this.y(),o=r.getAngle(this.rotation()),h=null!==(t=this.attrs.scaleX)&&void 0!==t?t:1,l=null!==(e=this.attrs.scaleY)&&void 0!==e?e:1,d=this.attrs.skewX||0,c=this.attrs.skewY||0,u=this.attrs.offsetX||0,g=this.attrs.offsetY||0;return 0===n&&0===s||i.translate(n,s),0!==o&&i.rotate(o),0===d&&0===c||i.skew(d,c),1===h&&1===l||i.scale(h,l),0===u&&0===g||i.translate(-1*u,-1*g),i.dirty=!1,i}clone(t){let e,i,n,r,s,o=m.cloneObject(this.attrs);for(e in t)o[e]=t[e];const a=new this.constructor(o);for(e in this.eventListeners)for(i=this.eventListeners[e],n=i.length,r=0;r<n;r++)s=i[r],s.name.indexOf("konva")<0&&(a.eventListeners[e]||(a.eventListeners[e]=[]),a.eventListeners[e].push(s));return a}_toKonvaCanvas(t){t=t||{};const e=this.getClientRect(),i=this.getStage(),n=void 0!==t.x?t.x:Math.floor(e.x),r=void 0!==t.y?t.y:Math.floor(e.y),s=t.pixelRatio||1,o=new k({width:t.width||Math.ceil(e.width)||(i?i.width():0),height:t.height||Math.ceil(e.height)||(i?i.height():0),pixelRatio:s}),a=o.getContext(),h=new k({width:o.width/o.pixelRatio+Math.abs(n),height:o.height/o.pixelRatio+Math.abs(r),pixelRatio:o.pixelRatio});return!1===t.imageSmoothingEnabled&&(a._context.imageSmoothingEnabled=!1),a.save(),(n||r)&&a.translate(-1*n,-1*r),this.drawScene(o,void 0,h),a.restore(),o}toCanvas(t){return this._toKonvaCanvas(t)._canvas}toDataURL(t){const e=(t=t||{}).mimeType||null,i=t.quality||null,n=this._toKonvaCanvas(t).toDataURL(e,i);return t.callback&&t.callback(n),n}toImage(t){return new Promise((e,i)=>{try{const i=null==t?void 0:t.callback;i&&delete t.callback,m._urlToImage(this.toDataURL(t),function(t){e(t),null==i||i(t)})}catch(t){i(t)}})}toBlob(t){return new Promise((e,i)=>{try{const i=null==t?void 0:t.callback;i&&delete t.callback,this.toCanvas(t).toBlob(t=>{e(t),null==i||i(t)},null==t?void 0:t.mimeType,null==t?void 0:t.quality)}catch(t){i(t)}})}setSize(t){return this.width(t.width),this.height(t.height),this}getSize(){return{width:this.width(),height:this.height()}}getClassName(){return this.className||this.nodeType}getType(){return this.nodeType}getDragDistance(){return void 0!==this.attrs.dragDistance?this.attrs.dragDistance:this.parent?this.parent.getDragDistance():r.dragDistance}_off(t,e,i){let n,r,s,o=this.eventListeners[t];for(n=0;n<o.length;n++)if(r=o[n].name,s=o[n].handler,!("konva"===r&&"konva"!==e||e&&r!==e||i&&i!==s)){if(o.splice(n,1),0===o.length){delete this.eventListeners[t];break}n--}}_fireChangeEvent(t,e,i){this._fire(t+"Change",{oldVal:e,newVal:i})}addName(t){if(!this.hasName(t)){const e=this.name(),i=e?e+" "+t:t;this.name(i)}return this}hasName(t){if(!t)return!1;const e=this.name();if(!e)return!1;return-1!==(e||"").split(/\s/g).indexOf(t)}removeName(t){const e=(this.name()||"").split(/\s/g),i=e.indexOf(t);return-1!==i&&(e.splice(i,1),this.name(e.join(" "))),this}setAttr(t,e){const i=this["set"+m._capitalize(t)];return m._isFunction(i)?i.call(this,e):this._setAttr(t,e),this}_requestDraw(){if(r.autoDrawEnabled){const t=this.getLayer()||this.getStage();null==t||t.batchDraw()}}_setAttr(t,e){const i=this.attrs[t];(i!==e||m.isObject(e))&&(null==e?delete this.attrs[t]:this.attrs[t]=e,this._shouldFireChangeEvents&&this._fireChangeEvent(t,i,e),this._requestDraw())}_setComponentAttr(t,e,i){let n;void 0!==i&&(n=this.attrs[t],n||(this.attrs[t]=this.getAttr(t)),this.attrs[t][e]=i,this._fireChangeEvent(t,n,i))}_fireAndBubble(t,e,i){e&&this.nodeType===q&&(e.target=this);const n=["mouseenter","mouseleave","pointerenter","pointerleave","touchenter","touchleave"];if(!(-1!==n.indexOf(t)&&(i&&(this===i||this.isAncestorOf&&this.isAncestorOf(i))||"Stage"===this.nodeType&&!i))){this._fire(t,e);const r=-1!==n.indexOf(t)&&i&&i.isAncestorOf&&i.isAncestorOf(this)&&!i.isAncestorOf(this.pare