Changeset 0c6b92a for imaps-frontend/node_modules/.vite/deps/konva.js

Timestamp:

12/12/24 17:06:06 (5 weeks ago)

Author:

stefan toskovski <stefantoska84@…>

Branches:

main

Parents:

d565449

Message:

Pred finalna verzija

File:

• imaps-frontend/node_modules/.vite/deps/konva.js (modified) (197 diffs)

imaps-frontend/node_modules/.vite/deps/konva.js

@@ -1 @@
-import {
-  require_Ring
-} from "./chunk-D42GQH4N.js";
-import {
-  require_Rect
-} from "./chunk-6JNWGPFD.js";
-import {
-  require_Canvas,
-  require_Context,
-  require_DragAndDrop,
-  require_Factory,
-  require_Node,
-  require_PointerEvents,
-  require_Shape,
-  require_Util,
-  require_Validators
-} from "./chunk-HC2KSO22.js";
 import {
   require_Global
-} from "./chunk-M3JPOOL7.js";
+} from "./chunk-3OE4LJUD.js";
 import {
   __commonJS
 } from "./chunk-V4OQ3NZ2.js";
+
+// node_modules/konva/lib/Util.js
+var require_Util = __commonJS({
+  "node_modules/konva/lib/Util.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Util = exports.Transform = void 0;
+    var Global_1 = require_Global();
+    var Transform = class _Transform {
+      constructor(m = [1, 0, 0, 1, 0, 0]) {
+        this.dirty = false;
+        this.m = m && m.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 _Transform(this.m);
+      }
+      copyInto(tr) {
+        tr.m[0] = this.m[0];
+        tr.m[1] = this.m[1];
+        tr.m[2] = this.m[2];
+        tr.m[3] = this.m[3];
+        tr.m[4] = this.m[4];
+        tr.m[5] = this.m[5];
+      }
+      point(point) {
+        const m = this.m;
+        return {
+          x: m[0] * point.x + m[2] * point.y + m[4],
+          y: m[1] * point.x + m[3] * point.y + m[5]
+        };
+      }
+      translate(x, y) {
+        this.m[4] += this.m[0] * x + this.m[2] * y;
+        this.m[5] += this.m[1] * x + this.m[3] * y;
+        return this;
+      }
+      scale(sx, sy) {
+        this.m[0] *= sx;
+        this.m[1] *= sx;
+        this.m[2] *= sy;
+        this.m[3] *= sy;
+        return this;
+      }
+      rotate(rad) {
+        const c = Math.cos(rad);
+        const s = Math.sin(rad);
+        const m11 = this.m[0] * c + this.m[2] * s;
+        const m12 = this.m[1] * c + this.m[3] * s;
+        const m21 = this.m[0] * -s + this.m[2] * c;
+        const m22 = this.m[1] * -s + this.m[3] * c;
+        this.m[0] = m11;
+        this.m[1] = m12;
+        this.m[2] = m21;
+        this.m[3] = m22;
+        return this;
+      }
+      getTranslation() {
+        return {
+          x: this.m[4],
+          y: this.m[5]
+        };
+      }
+      skew(sx, sy) {
+        const m11 = this.m[0] + this.m[2] * sy;
+        const m12 = this.m[1] + this.m[3] * sy;
+        const m21 = this.m[2] + this.m[0] * sx;
+        const m22 = this.m[3] + this.m[1] * sx;
+        this.m[0] = m11;
+        this.m[1] = m12;
+        this.m[2] = m21;
+        this.m[3] = m22;
+        return this;
+      }
+      multiply(matrix) {
+        const m11 = this.m[0] * matrix.m[0] + this.m[2] * matrix.m[1];
+        const m12 = this.m[1] * matrix.m[0] + this.m[3] * matrix.m[1];
+        const m21 = this.m[0] * matrix.m[2] + this.m[2] * matrix.m[3];
+        const m22 = this.m[1] * matrix.m[2] + this.m[3] * matrix.m[3];
+        const dx = this.m[0] * matrix.m[4] + this.m[2] * matrix.m[5] + this.m[4];
+        const dy = this.m[1] * matrix.m[4] + this.m[3] * matrix.m[5] + this.m[5];
+        this.m[0] = m11;
+        this.m[1] = m12;
+        this.m[2] = m21;
+        this.m[3] = m22;
+        this.m[4] = dx;
+        this.m[5] = dy;
+        return this;
+      }
+      invert() {
+        const d = 1 / (this.m[0] * this.m[3] - this.m[1] * this.m[2]);
+        const m0 = this.m[3] * d;
+        const m1 = -this.m[1] * d;
+        const m2 = -this.m[2] * d;
+        const m3 = this.m[0] * d;
+        const m4 = d * (this.m[2] * this.m[5] - this.m[3] * this.m[4]);
+        const m5 = d * (this.m[1] * this.m[4] - this.m[0] * this.m[5]);
+        this.m[0] = m0;
+        this.m[1] = m1;
+        this.m[2] = m2;
+        this.m[3] = m3;
+        this.m[4] = m4;
+        this.m[5] = m5;
+        return this;
+      }
+      getMatrix() {
+        return this.m;
+      }
+      decompose() {
+        const a = this.m[0];
+        const b = this.m[1];
+        const c = this.m[2];
+        const d = this.m[3];
+        const e = this.m[4];
+        const f = this.m[5];
+        const delta = a * d - b * c;
+        const result = {
+          x: e,
+          y: f,
+          rotation: 0,
+          scaleX: 0,
+          scaleY: 0,
+          skewX: 0,
+          skewY: 0
+        };
+        if (a != 0 || b != 0) {
+          const r = Math.sqrt(a * a + b * b);
+          result.rotation = b > 0 ? Math.acos(a / r) : -Math.acos(a / r);
+          result.scaleX = r;
+          result.scaleY = delta / r;
+          result.skewX = (a * c + b * d) / delta;
+          result.skewY = 0;
+        } else if (c != 0 || d != 0) {
+          const s = Math.sqrt(c * c + d * d);
+          result.rotation = Math.PI / 2 - (d > 0 ? Math.acos(-c / s) : -Math.acos(c / s));
+          result.scaleX = delta / s;
+          result.scaleY = s;
+          result.skewX = 0;
+          result.skewY = (a * c + b * d) / delta;
+        } else {
+        }
+        result.rotation = exports.Util._getRotation(result.rotation);
+        return result;
+      }
+    };
+    exports.Transform = Transform;
+    var OBJECT_ARRAY = "[object Array]";
+    var OBJECT_NUMBER = "[object Number]";
+    var OBJECT_STRING = "[object String]";
+    var OBJECT_BOOLEAN = "[object Boolean]";
+    var PI_OVER_DEG180 = Math.PI / 180;
+    var DEG180_OVER_PI = 180 / Math.PI;
+    var HASH = "#";
+    var EMPTY_STRING = "";
+    var ZERO = "0";
+    var KONVA_WARNING = "Konva warning: ";
+    var KONVA_ERROR = "Konva error: ";
+    var RGB_PAREN = "rgb(";
+    var COLORS = {
+      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]
+    };
+    var RGB_REGEX = /rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/;
+    var animQueue = [];
+    var req = typeof requestAnimationFrame !== "undefined" && requestAnimationFrame || function(f) {
+      setTimeout(f, 60);
+    };
+    exports.Util = {
+      _isElement(obj) {
+        return !!(obj && obj.nodeType == 1);
+      },
+      _isFunction(obj) {
+        return !!(obj && obj.constructor && obj.call && obj.apply);
+      },
+      _isPlainObject(obj) {
+        return !!obj && obj.constructor === Object;
+      },
+      _isArray(obj) {
+        return Object.prototype.toString.call(obj) === OBJECT_ARRAY;
+      },
+      _isNumber(obj) {
+        return Object.prototype.toString.call(obj) === OBJECT_NUMBER && !isNaN(obj) && isFinite(obj);
+      },
+      _isString(obj) {
+        return Object.prototype.toString.call(obj) === OBJECT_STRING;
+      },
+      _isBoolean(obj) {
+        return Object.prototype.toString.call(obj) === OBJECT_BOOLEAN;
+      },
+      isObject(val) {
+        return val instanceof Object;
+      },
+      isValidSelector(selector) {
+        if (typeof selector !== "string") {
+          return false;
+        }
+        const firstChar = selector[0];
+        return firstChar === "#" || firstChar === "." || firstChar === firstChar.toUpperCase();
+      },
+      _sign(number) {
+        if (number === 0) {
+          return 1;
+        }
+        if (number > 0) {
+          return 1;
+        } else {
+          return -1;
+        }
+      },
+      requestAnimFrame(callback) {
+        animQueue.push(callback);
+        if (animQueue.length === 1) {
+          req(function() {
+            const queue = animQueue;
+            animQueue = [];
+            queue.forEach(function(cb) {
+              cb();
+            });
+          });
+        }
+      },
+      createCanvasElement() {
+        const canvas = document.createElement("canvas");
+        try {
+          canvas.style = canvas.style || {};
+        } catch (e) {
+        }
+        return canvas;
+      },
+      createImageElement() {
+        return document.createElement("img");
+      },
+      _isInDocument(el) {
+        while (el = el.parentNode) {
+          if (el == document) {
+            return true;
+          }
+        }
+        return false;
+      },
+      _urlToImage(url, callback) {
+        const imageObj = exports.Util.createImageElement();
+        imageObj.onload = function() {
+          callback(imageObj);
+        };
+        imageObj.src = url;
+      },
+      _rgbToHex(r, g, b) {
+        return ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
+      },
+      _hexToRgb(hex) {
+        hex = hex.replace(HASH, EMPTY_STRING);
+        const bigint = parseInt(hex, 16);
+        return {
+          r: bigint >> 16 & 255,
+          g: bigint >> 8 & 255,
+          b: bigint & 255
+        };
+      },
+      getRandomColor() {
+        let randColor = (Math.random() * 16777215 << 0).toString(16);
+        while (randColor.length < 6) {
+          randColor = ZERO + randColor;
+        }
+        return HASH + randColor;
+      },
+      getRGB(color) {
+        let rgb;
+        if (color in COLORS) {
+          rgb = COLORS[color];
+          return {
+            r: rgb[0],
+            g: rgb[1],
+            b: rgb[2]
+          };
+        } else if (color[0] === HASH) {
+          return this._hexToRgb(color.substring(1));
+        } else if (color.substr(0, 4) === RGB_PAREN) {
+          rgb = RGB_REGEX.exec(color.replace(/ /g, ""));
+          return {
+            r: parseInt(rgb[1], 10),
+            g: parseInt(rgb[2], 10),
+            b: parseInt(rgb[3], 10)
+          };
+        } else {
+          return {
+            r: 0,
+            g: 0,
+            b: 0
+          };
+        }
+      },
+      colorToRGBA(str) {
+        str = str || "black";
+        return exports.Util._namedColorToRBA(str) || exports.Util._hex3ColorToRGBA(str) || exports.Util._hex4ColorToRGBA(str) || exports.Util._hex6ColorToRGBA(str) || exports.Util._hex8ColorToRGBA(str) || exports.Util._rgbColorToRGBA(str) || exports.Util._rgbaColorToRGBA(str) || exports.Util._hslColorToRGBA(str);
+      },
+      _namedColorToRBA(str) {
+        const c = COLORS[str.toLowerCase()];
+        if (!c) {
+          return null;
+        }
+        return {
+          r: c[0],
+          g: c[1],
+          b: c[2],
+          a: 1
+        };
+      },
+      _rgbColorToRGBA(str) {
+        if (str.indexOf("rgb(") === 0) {
+          str = str.match(/rgb\(([^)]+)\)/)[1];
+          const parts = str.split(/ *, */).map(Number);
+          return {
+            r: parts[0],
+            g: parts[1],
+            b: parts[2],
+            a: 1
+          };
+        }
+      },
+      _rgbaColorToRGBA(str) {
+        if (str.indexOf("rgba(") === 0) {
+          str = str.match(/rgba\(([^)]+)\)/)[1];
+          const parts = str.split(/ *, */).map((n, index) => {
+            if (n.slice(-1) === "%") {
+              return index === 3 ? parseInt(n) / 100 : parseInt(n) / 100 * 255;
+            }
+            return Number(n);
+          });
+          return {
+            r: parts[0],
+            g: parts[1],
+            b: parts[2],
+            a: parts[3]
+          };
+        }
+      },
+      _hex8ColorToRGBA(str) {
+        if (str[0] === "#" && str.length === 9) {
+          return {
+            r: parseInt(str.slice(1, 3), 16),
+            g: parseInt(str.slice(3, 5), 16),
+            b: parseInt(str.slice(5, 7), 16),
+            a: parseInt(str.slice(7, 9), 16) / 255
+          };
+        }
+      },
+      _hex6ColorToRGBA(str) {
+        if (str[0] === "#" && str.length === 7) {
+          return {
+            r: parseInt(str.slice(1, 3), 16),
+            g: parseInt(str.slice(3, 5), 16),
+            b: parseInt(str.slice(5, 7), 16),
+            a: 1
+          };
+        }
+      },
+      _hex4ColorToRGBA(str) {
+        if (str[0] === "#" && str.length === 5) {
+          return {
+            r: parseInt(str[1] + str[1], 16),
+            g: parseInt(str[2] + str[2], 16),
+            b: parseInt(str[3] + str[3], 16),
+            a: parseInt(str[4] + str[4], 16) / 255
+          };
+        }
+      },
+      _hex3ColorToRGBA(str) {
+        if (str[0] === "#" && str.length === 4) {
+          return {
+            r: parseInt(str[1] + str[1], 16),
+            g: parseInt(str[2] + str[2], 16),
+            b: parseInt(str[3] + str[3], 16),
+            a: 1
+          };
+        }
+      },
+      _hslColorToRGBA(str) {
+        if (/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.test(str)) {
+          const [_, ...hsl] = /hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(str);
+          const h = Number(hsl[0]) / 360;
+          const s = Number(hsl[1]) / 100;
+          const l = Number(hsl[2]) / 100;
+          let t2;
+          let t3;
+          let val;
+          if (s === 0) {
+            val = l * 255;
+            return {
+              r: Math.round(val),
+              g: Math.round(val),
+              b: Math.round(val),
+              a: 1
+            };
+          }
+          if (l < 0.5) {
+            t2 = l * (1 + s);
+          } else {
+            t2 = l + s - l * s;
+          }
+          const t1 = 2 * l - t2;
+          const rgb = [0, 0, 0];
+          for (let i = 0; i < 3; i++) {
+            t3 = h + 1 / 3 * -(i - 1);
+            if (t3 < 0) {
+              t3++;
+            }
+            if (t3 > 1) {
+              t3--;
+            }
+            if (6 * t3 < 1) {
+              val = t1 + (t2 - t1) * 6 * t3;
+            } else if (2 * t3 < 1) {
+              val = t2;
+            } else if (3 * t3 < 2) {
+              val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
+            } else {
+              val = t1;
+            }
+            rgb[i] = val * 255;
+          }
+          return {
+            r: Math.round(rgb[0]),
+            g: Math.round(rgb[1]),
+            b: Math.round(rgb[2]),
+            a: 1
+          };
+        }
+      },
+      haveIntersection(r1, r2) {
+        return !(r2.x > r1.x + r1.width || r2.x + r2.width < r1.x || r2.y > r1.y + r1.height || r2.y + r2.height < r1.y);
+      },
+      cloneObject(obj) {
+        const retObj = {};
+        for (const key in obj) {
+          if (this._isPlainObject(obj[key])) {
+            retObj[key] = this.cloneObject(obj[key]);
+          } else if (this._isArray(obj[key])) {
+            retObj[key] = this.cloneArray(obj[key]);
+          } else {
+            retObj[key] = obj[key];
+          }
+        }
+        return retObj;
+      },
+      cloneArray(arr) {
+        return arr.slice(0);
+      },
+      degToRad(deg) {
+        return deg * PI_OVER_DEG180;
+      },
+      radToDeg(rad) {
+        return rad * DEG180_OVER_PI;
+      },
+      _degToRad(deg) {
+        exports.Util.warn("Util._degToRad is removed. Please use public Util.degToRad instead.");
+        return exports.Util.degToRad(deg);
+      },
+      _radToDeg(rad) {
+        exports.Util.warn("Util._radToDeg is removed. Please use public Util.radToDeg instead.");
+        return exports.Util.radToDeg(rad);
+      },
+      _getRotation(radians) {
+        return Global_1.Konva.angleDeg ? exports.Util.radToDeg(radians) : radians;
+      },
+      _capitalize(str) {
+        return str.charAt(0).toUpperCase() + str.slice(1);
+      },
+      throw(str) {
+        throw new Error(KONVA_ERROR + str);
+      },
+      error(str) {
+        console.error(KONVA_ERROR + str);
+      },
+      warn(str) {
+        if (!Global_1.Konva.showWarnings) {
+          return;
+        }
+        console.warn(KONVA_WARNING + str);
+      },
+      each(obj, func) {
+        for (const key in obj) {
+          func(key, obj[key]);
+        }
+      },
+      _inRange(val, left, right) {
+        return left <= val && val < right;
+      },
+      _getProjectionToSegment(x1, y1, x2, y2, x3, y3) {
+        let x, y, dist;
+        const pd2 = (x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2);
+        if (pd2 == 0) {
+          x = x1;
+          y = y1;
+          dist = (x3 - x2) * (x3 - x2) + (y3 - y2) * (y3 - y2);
+        } else {
+          const u = ((x3 - x1) * (x2 - x1) + (y3 - y1) * (y2 - y1)) / pd2;
+          if (u < 0) {
+            x = x1;
+            y = y1;
+            dist = (x1 - x3) * (x1 - x3) + (y1 - y3) * (y1 - y3);
+          } else if (u > 1) {
+            x = x2;
+            y = y2;
+            dist = (x2 - x3) * (x2 - x3) + (y2 - y3) * (y2 - y3);
+          } else {
+            x = x1 + u * (x2 - x1);
+            y = y1 + u * (y2 - y1);
+            dist = (x - x3) * (x - x3) + (y - y3) * (y - y3);
+          }
+        }
+        return [x, y, dist];
+      },
+      _getProjectionToLine(pt, line, isClosed) {
+        const pc = exports.Util.cloneObject(pt);
+        let dist = Number.MAX_VALUE;
+        line.forEach(function(p1, i) {
+          if (!isClosed && i === line.length - 1) {
+            return;
+          }
+          const p2 = line[(i + 1) % line.length];
+          const proj = exports.Util._getProjectionToSegment(p1.x, p1.y, p2.x, p2.y, pt.x, pt.y);
+          const px = proj[0], py = proj[1], pdist = proj[2];
+          if (pdist < dist) {
+            pc.x = px;
+            pc.y = py;
+            dist = pdist;
+          }
+        });
+        return pc;
+      },
+      _prepareArrayForTween(startArray, endArray, isClosed) {
+        let n, start = [], end = [];
+        if (startArray.length > endArray.length) {
+          const temp = endArray;
+          endArray = startArray;
+          startArray = temp;
+        }
+        for (n = 0; n < startArray.length; n += 2) {
+          start.push({
+            x: startArray[n],
+            y: startArray[n + 1]
+          });
+        }
+        for (n = 0; n < endArray.length; n += 2) {
+          end.push({
+            x: endArray[n],
+            y: endArray[n + 1]
+          });
+        }
+        const newStart = [];
+        end.forEach(function(point) {
+          const pr = exports.Util._getProjectionToLine(point, start, isClosed);
+          newStart.push(pr.x);
+          newStart.push(pr.y);
+        });
+        return newStart;
+      },
+      _prepareToStringify(obj) {
+        let desc;
+        obj.visitedByCircularReferenceRemoval = true;
+        for (const key in obj) {
+          if (!(obj.hasOwnProperty(key) && obj[key] && typeof obj[key] == "object")) {
+            continue;
+          }
+          desc = Object.getOwnPropertyDescriptor(obj, key);
+          if (obj[key].visitedByCircularReferenceRemoval || exports.Util._isElement(obj[key])) {
+            if (desc.configurable) {
+              delete obj[key];
+            } else {
+              return null;
+            }
+          } else if (exports.Util._prepareToStringify(obj[key]) === null) {
+            if (desc.configurable) {
+              delete obj[key];
+            } else {
+              return null;
+            }
+          }
+        }
+        delete obj.visitedByCircularReferenceRemoval;
+        return obj;
+      },
+      _assign(target, source) {
+        for (const key in source) {
+          target[key] = source[key];
+        }
+        return target;
+      },
+      _getFirstPointerId(evt) {
+        if (!evt.touches) {
+          return evt.pointerId || 999;
+        } else {
+          return evt.changedTouches[0].identifier;
+        }
+      },
+      releaseCanvas(...canvases) {
+        if (!Global_1.Konva.releaseCanvasOnDestroy)
+          return;
+        canvases.forEach((c) => {
+          c.width = 0;
+          c.height = 0;
+        });
+      },
+      drawRoundedRectPath(context, width, height, cornerRadius) {
+        let topLeft = 0;
+        let topRight = 0;
+        let bottomLeft = 0;
+        let bottomRight = 0;
+        if (typeof cornerRadius === "number") {
+          topLeft = topRight = bottomLeft = bottomRight = Math.min(cornerRadius, width / 2, height / 2);
+        } else {
+          topLeft = Math.min(cornerRadius[0] || 0, width / 2, height / 2);
+          topRight = Math.min(cornerRadius[1] || 0, width / 2, height / 2);
+          bottomRight = Math.min(cornerRadius[2] || 0, width / 2, height / 2);
+          bottomLeft = Math.min(cornerRadius[3] || 0, width / 2, height / 2);
+        }
+        context.moveTo(topLeft, 0);
+        context.lineTo(width - topRight, 0);
+        context.arc(width - topRight, topRight, topRight, Math.PI * 3 / 2, 0, false);
+        context.lineTo(width, height - bottomRight);
+        context.arc(width - bottomRight, height - bottomRight, bottomRight, 0, Math.PI / 2, false);
+        context.lineTo(bottomLeft, height);
+        context.arc(bottomLeft, height - bottomLeft, bottomLeft, Math.PI / 2, Math.PI, false);
+        context.lineTo(0, topLeft);
+        context.arc(topLeft, topLeft, topLeft, Math.PI, Math.PI * 3 / 2, false);
+      }
+    };
+  }
+});
+
+// node_modules/konva/lib/Validators.js
+var require_Validators = __commonJS({
+  "node_modules/konva/lib/Validators.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.RGBComponent = RGBComponent;
+    exports.alphaComponent = alphaComponent;
+    exports.getNumberValidator = getNumberValidator;
+    exports.getNumberOrArrayOfNumbersValidator = getNumberOrArrayOfNumbersValidator;
+    exports.getNumberOrAutoValidator = getNumberOrAutoValidator;
+    exports.getStringValidator = getStringValidator;
+    exports.getStringOrGradientValidator = getStringOrGradientValidator;
+    exports.getFunctionValidator = getFunctionValidator;
+    exports.getNumberArrayValidator = getNumberArrayValidator;
+    exports.getBooleanValidator = getBooleanValidator;
+    exports.getComponentValidator = getComponentValidator;
+    var Global_1 = require_Global();
+    var Util_1 = require_Util();
+    function _formatValue(val) {
+      if (Util_1.Util._isString(val)) {
+        return '"' + val + '"';
+      }
+      if (Object.prototype.toString.call(val) === "[object Number]") {
+        return val;
+      }
+      if (Util_1.Util._isBoolean(val)) {
+        return val;
+      }
+      return Object.prototype.toString.call(val);
+    }
+    function RGBComponent(val) {
+      if (val > 255) {
+        return 255;
+      } else if (val < 0) {
+        return 0;
+      }
+      return Math.round(val);
+    }
+    function alphaComponent(val) {
+      if (val > 1) {
+        return 1;
+      } else if (val < 1e-4) {
+        return 1e-4;
+      }
+      return val;
+    }
+    function getNumberValidator() {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          if (!Util_1.Util._isNumber(val)) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a number.');
+          }
+          return val;
+        };
+      }
+    }
+    function getNumberOrArrayOfNumbersValidator(noOfElements) {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          const isNumber = Util_1.Util._isNumber(val);
+          const isValidArray = Util_1.Util._isArray(val) && val.length == noOfElements;
+          if (!isNumber && !isValidArray) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a number or Array<number>(' + noOfElements + ")");
+          }
+          return val;
+        };
+      }
+    }
+    function getNumberOrAutoValidator() {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          const isNumber = Util_1.Util._isNumber(val);
+          const isAuto = val === "auto";
+          if (!(isNumber || isAuto)) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a number or "auto".');
+          }
+          return val;
+        };
+      }
+    }
+    function getStringValidator() {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          if (!Util_1.Util._isString(val)) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a string.');
+          }
+          return val;
+        };
+      }
+    }
+    function getStringOrGradientValidator() {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          const isString = Util_1.Util._isString(val);
+          const isGradient = Object.prototype.toString.call(val) === "[object CanvasGradient]" || val && val.addColorStop;
+          if (!(isString || isGradient)) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a string or a native gradient.');
+          }
+          return val;
+        };
+      }
+    }
+    function getFunctionValidator() {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          if (!Util_1.Util._isFunction(val)) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a function.');
+          }
+          return val;
+        };
+      }
+    }
+    function getNumberArrayValidator() {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          const TypedArray = Int8Array ? Object.getPrototypeOf(Int8Array) : null;
+          if (TypedArray && val instanceof TypedArray) {
+            return val;
+          }
+          if (!Util_1.Util._isArray(val)) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a array of numbers.');
+          } else {
+            val.forEach(function(item) {
+              if (!Util_1.Util._isNumber(item)) {
+                Util_1.Util.warn('"' + attr + '" attribute has non numeric element ' + item + ". Make sure that all elements are numbers.");
+              }
+            });
+          }
+          return val;
+        };
+      }
+    }
+    function getBooleanValidator() {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          const isBool = val === true || val === false;
+          if (!isBool) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be a boolean.');
+          }
+          return val;
+        };
+      }
+    }
+    function getComponentValidator(components) {
+      if (Global_1.Konva.isUnminified) {
+        return function(val, attr) {
+          if (val === void 0 || val === null) {
+            return val;
+          }
+          if (!Util_1.Util.isObject(val)) {
+            Util_1.Util.warn(_formatValue(val) + ' is a not valid value for "' + attr + '" attribute. The value should be an object with properties ' + components);
+          }
+          return val;
+        };
+      }
+    }
+  }
+});
+
+// node_modules/konva/lib/Factory.js
+var require_Factory = __commonJS({
+  "node_modules/konva/lib/Factory.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Factory = void 0;
+    var Util_1 = require_Util();
+    var Validators_1 = require_Validators();
+    var GET = "get";
+    var SET = "set";
+    exports.Factory = {
+      addGetterSetter(constructor, attr, def, validator, after) {
+        exports.Factory.addGetter(constructor, attr, def);
+        exports.Factory.addSetter(constructor, attr, validator, after);
+        exports.Factory.addOverloadedGetterSetter(constructor, attr);
+      },
+      addGetter(constructor, attr, def) {
+        const method = GET + Util_1.Util._capitalize(attr);
+        constructor.prototype[method] = constructor.prototype[method] || function() {
+          const val = this.attrs[attr];
+          return val === void 0 ? def : val;
+        };
+      },
+      addSetter(constructor, attr, validator, after) {
+        const method = SET + Util_1.Util._capitalize(attr);
+        if (!constructor.prototype[method]) {
+          exports.Factory.overWriteSetter(constructor, attr, validator, after);
+        }
+      },
+      overWriteSetter(constructor, attr, validator, after) {
+        const method = SET + Util_1.Util._capitalize(attr);
+        constructor.prototype[method] = function(val) {
+          if (validator && val !== void 0 && val !== null) {
+            val = validator.call(this, val, attr);
+          }
+          this._setAttr(attr, val);
+          if (after) {
+            after.call(this);
+          }
+          return this;
+        };
+      },
+      addComponentsGetterSetter(constructor, attr, components, validator, after) {
+        let len = components.length, capitalize = Util_1.Util._capitalize, getter = GET + capitalize(attr), setter = SET + capitalize(attr), n, component;
+        constructor.prototype[getter] = function() {
+          const ret = {};
+          for (n = 0; n < len; n++) {
+            component = components[n];
+            ret[component] = this.getAttr(attr + capitalize(component));
+          }
+          return ret;
+        };
+        const basicValidator = (0, Validators_1.getComponentValidator)(components);
+        constructor.prototype[setter] = function(val) {
+          let oldVal = this.attrs[attr], key;
+          if (validator) {
+            val = validator.call(this, val);
+          }
+          if (basicValidator) {
+            basicValidator.call(this, val, attr);
+          }
+          for (key in val) {
+            if (!val.hasOwnProperty(key)) {
+              continue;
+            }
+            this._setAttr(attr + capitalize(key), val[key]);
+          }
+          if (!val) {
+            components.forEach((component2) => {
+              this._setAttr(attr + capitalize(component2), void 0);
+            });
+          }
+          this._fireChangeEvent(attr, oldVal, val);
+          if (after) {
+            after.call(this);
+          }
+          return this;
+        };
+        exports.Factory.addOverloadedGetterSetter(constructor, attr);
+      },
+      addOverloadedGetterSetter(constructor, attr) {
+        const capitalizedAttr = Util_1.Util._capitalize(attr), setter = SET + capitalizedAttr, getter = GET + capitalizedAttr;
+        constructor.prototype[attr] = function() {
+          if (arguments.length) {
+            this[setter](arguments[0]);
+            return this;
+          }
+          return this[getter]();
+        };
+      },
+      addDeprecatedGetterSetter(constructor, attr, def, validator) {
+        Util_1.Util.error("Adding deprecated " + attr);
+        const method = GET + Util_1.Util._capitalize(attr);
+        const message = attr + " property is deprecated and will be removed soon. Look at Konva change log for more information.";
+        constructor.prototype[method] = function() {
+          Util_1.Util.error(message);
+          const val = this.attrs[attr];
+          return val === void 0 ? def : val;
+        };
+        exports.Factory.addSetter(constructor, attr, validator, function() {
+          Util_1.Util.error(message);
+        });
+        exports.Factory.addOverloadedGetterSetter(constructor, attr);
+      },
+      backCompat(constructor, methods) {
+        Util_1.Util.each(methods, function(oldMethodName, newMethodName) {
+          const method = constructor.prototype[newMethodName];
+          const oldGetter = GET + Util_1.Util._capitalize(oldMethodName);
+          const oldSetter = SET + Util_1.Util._capitalize(oldMethodName);
+          function deprecated() {
+            method.apply(this, arguments);
+            Util_1.Util.error('"' + oldMethodName + '" method is deprecated and will be removed soon. Use ""' + newMethodName + '" instead.');
+          }
+          constructor.prototype[oldMethodName] = deprecated;
+          constructor.prototype[oldGetter] = deprecated;
+          constructor.prototype[oldSetter] = deprecated;
+        });
+      },
+      afterSetFilter() {
+        this._filterUpToDate = false;
+      }
+    };
+  }
+});
+
+// node_modules/konva/lib/Context.js
+var require_Context = __commonJS({
+  "node_modules/konva/lib/Context.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.HitContext = exports.SceneContext = exports.Context = void 0;
+    var Util_1 = require_Util();
+    var Global_1 = require_Global();
+    function simplifyArray(arr) {
+      let retArr = [], len = arr.length, util = Util_1.Util, n, val;
+      for (n = 0; n < len; n++) {
+        val = arr[n];
+        if (util._isNumber(val)) {
+          val = Math.round(val * 1e3) / 1e3;
+        } else if (!util._isString(val)) {
+          val = val + "";
+        }
+        retArr.push(val);
+      }
+      return retArr;
+    }
+    var COMMA = ",";
+    var OPEN_PAREN = "(";
+    var CLOSE_PAREN = ")";
+    var OPEN_PAREN_BRACKET = "([";
+    var CLOSE_BRACKET_PAREN = "])";
+    var SEMICOLON = ";";
+    var DOUBLE_PAREN = "()";
+    var EQUALS = "=";
+    var CONTEXT_METHODS = [
+      "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"
+    ];
+    var CONTEXT_PROPERTIES = [
+      "fillStyle",
+      "strokeStyle",
+      "shadowColor",
+      "shadowBlur",
+      "shadowOffsetX",
+      "shadowOffsetY",
+      "letterSpacing",
+      "lineCap",
+      "lineDashOffset",
+      "lineJoin",
+      "lineWidth",
+      "miterLimit",
+      "direction",
+      "font",
+      "textAlign",
+      "textBaseline",
+      "globalAlpha",
+      "globalCompositeOperation",
+      "imageSmoothingEnabled"
+    ];
+    var traceArrMax = 100;
+    var Context = class {
+      constructor(canvas) {
+        this.canvas = canvas;
+        if (Global_1.Konva.enableTrace) {
+          this.traceArr = [];
+          this._enableTrace();
+        }
+      }
+      fillShape(shape) {
+        if (shape.fillEnabled()) {
+          this._fill(shape);
+        }
+      }
+      _fill(shape) {
+      }
+      strokeShape(shape) {
+        if (shape.hasStroke()) {
+          this._stroke(shape);
+        }
+      }
+      _stroke(shape) {
+      }
+      fillStrokeShape(shape) {
+        if (shape.attrs.fillAfterStrokeEnabled) {
+          this.strokeShape(shape);
+          this.fillShape(shape);
+        } else {
+          this.fillShape(shape);
+          this.strokeShape(shape);
+        }
+      }
+      getTrace(relaxed, rounded) {
+        let traceArr = this.traceArr, len = traceArr.length, str = "", n, trace, method, args;
+        for (n = 0; n < len; n++) {
+          trace = traceArr[n];
+          method = trace.method;
+          if (method) {
+            args = trace.args;
+            str += method;
+            if (relaxed) {
+              str += DOUBLE_PAREN;
+            } else {
+              if (Util_1.Util._isArray(args[0])) {
+                str += OPEN_PAREN_BRACKET + args.join(COMMA) + CLOSE_BRACKET_PAREN;
+              } else {
+                if (rounded) {
+                  args = args.map((a) => typeof a === "number" ? Math.floor(a) : a);
+                }
+                str += OPEN_PAREN + args.join(COMMA) + CLOSE_PAREN;
+              }
+            }
+          } else {
+            str += trace.property;
+            if (!relaxed) {
+              str += EQUALS + trace.val;
+            }
+          }
+          str += SEMICOLON;
+        }
+        return str;
+      }
+      clearTrace() {
+        this.traceArr = [];
+      }
+      _trace(str) {
+        let traceArr = this.traceArr, len;
+        traceArr.push(str);
+        len = traceArr.length;
+        if (len >= traceArrMax) {
+          traceArr.shift();
+        }
+      }
+      reset() {
+        const pixelRatio = this.getCanvas().getPixelRatio();
+        this.setTransform(1 * pixelRatio, 0, 0, 1 * pixelRatio, 0, 0);
+      }
+      getCanvas() {
+        return this.canvas;
+      }
+      clear(bounds) {
+        const canvas = this.getCanvas();
+        if (bounds) {
+          this.clearRect(bounds.x || 0, bounds.y || 0, bounds.width || 0, bounds.height || 0);
+        } else {
+          this.clearRect(0, 0, canvas.getWidth() / canvas.pixelRatio, canvas.getHeight() / canvas.pixelRatio);
+        }
+      }
+      _applyLineCap(shape) {
+        const lineCap = shape.attrs.lineCap;
+        if (lineCap) {
+          this.setAttr("lineCap", lineCap);
+        }
+      }
+      _applyOpacity(shape) {
+        const absOpacity = shape.getAbsoluteOpacity();
+        if (absOpacity !== 1) {
+          this.setAttr("globalAlpha", absOpacity);
+        }
+      }
+      _applyLineJoin(shape) {
+        const lineJoin = shape.attrs.lineJoin;
+        if (lineJoin) {
+          this.setAttr("lineJoin", lineJoin);
+        }
+      }
+      setAttr(attr, val) {
+        this._context[attr] = val;
+      }
+      arc(x, y, radius, startAngle, endAngle, counterClockwise) {
+        this._context.arc(x, y, radius, startAngle, endAngle, counterClockwise);
+      }
+      arcTo(x1, y1, x2, y2, radius) {
+        this._context.arcTo(x1, y1, x2, y2, radius);
+      }
+      beginPath() {
+        this._context.beginPath();
+      }
+      bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) {
+        this._context.bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y);
+      }
+      clearRect(x, y, width, height) {
+        this._context.clearRect(x, y, width, height);
+      }
+      clip(...args) {
+        this._context.clip.apply(this._context, args);
+      }
+      closePath() {
+        this._context.closePath();
+      }
+      createImageData(width, height) {
+        const a = arguments;
+        if (a.length === 2) {
+          return this._context.createImageData(width, height);
+        } else if (a.length === 1) {
+          return this._context.createImageData(width);
+        }
+      }
+      createLinearGradient(x0, y0, x1, y1) {
+        return this._context.createLinearGradient(x0, y0, x1, y1);
+      }
+      createPattern(image, repetition) {
+        return this._context.createPattern(image, repetition);
+      }
+      createRadialGradient(x0, y0, r0, x1, y1, r1) {
+        return this._context.createRadialGradient(x0, y0, r0, x1, y1, r1);
+      }
+      drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight) {
+        const a = arguments, _context = this._context;
+        if (a.length === 3) {
+          _context.drawImage(image, sx, sy);
+        } else if (a.length === 5) {
+          _context.drawImage(image, sx, sy, sWidth, sHeight);
+        } else if (a.length === 9) {
+          _context.drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight);
+        }
+      }
+      ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, counterclockwise) {
+        this._context.ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, counterclockwise);
+      }
+      isPointInPath(x, y, path, fillRule) {
+        if (path) {
+          return this._context.isPointInPath(path, x, y, fillRule);
+        }
+        return this._context.isPointInPath(x, y, fillRule);
+      }
+      fill(...args) {
+        this._context.fill.apply(this._context, args);
+      }
+      fillRect(x, y, width, height) {
+        this._context.fillRect(x, y, width, height);
+      }
+      strokeRect(x, y, width, height) {
+        this._context.strokeRect(x, y, width, height);
+      }
+      fillText(text, x, y, maxWidth) {
+        if (maxWidth) {
+          this._context.fillText(text, x, y, maxWidth);
+        } else {
+          this._context.fillText(text, x, y);
+        }
+      }
+      measureText(text) {
+        return this._context.measureText(text);
+      }
+      getImageData(sx, sy, sw, sh) {
+        return this._context.getImageData(sx, sy, sw, sh);
+      }
+      lineTo(x, y) {
+        this._context.lineTo(x, y);
+      }
+      moveTo(x, y) {
+        this._context.moveTo(x, y);
+      }
+      rect(x, y, width, height) {
+        this._context.rect(x, y, width, height);
+      }
+      roundRect(x, y, width, height, radii) {
+        this._context.roundRect(x, y, width, height, radii);
+      }
+      putImageData(imageData, dx, dy) {
+        this._context.putImageData(imageData, dx, dy);
+      }
+      quadraticCurveTo(cpx, cpy, x, y) {
+        this._context.quadraticCurveTo(cpx, cpy, x, y);
+      }
+      restore() {
+        this._context.restore();
+      }
+      rotate(angle) {
+        this._context.rotate(angle);
+      }
+      save() {
+        this._context.save();
+      }
+      scale(x, y) {
+        this._context.scale(x, y);
+      }
+      setLineDash(segments) {
+        if (this._context.setLineDash) {
+          this._context.setLineDash(segments);
+        } else if ("mozDash" in this._context) {
+          this._context["mozDash"] = segments;
+        } else if ("webkitLineDash" in this._context) {
+          this._context["webkitLineDash"] = segments;
+        }
+      }
+      getLineDash() {
+        return this._context.getLineDash();
+      }
+      setTransform(a, b, c, d, e, f) {
+        this._context.setTransform(a, b, c, d, e, f);
+      }
+      stroke(path2d) {
+        if (path2d) {
+          this._context.stroke(path2d);
+        } else {
+          this._context.stroke();
+        }
+      }
+      strokeText(text, x, y, maxWidth) {
+        this._context.strokeText(text, x, y, maxWidth);
+      }
+      transform(a, b, c, d, e, f) {
+        this._context.transform(a, b, c, d, e, f);
+      }
+      translate(x, y) {
+        this._context.translate(x, y);
+      }
+      _enableTrace() {
+        let that = this, len = CONTEXT_METHODS.length, origSetter = this.setAttr, n, args;
+        const func = function(methodName) {
+          let origMethod = that[methodName], ret;
+          that[methodName] = function() {
+            args = simplifyArray(Array.prototype.slice.call(arguments, 0));
+            ret = origMethod.apply(that, arguments);
+            that._trace({
+              method: methodName,
+              args
+            });
+            return ret;
+          };
+        };
+        for (n = 0; n < len; n++) {
+          func(CONTEXT_METHODS[n]);
+        }
+        that.setAttr = function() {
+          origSetter.apply(that, arguments);
+          const prop = arguments[0];
+          let val = arguments[1];
+          if (prop === "shadowOffsetX" || prop === "shadowOffsetY" || prop === "shadowBlur") {
+            val = val / this.canvas.getPixelRatio();
+          }
+          that._trace({
+            property: prop,
+            val
+          });
+        };
+      }
+      _applyGlobalCompositeOperation(node) {
+        const op = node.attrs.globalCompositeOperation;
+        const def = !op || op === "source-over";
+        if (!def) {
+          this.setAttr("globalCompositeOperation", op);
+        }
+      }
+    };
+    exports.Context = Context;
+    CONTEXT_PROPERTIES.forEach(function(prop) {
+      Object.defineProperty(Context.prototype, prop, {
+        get() {
+          return this._context[prop];
+        },
+        set(val) {
+          this._context[prop] = val;
+        }
+      });
+    });
+    var SceneContext = class extends Context {
+      constructor(canvas, { willReadFrequently = false } = {}) {
+        super(canvas);
+        this._context = canvas._canvas.getContext("2d", {
+          willReadFrequently
+        });
+      }
+      _fillColor(shape) {
+        const fill = shape.fill();
+        this.setAttr("fillStyle", fill);
+        shape._fillFunc(this);
+      }
+      _fillPattern(shape) {
+        this.setAttr("fillStyle", shape._getFillPattern());
+        shape._fillFunc(this);
+      }
+      _fillLinearGradient(shape) {
+        const grd = shape._getLinearGradient();
+        if (grd) {
+          this.setAttr("fillStyle", grd);
+          shape._fillFunc(this);
+        }
+      }
+      _fillRadialGradient(shape) {
+        const grd = shape._getRadialGradient();
+        if (grd) {
+          this.setAttr("fillStyle", grd);
+          shape._fillFunc(this);
+        }
+      }
+      _fill(shape) {
+        const hasColor = shape.fill(), fillPriority = shape.getFillPriority();
+        if (hasColor && fillPriority === "color") {
+          this._fillColor(shape);
+          return;
+        }
+        const hasPattern = shape.getFillPatternImage();
+        if (hasPattern && fillPriority === "pattern") {
+          this._fillPattern(shape);
+          return;
+        }
+        const hasLinearGradient = shape.getFillLinearGradientColorStops();
+        if (hasLinearGradient && fillPriority === "linear-gradient") {
+          this._fillLinearGradient(shape);
+          return;
+        }
+        const hasRadialGradient = shape.getFillRadialGradientColorStops();
+        if (hasRadialGradient && fillPriority === "radial-gradient") {
+          this._fillRadialGradient(shape);
+          return;
+        }
+        if (hasColor) {
+          this._fillColor(shape);
+        } else if (hasPattern) {
+          this._fillPattern(shape);
+        } else if (hasLinearGradient) {
+          this._fillLinearGradient(shape);
+        } else if (hasRadialGradient) {
+          this._fillRadialGradient(shape);
+        }
+      }
+      _strokeLinearGradient(shape) {
+        const start = shape.getStrokeLinearGradientStartPoint(), end = shape.getStrokeLinearGradientEndPoint(), colorStops = shape.getStrokeLinearGradientColorStops(), grd = this.createLinearGradient(start.x, start.y, end.x, end.y);
+        if (colorStops) {
+          for (let n = 0; n < colorStops.length; n += 2) {
+            grd.addColorStop(colorStops[n], colorStops[n + 1]);
+          }
+          this.setAttr("strokeStyle", grd);
+        }
+      }
+      _stroke(shape) {
+        const dash = shape.dash(), strokeScaleEnabled = shape.getStrokeScaleEnabled();
+        if (shape.hasStroke()) {
+          if (!strokeScaleEnabled) {
+            this.save();
+            const pixelRatio = this.getCanvas().getPixelRatio();
+            this.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);
+          }
+          this._applyLineCap(shape);
+          if (dash && shape.dashEnabled()) {
+            this.setLineDash(dash);
+            this.setAttr("lineDashOffset", shape.dashOffset());
+          }
+          this.setAttr("lineWidth", shape.strokeWidth());
+          if (!shape.getShadowForStrokeEnabled()) {
+            this.setAttr("shadowColor", "rgba(0,0,0,0)");
+          }
+          const hasLinearGradient = shape.getStrokeLinearGradientColorStops();
+          if (hasLinearGradient) {
+            this._strokeLinearGradient(shape);
+          } else {
+            this.setAttr("strokeStyle", shape.stroke());
+          }
+          shape._strokeFunc(this);
+          if (!strokeScaleEnabled) {
+            this.restore();
+          }
+        }
+      }
+      _applyShadow(shape) {
+        var _a, _b, _c;
+        const color = (_a = shape.getShadowRGBA()) !== null && _a !== void 0 ? _a : "black", blur = (_b = shape.getShadowBlur()) !== null && _b !== void 0 ? _b : 5, offset = (_c = shape.getShadowOffset()) !== null && _c !== void 0 ? _c : {
+          x: 0,
+          y: 0
+        }, scale = shape.getAbsoluteScale(), ratio = this.canvas.getPixelRatio(), scaleX = scale.x * ratio, scaleY = scale.y * ratio;
+        this.setAttr("shadowColor", color);
+        this.setAttr("shadowBlur", blur * Math.min(Math.abs(scaleX), Math.abs(scaleY)));
+        this.setAttr("shadowOffsetX", offset.x * scaleX);
+        this.setAttr("shadowOffsetY", offset.y * scaleY);
+      }
+    };
+    exports.SceneContext = SceneContext;
+    var HitContext = class extends Context {
+      constructor(canvas) {
+        super(canvas);
+        this._context = canvas._canvas.getContext("2d", {
+          willReadFrequently: true
+        });
+      }
+      _fill(shape) {
+        this.save();
+        this.setAttr("fillStyle", shape.colorKey);
+        shape._fillFuncHit(this);
+        this.restore();
+      }
+      strokeShape(shape) {
+        if (shape.hasHitStroke()) {
+          this._stroke(shape);
+        }
+      }
+      _stroke(shape) {
+        if (shape.hasHitStroke()) {
+          const strokeScaleEnabled = shape.getStrokeScaleEnabled();
+          if (!strokeScaleEnabled) {
+            this.save();
+            const pixelRatio = this.getCanvas().getPixelRatio();
+            this.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);
+          }
+          this._applyLineCap(shape);
+          const hitStrokeWidth = shape.hitStrokeWidth();
+          const strokeWidth = hitStrokeWidth === "auto" ? shape.strokeWidth() : hitStrokeWidth;
+          this.setAttr("lineWidth", strokeWidth);
+          this.setAttr("strokeStyle", shape.colorKey);
+          shape._strokeFuncHit(this);
+          if (!strokeScaleEnabled) {
+            this.restore();
+          }
+        }
+      }
+    };
+    exports.HitContext = HitContext;
+  }
+});
+
+// node_modules/konva/lib/Canvas.js
+var require_Canvas = __commonJS({
+  "node_modules/konva/lib/Canvas.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.HitCanvas = exports.SceneCanvas = exports.Canvas = void 0;
+    var Util_1 = require_Util();
+    var Context_1 = require_Context();
+    var Global_1 = require_Global();
+    var Factory_1 = require_Factory();
+    var Validators_1 = require_Validators();
+    var _pixelRatio;
+    function getDevicePixelRatio() {
+      if (_pixelRatio) {
+        return _pixelRatio;
+      }
+      const canvas = Util_1.Util.createCanvasElement();
+      const context = canvas.getContext("2d");
+      _pixelRatio = function() {
+        const devicePixelRatio = Global_1.Konva._global.devicePixelRatio || 1, backingStoreRatio = context.webkitBackingStorePixelRatio || context.mozBackingStorePixelRatio || context.msBackingStorePixelRatio || context.oBackingStorePixelRatio || context.backingStorePixelRatio || 1;
+        return devicePixelRatio / backingStoreRatio;
+      }();
+      Util_1.Util.releaseCanvas(canvas);
+      return _pixelRatio;
+    }
+    var Canvas = class {
+      constructor(config) {
+        this.pixelRatio = 1;
+        this.width = 0;
+        this.height = 0;
+        this.isCache = false;
+        const conf = config || {};
+        const pixelRatio = conf.pixelRatio || Global_1.Konva.pixelRatio || getDevicePixelRatio();
+        this.pixelRatio = pixelRatio;
+        this._canvas = Util_1.Util.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(pixelRatio) {
+        const previousRatio = this.pixelRatio;
+        this.pixelRatio = pixelRatio;
+        this.setSize(this.getWidth() / previousRatio, this.getHeight() / previousRatio);
+      }
+      setWidth(width) {
+        this.width = this._canvas.width = width * this.pixelRatio;
+        this._canvas.style.width = width + "px";
+        const pixelRatio = this.pixelRatio, _context = this.getContext()._context;
+        _context.scale(pixelRatio, pixelRatio);
+      }
+      setHeight(height) {
+        this.height = this._canvas.height = height * this.pixelRatio;
+        this._canvas.style.height = height + "px";
+        const pixelRatio = this.pixelRatio, _context = this.getContext()._context;
+        _context.scale(pixelRatio, pixelRatio);
+      }
+      getWidth() {
+        return this.width;
+      }
+      getHeight() {
+        return this.height;
+      }
+      setSize(width, height) {
+        this.setWidth(width || 0);
+        this.setHeight(height || 0);
+      }
+      toDataURL(mimeType, quality) {
+        try {
+          return this._canvas.toDataURL(mimeType, quality);
+        } catch (e) {
+          try {
+            return this._canvas.toDataURL();
+          } catch (err) {
+            Util_1.Util.error("Unable to get data URL. " + err.message + " For more info read https://konvajs.org/docs/posts/Tainted_Canvas.html.");
+            return "";
+          }
+        }
+      }
+    };
+    exports.Canvas = Canvas;
+    Factory_1.Factory.addGetterSetter(Canvas, "pixelRatio", void 0, (0, Validators_1.getNumberValidator)());
+    var SceneCanvas = class extends Canvas {
+      constructor(config = { width: 0, height: 0, willReadFrequently: false }) {
+        super(config);
+        this.context = new Context_1.SceneContext(this, {
+          willReadFrequently: config.willReadFrequently
+        });
+        this.setSize(config.width, config.height);
+      }
+    };
+    exports.SceneCanvas = SceneCanvas;
+    var HitCanvas = class extends Canvas {
+      constructor(config = { width: 0, height: 0 }) {
+        super(config);
+        this.hitCanvas = true;
+        this.context = new Context_1.HitContext(this);
+        this.setSize(config.width, config.height);
+      }
+    };
+    exports.HitCanvas = HitCanvas;
+  }
+});
+
+// node_modules/konva/lib/DragAndDrop.js
+var require_DragAndDrop = __commonJS({
+  "node_modules/konva/lib/DragAndDrop.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.DD = void 0;
+    var Global_1 = require_Global();
+    var Util_1 = require_Util();
+    exports.DD = {
+      get isDragging() {
+        let flag = false;
+        exports.DD._dragElements.forEach((elem) => {
+          if (elem.dragStatus === "dragging") {
+            flag = true;
+          }
+        });
+        return flag;
+      },
+      justDragged: false,
+      get node() {
+        let node;
+        exports.DD._dragElements.forEach((elem) => {
+          node = elem.node;
+        });
+        return node;
+      },
+      _dragElements: /* @__PURE__ */ new Map(),
+      _drag(evt) {
+        const nodesToFireEvents = [];
+        exports.DD._dragElements.forEach((elem, key) => {
+          const { node } = elem;
+          const stage = node.getStage();
+          stage.setPointersPositions(evt);
+          if (elem.pointerId === void 0) {
+            elem.pointerId = Util_1.Util._getFirstPointerId(evt);
+          }
+          const pos = stage._changedPointerPositions.find((pos2) => pos2.id === elem.pointerId);
+          if (!pos) {
+            return;
+          }
+          if (elem.dragStatus !== "dragging") {
+            const dragDistance = node.dragDistance();
+            const distance = Math.max(Math.abs(pos.x - elem.startPointerPos.x), Math.abs(pos.y - elem.startPointerPos.y));
+            if (distance < dragDistance) {
+              return;
+            }
+            node.startDrag({ evt });
+            if (!node.isDragging()) {
+              return;
+            }
+          }
+          node._setDragPosition(evt, elem);
+          nodesToFireEvents.push(node);
+        });
+        nodesToFireEvents.forEach((node) => {
+          node.fire("dragmove", {
+            type: "dragmove",
+            target: node,
+            evt
+          }, true);
+        });
+      },
+      _endDragBefore(evt) {
+        const drawNodes = [];
+        exports.DD._dragElements.forEach((elem) => {
+          const { node } = elem;
+          const stage = node.getStage();
+          if (evt) {
+            stage.setPointersPositions(evt);
+          }
+          const pos = stage._changedPointerPositions.find((pos2) => pos2.id === elem.pointerId);
+          if (!pos) {
+            return;
+          }
+          if (elem.dragStatus === "dragging" || elem.dragStatus === "stopped") {
+            exports.DD.justDragged = true;
+            Global_1.Konva._mouseListenClick = false;
+            Global_1.Konva._touchListenClick = false;
+            Global_1.Konva._pointerListenClick = false;
+            elem.dragStatus = "stopped";
+          }
+          const drawNode = elem.node.getLayer() || elem.node instanceof Global_1.Konva["Stage"] && elem.node;
+          if (drawNode && drawNodes.indexOf(drawNode) === -1) {
+            drawNodes.push(drawNode);
+          }
+        });
+        drawNodes.forEach((drawNode) => {
+          drawNode.draw();
+        });
+      },
+      _endDragAfter(evt) {
+        exports.DD._dragElements.forEach((elem, key) => {
+          if (elem.dragStatus === "stopped") {
+            elem.node.fire("dragend", {
+              type: "dragend",
+              target: elem.node,
+              evt
+            }, true);
+          }
+          if (elem.dragStatus !== "dragging") {
+            exports.DD._dragElements.delete(key);
+          }
+        });
+      }
+    };
+    if (Global_1.Konva.isBrowser) {
+      window.addEventListener("mouseup", exports.DD._endDragBefore, true);
+      window.addEventListener("touchend", exports.DD._endDragBefore, true);
+      window.addEventListener("touchcancel", exports.DD._endDragBefore, true);
+      window.addEventListener("mousemove", exports.DD._drag);
+      window.addEventListener("touchmove", exports.DD._drag);
+      window.addEventListener("mouseup", exports.DD._endDragAfter, false);
+      window.addEventListener("touchend", exports.DD._endDragAfter, false);
+      window.addEventListener("touchcancel", exports.DD._endDragAfter, false);
+    }
+  }
+});
+
+// node_modules/konva/lib/Node.js
+var require_Node = __commonJS({
+  "node_modules/konva/lib/Node.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Node = void 0;
+    var Util_1 = require_Util();
+    var Factory_1 = require_Factory();
+    var Canvas_1 = require_Canvas();
+    var Global_1 = require_Global();
+    var DragAndDrop_1 = require_DragAndDrop();
+    var Validators_1 = require_Validators();
+    var ABSOLUTE_OPACITY = "absoluteOpacity";
+    var ALL_LISTENERS = "allEventListeners";
+    var ABSOLUTE_TRANSFORM = "absoluteTransform";
+    var ABSOLUTE_SCALE = "absoluteScale";
+    var CANVAS = "canvas";
+    var CHANGE = "Change";
+    var CHILDREN = "children";
+    var KONVA = "konva";
+    var LISTENING = "listening";
+    var MOUSEENTER = "mouseenter";
+    var MOUSELEAVE = "mouseleave";
+    var SET = "set";
+    var SHAPE = "Shape";
+    var SPACE = " ";
+    var STAGE = "stage";
+    var TRANSFORM = "transform";
+    var UPPER_STAGE = "Stage";
+    var VISIBLE = "visible";
+    var TRANSFORM_CHANGE_STR = [
+      "xChange.konva",
+      "yChange.konva",
+      "scaleXChange.konva",
+      "scaleYChange.konva",
+      "skewXChange.konva",
+      "skewYChange.konva",
+      "rotationChange.konva",
+      "offsetXChange.konva",
+      "offsetYChange.konva",
+      "transformsEnabledChange.konva"
+    ].join(SPACE);
+    var idCounter = 1;
+    var Node = class _Node {
+      constructor(config) {
+        this._id = idCounter++;
+        this.eventListeners = {};
+        this.attrs = {};
+        this.index = 0;
+        this._allEventListeners = null;
+        this.parent = null;
+        this._cache = /* @__PURE__ */ new Map();
+        this._attachedDepsListeners = /* @__PURE__ */ new Map();
+        this._lastPos = null;
+        this._batchingTransformChange = false;
+        this._needClearTransformCache = false;
+        this._filterUpToDate = false;
+        this._isUnderCache = false;
+        this._dragEventId = null;
+        this._shouldFireChangeEvents = false;
+        this.setAttrs(config);
+        this._shouldFireChangeEvents = true;
+      }
+      hasChildren() {
+        return false;
+      }
+      _clearCache(attr) {
+        if ((attr === TRANSFORM || attr === ABSOLUTE_TRANSFORM) && this._cache.get(attr)) {
+          this._cache.get(attr).dirty = true;
+        } else if (attr) {
+          this._cache.delete(attr);
+        } else {
+          this._cache.clear();
+        }
+      }
+      _getCache(attr, privateGetter) {
+        let cache = this._cache.get(attr);
+        const isTransform = attr === TRANSFORM || attr === ABSOLUTE_TRANSFORM;
+        const invalid = cache === void 0 || isTransform && cache.dirty === true;
+        if (invalid) {
+          cache = privateGetter.call(this);
+          this._cache.set(attr, cache);
+        }
+        return cache;
+      }
+      _calculate(name, deps, getter) {
+        if (!this._attachedDepsListeners.get(name)) {
+          const depsString = deps.map((dep) => dep + "Change.konva").join(SPACE);
+          this.on(depsString, () => {
+            this._clearCache(name);
+          });
+          this._attachedDepsListeners.set(name, true);
+        }
+        return this._getCache(name, getter);
+      }
+      _getCanvasCache() {
+        return this._cache.get(CANVAS);
+      }
+      _clearSelfAndDescendantCache(attr) {
+        this._clearCache(attr);
+        if (attr === ABSOLUTE_TRANSFORM) {
+          this.fire("absoluteTransformChange");
+        }
+      }
+      clearCache() {
+        if (this._cache.has(CANVAS)) {
+          const { scene, filter, hit } = this._cache.get(CANVAS);
+          Util_1.Util.releaseCanvas(scene, filter, hit);
+          this._cache.delete(CANVAS);
+        }
+        this._clearSelfAndDescendantCache();
+        this._requestDraw();
+        return this;
+      }
+      cache(config) {
+        const conf = config || {};
+        let rect = {};
+        if (conf.x === void 0 || conf.y === void 0 || conf.width === void 0 || conf.height === void 0) {
+          rect = this.getClientRect({
+            skipTransform: true,
+            relativeTo: this.getParent() || void 0
+          });
+        }
+        let width = Math.ceil(conf.width || rect.width), height = Math.ceil(conf.height || rect.height), pixelRatio = conf.pixelRatio, x = conf.x === void 0 ? Math.floor(rect.x) : conf.x, y = conf.y === void 0 ? Math.floor(rect.y) : conf.y, offset = conf.offset || 0, drawBorder = conf.drawBorder || false, hitCanvasPixelRatio = conf.hitCanvasPixelRatio || 1;
+        if (!width || !height) {
+          Util_1.Util.error("Can not cache the node. Width or height of the node equals 0. Caching is skipped.");
+          return;
+        }
+        const extraPaddingX = Math.abs(Math.round(rect.x) - x) > 0.5 ? 1 : 0;
+        const extraPaddingY = Math.abs(Math.round(rect.y) - y) > 0.5 ? 1 : 0;
+        width += offset * 2 + extraPaddingX;
+        height += offset * 2 + extraPaddingY;
+        x -= offset;
+        y -= offset;
+        const cachedSceneCanvas = new Canvas_1.SceneCanvas({
+          pixelRatio,
+          width,
+          height
+        }), cachedFilterCanvas = new Canvas_1.SceneCanvas({
+          pixelRatio,
+          width: 0,
+          height: 0,
+          willReadFrequently: true
+        }), cachedHitCanvas = new Canvas_1.HitCanvas({
+          pixelRatio: hitCanvasPixelRatio,
+          width,
+          height
+        }), sceneContext = cachedSceneCanvas.getContext(), hitContext = cachedHitCanvas.getContext();
+        cachedHitCanvas.isCache = true;
+        cachedSceneCanvas.isCache = true;
+        this._cache.delete(CANVAS);
+        this._filterUpToDate = false;
+        if (conf.imageSmoothingEnabled === false) {
+          cachedSceneCanvas.getContext()._context.imageSmoothingEnabled = false;
+          cachedFilterCanvas.getContext()._context.imageSmoothingEnabled = false;
+        }
+        sceneContext.save();
+        hitContext.save();
+        sceneContext.translate(-x, -y);
+        hitContext.translate(-x, -y);
+        this._isUnderCache = true;
+        this._clearSelfAndDescendantCache(ABSOLUTE_OPACITY);
+        this._clearSelfAndDescendantCache(ABSOLUTE_SCALE);
+        this.drawScene(cachedSceneCanvas, this);
+        this.drawHit(cachedHitCanvas, this);
+        this._isUnderCache = false;
+        sceneContext.restore();
+        hitContext.restore();
+        if (drawBorder) {
+          sceneContext.save();
+          sceneContext.beginPath();
+          sceneContext.rect(0, 0, width, height);
+          sceneContext.closePath();
+          sceneContext.setAttr("strokeStyle", "red");
+          sceneContext.setAttr("lineWidth", 5);
+          sceneContext.stroke();
+          sceneContext.restore();
+        }
+        this._cache.set(CANVAS, {
+          scene: cachedSceneCanvas,
+          filter: cachedFilterCanvas,
+          hit: cachedHitCanvas,
+          x,
+          y
+        });
+        this._requestDraw();
+        return this;
+      }
+      isCached() {
+        return this._cache.has(CANVAS);
+      }
+      getClientRect(config) {
+        throw new Error('abstract "getClientRect" method call');
+      }
+      _transformedRect(rect, top) {
+        const points = [
+          { x: rect.x, y: rect.y },
+          { x: rect.x + rect.width, y: rect.y },
+          { x: rect.x + rect.width, y: rect.y + rect.height },
+          { x: rect.x, y: rect.y + rect.height }
+        ];
+        let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+        const trans = this.getAbsoluteTransform(top);
+        points.forEach(function(point) {
+          const transformed = trans.point(point);
+          if (minX === void 0) {
+            minX = maxX = transformed.x;
+            minY = maxY = transformed.y;
+          }
+          minX = Math.min(minX, transformed.x);
+          minY = Math.min(minY, transformed.y);
+          maxX = Math.max(maxX, transformed.x);
+          maxY = Math.max(maxY, transformed.y);
+        });
+        return {
+          x: minX,
+          y: minY,
+          width: maxX - minX,
+          height: maxY - minY
+        };
+      }
+      _drawCachedSceneCanvas(context) {
+        context.save();
+        context._applyOpacity(this);
+        context._applyGlobalCompositeOperation(this);
+        const canvasCache = this._getCanvasCache();
+        context.translate(canvasCache.x, canvasCache.y);
+        const cacheCanvas = this._getCachedSceneCanvas();
+        const ratio = cacheCanvas.pixelRatio;
+        context.drawImage(cacheCanvas._canvas, 0, 0, cacheCanvas.width / ratio, cacheCanvas.height / ratio);
+        context.restore();
+      }
+      _drawCachedHitCanvas(context) {
+        const canvasCache = this._getCanvasCache(), hitCanvas = canvasCache.hit;
+        context.save();
+        context.translate(canvasCache.x, canvasCache.y);
+        context.drawImage(hitCanvas._canvas, 0, 0, hitCanvas.width / hitCanvas.pixelRatio, hitCanvas.height / hitCanvas.pixelRatio);
+        context.restore();
+      }
+      _getCachedSceneCanvas() {
+        let filters = this.filters(), cachedCanvas = this._getCanvasCache(), sceneCanvas = cachedCanvas.scene, filterCanvas = cachedCanvas.filter, filterContext = filterCanvas.getContext(), len, imageData, n, filter;
+        if (filters) {
+          if (!this._filterUpToDate) {
+            const ratio = sceneCanvas.pixelRatio;
+            filterCanvas.setSize(sceneCanvas.width / sceneCanvas.pixelRatio, sceneCanvas.height / sceneCanvas.pixelRatio);
+            try {
+              len = filters.length;
+              filterContext.clear();
+              filterContext.drawImage(sceneCanvas._canvas, 0, 0, sceneCanvas.getWidth() / ratio, sceneCanvas.getHeight() / ratio);
+              imageData = filterContext.getImageData(0, 0, filterCanvas.getWidth(), filterCanvas.getHeight());
+              for (n = 0; n < len; n++) {
+                filter = filters[n];
+                if (typeof filter !== "function") {
+                  Util_1.Util.error("Filter should be type of function, but got " + typeof filter + " instead. Please check correct filters");
+                  continue;
+                }
+                filter.call(this, imageData);
+                filterContext.putImageData(imageData, 0, 0);
+              }
+            } catch (e) {
+              Util_1.Util.error("Unable to apply filter. " + e.message + " This post my help you https://konvajs.org/docs/posts/Tainted_Canvas.html.");
+            }
+            this._filterUpToDate = true;
+          }
+          return filterCanvas;
+        }
+        return sceneCanvas;
+      }
+      on(evtStr, handler) {
+        this._cache && this._cache.delete(ALL_LISTENERS);
+        if (arguments.length === 3) {
+          return this._delegate.apply(this, arguments);
+        }
+        let events = evtStr.split(SPACE), len = events.length, n, event, parts, baseEvent, name;
+        for (n = 0; n < len; n++) {
+          event = events[n];
+          parts = event.split(".");
+          baseEvent = parts[0];
+          name = parts[1] || "";
+          if (!this.eventListeners[baseEvent]) {
+            this.eventListeners[baseEvent] = [];
+          }
+          this.eventListeners[baseEvent].push({
+            name,
+            handler
+          });
+        }
+        return this;
+      }
+      off(evtStr, callback) {
+        let events = (evtStr || "").split(SPACE), len = events.length, n, t, event, parts, baseEvent, name;
+        this._cache && this._cache.delete(ALL_LISTENERS);
+        if (!evtStr) {
+          for (t in this.eventListeners) {
+            this._off(t);
+          }
+        }
+        for (n = 0; n < len; n++) {
+          event = events[n];
+          parts = event.split(".");
+          baseEvent = parts[0];
+          name = parts[1];
+          if (baseEvent) {
+            if (this.eventListeners[baseEvent]) {
+              this._off(baseEvent, name, callback);
+            }
+          } else {
+            for (t in this.eventListeners) {
+              this._off(t, name, callback);
+            }
+          }
+        }
+        return this;
+      }
+      dispatchEvent(evt) {
+        const e = {
+          target: this,
+          type: evt.type,
+          evt
+        };
+        this.fire(evt.type, e);
+        return this;
+      }
+      addEventListener(type, handler) {
+        this.on(type, function(evt) {
+          handler.call(this, evt.evt);
+        });
+        return this;
+      }
+      removeEventListener(type) {
+        this.off(type);
+        return this;
+      }
+      _delegate(event, selector, handler) {
+        const stopNode = this;
+        this.on(event, function(evt) {
+          const targets = evt.target.findAncestors(selector, true, stopNode);
+          for (let i = 0; i < targets.length; i++) {
+            evt = Util_1.Util.cloneObject(evt);
+            evt.currentTarget = targets[i];
+            handler.call(targets[i], evt);
+          }
+        });
+      }
+      remove() {
+        if (this.isDragging()) {
+          this.stopDrag();
+        }
+        DragAndDrop_1.DD._dragElements.delete(this._id);
+        this._remove();
+        return this;
+      }
+      _clearCaches() {
+        this._clearSelfAndDescendantCache(ABSOLUTE_TRANSFORM);
+        this._clearSelfAndDescendantCache(ABSOLUTE_OPACITY);
+        this._clearSelfAndDescendantCache(ABSOLUTE_SCALE);
+        this._clearSelfAndDescendantCache(STAGE);
+        this._clearSelfAndDescendantCache(VISIBLE);
+        this._clearSelfAndDescendantCache(LISTENING);
+      }
+      _remove() {
+        this._clearCaches();
+        const parent = this.getParent();
+        if (parent && parent.children) {
+          parent.children.splice(this.index, 1);
+          parent._setChildrenIndices();
+          this.parent = null;
+        }
+      }
+      destroy() {
+        this.remove();
+        this.clearCache();
+        return this;
+      }
+      getAttr(attr) {
+        const method = "get" + Util_1.Util._capitalize(attr);
+        if (Util_1.Util._isFunction(this[method])) {
+          return this[method]();
+        }
+        return this.attrs[attr];
+      }
+      getAncestors() {
+        let parent = this.getParent(), ancestors = [];
+        while (parent) {
+          ancestors.push(parent);
+          parent = parent.getParent();
+        }
+        return ancestors;
+      }
+      getAttrs() {
+        return this.attrs || {};
+      }
+      setAttrs(config) {
+        this._batchTransformChanges(() => {
+          let key, method;
+          if (!config) {
+            return this;
+          }
+          for (key in config) {
+            if (key === CHILDREN) {
+              continue;
+            }
+            method = SET + Util_1.Util._capitalize(key);
+            if (Util_1.Util._isFunction(this[method])) {
+              this[method](config[key]);
+            } else {
+              this._setAttr(key, config[key]);
+            }
+          }
+        });
+        return this;
+      }
+      isListening() {
+        return this._getCache(LISTENING, this._isListening);
+      }
+      _isListening(relativeTo) {
+        const listening = this.listening();
+        if (!listening) {
+          return false;
+        }
+        const parent = this.getParent();
+        if (parent && parent !== relativeTo && this !== relativeTo) {
+          return parent._isListening(relativeTo);
+        } else {
+          return true;
+        }
+      }
+      isVisible() {
+        return this._getCache(VISIBLE, this._isVisible);
+      }
+      _isVisible(relativeTo) {
+        const visible = this.visible();
+        if (!visible) {
+          return false;
+        }
+        const parent = this.getParent();
+        if (parent && parent !== relativeTo && this !== relativeTo) {
+          return parent._isVisible(relativeTo);
+        } else {
+          return true;
+        }
+      }
+      shouldDrawHit(top, skipDragCheck = false) {
+        if (top) {
+          return this._isVisible(top) && this._isListening(top);
+        }
+        const layer = this.getLayer();
+        let layerUnderDrag = false;
+        DragAndDrop_1.DD._dragElements.forEach((elem) => {
+          if (elem.dragStatus !== "dragging") {
+            return;
+          } else if (elem.node.nodeType === "Stage") {
+            layerUnderDrag = true;
+          } else if (elem.node.getLayer() === layer) {
+            layerUnderDrag = true;
+          }
+        });
+        const dragSkip = !skipDragCheck && !Global_1.Konva.hitOnDragEnabled && (layerUnderDrag || Global_1.Konva.isTransforming());
+        return this.isListening() && this.isVisible() && !dragSkip;
+      }
+      show() {
+        this.visible(true);
+        return this;
+      }
+      hide() {
+        this.visible(false);
+        return this;
+      }
+      getZIndex() {
+        return this.index || 0;
+      }
+      getAbsoluteZIndex() {
+        let depth = this.getDepth(), that = this, index = 0, nodes, len, n, child;
+        function addChildren(children) {
+          nodes = [];
+          len = children.length;
+          for (n = 0; n < len; n++) {
+            child = children[n];
+            index++;
+            if (child.nodeType !== SHAPE) {
+              nodes = nodes.concat(child.getChildren().slice());
+            }
+            if (child._id === that._id) {
+              n = len;
+            }
+          }
+          if (nodes.length > 0 && nodes[0].getDepth() <= depth) {
+            addChildren(nodes);
+          }
+        }
+        const stage = this.getStage();
+        if (that.nodeType !== UPPER_STAGE && stage) {
+          addChildren(stage.getChildren());
+        }
+        return index;
+      }
+      getDepth() {
+        let depth = 0, parent = this.parent;
+        while (parent) {
+          depth++;
+          parent = parent.parent;
+        }
+        return depth;
+      }
+      _batchTransformChanges(func) {
+        this._batchingTransformChange = true;
+        func();
+        this._batchingTransformChange = false;
+        if (this._needClearTransformCache) {
+          this._clearCache(TRANSFORM);
+          this._clearSelfAndDescendantCache(ABSOLUTE_TRANSFORM);
+        }
+        this._needClearTransformCache = false;
+      }
+      setPosition(pos) {
+        this._batchTransformChanges(() => {
+          this.x(pos.x);
+          this.y(pos.y);
+        });
+        return this;
+      }
+      getPosition() {
+        return {
+          x: this.x(),
+          y: this.y()
+        };
+      }
+      getRelativePointerPosition() {
+        const stage = this.getStage();
+        if (!stage) {
+          return null;
+        }
+        const pos = stage.getPointerPosition();
+        if (!pos) {
+          return null;
+        }
+        const transform = this.getAbsoluteTransform().copy();
+        transform.invert();
+        return transform.point(pos);
+      }
+      getAbsolutePosition(top) {
+        let haveCachedParent = false;
+        let parent = this.parent;
+        while (parent) {
+          if (parent.isCached()) {
+            haveCachedParent = true;
+            break;
+          }
+          parent = parent.parent;
+        }
+        if (haveCachedParent && !top) {
+          top = true;
+        }
+        const absoluteMatrix = this.getAbsoluteTransform(top).getMatrix(), absoluteTransform = new Util_1.Transform(), offset = this.offset();
+        absoluteTransform.m = absoluteMatrix.slice();
+        absoluteTransform.translate(offset.x, offset.y);
+        return absoluteTransform.getTranslation();
+      }
+      setAbsolutePosition(pos) {
+        const { x, y, ...origTrans } = this._clearTransform();
+        this.attrs.x = x;
+        this.attrs.y = y;
+        this._clearCache(TRANSFORM);
+        const it = this._getAbsoluteTransform().copy();
+        it.invert();
+        it.translate(pos.x, pos.y);
+        pos = {
+          x: this.attrs.x + it.getTranslation().x,
+          y: this.attrs.y + it.getTranslation().y
+        };
+        this._setTransform(origTrans);
+        this.setPosition({ x: pos.x, y: pos.y });
+        this._clearCache(TRANSFORM);
+        this._clearSelfAndDescendantCache(ABSOLUTE_TRANSFORM);
+        return this;
+      }
+      _setTransform(trans) {
+        let key;
+        for (key in trans) {
+          this.attrs[key] = trans[key];
+        }
+      }
+      _clearTransform() {
+        const trans = {
+          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()
+        };
+        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;
+        return trans;
+      }
+      move(change) {
+        let changeX = change.x, changeY = change.y, x = this.x(), y = this.y();
+        if (changeX !== void 0) {
+          x += changeX;
+        }
+        if (changeY !== void 0) {
+          y += changeY;
+        }
+        this.setPosition({ x, y });
+        return this;
+      }
+      _eachAncestorReverse(func, top) {
+        let family = [], parent = this.getParent(), len, n;
+        if (top && top._id === this._id) {
+          return;
+        }
+        family.unshift(this);
+        while (parent && (!top || parent._id !== top._id)) {
+          family.unshift(parent);
+          parent = parent.parent;
+        }
+        len = family.length;
+        for (n = 0; n < len; n++) {
+          func(family[n]);
+        }
+      }
+      rotate(theta) {
+        this.rotation(this.rotation() + theta);
+        return this;
+      }
+      moveToTop() {
+        if (!this.parent) {
+          Util_1.Util.warn("Node has no parent. moveToTop function is ignored.");
+          return false;
+        }
+        const index = this.index, len = this.parent.getChildren().length;
+        if (index < len - 1) {
+          this.parent.children.splice(index, 1);
+          this.parent.children.push(this);
+          this.parent._setChildrenIndices();
+          return true;
+        }
+        return false;
+      }
+      moveUp() {
+        if (!this.parent) {
+          Util_1.Util.warn("Node has no parent. moveUp function is ignored.");
+          return false;
+        }
+        const index = this.index, len = this.parent.getChildren().length;
+        if (index < len - 1) {
+          this.parent.children.splice(index, 1);
+          this.parent.children.splice(index + 1, 0, this);
+          this.parent._setChildrenIndices();
+          return true;
+        }
+        return false;
+      }
+      moveDown() {
+        if (!this.parent) {
+          Util_1.Util.warn("Node has no parent. moveDown function is ignored.");
+          return false;
+        }
+        const index = this.index;
+        if (index > 0) {
+          this.parent.children.splice(index, 1);
+          this.parent.children.splice(index - 1, 0, this);
+          this.parent._setChildrenIndices();
+          return true;
+        }
+        return false;
+      }
+      moveToBottom() {
+        if (!this.parent) {
+          Util_1.Util.warn("Node has no parent. moveToBottom function is ignored.");
+          return false;
+        }
+        const index = this.index;
+        if (index > 0) {
+          this.parent.children.splice(index, 1);
+          this.parent.children.unshift(this);
+          this.parent._setChildrenIndices();
+          return true;
+        }
+        return false;
+      }
+      setZIndex(zIndex) {
+        if (!this.parent) {
+          Util_1.Util.warn("Node has no parent. zIndex parameter is ignored.");
+          return this;
+        }
+        if (zIndex < 0 || zIndex >= this.parent.children.length) {
+          Util_1.Util.warn("Unexpected value " + zIndex + " 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 index = this.index;
+        this.parent.children.splice(index, 1);
+        this.parent.children.splice(zIndex, 0, this);
+        this.parent._setChildrenIndices();
+        return this;
+      }
+      getAbsoluteOpacity() {
+        return this._getCache(ABSOLUTE_OPACITY, this._getAbsoluteOpacity);
+      }
+      _getAbsoluteOpacity() {
+        let absOpacity = this.opacity();
+        const parent = this.getParent();
+        if (parent && !parent._isUnderCache) {
+          absOpacity *= parent.getAbsoluteOpacity();
+        }
+        return absOpacity;
+      }
+      moveTo(newContainer) {
+        if (this.getParent() !== newContainer) {
+          this._remove();
+          newContainer.add(this);
+        }
+        return this;
+      }
+      toObject() {
+        let attrs = this.getAttrs(), key, val, getter, defaultValue, nonPlainObject;
+        const obj = {
+          attrs: {},
+          className: this.getClassName()
+        };
+        for (key in attrs) {
+          val = attrs[key];
+          nonPlainObject = Util_1.Util.isObject(val) && !Util_1.Util._isPlainObject(val) && !Util_1.Util._isArray(val);
+          if (nonPlainObject) {
+            continue;
+          }
+          getter = typeof this[key] === "function" && this[key];
+          delete attrs[key];
+          defaultValue = getter ? getter.call(this) : null;
+          attrs[key] = val;
+          if (defaultValue !== val) {
+            obj.attrs[key] = val;
+          }
+        }
+        return Util_1.Util._prepareToStringify(obj);
+      }
+      toJSON() {
+        return JSON.stringify(this.toObject());
+      }
+      getParent() {
+        return this.parent;
+      }
+      findAncestors(selector, includeSelf, stopNode) {
+        const res = [];
+        if (includeSelf && this._isMatch(selector)) {
+          res.push(this);
+        }
+        let ancestor = this.parent;
+        while (ancestor) {
+          if (ancestor === stopNode) {
+            return res;
+          }
+          if (ancestor._isMatch(selector)) {
+            res.push(ancestor);
+          }
+          ancestor = ancestor.parent;
+        }
+        return res;
+      }
+      isAncestorOf(node) {
+        return false;
+      }
+      findAncestor(selector, includeSelf, stopNode) {
+        return this.findAncestors(selector, includeSelf, stopNode)[0];
+      }
+      _isMatch(selector) {
+        if (!selector) {
+          return false;
+        }
+        if (typeof selector === "function") {
+          return selector(this);
+        }
+        let selectorArr = selector.replace(/ /g, "").split(","), len = selectorArr.length, n, sel;
+        for (n = 0; n < len; n++) {
+          sel = selectorArr[n];
+          if (!Util_1.Util.isValidSelector(sel)) {
+            Util_1.Util.warn('Selector "' + sel + '" is invalid. Allowed selectors examples are "#foo", ".bar" or "Group".');
+            Util_1.Util.warn('If you have a custom shape with such className, please change it to start with upper letter like "Triangle".');
+            Util_1.Util.warn("Konva is awesome, right?");
+          }
+          if (sel.charAt(0) === "#") {
+            if (this.id() === sel.slice(1)) {
+              return true;
+            }
+          } else if (sel.charAt(0) === ".") {
+            if (this.hasName(sel.slice(1))) {
+              return true;
+            }
+          } else if (this.className === sel || this.nodeType === sel) {
+            return true;
+          }
+        }
+        return false;
+      }
+      getLayer() {
+        const parent = this.getParent();
+        return parent ? parent.getLayer() : null;
+      }
+      getStage() {
+        return this._getCache(STAGE, this._getStage);
+      }
+      _getStage() {
+        const parent = this.getParent();
+        if (parent) {
+          return parent.getStage();
+        } else {
+          return null;
+        }
+      }
+      fire(eventType, evt = {}, bubble) {
+        evt.target = evt.target || this;
+        if (bubble) {
+          this._fireAndBubble(eventType, evt);
+        } else {
+          this._fire(eventType, evt);
+        }
+        return this;
+      }
+      getAbsoluteTransform(top) {
+        if (top) {
+          return this._getAbsoluteTransform(top);
+        } else {
+          return this._getCache(ABSOLUTE_TRANSFORM, this._getAbsoluteTransform);
+        }
+      }
+      _getAbsoluteTransform(top) {
+        let at;
+        if (top) {
+          at = new Util_1.Transform();
+          this._eachAncestorReverse(function(node) {
+            const transformsEnabled = node.transformsEnabled();
+            if (transformsEnabled === "all") {
+              at.multiply(node.getTransform());
+            } else if (transformsEnabled === "position") {
+              at.translate(node.x() - node.offsetX(), node.y() - node.offsetY());
+            }
+          }, top);
+          return at;
+        } else {
+          at = this._cache.get(ABSOLUTE_TRANSFORM) || new Util_1.Transform();
+          if (this.parent) {
+            this.parent.getAbsoluteTransform().copyInto(at);
+          } else {
+            at.reset();
+          }
+          const transformsEnabled = this.transformsEnabled();
+          if (transformsEnabled === "all") {
+            at.multiply(this.getTransform());
+          } else if (transformsEnabled === "position") {
+            const x = this.attrs.x || 0;
+            const y = this.attrs.y || 0;
+            const offsetX = this.attrs.offsetX || 0;
+            const offsetY = this.attrs.offsetY || 0;
+            at.translate(x - offsetX, y - offsetY);
+          }
+          at.dirty = false;
+          return at;
+        }
+      }
+      getAbsoluteScale(top) {
+        let parent = this;
+        while (parent) {
+          if (parent._isUnderCache) {
+            top = parent;
+          }
+          parent = parent.getParent();
+        }
+        const transform = this.getAbsoluteTransform(top);
+        const attrs = transform.decompose();
+        return {
+          x: attrs.scaleX,
+          y: attrs.scaleY
+        };
+      }
+      getAbsoluteRotation() {
+        return this.getAbsoluteTransform().decompose().rotation;
+      }
+      getTransform() {
+        return this._getCache(TRANSFORM, this._getTransform);
+      }
+      _getTransform() {
+        var _a, _b;
+        const m = this._cache.get(TRANSFORM) || new Util_1.Transform();
+        m.reset();
+        const x = this.x(), y = this.y(), rotation = Global_1.Konva.getAngle(this.rotation()), scaleX = (_a = this.attrs.scaleX) !== null && _a !== void 0 ? _a : 1, scaleY = (_b = this.attrs.scaleY) !== null && _b !== void 0 ? _b : 1, skewX = this.attrs.skewX || 0, skewY = this.attrs.skewY || 0, offsetX = this.attrs.offsetX || 0, offsetY = this.attrs.offsetY || 0;
+        if (x !== 0 || y !== 0) {
+          m.translate(x, y);
+        }
+        if (rotation !== 0) {
+          m.rotate(rotation);
+        }
+        if (skewX !== 0 || skewY !== 0) {
+          m.skew(skewX, skewY);
+        }
+        if (scaleX !== 1 || scaleY !== 1) {
+          m.scale(scaleX, scaleY);
+        }
+        if (offsetX !== 0 || offsetY !== 0) {
+          m.translate(-1 * offsetX, -1 * offsetY);
+        }
+        m.dirty = false;
+        return m;
+      }
+      clone(obj) {
+        let attrs = Util_1.Util.cloneObject(this.attrs), key, allListeners, len, n, listener;
+        for (key in obj) {
+          attrs[key] = obj[key];
+        }
+        const node = new this.constructor(attrs);
+        for (key in this.eventListeners) {
+          allListeners = this.eventListeners[key];
+          len = allListeners.length;
+          for (n = 0; n < len; n++) {
+            listener = allListeners[n];
+            if (listener.name.indexOf(KONVA) < 0) {
+              if (!node.eventListeners[key]) {
+                node.eventListeners[key] = [];
+              }
+              node.eventListeners[key].push(listener);
+            }
+          }
+        }
+        return node;
+      }
+      _toKonvaCanvas(config) {
+        config = config || {};
+        const box = this.getClientRect();
+        const stage = this.getStage(), x = config.x !== void 0 ? config.x : Math.floor(box.x), y = config.y !== void 0 ? config.y : Math.floor(box.y), pixelRatio = config.pixelRatio || 1, canvas = new Canvas_1.SceneCanvas({
+          width: config.width || Math.ceil(box.width) || (stage ? stage.width() : 0),
+          height: config.height || Math.ceil(box.height) || (stage ? stage.height() : 0),
+          pixelRatio
+        }), context = canvas.getContext();
+        const bufferCanvas = new Canvas_1.SceneCanvas({
+          width: canvas.width / canvas.pixelRatio + Math.abs(x),
+          height: canvas.height / canvas.pixelRatio + Math.abs(y),
+          pixelRatio: canvas.pixelRatio
+        });
+        if (config.imageSmoothingEnabled === false) {
+          context._context.imageSmoothingEnabled = false;
+        }
+        context.save();
+        if (x || y) {
+          context.translate(-1 * x, -1 * y);
+        }
+        this.drawScene(canvas, void 0, bufferCanvas);
+        context.restore();
+        return canvas;
+      }
+      toCanvas(config) {
+        return this._toKonvaCanvas(config)._canvas;
+      }
+      toDataURL(config) {
+        config = config || {};
+        const mimeType = config.mimeType || null, quality = config.quality || null;
+        const url = this._toKonvaCanvas(config).toDataURL(mimeType, quality);
+        if (config.callback) {
+          config.callback(url);
+        }
+        return url;
+      }
+      toImage(config) {
+        return new Promise((resolve, reject) => {
+          try {
+            const callback = config === null || config === void 0 ? void 0 : config.callback;
+            if (callback)
+              delete config.callback;
+            Util_1.Util._urlToImage(this.toDataURL(config), function(img) {
+              resolve(img);
+              callback === null || callback === void 0 ? void 0 : callback(img);
+            });
+          } catch (err) {
+            reject(err);
+          }
+        });
+      }
+      toBlob(config) {
+        return new Promise((resolve, reject) => {
+          try {
+            const callback = config === null || config === void 0 ? void 0 : config.callback;
+            if (callback)
+              delete config.callback;
+            this.toCanvas(config).toBlob((blob) => {
+              resolve(blob);
+              callback === null || callback === void 0 ? void 0 : callback(blob);
+            }, config === null || config === void 0 ? void 0 : config.mimeType, config === null || config === void 0 ? void 0 : config.quality);
+          } catch (err) {
+            reject(err);
+          }
+        });
+      }
+      setSize(size) {
+        this.width(size.width);
+        this.height(size.height);
+        return this;
+      }
+      getSize() {
+        return {
+          width: this.width(),
+          height: this.height()
+        };
+      }
+      getClassName() {
+        return this.className || this.nodeType;
+      }
+      getType() {
+        return this.nodeType;
+      }
+      getDragDistance() {
+        if (this.attrs.dragDistance !== void 0) {
+          return this.attrs.dragDistance;
+        } else if (this.parent) {
+          return this.parent.getDragDistance();
+        } else {
+          return Global_1.Konva.dragDistance;
+        }
+      }
+      _off(type, name, callback) {
+        let evtListeners = this.eventListeners[type], i, evtName, handler;
+        for (i = 0; i < evtListeners.length; i++) {
+          evtName = evtListeners[i].name;
+          handler = evtListeners[i].handler;
+          if ((evtName !== "konva" || name === "konva") && (!name || evtName === name) && (!callback || callback === handler)) {
+            evtListeners.splice(i, 1);
+            if (evtListeners.length === 0) {
+              delete this.eventListeners[type];
+              break;
+            }
+            i--;
+          }
+        }
+      }
+      _fireChangeEvent(attr, oldVal, newVal) {
+        this._fire(attr + CHANGE, {
+          oldVal,
+          newVal
+        });
+      }
+      addName(name) {
+        if (!this.hasName(name)) {
+          const oldName = this.name();
+          const newName = oldName ? oldName + " " + name : name;
+          this.name(newName);
+        }
+        return this;
+      }
+      hasName(name) {
+        if (!name) {
+          return false;
+        }
+        const fullName = this.name();
+        if (!fullName) {
+          return false;
+        }
+        const names = (fullName || "").split(/\s/g);
+        return names.indexOf(name) !== -1;
+      }
+      removeName(name) {
+        const names = (this.name() || "").split(/\s/g);
+        const index = names.indexOf(name);
+        if (index !== -1) {
+          names.splice(index, 1);
+          this.name(names.join(" "));
+        }
+        return this;
+      }
+      setAttr(attr, val) {
+        const func = this[SET + Util_1.Util._capitalize(attr)];
+        if (Util_1.Util._isFunction(func)) {
+          func.call(this, val);
+        } else {
+          this._setAttr(attr, val);
+        }
+        return this;
+      }
+      _requestDraw() {
+        if (Global_1.Konva.autoDrawEnabled) {
+          const drawNode = this.getLayer() || this.getStage();
+          drawNode === null || drawNode === void 0 ? void 0 : drawNode.batchDraw();
+        }
+      }
+      _setAttr(key, val) {
+        const oldVal = this.attrs[key];
+        if (oldVal === val && !Util_1.Util.isObject(val)) {
+          return;
+        }
+        if (val === void 0 || val === null) {
+          delete this.attrs[key];
+        } else {
+          this.attrs[key] = val;
+        }
+        if (this._shouldFireChangeEvents) {
+          this._fireChangeEvent(key, oldVal, val);
+        }
+        this._requestDraw();
+      }
+      _setComponentAttr(key, component, val) {
+        let oldVal;
+        if (val !== void 0) {
+          oldVal = this.attrs[key];
+          if (!oldVal) {
+            this.attrs[key] = this.getAttr(key);
+          }
+          this.attrs[key][component] = val;
+          this._fireChangeEvent(key, oldVal, val);
+        }
+      }
+      _fireAndBubble(eventType, evt, compareShape) {
+        if (evt && this.nodeType === SHAPE) {
+          evt.target = this;
+        }
+        const shouldStop = (eventType === MOUSEENTER || eventType === MOUSELEAVE) && (compareShape && (this === compareShape || this.isAncestorOf && this.isAncestorOf(compareShape)) || this.nodeType === "Stage" && !compareShape);
+        if (!shouldStop) {
+          this._fire(eventType, evt);
+          const stopBubble = (eventType === MOUSEENTER || eventType === MOUSELEAVE) && compareShape && compareShape.isAncestorOf && compareShape.isAncestorOf(this) && !compareShape.isAncestorOf(this.parent);
+          if ((evt && !evt.cancelBubble || !evt) && this.parent && this.parent.isListening() && !stopBubble) {
+            if (compareShape && compareShape.parent) {
+              this._fireAndBubble.call(this.parent, eventType, evt, compareShape);
+            } else {
+              this._fireAndBubble.call(this.parent, eventType, evt);
+            }
+          }
+        }
+      }
+      _getProtoListeners(eventType) {
+        var _a, _b, _c;
+        const allListeners = (_a = this._cache.get(ALL_LISTENERS)) !== null && _a !== void 0 ? _a : {};
+        let events = allListeners === null || allListeners === void 0 ? void 0 : allListeners[eventType];
+        if (events === void 0) {
+          events = [];
+          let obj = Object.getPrototypeOf(this);
+          while (obj) {
+            const hierarchyEvents = (_c = (_b = obj.eventListeners) === null || _b === void 0 ? void 0 : _b[eventType]) !== null && _c !== void 0 ? _c : [];
+            events.push(...hierarchyEvents);
+            obj = Object.getPrototypeOf(obj);
+          }
+          allListeners[eventType] = events;
+          this._cache.set(ALL_LISTENERS, allListeners);
+        }
+        return events;
+      }
+      _fire(eventType, evt) {
+        evt = evt || {};
+        evt.currentTarget = this;
+        evt.type = eventType;
+        const topListeners = this._getProtoListeners(eventType);
+        if (topListeners) {
+          for (var i = 0; i < topListeners.length; i++) {
+            topListeners[i].handler.call(this, evt);
+          }
+        }
+        const selfListeners = this.eventListeners[eventType];
+        if (selfListeners) {
+          for (var i = 0; i < selfListeners.length; i++) {
+            selfListeners[i].handler.call(this, evt);
+          }
+        }
+      }
+      draw() {
+        this.drawScene();
+        this.drawHit();
+        return this;
+      }
+      _createDragElement(evt) {
+        const pointerId = evt ? evt.pointerId : void 0;
+        const stage = this.getStage();
+        const ap = this.getAbsolutePosition();
+        if (!stage) {
+          return;
+        }
+        const pos = stage._getPointerById(pointerId) || stage._changedPointerPositions[0] || ap;
+        DragAndDrop_1.DD._dragElements.set(this._id, {
+          node: this,
+          startPointerPos: pos,
+          offset: {
+            x: pos.x - ap.x,
+            y: pos.y - ap.y
+          },
+          dragStatus: "ready",
+          pointerId
+        });
+      }
+      startDrag(evt, bubbleEvent = true) {
+        if (!DragAndDrop_1.DD._dragElements.has(this._id)) {
+          this._createDragElement(evt);
+        }
+        const elem = DragAndDrop_1.DD._dragElements.get(this._id);
+        elem.dragStatus = "dragging";
+        this.fire("dragstart", {
+          type: "dragstart",
+          target: this,
+          evt: evt && evt.evt
+        }, bubbleEvent);
+      }
+      _setDragPosition(evt, elem) {
+        const pos = this.getStage()._getPointerById(elem.pointerId);
+        if (!pos) {
+          return;
+        }
+        let newNodePos = {
+          x: pos.x - elem.offset.x,
+          y: pos.y - elem.offset.y
+        };
+        const dbf = this.dragBoundFunc();
+        if (dbf !== void 0) {
+          const bounded = dbf.call(this, newNodePos, evt);
+          if (!bounded) {
+            Util_1.Util.warn("dragBoundFunc did not return any value. That is unexpected behavior. You must return new absolute position from dragBoundFunc.");
+          } else {
+            newNodePos = bounded;
+          }
+        }
+        if (!this._lastPos || this._lastPos.x !== newNodePos.x || this._lastPos.y !== newNodePos.y) {
+          this.setAbsolutePosition(newNodePos);
+          this._requestDraw();
+        }
+        this._lastPos = newNodePos;
+      }
+      stopDrag(evt) {
+        const elem = DragAndDrop_1.DD._dragElements.get(this._id);
+        if (elem) {
+          elem.dragStatus = "stopped";
+        }
+        DragAndDrop_1.DD._endDragBefore(evt);
+        DragAndDrop_1.DD._endDragAfter(evt);
+      }
+      setDraggable(draggable) {
+        this._setAttr("draggable", draggable);
+        this._dragChange();
+      }
+      isDragging() {
+        const elem = DragAndDrop_1.DD._dragElements.get(this._id);
+        return elem ? elem.dragStatus === "dragging" : false;
+      }
+      _listenDrag() {
+        this._dragCleanup();
+        this.on("mousedown.konva touchstart.konva", function(evt) {
+          const shouldCheckButton = evt.evt["button"] !== void 0;
+          const canDrag = !shouldCheckButton || Global_1.Konva.dragButtons.indexOf(evt.evt["button"]) >= 0;
+          if (!canDrag) {
+            return;
+          }
+          if (this.isDragging()) {
+            return;
+          }
+          let hasDraggingChild = false;
+          DragAndDrop_1.DD._dragElements.forEach((elem) => {
+            if (this.isAncestorOf(elem.node)) {
+              hasDraggingChild = true;
+            }
+          });
+          if (!hasDraggingChild) {
+            this._createDragElement(evt);
+          }
+        });
+      }
+      _dragChange() {
+        if (this.attrs.draggable) {
+          this._listenDrag();
+        } else {
+          this._dragCleanup();
+          const stage = this.getStage();
+          if (!stage) {
+            return;
+          }
+          const dragElement = DragAndDrop_1.DD._dragElements.get(this._id);
+          const isDragging = dragElement && dragElement.dragStatus === "dragging";
+          const isReady = dragElement && dragElement.dragStatus === "ready";
+          if (isDragging) {
+            this.stopDrag();
+          } else if (isReady) {
+            DragAndDrop_1.DD._dragElements.delete(this._id);
+          }
+        }
+      }
+      _dragCleanup() {
+        this.off("mousedown.konva");
+        this.off("touchstart.konva");
+      }
+      isClientRectOnScreen(margin = { x: 0, y: 0 }) {
+        const stage = this.getStage();
+        if (!stage) {
+          return false;
+        }
+        const screenRect = {
+          x: -margin.x,
+          y: -margin.y,
+          width: stage.width() + 2 * margin.x,
+          height: stage.height() + 2 * margin.y
+        };
+        return Util_1.Util.haveIntersection(screenRect, this.getClientRect());
+      }
+      static create(data, container) {
+        if (Util_1.Util._isString(data)) {
+          data = JSON.parse(data);
+        }
+        return this._createNode(data, container);
+      }
+      static _createNode(obj, container) {
+        let className = _Node.prototype.getClassName.call(obj), children = obj.children, no, len, n;
+        if (container) {
+          obj.attrs.container = container;
+        }
+        if (!Global_1.Konva[className]) {
+          Util_1.Util.warn('Can not find a node with class name "' + className + '". Fallback to "Shape".');
+          className = "Shape";
+        }
+        const Class = Global_1.Konva[className];
+        no = new Class(obj.attrs);
+        if (children) {
+          len = children.length;
+          for (n = 0; n < len; n++) {
+            no.add(_Node._createNode(children[n]));
+          }
+        }
+        return no;
+      }
+    };
+    exports.Node = Node;
+    Node.prototype.nodeType = "Node";
+    Node.prototype._attrsAffectingSize = [];
+    Node.prototype.eventListeners = {};
+    Node.prototype.on.call(Node.prototype, TRANSFORM_CHANGE_STR, function() {
+      if (this._batchingTransformChange) {
+        this._needClearTransformCache = true;
+        return;
+      }
+      this._clearCache(TRANSFORM);
+      this._clearSelfAndDescendantCache(ABSOLUTE_TRANSFORM);
+    });
+    Node.prototype.on.call(Node.prototype, "visibleChange.konva", function() {
+      this._clearSelfAndDescendantCache(VISIBLE);
+    });
+    Node.prototype.on.call(Node.prototype, "listeningChange.konva", function() {
+      this._clearSelfAndDescendantCache(LISTENING);
+    });
+    Node.prototype.on.call(Node.prototype, "opacityChange.konva", function() {
+      this._clearSelfAndDescendantCache(ABSOLUTE_OPACITY);
+    });
+    var addGetterSetter = Factory_1.Factory.addGetterSetter;
+    addGetterSetter(Node, "zIndex");
+    addGetterSetter(Node, "absolutePosition");
+    addGetterSetter(Node, "position");
+    addGetterSetter(Node, "x", 0, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "y", 0, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "globalCompositeOperation", "source-over", (0, Validators_1.getStringValidator)());
+    addGetterSetter(Node, "opacity", 1, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "name", "", (0, Validators_1.getStringValidator)());
+    addGetterSetter(Node, "id", "", (0, Validators_1.getStringValidator)());
+    addGetterSetter(Node, "rotation", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addComponentsGetterSetter(Node, "scale", ["x", "y"]);
+    addGetterSetter(Node, "scaleX", 1, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "scaleY", 1, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addComponentsGetterSetter(Node, "skew", ["x", "y"]);
+    addGetterSetter(Node, "skewX", 0, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "skewY", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addComponentsGetterSetter(Node, "offset", ["x", "y"]);
+    addGetterSetter(Node, "offsetX", 0, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "offsetY", 0, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "dragDistance", null, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "width", 0, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "height", 0, (0, Validators_1.getNumberValidator)());
+    addGetterSetter(Node, "listening", true, (0, Validators_1.getBooleanValidator)());
+    addGetterSetter(Node, "preventDefault", true, (0, Validators_1.getBooleanValidator)());
+    addGetterSetter(Node, "filters", null, function(val) {
+      this._filterUpToDate = false;
+      return val;
+    });
+    addGetterSetter(Node, "visible", true, (0, Validators_1.getBooleanValidator)());
+    addGetterSetter(Node, "transformsEnabled", "all", (0, Validators_1.getStringValidator)());
+    addGetterSetter(Node, "size");
+    addGetterSetter(Node, "dragBoundFunc");
+    addGetterSetter(Node, "draggable", false, (0, Validators_1.getBooleanValidator)());
+    Factory_1.Factory.backCompat(Node, {
+      rotateDeg: "rotate",
+      setRotationDeg: "setRotation",
+      getRotationDeg: "getRotation"
+    });
+  }
+});
 
 // node_modules/konva/lib/Container.js
@@ -42 +3249 @@
         }
         const children = this.children || [];
-        var results = [];
+        const results = [];
         children.forEach(function(child) {
           if (filterFunc(child)) {
@@ -78 +3285 @@
         }
         if (children.length > 1) {
-          for (var i = 0; i < children.length; i++) {
+          for (let i = 0; i < children.length; i++) {
             this.add(children[i]);
           }
@@ -110 +3317 @@
       }
       findOne(selector) {
-        var result = this._generalFind(selector, true);
+        const result = this._generalFind(selector, true);
         return result.length > 0 ? result[0] : void 0;
       }
       _generalFind(selector, findOne) {
-        var retArr = [];
+        const retArr = [];
         this._descendants((node) => {
           const valid = node._isMatch(selector);
@@ -146 +3353 @@
       }
       toObject() {
-        var obj = Node_1.Node.prototype.toObject.call(this);
+        const obj = Node_1.Node.prototype.toObject.call(this);
         obj.children = [];
         this.getChildren().forEach((child) => {
@@ -154 +3361 @@
       }
       isAncestorOf(node) {
-        var parent = node.getParent();
+        let parent = node.getParent();
         while (parent) {
           if (parent._id === this._id) {
@@ -164 +3371 @@
       }
       clone(obj) {
-        var node = Node_1.Node.prototype.clone.call(this, obj);
+        const node = Node_1.Node.prototype.clone.call(this, obj);
         this.getChildren().forEach(function(no) {
           node.add(no.clone());
@@ -171 +3378 @@
       }
       getAllIntersections(pos) {
-        var arr = [];
+        const arr = [];
         this.find("Shape").forEach((shape) => {
           if (shape.isVisible() && shape.intersects(pos)) {
@@ -197 +3404 @@
       }
       drawScene(can, top, bufferCanvas) {
-        var layer = this.getLayer(), canvas = can || layer && layer.getCanvas(), context = canvas && canvas.getContext(), cachedCanvas = this._getCanvasCache(), cachedSceneCanvas = cachedCanvas && cachedCanvas.scene;
-        var caching = canvas && canvas.isCache;
+        const layer = this.getLayer(), canvas = can || layer && layer.getCanvas(), context = canvas && canvas.getContext(), cachedCanvas = this._getCanvasCache(), cachedSceneCanvas = cachedCanvas && cachedCanvas.scene;
+        const caching = canvas && canvas.isCache;
         if (!this.isVisible() && !caching) {
           return this;
@@ -204 +3411 @@
         if (cachedSceneCanvas) {
           context.save();
-          var m = this.getAbsoluteTransform(top).getMatrix();
+          const m = this.getAbsoluteTransform(top).getMatrix();
           context.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
           this._drawCachedSceneCanvas(context);
@@ -217 +3424 @@
           return this;
         }
-        var layer = this.getLayer(), canvas = can || layer && layer.hitCanvas, context = canvas && canvas.getContext(), cachedCanvas = this._getCanvasCache(), cachedHitCanvas = cachedCanvas && cachedCanvas.hit;
+        const layer = this.getLayer(), canvas = can || layer && layer.hitCanvas, context = canvas && canvas.getContext(), cachedCanvas = this._getCanvasCache(), cachedHitCanvas = cachedCanvas && cachedCanvas.hit;
         if (cachedHitCanvas) {
           context.save();
-          var m = this.getAbsoluteTransform(top).getMatrix();
+          const m = this.getAbsoluteTransform(top).getMatrix();
           context.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
           this._drawCachedHitCanvas(context);
@@ -231 +3438 @@
       _drawChildren(drawMethod, canvas, top, bufferCanvas) {
         var _a;
-        var context = canvas && canvas.getContext(), clipWidth = this.clipWidth(), clipHeight = this.clipHeight(), clipFunc = this.clipFunc(), hasClip = typeof clipWidth === "number" && typeof clipHeight === "number" || clipFunc;
+        const context = canvas && canvas.getContext(), clipWidth = this.clipWidth(), clipHeight = this.clipHeight(), clipFunc = this.clipFunc(), hasClip = typeof clipWidth === "number" && typeof clipHeight === "number" || clipFunc;
         const selfCache = top === this;
         if (hasClip) {
           context.save();
-          var transform = this.getAbsoluteTransform(top);
-          var m = transform.getMatrix();
+          const transform = this.getAbsoluteTransform(top);
+          let m = transform.getMatrix();
           context.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
           context.beginPath();
@@ -243 +3450 @@
             clipArgs = clipFunc.call(this, context, this);
           } else {
-            var clipX = this.clipX();
-            var clipY = this.clipY();
+            const clipX = this.clipX();
+            const clipY = this.clipY();
             context.rect(clipX || 0, clipY || 0, clipWidth, clipHeight);
           }
@@ -251 +3458 @@
           context.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
         }
-        var hasComposition = !selfCache && this.globalCompositeOperation() !== "source-over" && drawMethod === "drawScene";
+        const hasComposition = !selfCache && this.globalCompositeOperation() !== "source-over" && drawMethod === "drawScene";
         if (hasComposition) {
           context.save();
@@ -268 +3475 @@
       getClientRect(config = {}) {
         var _a;
-        var skipTransform = config.skipTransform;
-        var relativeTo = config.relativeTo;
-        var minX, minY, maxX, maxY;
-        var selfRect = {
+        const skipTransform = config.skipTransform;
+        const relativeTo = config.relativeTo;
+        let minX, minY, maxX, maxY;
+        let selfRect = {
           x: Infinity,
           y: Infinity,
@@ -277 +3484 @@
           height: 0
         };
-        var that = this;
+        const that = this;
         (_a = this.children) === null || _a === void 0 ? void 0 : _a.forEach(function(child) {
           if (!child.visible()) {
             return;
           }
-          var rect = child.getClientRect({
+          const rect = child.getClientRect({
             relativeTo: that,
             skipShadow: config.skipShadow,
@@ -302 +3509 @@
           }
         });
-        var shapes = this.find("Shape");
-        var hasVisible = false;
-        for (var i = 0; i < shapes.length; i++) {
-          var shape = shapes[i];
+        const shapes = this.find("Shape");
+        let hasVisible = false;
+        for (let i = 0; i < shapes.length; i++) {
+          const shape = shapes[i];
           if (shape._isVisible(this)) {
             hasVisible = true;
@@ -344 +3551 @@
     Factory_1.Factory.addGetterSetter(Container, "clipHeight", void 0, (0, Validators_1.getNumberValidator)());
     Factory_1.Factory.addGetterSetter(Container, "clipFunc");
+  }
+});
+
+// node_modules/konva/lib/PointerEvents.js
+var require_PointerEvents = __commonJS({
+  "node_modules/konva/lib/PointerEvents.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.getCapturedShape = getCapturedShape;
+    exports.createEvent = createEvent;
+    exports.hasPointerCapture = hasPointerCapture;
+    exports.setPointerCapture = setPointerCapture;
+    exports.releaseCapture = releaseCapture;
+    var Global_1 = require_Global();
+    var Captures = /* @__PURE__ */ new Map();
+    var SUPPORT_POINTER_EVENTS = Global_1.Konva._global["PointerEvent"] !== void 0;
+    function getCapturedShape(pointerId) {
+      return Captures.get(pointerId);
+    }
+    function createEvent(evt) {
+      return {
+        evt,
+        pointerId: evt.pointerId
+      };
+    }
+    function hasPointerCapture(pointerId, shape) {
+      return Captures.get(pointerId) === shape;
+    }
+    function setPointerCapture(pointerId, shape) {
+      releaseCapture(pointerId);
+      const stage = shape.getStage();
+      if (!stage)
+        return;
+      Captures.set(pointerId, shape);
+      if (SUPPORT_POINTER_EVENTS) {
+        shape._fire("gotpointercapture", createEvent(new PointerEvent("gotpointercapture")));
+      }
+    }
+    function releaseCapture(pointerId, target) {
+      const shape = Captures.get(pointerId);
+      if (!shape)
+        return;
+      const stage = shape.getStage();
+      if (stage && stage.content) {
+      }
+      Captures.delete(pointerId);
+      if (SUPPORT_POINTER_EVENTS) {
+        shape._fire("lostpointercapture", createEvent(new PointerEvent("lostpointercapture")));
+      }
+    }
   }
 });
@@ -506 +3763 @@
         if (typeof container === STRING) {
           if (container.charAt(0) === ".") {
-            var className = container.slice(1);
+            const className = container.slice(1);
             container = document.getElementsByClassName(className)[0];
           } else {
@@ -534 +3791 @@
       }
       clear() {
-        var layers = this.children, len = layers.length, n;
+        let layers = this.children, len = layers.length, n;
         for (n = 0; n < len; n++) {
           layers[n].clear();
@@ -549 +3806 @@
       destroy() {
         super.destroy();
-        var content = this.content;
+        const content = this.content;
         if (content && Util_1.Util._isInDocument(content)) {
           this.container().removeChild(content);
         }
-        var index = exports.stages.indexOf(this);
+        const index = exports.stages.indexOf(this);
         if (index > -1) {
           exports.stages.splice(index, 1);
@@ -589 +3846 @@
         config.width = config.width || this.width();
         config.height = config.height || this.height();
-        var canvas = new Canvas_1.SceneCanvas({
+        const canvas = new Canvas_1.SceneCanvas({
           width: config.width,
           height: config.height,
           pixelRatio: config.pixelRatio || 1
         });
-        var _context = canvas.getContext()._context;
-        var layers = this.children;
+        const _context = canvas.getContext()._context;
+        const layers = this.children;
         if (config.x || config.y) {
           _context.translate(-1 * config.x, -1 * config.y);
@@ -603 +3860 @@
             return;
           }
-          var layerCanvas = layer._toKonvaCanvas(config);
+          const layerCanvas = layer._toKonvaCanvas(config);
           _context.drawImage(layerCanvas._canvas, config.x, config.y, layerCanvas.getWidth() / layerCanvas.getPixelRatio(), layerCanvas.getHeight() / layerCanvas.getPixelRatio());
         });
@@ -612 +3869 @@
           return null;
         }
-        var layers = this.children, len = layers.length, end = len - 1, n;
+        let layers = this.children, len = layers.length, end = len - 1, n;
         for (n = end; n >= 0; n--) {
           const shape = layers[n].getIntersection(pos);
@@ -622 +3879 @@
       }
       _resizeDOM() {
-        var width = this.width();
-        var height = this.height();
+        const width = this.width();
+        const height = this.height();
         if (this.content) {
           this.content.style.width = width + PX;
@@ -637 +3894 @@
       add(layer, ...rest) {
         if (arguments.length > 1) {
-          for (var i = 0; i < arguments.length; i++) {
+          for (let i = 0; i < arguments.length; i++) {
             this.add(arguments[i]);
           }
@@ -643 +3900 @@
         }
         super.add(layer);
-        var length = this.children.length;
+        const length = this.children.length;
         if (length > MAX_LAYERS_NUMBER) {
           Util_1.Util.warn("The stage has " + length + " layers. Recommended maximum number of layers is 3-5. Adding more layers into the stage may drop the performance. Rethink your tree structure, you can use Konva.Group.");
@@ -718 +3975 @@
         }
         this.setPointersPositions(evt);
-        var targetShape = this._getTargetShape(eventType);
-        var eventsEnabled = !(Global_1.Konva.isDragging() || Global_1.Konva.isTransforming()) || Global_1.Konva.hitOnDragEnabled;
+        const targetShape = this._getTargetShape(eventType);
+        const eventsEnabled = !(Global_1.Konva.isDragging() || Global_1.Konva.isTransforming()) || Global_1.Konva.hitOnDragEnabled;
         if (targetShape && eventsEnabled) {
           targetShape._fireAndBubble(events.pointerout, { evt });
@@ -751 +4008 @@
         }
         this.setPointersPositions(evt);
-        var triggeredOnShape = false;
+        let triggeredOnShape = false;
         this._changedPointerPositions.forEach((pos) => {
-          var shape = this.getIntersection(pos);
+          const shape = this.getIntersection(pos);
           DragAndDrop_1.DD.justDragged = false;
           Global_1.Konva["_" + eventType + "ListenClick"] = true;
@@ -793 +4050 @@
         }
         this.setPointersPositions(evt);
-        var eventsEnabled = !(Global_1.Konva.isDragging() || Global_1.Konva.isTransforming()) || Global_1.Konva.hitOnDragEnabled;
+        const eventsEnabled = !(Global_1.Konva.isDragging() || Global_1.Konva.isTransforming()) || Global_1.Konva.hitOnDragEnabled;
         if (!eventsEnabled) {
           return;
         }
-        var processedShapesIds = {};
+        const processedShapesIds = {};
         let triggeredOnShape = false;
-        var targetShape = this._getTargetShape(eventType);
+        const targetShape = this._getTargetShape(eventType);
         this._changedPointerPositions.forEach((pos) => {
           const shape = PointerEvents.getCapturedShape(pos.id) || this.getIntersection(pos);
           const pointerId = pos.id;
           const event = { evt, pointerId };
-          var differentTarget = targetShape !== shape;
+          const differentTarget = targetShape !== shape;
           if (differentTarget && targetShape) {
             targetShape._fireAndBubble(events.pointerout, { ...event }, shape);
@@ -853 +4110 @@
         const clickStartShape = this[eventType + "ClickStartShape"];
         const clickEndShape = this[eventType + "ClickEndShape"];
-        var processedShapesIds = {};
+        const processedShapesIds = {};
         let triggeredOnShape = false;
         this._changedPointerPositions.forEach((pos) => {
@@ -922 +4179 @@
       _contextmenu(evt) {
         this.setPointersPositions(evt);
-        var shape = this.getIntersection(this.getPointerPosition());
+        const shape = this.getIntersection(this.getPointerPosition());
         if (shape && shape.isListening()) {
           shape._fireAndBubble(CONTEXTMENU, { evt });
@@ -935 +4192 @@
       _wheel(evt) {
         this.setPointersPositions(evt);
-        var shape = this.getIntersection(this.getPointerPosition());
+        const shape = this.getIntersection(this.getPointerPosition());
         if (shape && shape.isListening()) {
           shape._fireAndBubble(WHEEL, { evt });
@@ -958 +4215 @@
       }
       setPointersPositions(evt) {
-        var contentPosition = this._getContentPosition(), x = null, y = null;
+        let contentPosition = this._getContentPosition(), x = null, y = null;
         evt = evt ? evt : window.event;
         if (evt.touches !== void 0) {
@@ -1003 +4260 @@
           };
         }
-        var rect = this.content.getBoundingClientRect();
+        const rect = this.content.getBoundingClientRect();
         return {
           top: rect.top,
@@ -1024 +4281 @@
           return;
         }
-        var container = this.container();
+        const container = this.container();
         if (!container) {
           throw "Stage has no container. A container is required.";
@@ -1062 +4319 @@
       });
     }
+  }
+});
+
+// node_modules/konva/lib/Shape.js
+var require_Shape = __commonJS({
+  "node_modules/konva/lib/Shape.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Shape = exports.shapes = void 0;
+    var Global_1 = require_Global();
+    var Util_1 = require_Util();
+    var Factory_1 = require_Factory();
+    var Node_1 = require_Node();
+    var Validators_1 = require_Validators();
+    var Global_2 = require_Global();
+    var PointerEvents = require_PointerEvents();
+    var HAS_SHADOW = "hasShadow";
+    var SHADOW_RGBA = "shadowRGBA";
+    var patternImage = "patternImage";
+    var linearGradient = "linearGradient";
+    var radialGradient = "radialGradient";
+    var dummyContext;
+    function getDummyContext() {
+      if (dummyContext) {
+        return dummyContext;
+      }
+      dummyContext = Util_1.Util.createCanvasElement().getContext("2d");
+      return dummyContext;
+    }
+    exports.shapes = {};
+    function _fillFunc(context) {
+      const fillRule = this.attrs.fillRule;
+      if (fillRule) {
+        context.fill(fillRule);
+      } else {
+        context.fill();
+      }
+    }
+    function _strokeFunc(context) {
+      context.stroke();
+    }
+    function _fillFuncHit(context) {
+      const fillRule = this.attrs.fillRule;
+      if (fillRule) {
+        context.fill(fillRule);
+      } else {
+        context.fill();
+      }
+    }
+    function _strokeFuncHit(context) {
+      context.stroke();
+    }
+    function _clearHasShadowCache() {
+      this._clearCache(HAS_SHADOW);
+    }
+    function _clearGetShadowRGBACache() {
+      this._clearCache(SHADOW_RGBA);
+    }
+    function _clearFillPatternCache() {
+      this._clearCache(patternImage);
+    }
+    function _clearLinearGradientCache() {
+      this._clearCache(linearGradient);
+    }
+    function _clearRadialGradientCache() {
+      this._clearCache(radialGradient);
+    }
+    var Shape = class extends Node_1.Node {
+      constructor(config) {
+        super(config);
+        let key;
+        while (true) {
+          key = Util_1.Util.getRandomColor();
+          if (key && !(key in exports.shapes)) {
+            break;
+          }
+        }
+        this.colorKey = key;
+        exports.shapes[key] = this;
+      }
+      getContext() {
+        Util_1.Util.warn("shape.getContext() method is deprecated. Please do not use it.");
+        return this.getLayer().getContext();
+      }
+      getCanvas() {
+        Util_1.Util.warn("shape.getCanvas() method is deprecated. Please do not use it.");
+        return this.getLayer().getCanvas();
+      }
+      getSceneFunc() {
+        return this.attrs.sceneFunc || this["_sceneFunc"];
+      }
+      getHitFunc() {
+        return this.attrs.hitFunc || this["_hitFunc"];
+      }
+      hasShadow() {
+        return this._getCache(HAS_SHADOW, this._hasShadow);
+      }
+      _hasShadow() {
+        return this.shadowEnabled() && this.shadowOpacity() !== 0 && !!(this.shadowColor() || this.shadowBlur() || this.shadowOffsetX() || this.shadowOffsetY());
+      }
+      _getFillPattern() {
+        return this._getCache(patternImage, this.__getFillPattern);
+      }
+      __getFillPattern() {
+        if (this.fillPatternImage()) {
+          const ctx = getDummyContext();
+          const pattern = ctx.createPattern(this.fillPatternImage(), this.fillPatternRepeat() || "repeat");
+          if (pattern && pattern.setTransform) {
+            const tr = new Util_1.Transform();
+            tr.translate(this.fillPatternX(), this.fillPatternY());
+            tr.rotate(Global_1.Konva.getAngle(this.fillPatternRotation()));
+            tr.scale(this.fillPatternScaleX(), this.fillPatternScaleY());
+            tr.translate(-1 * this.fillPatternOffsetX(), -1 * this.fillPatternOffsetY());
+            const m = tr.getMatrix();
+            const matrix = typeof DOMMatrix === "undefined" ? {
+              a: m[0],
+              b: m[1],
+              c: m[2],
+              d: m[3],
+              e: m[4],
+              f: m[5]
+            } : new DOMMatrix(m);
+            pattern.setTransform(matrix);
+          }
+          return pattern;
+        }
+      }
+      _getLinearGradient() {
+        return this._getCache(linearGradient, this.__getLinearGradient);
+      }
+      __getLinearGradient() {
+        const colorStops = this.fillLinearGradientColorStops();
+        if (colorStops) {
+          const ctx = getDummyContext();
+          const start = this.fillLinearGradientStartPoint();
+          const end = this.fillLinearGradientEndPoint();
+          const grd = ctx.createLinearGradient(start.x, start.y, end.x, end.y);
+          for (let n = 0; n < colorStops.length; n += 2) {
+            grd.addColorStop(colorStops[n], colorStops[n + 1]);
+          }
+          return grd;
+        }
+      }
+      _getRadialGradient() {
+        return this._getCache(radialGradient, this.__getRadialGradient);
+      }
+      __getRadialGradient() {
+        const colorStops = this.fillRadialGradientColorStops();
+        if (colorStops) {
+          const ctx = getDummyContext();
+          const start = this.fillRadialGradientStartPoint();
+          const end = this.fillRadialGradientEndPoint();
+          const grd = ctx.createRadialGradient(start.x, start.y, this.fillRadialGradientStartRadius(), end.x, end.y, this.fillRadialGradientEndRadius());
+          for (let n = 0; n < colorStops.length; n += 2) {
+            grd.addColorStop(colorStops[n], colorStops[n + 1]);
+          }
+          return grd;
+        }
+      }
+      getShadowRGBA() {
+        return this._getCache(SHADOW_RGBA, this._getShadowRGBA);
+      }
+      _getShadowRGBA() {
+        if (!this.hasShadow()) {
+          return;
+        }
+        const rgba = Util_1.Util.colorToRGBA(this.shadowColor());
+        if (rgba) {
+          return "rgba(" + rgba.r + "," + rgba.g + "," + rgba.b + "," + rgba.a * (this.shadowOpacity() || 1) + ")";
+        }
+      }
+      hasFill() {
+        return this._calculate("hasFill", [
+          "fillEnabled",
+          "fill",
+          "fillPatternImage",
+          "fillLinearGradientColorStops",
+          "fillRadialGradientColorStops"
+        ], () => {
+          return this.fillEnabled() && !!(this.fill() || this.fillPatternImage() || this.fillLinearGradientColorStops() || this.fillRadialGradientColorStops());
+        });
+      }
+      hasStroke() {
+        return this._calculate("hasStroke", [
+          "strokeEnabled",
+          "strokeWidth",
+          "stroke",
+          "strokeLinearGradientColorStops"
+        ], () => {
+          return this.strokeEnabled() && this.strokeWidth() && !!(this.stroke() || this.strokeLinearGradientColorStops());
+        });
+      }
+      hasHitStroke() {
+        const width = this.hitStrokeWidth();
+        if (width === "auto") {
+          return this.hasStroke();
+        }
+        return this.strokeEnabled() && !!width;
+      }
+      intersects(point) {
+        const stage = this.getStage();
+        if (!stage) {
+          return false;
+        }
+        const bufferHitCanvas = stage.bufferHitCanvas;
+        bufferHitCanvas.getContext().clear();
+        this.drawHit(bufferHitCanvas, void 0, true);
+        const p = bufferHitCanvas.context.getImageData(Math.round(point.x), Math.round(point.y), 1, 1).data;
+        return p[3] > 0;
+      }
+      destroy() {
+        Node_1.Node.prototype.destroy.call(this);
+        delete exports.shapes[this.colorKey];
+        delete this.colorKey;
+        return this;
+      }
+      _useBufferCanvas(forceFill) {
+        var _a;
+        const perfectDrawEnabled = (_a = this.attrs.perfectDrawEnabled) !== null && _a !== void 0 ? _a : true;
+        if (!perfectDrawEnabled) {
+          return false;
+        }
+        const hasFill = forceFill || this.hasFill();
+        const hasStroke = this.hasStroke();
+        const isTransparent = this.getAbsoluteOpacity() !== 1;
+        if (hasFill && hasStroke && isTransparent) {
+          return true;
+        }
+        const hasShadow = this.hasShadow();
+        const strokeForShadow = this.shadowForStrokeEnabled();
+        if (hasFill && hasStroke && hasShadow && strokeForShadow) {
+          return true;
+        }
+        return false;
+      }
+      setStrokeHitEnabled(val) {
+        Util_1.Util.warn("strokeHitEnabled property is deprecated. Please use hitStrokeWidth instead.");
+        if (val) {
+          this.hitStrokeWidth("auto");
+        } else {
+          this.hitStrokeWidth(0);
+        }
+      }
+      getStrokeHitEnabled() {
+        if (this.hitStrokeWidth() === 0) {
+          return false;
+        } else {
+          return true;
+        }
+      }
+      getSelfRect() {
+        const size = this.size();
+        return {
+          x: this._centroid ? -size.width / 2 : 0,
+          y: this._centroid ? -size.height / 2 : 0,
+          width: size.width,
+          height: size.height
+        };
+      }
+      getClientRect(config = {}) {
+        let hasCachedParent = false;
+        let parent = this.getParent();
+        while (parent) {
+          if (parent.isCached()) {
+            hasCachedParent = true;
+            break;
+          }
+          parent = parent.getParent();
+        }
+        const skipTransform = config.skipTransform;
+        const relativeTo = config.relativeTo || hasCachedParent && this.getStage() || void 0;
+        const fillRect = this.getSelfRect();
+        const applyStroke = !config.skipStroke && this.hasStroke();
+        const strokeWidth = applyStroke && this.strokeWidth() || 0;
+        const fillAndStrokeWidth = fillRect.width + strokeWidth;
+        const fillAndStrokeHeight = fillRect.height + strokeWidth;
+        const applyShadow = !config.skipShadow && this.hasShadow();
+        const shadowOffsetX = applyShadow ? this.shadowOffsetX() : 0;
+        const shadowOffsetY = applyShadow ? this.shadowOffsetY() : 0;
+        const preWidth = fillAndStrokeWidth + Math.abs(shadowOffsetX);
+        const preHeight = fillAndStrokeHeight + Math.abs(shadowOffsetY);
+        const blurRadius = applyShadow && this.shadowBlur() || 0;
+        const width = preWidth + blurRadius * 2;
+        const height = preHeight + blurRadius * 2;
+        const rect = {
+          width,
+          height,
+          x: -(strokeWidth / 2 + blurRadius) + Math.min(shadowOffsetX, 0) + fillRect.x,
+          y: -(strokeWidth / 2 + blurRadius) + Math.min(shadowOffsetY, 0) + fillRect.y
+        };
+        if (!skipTransform) {
+          return this._transformedRect(rect, relativeTo);
+        }
+        return rect;
+      }
+      drawScene(can, top, bufferCanvas) {
+        const layer = this.getLayer();
+        let canvas = can || layer.getCanvas(), context = canvas.getContext(), cachedCanvas = this._getCanvasCache(), drawFunc = this.getSceneFunc(), hasShadow = this.hasShadow(), stage, bufferContext;
+        const skipBuffer = canvas.isCache;
+        const cachingSelf = top === this;
+        if (!this.isVisible() && !cachingSelf) {
+          return this;
+        }
+        if (cachedCanvas) {
+          context.save();
+          const m = this.getAbsoluteTransform(top).getMatrix();
+          context.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
+          this._drawCachedSceneCanvas(context);
+          context.restore();
+          return this;
+        }
+        if (!drawFunc) {
+          return this;
+        }
+        context.save();
+        if (this._useBufferCanvas() && !skipBuffer) {
+          stage = this.getStage();
+          const bc = bufferCanvas || stage.bufferCanvas;
+          bufferContext = bc.getContext();
+          bufferContext.clear();
+          bufferContext.save();
+          bufferContext._applyLineJoin(this);
+          var o = this.getAbsoluteTransform(top).getMatrix();
+          bufferContext.transform(o[0], o[1], o[2], o[3], o[4], o[5]);
+          drawFunc.call(this, bufferContext, this);
+          bufferContext.restore();
+          const ratio = bc.pixelRatio;
+          if (hasShadow) {
+            context._applyShadow(this);
+          }
+          context._applyOpacity(this);
+          context._applyGlobalCompositeOperation(this);
+          context.drawImage(bc._canvas, 0, 0, bc.width / ratio, bc.height / ratio);
+        } else {
+          context._applyLineJoin(this);
+          if (!cachingSelf) {
+            var o = this.getAbsoluteTransform(top).getMatrix();
+            context.transform(o[0], o[1], o[2], o[3], o[4], o[5]);
+            context._applyOpacity(this);
+            context._applyGlobalCompositeOperation(this);
+          }
+          if (hasShadow) {
+            context._applyShadow(this);
+          }
+          drawFunc.call(this, context, this);
+        }
+        context.restore();
+        return this;
+      }
+      drawHit(can, top, skipDragCheck = false) {
+        if (!this.shouldDrawHit(top, skipDragCheck)) {
+          return this;
+        }
+        const layer = this.getLayer(), canvas = can || layer.hitCanvas, context = canvas && canvas.getContext(), drawFunc = this.hitFunc() || this.sceneFunc(), cachedCanvas = this._getCanvasCache(), cachedHitCanvas = cachedCanvas && cachedCanvas.hit;
+        if (!this.colorKey) {
+          Util_1.Util.warn("Looks like your canvas has a destroyed shape in it. Do not reuse shape after you destroyed it. If you want to reuse shape you should call remove() instead of destroy()");
+        }
+        if (cachedHitCanvas) {
+          context.save();
+          const m = this.getAbsoluteTransform(top).getMatrix();
+          context.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
+          this._drawCachedHitCanvas(context);
+          context.restore();
+          return this;
+        }
+        if (!drawFunc) {
+          return this;
+        }
+        context.save();
+        context._applyLineJoin(this);
+        const selfCache = this === top;
+        if (!selfCache) {
+          const o = this.getAbsoluteTransform(top).getMatrix();
+          context.transform(o[0], o[1], o[2], o[3], o[4], o[5]);
+        }
+        drawFunc.call(this, context, this);
+        context.restore();
+        return this;
+      }
+      drawHitFromCache(alphaThreshold = 0) {
+        let cachedCanvas = this._getCanvasCache(), sceneCanvas = this._getCachedSceneCanvas(), hitCanvas = cachedCanvas.hit, hitContext = hitCanvas.getContext(), hitWidth = hitCanvas.getWidth(), hitHeight = hitCanvas.getHeight(), hitImageData, hitData, len, rgbColorKey, i, alpha;
+        hitContext.clear();
+        hitContext.drawImage(sceneCanvas._canvas, 0, 0, hitWidth, hitHeight);
+        try {
+          hitImageData = hitContext.getImageData(0, 0, hitWidth, hitHeight);
+          hitData = hitImageData.data;
+          len = hitData.length;
+          rgbColorKey = Util_1.Util._hexToRgb(this.colorKey);
+          for (i = 0; i < len; i += 4) {
+            alpha = hitData[i + 3];
+            if (alpha > alphaThreshold) {
+              hitData[i] = rgbColorKey.r;
+              hitData[i + 1] = rgbColorKey.g;
+              hitData[i + 2] = rgbColorKey.b;
+              hitData[i + 3] = 255;
+            } else {
+              hitData[i + 3] = 0;
+            }
+          }
+          hitContext.putImageData(hitImageData, 0, 0);
+        } catch (e) {
+          Util_1.Util.error("Unable to draw hit graph from cached scene canvas. " + e.message);
+        }
+        return this;
+      }
+      hasPointerCapture(pointerId) {
+        return PointerEvents.hasPointerCapture(pointerId, this);
+      }
+      setPointerCapture(pointerId) {
+        PointerEvents.setPointerCapture(pointerId, this);
+      }
+      releaseCapture(pointerId) {
+        PointerEvents.releaseCapture(pointerId, this);
+      }
+    };
+    exports.Shape = Shape;
+    Shape.prototype._fillFunc = _fillFunc;
+    Shape.prototype._strokeFunc = _strokeFunc;
+    Shape.prototype._fillFuncHit = _fillFuncHit;
+    Shape.prototype._strokeFuncHit = _strokeFuncHit;
+    Shape.prototype._centroid = false;
+    Shape.prototype.nodeType = "Shape";
+    (0, Global_2._registerNode)(Shape);
+    Shape.prototype.eventListeners = {};
+    Shape.prototype.on.call(Shape.prototype, "shadowColorChange.konva shadowBlurChange.konva shadowOffsetChange.konva shadowOpacityChange.konva shadowEnabledChange.konva", _clearHasShadowCache);
+    Shape.prototype.on.call(Shape.prototype, "shadowColorChange.konva shadowOpacityChange.konva shadowEnabledChange.konva", _clearGetShadowRGBACache);
+    Shape.prototype.on.call(Shape.prototype, "fillPriorityChange.konva fillPatternImageChange.konva fillPatternRepeatChange.konva fillPatternScaleXChange.konva fillPatternScaleYChange.konva fillPatternOffsetXChange.konva fillPatternOffsetYChange.konva fillPatternXChange.konva fillPatternYChange.konva fillPatternRotationChange.konva", _clearFillPatternCache);
+    Shape.prototype.on.call(Shape.prototype, "fillPriorityChange.konva fillLinearGradientColorStopsChange.konva fillLinearGradientStartPointXChange.konva fillLinearGradientStartPointYChange.konva fillLinearGradientEndPointXChange.konva fillLinearGradientEndPointYChange.konva", _clearLinearGradientCache);
+    Shape.prototype.on.call(Shape.prototype, "fillPriorityChange.konva fillRadialGradientColorStopsChange.konva fillRadialGradientStartPointXChange.konva fillRadialGradientStartPointYChange.konva fillRadialGradientEndPointXChange.konva fillRadialGradientEndPointYChange.konva fillRadialGradientStartRadiusChange.konva fillRadialGradientEndRadiusChange.konva", _clearRadialGradientCache);
+    Factory_1.Factory.addGetterSetter(Shape, "stroke", void 0, (0, Validators_1.getStringOrGradientValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "strokeWidth", 2, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "fillAfterStrokeEnabled", false);
+    Factory_1.Factory.addGetterSetter(Shape, "hitStrokeWidth", "auto", (0, Validators_1.getNumberOrAutoValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "strokeHitEnabled", true, (0, Validators_1.getBooleanValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "perfectDrawEnabled", true, (0, Validators_1.getBooleanValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "shadowForStrokeEnabled", true, (0, Validators_1.getBooleanValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "lineJoin");
+    Factory_1.Factory.addGetterSetter(Shape, "lineCap");
+    Factory_1.Factory.addGetterSetter(Shape, "sceneFunc");
+    Factory_1.Factory.addGetterSetter(Shape, "hitFunc");
+    Factory_1.Factory.addGetterSetter(Shape, "dash");
+    Factory_1.Factory.addGetterSetter(Shape, "dashOffset", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "shadowColor", void 0, (0, Validators_1.getStringValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "shadowBlur", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "shadowOpacity", 1, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "shadowOffset", ["x", "y"]);
+    Factory_1.Factory.addGetterSetter(Shape, "shadowOffsetX", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "shadowOffsetY", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternImage");
+    Factory_1.Factory.addGetterSetter(Shape, "fill", void 0, (0, Validators_1.getStringOrGradientValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternX", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternY", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "fillLinearGradientColorStops");
+    Factory_1.Factory.addGetterSetter(Shape, "strokeLinearGradientColorStops");
+    Factory_1.Factory.addGetterSetter(Shape, "fillRadialGradientStartRadius", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillRadialGradientEndRadius", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillRadialGradientColorStops");
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternRepeat", "repeat");
+    Factory_1.Factory.addGetterSetter(Shape, "fillEnabled", true);
+    Factory_1.Factory.addGetterSetter(Shape, "strokeEnabled", true);
+    Factory_1.Factory.addGetterSetter(Shape, "shadowEnabled", true);
+    Factory_1.Factory.addGetterSetter(Shape, "dashEnabled", true);
+    Factory_1.Factory.addGetterSetter(Shape, "strokeScaleEnabled", true);
+    Factory_1.Factory.addGetterSetter(Shape, "fillPriority", "color");
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "fillPatternOffset", ["x", "y"]);
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternOffsetX", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternOffsetY", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "fillPatternScale", ["x", "y"]);
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternScaleX", 1, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternScaleY", 1, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "fillLinearGradientStartPoint", [
+      "x",
+      "y"
+    ]);
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "strokeLinearGradientStartPoint", [
+      "x",
+      "y"
+    ]);
+    Factory_1.Factory.addGetterSetter(Shape, "fillLinearGradientStartPointX", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "strokeLinearGradientStartPointX", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillLinearGradientStartPointY", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "strokeLinearGradientStartPointY", 0);
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "fillLinearGradientEndPoint", [
+      "x",
+      "y"
+    ]);
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "strokeLinearGradientEndPoint", [
+      "x",
+      "y"
+    ]);
+    Factory_1.Factory.addGetterSetter(Shape, "fillLinearGradientEndPointX", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "strokeLinearGradientEndPointX", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillLinearGradientEndPointY", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "strokeLinearGradientEndPointY", 0);
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "fillRadialGradientStartPoint", [
+      "x",
+      "y"
+    ]);
+    Factory_1.Factory.addGetterSetter(Shape, "fillRadialGradientStartPointX", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillRadialGradientStartPointY", 0);
+    Factory_1.Factory.addComponentsGetterSetter(Shape, "fillRadialGradientEndPoint", [
+      "x",
+      "y"
+    ]);
+    Factory_1.Factory.addGetterSetter(Shape, "fillRadialGradientEndPointX", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillRadialGradientEndPointY", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillPatternRotation", 0);
+    Factory_1.Factory.addGetterSetter(Shape, "fillRule", void 0, (0, Validators_1.getStringValidator)());
+    Factory_1.Factory.backCompat(Shape, {
+      dashArray: "dash",
+      getDashArray: "getDash",
+      setDashArray: "getDash",
+      drawFunc: "sceneFunc",
+      getDrawFunc: "getSceneFunc",
+      setDrawFunc: "setSceneFunc",
+      drawHitFunc: "hitFunc",
+      getDrawHitFunc: "getHitFunc",
+      setDrawHitFunc: "setHitFunc"
+    });
   }
 });
@@ -1126 +4902 @@
       setZIndex(index) {
         super.setZIndex(index);
-        var stage = this.getStage();
+        const stage = this.getStage();
         if (stage && stage.content) {
           stage.content.removeChild(this.getNativeCanvasElement());
@@ -1139 +4915 @@
       moveToTop() {
         Node_1.Node.prototype.moveToTop.call(this);
-        var stage = this.getStage();
+        const stage = this.getStage();
         if (stage && stage.content) {
           stage.content.removeChild(this.getNativeCanvasElement());
@@ -1147 +4923 @@
       }
       moveUp() {
-        var moved = Node_1.Node.prototype.moveUp.call(this);
+        const moved = Node_1.Node.prototype.moveUp.call(this);
         if (!moved) {
           return false;
         }
-        var stage = this.getStage();
+        const stage = this.getStage();
         if (!stage || !stage.content) {
           return false;
@@ -1165 +4941 @@
       moveDown() {
         if (Node_1.Node.prototype.moveDown.call(this)) {
-          var stage = this.getStage();
+          const stage = this.getStage();
           if (stage) {
-            var children = stage.children;
+            const children = stage.children;
             if (stage.content) {
               stage.content.removeChild(this.getNativeCanvasElement());
@@ -1179 +4955 @@
       moveToBottom() {
         if (Node_1.Node.prototype.moveToBottom.call(this)) {
-          var stage = this.getStage();
+          const stage = this.getStage();
           if (stage) {
-            var children = stage.children;
+            const children = stage.children;
             if (stage.content) {
               stage.content.removeChild(this.getNativeCanvasElement());
@@ -1195 +4971 @@
       }
       remove() {
-        var _canvas = this.getNativeCanvasElement();
+        const _canvas = this.getNativeCanvasElement();
         Node_1.Node.prototype.remove.call(this);
         if (_canvas && _canvas.parentNode && Util_1.Util._isInDocument(_canvas)) {
@@ -1212 +4988 @@
       }
       _validateAdd(child) {
-        var type = child.getType();
+        const type = child.getType();
         if (type !== "Group" && type !== "Shape") {
           Util_1.Util.throw("You may only add groups and shapes to a layer.");
@@ -1266 +5042 @@
           return null;
         }
-        var spiralSearchDistance = 1;
-        var continueSearch = false;
+        let spiralSearchDistance = 1;
+        let continueSearch = false;
         while (true) {
           for (let i = 0; i < INTERSECTION_OFFSETS_LEN; i++) {
@@ -1314 +5090 @@
       }
       drawScene(can, top) {
-        var layer = this.getLayer(), canvas = can || layer && layer.getCanvas();
+        const layer = this.getLayer(), canvas = can || layer && layer.getCanvas();
         this._fire(BEFORE_DRAW, {
           node: this
@@ -1328 +5104 @@
       }
       drawHit(can, top) {
-        var layer = this.getLayer(), canvas = can || layer && layer.hitCanvas;
+        const layer = this.getLayer(), canvas = can || layer && layer.hitCanvas;
         if (layer && layer.clearBeforeDraw()) {
           layer.getHitCanvas().getContext().clear();
@@ -1355 +5131 @@
           return;
         }
-        var parent = this.parent;
-        var added = !!this.hitCanvas._canvas.parentNode;
+        const parent = this.parent;
+        const added = !!this.hitCanvas._canvas.parentNode;
         if (added) {
           parent.content.removeChild(this.hitCanvas._canvas);
@@ -1410 +5186 @@
     var Group = class extends Container_1.Container {
       _validateAdd(child) {
-        var type = child.getType();
+        const type = child.getType();
         if (type !== "Group" && type !== "Shape") {
           Util_1.Util.throw("You may only add groups and shapes to groups.");
@@ -1542 +5318 @@
           }
         }
-        for (let key in layerHash) {
+        for (const key in layerHash) {
           if (!layerHash.hasOwnProperty(key)) {
             continue;
@@ -1613 +5389 @@
       }
       fire(str) {
-        var handler = this[str];
+        const handler = this[str];
         if (handler) {
           handler();
@@ -1688 +5464 @@
       }
       onEnterFrame() {
-        var t = this.getTimer() - this._startTime;
+        const t = this.getTimer() - this._startTime;
         if (this.state === PLAYING) {
           this.setTime(t);
@@ -1705 +5481 @@
     var Tween = class _Tween {
       constructor(config) {
-        var that = this, node = config.node, nodeId = node._id, duration, easing = config.easing || exports.Easings.Linear, yoyo = !!config.yoyo, key;
+        let that = this, node = config.node, nodeId = node._id, duration, easing = config.easing || exports.Easings.Linear, yoyo = !!config.yoyo, key;
         if (typeof config.duration === "undefined") {
           duration = 0.3;
@@ -1715 +5491 @@
         this.node = node;
         this._id = idCounter++;
-        var layers = node.getLayer() || (node instanceof Global_1.Konva["Stage"] ? node.getLayers() : null);
+        const layers = node.getLayer() || (node instanceof Global_1.Konva["Stage"] ? node.getLayers() : null);
         if (!layers) {
           Util_1.Util.error("Tween constructor have `node` that is not in a layer. Please add node into layer first.");
@@ -1746 +5522 @@
       }
       _addAttr(key, end) {
-        var node = this.node, nodeId = node._id, start, diff, tweenId, n, len, trueEnd, trueStart, endRGBA;
+        let node = this.node, nodeId = node._id, start, diff, tweenId, n, len, trueEnd, trueStart, endRGBA;
         tweenId = _Tween.tweens[nodeId][key];
         if (tweenId) {
@@ -1769 +5545 @@
                 diff.push(end[n] - start[n]);
               } else {
-                var startRGBA = Util_1.Util.colorToRGBA(start[n]);
+                const startRGBA = Util_1.Util.colorToRGBA(start[n]);
                 endRGBA = Util_1.Util.colorToRGBA(end[n]);
                 start[n] = startRGBA;
@@ -1807 +5583 @@
       }
       _tweenFunc(i) {
-        var node = this.node, attrs = _Tween.attrs[node._id][this._id], key, attr, start, diff, newVal, n, len, end;
+        let node = this.node, attrs = _Tween.attrs[node._id][this._id], key, attr, start, diff, newVal, n, len, end;
         for (key in attrs) {
           attr = attrs[key];
@@ -1848 +5624 @@
         };
         this.tween.onFinish = () => {
-          var node = this.node;
-          var attrs = _Tween.attrs[node._id][this._id];
+          const node = this.node;
+          const attrs = _Tween.attrs[node._id][this._id];
           if (attrs.points && attrs.points.trueEnd) {
             node.setAttr("points", attrs.points.trueEnd);
@@ -1858 +5634 @@
         };
         this.tween.onReset = () => {
-          var node = this.node;
-          var attrs = _Tween.attrs[node._id][this._id];
+          const node = this.node;
+          const attrs = _Tween.attrs[node._id][this._id];
           if (attrs.points && attrs.points.trueStart) {
             node.points(attrs.points.trueStart);
@@ -1898 +5674 @@
       }
       destroy() {
-        var nodeId = this.node._id, thisId = this._id, attrs = _Tween.tweens[nodeId], key;
+        let nodeId = this.node._id, thisId = this._id, attrs = _Tween.tweens[nodeId], key;
         this.pause();
         for (key in attrs) {
@@ -1910 +5686 @@
     Tween.tweens = {};
     Node_1.Node.prototype.to = function(params) {
-      var onFinish = params.onFinish;
+      const onFinish = params.onFinish;
       params.node = this;
       params.onFinish = function() {
@@ -1918 +5694 @@
         }
       };
-      var tween = new Tween(params);
+      const tween = new Tween(params);
       tween.play();
     };
     exports.Easings = {
       BackEaseIn(t, b, c, d) {
-        var s = 1.70158;
+        const s = 1.70158;
         return c * (t /= d) * t * ((s + 1) * t - s) + b;
       },
       BackEaseOut(t, b, c, d) {
-        var s = 1.70158;
+        const s = 1.70158;
         return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
       },
       BackEaseInOut(t, b, c, d) {
-        var s = 1.70158;
+        let s = 1.70158;
         if ((t /= d / 2) < 1) {
           return c / 2 * (t * t * (((s *= 1.525) + 1) * t - s)) + b;
@@ -1938 +5714 @@
       },
       ElasticEaseIn(t, b, c, d, a, p) {
-        var s = 0;
+        let s = 0;
         if (t === 0) {
           return b;
@@ -1957 +5733 @@
       },
       ElasticEaseOut(t, b, c, d, a, p) {
-        var s = 0;
+        let s = 0;
         if (t === 0) {
           return b;
@@ -1976 +5752 @@
       },
       ElasticEaseInOut(t, b, c, d, a, p) {
-        var s = 0;
+        let s = 0;
         if (t === 0) {
           return b;
@@ -2105 +5881 @@
     var Arc = class extends Shape_1.Shape {
       _sceneFunc(context) {
-        var angle = Global_1.Konva.getAngle(this.angle()), clockwise = this.clockwise();
+        const angle = Global_1.Konva.getAngle(this.angle()), clockwise = this.clockwise();
         context.beginPath();
         context.arc(0, 0, this.outerRadius(), 0, angle, clockwise);
@@ -2164 +5940 @@
     exports.Line = void 0;
     var Factory_1 = require_Factory();
+    var Global_1 = require_Global();
     var Shape_1 = require_Shape();
     var Validators_1 = require_Validators();
-    var Global_1 = require_Global();
     function getControlPoints(x0, y0, x1, y1, x2, y2, t) {
-      var d01 = Math.sqrt(Math.pow(x1 - x0, 2) + Math.pow(y1 - y0, 2)), d12 = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2)), fa = t * d01 / (d01 + d12), fb = t * d12 / (d01 + d12), p1x = x1 - fa * (x2 - x0), p1y = y1 - fa * (y2 - y0), p2x = x1 + fb * (x2 - x0), p2y = y1 + fb * (y2 - y0);
+      const d01 = Math.sqrt(Math.pow(x1 - x0, 2) + Math.pow(y1 - y0, 2)), d12 = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2)), fa = t * d01 / (d01 + d12), fb = t * d12 / (d01 + d12), p1x = x1 - fa * (x2 - x0), p1y = y1 - fa * (y2 - y0), p2x = x1 + fb * (x2 - x0), p2y = y1 + fb * (y2 - y0);
       return [p1x, p1y, p2x, p2y];
     }
     function expandPoints(p, tension) {
-      var len = p.length, allPoints = [], n, cp;
-      for (n = 2; n < len - 2; n += 2) {
-        cp = getControlPoints(p[n - 2], p[n - 1], p[n], p[n + 1], p[n + 2], p[n + 3], tension);
+      const len = p.length, allPoints = [];
+      for (let n = 2; n < len - 2; n += 2) {
+        const cp = getControlPoints(p[n - 2], p[n - 1], p[n], p[n + 1], p[n + 2], p[n + 3], tension);
         if (isNaN(cp[0])) {
           continue;
@@ -2195 +5971 @@
       }
       _sceneFunc(context) {
-        var points = this.points(), length = points.length, tension = this.tension(), closed = this.closed(), bezier = this.bezier(), tp, len, n;
+        let points = this.points(), length = points.length, tension = this.tension(), closed = this.closed(), bezier = this.bezier(), tp, len, n;
         if (!length) {
           return;
@@ -2242 +6018 @@
       }
       _getTensionPointsClosed() {
-        var p = this.points(), len = p.length, tension = this.tension(), firstControlPoints = getControlPoints(p[len - 2], p[len - 1], p[0], p[1], p[2], p[3], tension), lastControlPoints = getControlPoints(p[len - 4], p[len - 3], p[len - 2], p[len - 1], p[0], p[1], tension), middle = expandPoints(p, tension), tp = [firstControlPoints[2], firstControlPoints[3]].concat(middle).concat([
+        const p = this.points(), len = p.length, tension = this.tension(), firstControlPoints = getControlPoints(p[len - 2], p[len - 1], p[0], p[1], p[2], p[3], tension), lastControlPoints = getControlPoints(p[len - 4], p[len - 3], p[len - 2], p[len - 1], p[0], p[1], tension), middle = expandPoints(p, tension), tp = [firstControlPoints[2], firstControlPoints[3]].concat(middle).concat([
           lastControlPoints[0],
           lastControlPoints[1],
@@ -2263 +6039 @@
       }
       getSelfRect() {
-        var points = this.points();
+        let points = this.points();
         if (points.length < 4) {
           return {
@@ -2283 +6059 @@
           points = this.points();
         }
-        var minX = points[0];
-        var maxX = points[0];
-        var minY = points[1];
-        var maxY = points[1];
-        var x, y;
-        for (var i = 0; i < points.length / 2; i++) {
+        let minX = points[0];
+        let maxX = points[0];
+        let minY = points[1];
+        let maxY = points[1];
+        let x, y;
+        for (let i = 0; i < points.length / 2; i++) {
           x = points[i * 2];
           y = points[i * 2 + 1];
@@ -3018 +6794 @@
     exports.binomialCoefficients = [[1], [1, 1], [1, 2, 1], [1, 3, 3, 1]];
     var getCubicArcLength = (xs, ys, t) => {
-      let z;
       let sum;
       let correctedT;
       const n = 20;
-      z = t / 2;
+      const z = t / 2;
       sum = 0;
       for (let i = 0; i < n; i++) {
@@ -3139 +6914 @@
       }
       _sceneFunc(context) {
-        var ca = this.dataArray;
+        const ca = this.dataArray;
         context.beginPath();
-        var isClosed = false;
-        for (var n = 0; n < ca.length; n++) {
-          var c = ca[n].command;
-          var p = ca[n].points;
+        let isClosed = false;
+        for (let n = 0; n < ca.length; n++) {
+          const c = ca[n].command;
+          const p = ca[n].points;
           switch (c) {
             case "L":
@@ -3184 +6959 @@
       }
       getSelfRect() {
-        var points = [];
+        let points = [];
         this.dataArray.forEach(function(data) {
           if (data.command === "A") {
-            var start = data.points[4];
-            var dTheta = data.points[5];
-            var end = data.points[4] + dTheta;
-            var inc = Math.PI / 180;
+            const start = data.points[4];
+            const dTheta = data.points[5];
+            const end = data.points[4] + dTheta;
+            let inc = Math.PI / 180;
             if (Math.abs(start - end) < inc) {
               inc = Math.abs(start - end);
@@ -3214 +6989 @@
           }
         });
-        var minX = points[0];
-        var maxX = points[0];
-        var minY = points[1];
-        var maxY = points[1];
-        var x, y;
-        for (var i = 0; i < points.length / 2; i++) {
+        let minX = points[0];
+        let maxX = points[0];
+        let minY = points[1];
+        let maxY = points[1];
+        let x, y;
+        for (let i = 0; i < points.length / 2; i++) {
           x = points[i * 2];
           y = points[i * 2 + 1];
@@ -3249 +7024 @@
       static getPathLength(dataArray) {
         let pathLength = 0;
-        for (var i = 0; i < dataArray.length; ++i) {
+        for (let i = 0; i < dataArray.length; ++i) {
           pathLength += dataArray[i].pathLength;
         }
@@ -3255 +7030 @@
       }
       static getPointAtLengthOfDataArray(length, dataArray) {
-        var point, i = 0, ii = dataArray.length;
+        let points, i = 0, ii = dataArray.length;
         if (!ii) {
           return null;
@@ -3264 +7039 @@
         }
         if (i === ii) {
-          point = dataArray[i - 1].points.slice(-2);
+          points = dataArray[i - 1].points.slice(-2);
           return {
-            x: point[0],
-            y: point[1]
+            x: points[0],
+            y: points[1]
           };
         }
         if (length < 0.01) {
-          point = dataArray[i].points.slice(0, 2);
+          points = dataArray[i].points.slice(0, 2);
           return {
-            x: point[0],
-            y: point[1]
+            x: points[0],
+            y: points[1]
           };
         }
-        var cp = dataArray[i];
-        var p = cp.points;
+        const cp = dataArray[i];
+        const p = cp.points;
         switch (cp.command) {
           case "L":
@@ -3335 +7110 @@
           return (1 - t) * (1 - t) * (1 - t);
         }
-        var x = P4x * CB1(pct) + P3x * CB2(pct) + P2x * CB3(pct) + P1x * CB4(pct);
-        var y = P4y * CB1(pct) + P3y * CB2(pct) + P2y * CB3(pct) + P1y * CB4(pct);
+        const x = P4x * CB1(pct) + P3x * CB2(pct) + P2x * CB3(pct) + P1x * CB4(pct);
+        const y = P4y * CB1(pct) + P3y * CB2(pct) + P2y * CB3(pct) + P1y * CB4(pct);
         return {
           x,
@@ -3352 +7127 @@
           return (1 - t) * (1 - t);
         }
-        var x = P3x * QB1(pct) + P2x * QB2(pct) + P1x * QB3(pct);
-        var y = P3y * QB1(pct) + P2y * QB2(pct) + P1y * QB3(pct);
+        const x = P3x * QB1(pct) + P2x * QB2(pct) + P1x * QB3(pct);
+        const y = P3y * QB1(pct) + P2y * QB2(pct) + P1y * QB3(pct);
         return {
           x,
@@ -3360 +7135 @@
       }
       static getPointOnEllipticalArc(cx, cy, rx, ry, theta, psi) {
-        var cosPsi = Math.cos(psi), sinPsi = Math.sin(psi);
-        var pt = {
+        const cosPsi = Math.cos(psi), sinPsi = Math.sin(psi);
+        const pt = {
           x: rx * Math.cos(theta),
           y: ry * Math.sin(theta)
@@ -3374 +7149 @@
           return [];
         }
-        var cs = data;
-        var cc = [
+        let cs = data;
+        const cc = [
           "m",
           "M",
@@ -3401 +7176 @@
           cs = cs.replace(new RegExp(cc[n], "g"), "|" + cc[n]);
         }
-        var arr = cs.split("|");
-        var ca = [];
-        var coords = [];
-        var cpx = 0;
-        var cpy = 0;
-        var re = /([-+]?((\d+\.\d+)|((\d+)|(\.\d+)))(?:e[-+]?\d+)?)/gi;
-        var match;
+        const arr = cs.split("|");
+        const ca = [];
+        const coords = [];
+        let cpx = 0;
+        let cpy = 0;
+        const re = /([-+]?((\d+\.\d+)|((\d+)|(\.\d+)))(?:e[-+]?\d+)?)/gi;
+        let match;
         for (n = 1; n < arr.length; n++) {
-          var str = arr[n];
-          var c = str.charAt(0);
+          let str = arr[n];
+          let c = str.charAt(0);
           str = str.slice(1);
           coords.length = 0;
@@ -3416 +7191 @@
             coords.push(match[0]);
           }
-          var p = [];
-          for (var j = 0, jlen = coords.length; j < jlen; j++) {
+          const p = [];
+          for (let j = 0, jlen = coords.length; j < jlen; j++) {
             if (coords[j] === "00") {
               p.push(0, 0);
               continue;
             }
-            var parsed = parseFloat(coords[j]);
+            const parsed = parseFloat(coords[j]);
             if (!isNaN(parsed)) {
               p.push(parsed);
@@ -3433 +7208 @@
               break;
             }
-            var cmd = "";
-            var points = [];
-            var startX = cpx, startY = cpy;
+            let cmd = "";
+            let points = [];
+            const startX = cpx, startY = cpy;
             var prevCmd, ctlPtx, ctlPty;
             var rx, ry, psi, fa, fs, x1, y1;
@@ -3457 +7232 @@
                 cmd = "M";
                 if (ca.length > 2 && ca[ca.length - 1].command === "z") {
-                  for (var idx = ca.length - 2; idx >= 0; idx--) {
+                  for (let idx = ca.length - 2; idx >= 0; idx--) {
                     if (ca[idx].command === "M") {
                       cpx = ca[idx].points[0] + dx;
@@ -3624 +7399 @@
       }
       static calcLength(x, y, cmd, points) {
-        var len, p1, p2, t;
-        var path = _Path;
+        let len, p1, p2, t;
+        const path = _Path;
         switch (cmd) {
           case "L":
@@ -3663 +7438 @@
       }
       static convertEndpointToCenterParameterization(x1, y1, x2, y2, fa, fs, rx, ry, psiDeg) {
-        var psi = psiDeg * (Math.PI / 180);
-        var xp = Math.cos(psi) * (x1 - x2) / 2 + Math.sin(psi) * (y1 - y2) / 2;
-        var yp = -1 * Math.sin(psi) * (x1 - x2) / 2 + Math.cos(psi) * (y1 - y2) / 2;
-        var lambda = xp * xp / (rx * rx) + yp * yp / (ry * ry);
+        const psi = psiDeg * (Math.PI / 180);
+        const xp = Math.cos(psi) * (x1 - x2) / 2 + Math.sin(psi) * (y1 - y2) / 2;
+        const yp = -1 * Math.sin(psi) * (x1 - x2) / 2 + Math.cos(psi) * (y1 - y2) / 2;
+        const lambda = xp * xp / (rx * rx) + yp * yp / (ry * ry);
         if (lambda > 1) {
           rx *= Math.sqrt(lambda);
           ry *= Math.sqrt(lambda);
         }
-        var f = Math.sqrt((rx * rx * (ry * ry) - rx * rx * (yp * yp) - ry * ry * (xp * xp)) / (rx * rx * (yp * yp) + ry * ry * (xp * xp)));
+        let f = Math.sqrt((rx * rx * (ry * ry) - rx * rx * (yp * yp) - ry * ry * (xp * xp)) / (rx * rx * (yp * yp) + ry * ry * (xp * xp)));
         if (fa === fs) {
           f *= -1;
@@ -3678 +7453 @@
           f = 0;
         }
-        var cxp = f * rx * yp / ry;
-        var cyp = f * -ry * xp / rx;
-        var cx = (x1 + x2) / 2 + Math.cos(psi) * cxp - Math.sin(psi) * cyp;
-        var cy = (y1 + y2) / 2 + Math.sin(psi) * cxp + Math.cos(psi) * cyp;
-        var vMag = function(v2) {
+        const cxp = f * rx * yp / ry;
+        const cyp = f * -ry * xp / rx;
+        const cx = (x1 + x2) / 2 + Math.cos(psi) * cxp - Math.sin(psi) * cyp;
+        const cy = (y1 + y2) / 2 + Math.sin(psi) * cxp + Math.cos(psi) * cyp;
+        const vMag = function(v2) {
           return Math.sqrt(v2[0] * v2[0] + v2[1] * v2[1]);
         };
-        var vRatio = function(u2, v2) {
+        const vRatio = function(u2, v2) {
           return (u2[0] * v2[0] + u2[1] * v2[1]) / (vMag(u2) * vMag(v2));
         };
-        var vAngle = function(u2, v2) {
+        const vAngle = function(u2, v2) {
           return (u2[0] * v2[1] < u2[1] * v2[0] ? -1 : 1) * Math.acos(vRatio(u2, v2));
         };
-        var theta = vAngle([1, 0], [(xp - cxp) / rx, (yp - cyp) / ry]);
-        var u = [(xp - cxp) / rx, (yp - cyp) / ry];
-        var v = [(-1 * xp - cxp) / rx, (-1 * yp - cyp) / ry];
-        var dTheta = vAngle(u, v);
+        const theta = vAngle([1, 0], [(xp - cxp) / rx, (yp - cyp) / ry]);
+        const u = [(xp - cxp) / rx, (yp - cyp) / ry];
+        const v = [(-1 * xp - cxp) / rx, (-1 * yp - cyp) / ry];
+        let dTheta = vAngle(u, v);
         if (vRatio(u, v) <= -1) {
           dTheta = Math.PI;
@@ -3732 +7507 @@
       _sceneFunc(ctx) {
         super._sceneFunc(ctx);
-        var PI2 = Math.PI * 2;
-        var points = this.points();
-        var tp = points;
-        var fromTension = this.tension() !== 0 && points.length > 4;
+        const PI2 = Math.PI * 2;
+        const points = this.points();
+        let tp = points;
+        const fromTension = this.tension() !== 0 && points.length > 4;
         if (fromTension) {
           tp = this.getTensionPoints();
         }
-        var length = this.pointerLength();
-        var n = points.length;
-        var dx, dy;
+        const length = this.pointerLength();
+        const n = points.length;
+        let dx, dy;
         if (fromTension) {
           const lp = [
@@ -3759 +7534 @@
           dy = points[n - 1] - points[n - 3];
         }
-        var radians = (Math.atan2(dy, dx) + PI2) % PI2;
-        var width = this.pointerWidth();
+        const radians = (Math.atan2(dy, dx) + PI2) % PI2;
+        const width = this.pointerWidth();
         if (this.pointerAtEnding()) {
           ctx.save();
@@ -3794 +7569 @@
       }
       __fillStroke(ctx) {
-        var isDashEnabled = this.dashEnabled();
+        const isDashEnabled = this.dashEnabled();
         if (isDashEnabled) {
           this.attrs.dashEnabled = false;
@@ -3880 +7655 @@
     var Ellipse = class extends Shape_1.Shape {
       _sceneFunc(context) {
-        var rx = this.radiusX(), ry = this.radiusY();
+        const rx = this.radiusX(), ry = this.radiusY();
         context.beginPath();
         context.save();
@@ -3995 +7770 @@
       }
       _hitFunc(context) {
-        var width = this.width(), height = this.height(), cornerRadius = this.cornerRadius();
+        const width = this.width(), height = this.height(), cornerRadius = this.cornerRadius();
         context.beginPath();
         if (!cornerRadius) {
@@ -4014 +7789 @@
       }
       static fromURL(url, callback, onError = null) {
-        var img = Util_1.Util.createImageElement();
+        const img = Util_1.Util.createImageElement();
         img.onload = function() {
-          var image = new _Image({
+          const image = new _Image({
             image: img
           });
@@ -4085 +7860 @@
       }
       _addListeners(text) {
-        var that = this, n;
-        var func = function() {
+        let that = this, n;
+        const func = function() {
           that._sync();
         };
@@ -4100 +7875 @@
       }
       _sync() {
-        var text = this.getText(), tag = this.getTag(), width, height, pointerDirection, pointerWidth, x, y, pointerHeight;
+        let text = this.getText(), tag = this.getTag(), width, height, pointerDirection, pointerWidth, x, y, pointerHeight;
         if (text && tag) {
           width = text.width();
@@ -4145 +7920 @@
     var Tag = class extends Shape_1.Shape {
       _sceneFunc(context) {
-        var width = this.width(), height = this.height(), pointerDirection = this.pointerDirection(), pointerWidth = this.pointerWidth(), pointerHeight = this.pointerHeight(), cornerRadius = this.cornerRadius();
+        const width = this.width(), height = this.height(), pointerDirection = this.pointerDirection(), pointerWidth = this.pointerWidth(), pointerHeight = this.pointerHeight(), cornerRadius = this.cornerRadius();
         let topLeft = 0;
         let topRight = 0;
@@ -4192 +7967 @@
       }
       getSelfRect() {
-        var x = 0, y = 0, pointerWidth = this.pointerWidth(), pointerHeight = this.pointerHeight(), direction = this.pointerDirection(), width = this.width(), height = this.height();
+        let x = 0, y = 0, pointerWidth = this.pointerWidth(), pointerHeight = this.pointerHeight(), direction = this.pointerDirection(), width = this.width(), height = this.height();
         if (direction === UP) {
           y -= pointerHeight;
@@ -4219 +7994 @@
     Factory_1.Factory.addGetterSetter(Tag, "pointerHeight", 0, (0, Validators_1.getNumberValidator)());
     Factory_1.Factory.addGetterSetter(Tag, "cornerRadius", 0, (0, Validators_1.getNumberOrArrayOfNumbersValidator)(4));
+  }
+});
+
+// node_modules/konva/lib/shapes/Rect.js
+var require_Rect = __commonJS({
+  "node_modules/konva/lib/shapes/Rect.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Rect = void 0;
+    var Factory_1 = require_Factory();
+    var Shape_1 = require_Shape();
+    var Global_1 = require_Global();
+    var Util_1 = require_Util();
+    var Validators_1 = require_Validators();
+    var Rect = class extends Shape_1.Shape {
+      _sceneFunc(context) {
+        const cornerRadius = this.cornerRadius(), width = this.width(), height = this.height();
+        context.beginPath();
+        if (!cornerRadius) {
+          context.rect(0, 0, width, height);
+        } else {
+          Util_1.Util.drawRoundedRectPath(context, width, height, cornerRadius);
+        }
+        context.closePath();
+        context.fillStrokeShape(this);
+      }
+    };
+    exports.Rect = Rect;
+    Rect.prototype.className = "Rect";
+    (0, Global_1._registerNode)(Rect);
+    Factory_1.Factory.addGetterSetter(Rect, "cornerRadius", 0, (0, Validators_1.getNumberOrArrayOfNumbersValidator)(4));
   }
 });
@@ -4237 +8043 @@
         context.beginPath();
         context.moveTo(points[0].x, points[0].y);
-        for (var n = 1; n < points.length; n++) {
+        for (let n = 1; n < points.length; n++) {
           context.lineTo(points[n].x, points[n].y);
         }
@@ -4247 +8053 @@
         const radius = this.attrs.radius || 0;
         const points = [];
-        for (var n = 0; n < sides; n++) {
+        for (let n = 0; n < sides; n++) {
           points.push({
             x: radius * Math.sin(n * 2 * Math.PI / sides),
@@ -4257 +8063 @@
       getSelfRect() {
         const points = this._getPoints();
-        var minX = points[0].x;
-        var maxX = points[0].y;
-        var minY = points[0].x;
-        var maxY = points[0].y;
+        let minX = points[0].x;
+        let maxX = points[0].y;
+        let minY = points[0].x;
+        let maxY = points[0].y;
         points.forEach((point) => {
           minX = Math.min(minX, point.x);
@@ -4294 +8100 @@
     Factory_1.Factory.addGetterSetter(RegularPolygon, "radius", 0, (0, Validators_1.getNumberValidator)());
     Factory_1.Factory.addGetterSetter(RegularPolygon, "sides", 0, (0, Validators_1.getNumberValidator)());
+  }
+});
+
+// node_modules/konva/lib/shapes/Ring.js
+var require_Ring = __commonJS({
+  "node_modules/konva/lib/shapes/Ring.js"(exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Ring = void 0;
+    var Factory_1 = require_Factory();
+    var Shape_1 = require_Shape();
+    var Validators_1 = require_Validators();
+    var Global_1 = require_Global();
+    var PIx2 = Math.PI * 2;
+    var Ring = class extends Shape_1.Shape {
+      _sceneFunc(context) {
+        context.beginPath();
+        context.arc(0, 0, this.innerRadius(), 0, PIx2, false);
+        context.moveTo(this.outerRadius(), 0);
+        context.arc(0, 0, this.outerRadius(), PIx2, 0, true);
+        context.closePath();
+        context.fillStrokeShape(this);
+      }
+      getWidth() {
+        return this.outerRadius() * 2;
+      }
+      getHeight() {
+        return this.outerRadius() * 2;
+      }
+      setWidth(width) {
+        this.outerRadius(width / 2);
+      }
+      setHeight(height) {
+        this.outerRadius(height / 2);
+      }
+    };
+    exports.Ring = Ring;
+    Ring.prototype.className = "Ring";
+    Ring.prototype._centroid = true;
+    Ring.prototype._attrsAffectingSize = ["innerRadius", "outerRadius"];
+    (0, Global_1._registerNode)(Ring);
+    Factory_1.Factory.addGetterSetter(Ring, "innerRadius", 0, (0, Validators_1.getNumberValidator)());
+    Factory_1.Factory.addGetterSetter(Ring, "outerRadius", 0, (0, Validators_1.getNumberValidator)());
   }
 });
@@ -4313 +8162 @@
         this._updated = true;
         this.anim = new Animation_1.Animation(() => {
-          var updated = this._updated;
+          const updated = this._updated;
           this._updated = false;
           return updated;
@@ -4332 +8181 @@
       }
       _sceneFunc(context) {
-        var anim = this.animation(), index = this.frameIndex(), ix4 = index * 4, set = this.animations()[anim], offsets = this.frameOffsets(), x = set[ix4 + 0], y = set[ix4 + 1], width = set[ix4 + 2], height = set[ix4 + 3], image = this.image();
+        const anim = this.animation(), index = this.frameIndex(), ix4 = index * 4, set = this.animations()[anim], offsets = this.frameOffsets(), x = set[ix4 + 0], y = set[ix4 + 1], width = set[ix4 + 2], height = set[ix4 + 3], image = this.image();
         if (this.hasFill() || this.hasStroke()) {
           context.beginPath();
@@ -4341 +8190 @@
         if (image) {
           if (offsets) {
-            var offset = offsets[anim], ix2 = index * 2;
+            const offset = offsets[anim], ix2 = index * 2;
             context.drawImage(image, x, y, width, height, offset[ix2 + 0], offset[ix2 + 1], width, height);
           } else {
@@ -4349 +8198 @@
       }
       _hitFunc(context) {
-        var anim = this.animation(), index = this.frameIndex(), ix4 = index * 4, set = this.animations()[anim], offsets = this.frameOffsets(), width = set[ix4 + 2], height = set[ix4 + 3];
+        const anim = this.animation(), index = this.frameIndex(), ix4 = index * 4, set = this.animations()[anim], offsets = this.frameOffsets(), width = set[ix4 + 2], height = set[ix4 + 3];
         context.beginPath();
         if (offsets) {
-          var offset = offsets[anim];
-          var ix2 = index * 2;
+          const offset = offsets[anim];
+          const ix2 = index * 2;
           context.rect(offset[ix2 + 0], offset[ix2 + 1], width, height);
         } else {
@@ -4365 +8214 @@
       }
       _setInterval() {
-        var that = this;
+        const that = this;
         this.interval = setInterval(function() {
           that._updateIndex();
@@ -4374 +8223 @@
           return;
         }
-        var layer = this.getLayer();
+        const layer = this.getLayer();
         this.anim.setLayers(layer);
         this._setInterval();
@@ -4387 +8236 @@
       }
       _updateIndex() {
-        var index = this.frameIndex(), animation = this.animation(), animations = this.animations(), anim = animations[animation], len = anim.length / 4;
+        const index = this.frameIndex(), animation = this.animation(), animations = this.animations(), anim = animations[animation], len = anim.length / 4;
         if (index < len - 1) {
           this.frameIndex(index + 1);
@@ -4424 +8273 @@
     var Star = class extends Shape_1.Shape {
       _sceneFunc(context) {
-        var innerRadius = this.innerRadius(), outerRadius = this.outerRadius(), numPoints = this.numPoints();
+        const innerRadius = this.innerRadius(), outerRadius = this.outerRadius(), numPoints = this.numPoints();
         context.beginPath();
         context.moveTo(0, 0 - outerRadius);
-        for (var n = 1; n < numPoints * 2; n++) {
-          var radius = n % 2 === 0 ? outerRadius : innerRadius;
-          var x = radius * Math.sin(n * Math.PI / numPoints);
-          var y = -1 * radius * Math.cos(n * Math.PI / numPoints);
+        for (let n = 1; n < numPoints * 2; n++) {
+          const radius = n % 2 === 0 ? outerRadius : innerRadius;
+          const x = radius * Math.sin(n * Math.PI / numPoints);
+          const y = -1 * radius * Math.cos(n * Math.PI / numPoints);
           context.lineTo(x, y);
         }
@@ -4465 +8314 @@
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.Text = exports.stringToArray = void 0;
+    exports.Text = void 0;
+    exports.stringToArray = stringToArray;
     var Util_1 = require_Util();
     var Factory_1 = require_Factory();
@@ -4473 +8323 @@
     var Global_2 = require_Global();
     function stringToArray(string) {
-      return Array.from(string);
+      return [...string].reduce((acc, char, index, array) => {
+        if (new RegExp("\\p{Emoji_Modifier_Base}\\p{Emoji_Modifier}?(?:\\u200D\\p{Emoji_Presentation})+", "u").test(char)) {
+          acc.push(char);
+        } else if (new RegExp("\\p{Regional_Indicator}{2}", "u").test(char + (array[index + 1] || ""))) {
+          acc.push(char + array[index + 1]);
+        } else if (index > 0 && new RegExp("\\p{Mn}|\\p{Me}|\\p{Mc}", "u").test(char)) {
+          acc[acc.length - 1] += char;
+        } else {
+          acc.push(char);
+        }
+        return acc;
+      }, []);
     }
-    exports.stringToArray = stringToArray;
     var AUTO = "auto";
     var CENTER = "center";
@@ -4554 +8414 @@
         this._partialTextX = 0;
         this._partialTextY = 0;
-        for (var n = 0; n < attrChangeListLen; n++) {
+        for (let n = 0; n < attrChangeListLen; n++) {
           this.on(ATTR_CHANGE_LIST[n] + CHANGE_KONVA, this._setTextData);
         }
@@ -4560 +8420 @@
       }
       _sceneFunc(context) {
-        var textArr = this.textArr, textArrLen = textArr.length;
+        const textArr = this.textArr, textArrLen = textArr.length;
         if (!this.text()) {
           return;
         }
-        var padding = this.padding(), fontSize = this.fontSize(), lineHeightPx = this.lineHeight() * fontSize, verticalAlign = this.verticalAlign(), direction = this.direction(), alignY = 0, align = this.align(), totalWidth = this.getWidth(), letterSpacing = this.letterSpacing(), fill = this.fill(), textDecoration = this.textDecoration(), shouldUnderline = textDecoration.indexOf("underline") !== -1, shouldLineThrough = textDecoration.indexOf("line-through") !== -1, n;
+        let padding = this.padding(), fontSize = this.fontSize(), lineHeightPx = this.lineHeight() * fontSize, verticalAlign = this.verticalAlign(), direction = this.direction(), alignY = 0, align = this.align(), totalWidth = this.getWidth(), letterSpacing = this.letterSpacing(), fill = this.fill(), textDecoration = this.textDecoration(), shouldUnderline = textDecoration.indexOf("underline") !== -1, shouldLineThrough = textDecoration.indexOf("line-through") !== -1, n;
         direction = direction === INHERIT ? context.direction : direction;
-        var translateY = lineHeightPx / 2;
-        var baseline = MIDDLE;
+        let translateY = lineHeightPx / 2;
+        let baseline = MIDDLE;
         if (Global_1.Konva._fixTextRendering) {
-          var metrics = this.measureSize("M");
+          const metrics = this.measureSize("M");
           baseline = "alphabetic";
           translateY = (metrics.fontBoundingBoxAscent - metrics.fontBoundingBoxDescent) / 2 + lineHeightPx / 2;
@@ -4600 +8460 @@
             context.save();
             context.beginPath();
-            let yOffset = Global_1.Konva._fixTextRendering ? Math.round(fontSize / 4) : Math.round(fontSize / 2);
+            const yOffset = Global_1.Konva._fixTextRendering ? Math.round(fontSize / 4) : Math.round(fontSize / 2);
             const x = lineTranslateX;
             const y = translateY + lineTranslateY + yOffset;
@@ -4617 +8477 @@
             context.save();
             context.beginPath();
-            let yOffset = Global_1.Konva._fixTextRendering ? -Math.round(fontSize / 4) : 0;
+            const yOffset = Global_1.Konva._fixTextRendering ? -Math.round(fontSize / 4) : 0;
             context.moveTo(lineTranslateX, translateY + lineTranslateY + yOffset);
             spacesNumber = text.split(" ").length - 1;
@@ -4631 +8491 @@
           if (direction !== RTL && (letterSpacing !== 0 || align === JUSTIFY)) {
             spacesNumber = text.split(" ").length - 1;
-            var array = stringToArray(text);
-            for (var li = 0; li < array.length; li++) {
-              var letter = array[li];
+            const array = stringToArray(text);
+            for (let li = 0; li < array.length; li++) {
+              const letter = array[li];
               if (letter === " " && !lastLine && align === JUSTIFY) {
                 lineTranslateX += (totalWidth - padding * 2 - width) / spacesNumber;
@@ -4659 +8519 @@
       }
       _hitFunc(context) {
-        var width = this.getWidth(), height = this.getHeight();
+        const width = this.getWidth(), height = this.getHeight();
         context.beginPath();
         context.rect(0, 0, width, height);
@@ -4666 +8526 @@
       }
       setText(text) {
-        var str = Util_1.Util._isString(text) ? text : text === null || text === void 0 ? "" : text + "";
+        const str = Util_1.Util._isString(text) ? text : text === null || text === void 0 ? "" : text + "";
         this._setAttr(TEXT, str);
         return this;
       }
       getWidth() {
-        var isAuto = this.attrs.width === AUTO || this.attrs.width === void 0;
+        const isAuto = this.attrs.width === AUTO || this.attrs.width === void 0;
         return isAuto ? this.getTextWidth() + this.padding() * 2 : this.attrs.width;
       }
       getHeight() {
-        var isAuto = this.attrs.height === AUTO || this.attrs.height === void 0;
+        const isAuto = this.attrs.height === AUTO || this.attrs.height === void 0;
         return isAuto ? this.fontSize() * this.textArr.length * this.lineHeight() + this.padding() * 2 : this.attrs.height;
       }
@@ -4687 +8547 @@
       measureSize(text) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        var _context = getDummyContext(), fontSize = this.fontSize(), metrics;
+        let _context = getDummyContext(), fontSize = this.fontSize(), metrics;
         _context.save();
         _context.font = this._getContextFont();
@@ -4717 +8577 @@
           line = line.trim();
         }
-        var width = this._getTextWidth(line);
+        const width = this._getTextWidth(line);
         return this.textArr.push({
           text: line,
@@ -4725 +8585 @@
       }
       _getTextWidth(text) {
-        var letterSpacing = this.letterSpacing();
-        var length = text.length;
+        const letterSpacing = this.letterSpacing();
+        const length = text.length;
         return getDummyContext().measureText(text).width + (length ? letterSpacing * (length - 1) : 0);
       }
       _setTextData() {
-        var lines = this.text().split("\n"), fontSize = +this.fontSize(), textWidth = 0, lineHeightPx = this.lineHeight() * fontSize, width = this.attrs.width, height = this.attrs.height, fixedWidth = width !== AUTO && width !== void 0, fixedHeight = height !== AUTO && height !== void 0, padding = this.padding(), maxWidth = width - padding * 2, maxHeightPx = height - padding * 2, currentHeightPx = 0, wrap = this.wrap(), shouldWrap = wrap !== NONE, wrapAtWord = wrap !== CHAR && shouldWrap, shouldAddEllipsis = this.ellipsis();
+        let lines = this.text().split("\n"), fontSize = +this.fontSize(), textWidth = 0, lineHeightPx = this.lineHeight() * fontSize, width = this.attrs.width, height = this.attrs.height, fixedWidth = width !== AUTO && width !== void 0, fixedHeight = height !== AUTO && height !== void 0, padding = this.padding(), maxWidth = width - padding * 2, maxHeightPx = height - padding * 2, currentHeightPx = 0, wrap = this.wrap(), shouldWrap = wrap !== NONE, wrapAtWord = wrap !== CHAR && shouldWrap, shouldAddEllipsis = this.ellipsis();
         this.textArr = [];
         getDummyContext().font = this._getContextFont();
-        var additionalWidth = shouldAddEllipsis ? this._getTextWidth(ELLIPSIS) : 0;
-        for (var i = 0, max = lines.length; i < max; ++i) {
-          var line = lines[i];
-          var lineWidth = this._getTextWidth(line);
+        const additionalWidth = shouldAddEllipsis ? this._getTextWidth(ELLIPSIS) : 0;
+        for (let i = 0, max = lines.length; i < max; ++i) {
+          let line = lines[i];
+          let lineWidth = this._getTextWidth(line);
           if (fixedWidth && lineWidth > maxWidth) {
             while (line.length > 0) {
-              var low = 0, high = line.length, match = "", matchWidth = 0;
+              let low = 0, high = line.length, match = "", matchWidth = 0;
               while (low < high) {
-                var mid = low + high >>> 1, substr = line.slice(0, mid + 1), substrWidth = this._getTextWidth(substr) + additionalWidth;
+                const mid = low + high >>> 1, substr = line.slice(0, mid + 1), substrWidth = this._getTextWidth(substr) + additionalWidth;
                 if (substrWidth <= maxWidth) {
                   low = mid + 1;
@@ -4753 +8613 @@
                 if (wrapAtWord) {
                   var wrapIndex;
-                  var nextChar = line[match.length];
-                  var nextIsSpaceOrDash = nextChar === SPACE || nextChar === DASH;
+                  const nextChar = line[match.length];
+                  const nextIsSpaceOrDash = nextChar === SPACE || nextChar === DASH;
                   if (nextIsSpaceOrDash && matchWidth <= maxWidth) {
                     wrapIndex = match.length;
@@ -4770 +8630 @@
                 textWidth = Math.max(textWidth, matchWidth);
                 currentHeightPx += lineHeightPx;
-                var shouldHandleEllipsis = this._shouldHandleEllipsis(currentHeightPx);
+                const shouldHandleEllipsis = this._shouldHandleEllipsis(currentHeightPx);
                 if (shouldHandleEllipsis) {
                   this._tryToAddEllipsisToLastLine();
@@ -4809 +8669 @@
       }
       _shouldHandleEllipsis(currentHeightPx) {
-        var fontSize = +this.fontSize(), lineHeightPx = this.lineHeight() * fontSize, height = this.attrs.height, fixedHeight = height !== AUTO && height !== void 0, padding = this.padding(), maxHeightPx = height - padding * 2, wrap = this.wrap(), shouldWrap = wrap !== NONE;
+        const fontSize = +this.fontSize(), lineHeightPx = this.lineHeight() * fontSize, height = this.attrs.height, fixedHeight = height !== AUTO && height !== void 0, padding = this.padding(), maxHeightPx = height - padding * 2, wrap = this.wrap(), shouldWrap = wrap !== NONE;
         return !shouldWrap || fixedHeight && currentHeightPx + lineHeightPx > maxHeightPx;
       }
       _tryToAddEllipsisToLastLine() {
-        var width = this.attrs.width, fixedWidth = width !== AUTO && width !== void 0, padding = this.padding(), maxWidth = width - padding * 2, shouldAddEllipsis = this.ellipsis();
-        var lastLine = this.textArr[this.textArr.length - 1];
+        const width = this.attrs.width, fixedWidth = width !== AUTO && width !== void 0, padding = this.padding(), maxWidth = width - padding * 2, shouldAddEllipsis = this.ellipsis();
+        const lastLine = this.textArr[this.textArr.length - 1];
         if (!lastLine || !shouldAddEllipsis) {
           return;
         }
         if (fixedWidth) {
-          var haveSpace = this._getTextWidth(lastLine.text + ELLIPSIS) < maxWidth;
+          const haveSpace = this._getTextWidth(lastLine.text + ELLIPSIS) < maxWidth;
           if (!haveSpace) {
             lastLine.text = lastLine.text.slice(0, lastLine.text.length - 3);
@@ -4927 +8787 @@
         context.setAttr("textAlign", "left");
         context.save();
-        var textDecoration = this.textDecoration();
-        var fill = this.fill();
-        var fontSize = this.fontSize();
-        var glyphInfo = this.glyphInfo;
+        const textDecoration = this.textDecoration();
+        const fill = this.fill();
+        const fontSize = this.fontSize();
+        const glyphInfo = this.glyphInfo;
         if (textDecoration === "underline") {
           context.beginPath();
         }
-        for (var i = 0; i < glyphInfo.length; i++) {
+        for (let i = 0; i < glyphInfo.length; i++) {
           context.save();
-          var p0 = glyphInfo[i].p0;
+          const p0 = glyphInfo[i].p0;
           context.translate(p0.x, p0.y);
           context.rotate(glyphInfo[i].rotation);
@@ -4958 +8818 @@
       _hitFunc(context) {
         context.beginPath();
-        var glyphInfo = this.glyphInfo;
+        const glyphInfo = this.glyphInfo;
         if (glyphInfo.length >= 1) {
-          var p0 = glyphInfo[0].p0;
+          const p0 = glyphInfo[0].p0;
           context.moveTo(p0.x, p0.y);
         }
-        for (var i = 0; i < glyphInfo.length; i++) {
-          var p1 = glyphInfo[i].p1;
+        for (let i = 0; i < glyphInfo.length; i++) {
+          const p1 = glyphInfo[i].p1;
           context.lineTo(p1.x, p1.y);
         }
@@ -4985 +8845 @@
       }
       _getTextSize(text) {
-        var dummyCanvas = this.dummyCanvas;
-        var _context = dummyCanvas.getContext("2d");
+        const dummyCanvas = this.dummyCanvas;
+        const _context = dummyCanvas.getContext("2d");
         _context.save();
         _context.font = this._getContextFont();
-        var metrics = _context.measureText(text);
+        const metrics = _context.measureText(text);
         _context.restore();
         return {
@@ -5017 +8877 @@
         const charArr = (0, Text_1.stringToArray)(this.text());
         let offsetToGlyph = offset;
-        for (var i = 0; i < charArr.length; i++) {
+        for (let i = 0; i < charArr.length; i++) {
           const charStartPoint = this._getPointAtLength(offsetToGlyph);
           if (!charStartPoint)
@@ -5063 +8923 @@
           };
         }
-        var points = [];
+        const points = [];
         this.glyphInfo.forEach(function(info) {
           points.push(info.p0.x);
@@ -5070 +8930 @@
           points.push(info.p1.y);
         });
-        var minX = points[0] || 0;
-        var maxX = points[0] || 0;
-        var minY = points[1] || 0;
-        var maxY = points[1] || 0;
-        var x, y;
-        for (var i = 0; i < points.length / 2; i++) {
+        let minX = points[0] || 0;
+        let maxX = points[0] || 0;
+        let minY = points[1] || 0;
+        let maxY = points[1] || 0;
+        let x, y;
+        for (let i = 0; i < points.length / 2; i++) {
           x = points[i * 2];
           y = points[i * 2 + 1];
@@ -5083 +8943 @@
           maxY = Math.max(maxY, y);
         }
-        var fontSize = this.fontSize();
+        const fontSize = this.fontSize();
         return {
           x: minX - fontSize / 2,
@@ -5181 +9041 @@
       }
       rad += Util_1.Util.degToRad(ANGLES[anchorName] || 0);
-      var angle = (Util_1.Util.radToDeg(rad) % 360 + 360) % 360;
+      const angle = (Util_1.Util.radToDeg(rad) % 360 + 360) % 360;
       if (Util_1.Util._inRange(angle, 315 + 22.5, 360) || Util_1.Util._inRange(angle, 0, 22.5)) {
         return "ns-resize";
@@ -5309 +9169 @@
         });
         this._resetTransformCache();
-        var elementsCreated = !!this.findOne(".top-left");
+        const elementsCreated = !!this.findOne(".top-left");
         if (elementsCreated) {
           this.update();
@@ -5371 +9231 @@
       }
       __getNodeShape(node, rot = this.rotation(), relative) {
-        var rect = node.getClientRect({
+        const rect = node.getClientRect({
           skipTransform: true,
           skipShadow: true,
           skipStroke: this.ignoreStroke()
         });
-        var absScale = node.getAbsoluteScale(relative);
-        var absPos = node.getAbsolutePosition(relative);
-        var dx = rect.x * absScale.x - node.offsetX() * absScale.x;
-        var dy = rect.y * absScale.y - node.offsetY() * absScale.y;
+        const absScale = node.getAbsoluteScale(relative);
+        const absPos = node.getAbsolutePosition(relative);
+        const dx = rect.x * absScale.x - node.offsetX() * absScale.x;
+        const dy = rect.y * absScale.y - node.offsetY() * absScale.y;
         const rotation = (Global_1.Konva.getAngle(node.getAbsoluteRotation()) + Math.PI * 2) % (Math.PI * 2);
         const box = {
@@ -5394 +9254 @@
       }
       __getNodeRect() {
-        var node = this.getNode();
+        const node = this.getNode();
         if (!node) {
           return {
@@ -5411 +9271 @@
             skipStroke: this.ignoreStroke()
           });
-          var points = [
+          const points = [
             { x: box.x, y: box.y },
             { x: box.x + box.width, y: box.y },
@@ -5417 +9277 @@
             { x: box.x, y: box.y + box.height }
           ];
-          var trans = node2.getAbsoluteTransform();
+          const trans = node2.getAbsoluteTransform();
           points.forEach(function(point) {
-            var transformed = trans.point(point);
+            const transformed = trans.point(point);
             totalPoints.push(transformed);
           });
@@ -5425 +9285 @@
         const tr = new Util_1.Transform();
         tr.rotate(-Global_1.Konva.getAngle(this.rotation()));
-        var minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+        let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
         totalPoints.forEach(function(point) {
-          var transformed = tr.point(point);
+          const transformed = tr.point(point);
           if (minX === void 0) {
             minX = maxX = transformed.x;
@@ -5467 +9327 @@
       }
       _createAnchor(name) {
-        var anchor = new Rect_1.Rect({
+        const anchor = new Rect_1.Rect({
           stroke: "rgb(0, 161, 255)",
           fill: "white",
@@ -5476 +9336 @@
           hitStrokeWidth: TOUCH_DEVICE ? 10 : "auto"
         });
-        var self = this;
+        const self = this;
         anchor.on("mousedown touchstart", function(e) {
           self._handleMouseDown(e);
@@ -5488 +9348 @@
         });
         anchor.on("mouseenter", () => {
-          var rad = Global_1.Konva.getAngle(this.rotation());
-          var rotateCursor = this.rotateAnchorCursor();
-          var cursor = getCursor(name, rad, rotateCursor);
+          const rad = Global_1.Konva.getAngle(this.rotation());
+          const rotateCursor = this.rotateAnchorCursor();
+          const cursor = getCursor(name, rad, rotateCursor);
           anchor.getStage().content && (anchor.getStage().content.style.cursor = cursor);
           this._cursorChange = true;
@@ -5501 +9361 @@
       }
       _createBack() {
-        var back = new Shape_1.Shape({
+        const back = new Shape_1.Shape({
           name: "back",
           width: 0,
@@ -5507 +9367 @@
           draggable: true,
           sceneFunc(ctx, shape) {
-            var tr = shape.getParent();
-            var padding = tr.padding();
+            const tr = shape.getParent();
+            const padding = tr.padding();
             ctx.beginPath();
             ctx.rect(-padding, -padding, shape.width() + padding * 2, shape.height() + padding * 2);
@@ -5521 +9381 @@
               return;
             }
-            var padding = this.padding();
+            const padding = this.padding();
             ctx.beginPath();
             ctx.rect(-padding, -padding, shape.width() + padding * 2, shape.height() + padding * 2);
@@ -5547 +9407 @@
         }
         this._movingAnchorName = e.target.name().split(" ")[0];
-        var attrs = this._getNodeRect();
-        var width = attrs.width;
-        var height = attrs.height;
-        var hypotenuse = Math.sqrt(Math.pow(width, 2) + Math.pow(height, 2));
+        const attrs = this._getNodeRect();
+        const width = attrs.width;
+        const height = attrs.height;
+        const hypotenuse = Math.sqrt(Math.pow(width, 2) + Math.pow(height, 2));
         this.sin = Math.abs(height / hypotenuse);
         this.cos = Math.abs(width / hypotenuse);
@@ -5560 +9420 @@
         }
         this._transforming = true;
-        var ap = e.target.getAbsolutePosition();
-        var pos = e.target.getStage().getPointerPosition();
+        const ap = e.target.getAbsolutePosition();
+        const pos = e.target.getStage().getPointerPosition();
         this._anchorDragOffset = {
           x: pos.x - ap.x,
@@ -5573 +9433 @@
       }
       _handleMouseMove(e) {
-        var x, y, newHypotenuse;
-        var anchorNode = this.findOne("." + this._movingAnchorName);
-        var stage = anchorNode.getStage();
+        let x, y, newHypotenuse;
+        const anchorNode = this.findOne("." + this._movingAnchorName);
+        const stage = anchorNode.getStage();
         stage.setPointersPositions(e);
         const pp = stage.getPointerPosition();
@@ -5592 +9452 @@
         }
         if (this._movingAnchorName === "rotater") {
-          var attrs = this._getNodeRect();
+          const attrs = this._getNodeRect();
           x = anchorNode.x() - attrs.width / 2;
           y = -anchorNode.y() + attrs.height / 2;
@@ -5599 +9459 @@
             delta -= Math.PI;
           }
-          var oldRotation = Global_1.Konva.getAngle(this.rotation());
+          const oldRotation = Global_1.Konva.getAngle(this.rotation());
           const newRotation = oldRotation + delta;
           const tol = Global_1.Konva.getAngle(this.rotationSnapTolerance());
@@ -5608 +9468 @@
           return;
         }
-        var shiftBehavior = this.shiftBehavior();
-        var keepProportion;
+        const shiftBehavior = this.shiftBehavior();
+        let keepProportion;
         if (shiftBehavior === "inverted") {
           keepProportion = this.keepRatio() && !e.shiftKey;
@@ -5705 +9565 @@
         var centeredScaling = this.centeredScaling() || e.altKey;
         if (centeredScaling) {
-          var topLeft = this.findOne(".top-left");
-          var bottomRight = this.findOne(".bottom-right");
-          var topOffsetX = topLeft.x();
-          var topOffsetY = topLeft.y();
-          var bottomOffsetX = this.getWidth() - bottomRight.x();
-          var bottomOffsetY = this.getHeight() - bottomRight.y();
+          const topLeft = this.findOne(".top-left");
+          const bottomRight = this.findOne(".bottom-right");
+          const topOffsetX = topLeft.x();
+          const topOffsetY = topLeft.y();
+          const bottomOffsetX = this.getWidth() - bottomRight.x();
+          const bottomOffsetY = this.getHeight() - bottomRight.y();
           bottomRight.move({
             x: -topOffsetX,
@@ -5720 +9580 @@
           });
         }
-        var absPos = this.findOne(".top-left").getAbsolutePosition();
+        const absPos = this.findOne(".top-left").getAbsolutePosition();
         x = absPos.x;
         y = absPos.y;
-        var width = this.findOne(".bottom-right").x() - this.findOne(".top-left").x();
-        var height = this.findOne(".bottom-right").y() - this.findOne(".top-left").y();
+        const width = this.findOne(".bottom-right").x() - this.findOne(".top-left").x();
+        const height = this.findOne(".bottom-right").y() - this.findOne(".top-left").y();
         this._fitNodesInto({
           x,
@@ -5749 +9609 @@
             window.removeEventListener("touchend", this._handleMouseUp, true);
           }
-          var node = this.getNode();
+          const node = this.getNode();
           activeTransformersCount--;
           this._fire("transformend", { evt: e, target: node });
@@ -5764 +9624 @@
       }
       _fitNodesInto(newAttrs, evt) {
-        var oldAttrs = this._getNodeRect();
+        const oldAttrs = this._getNodeRect();
         const minSize = 1;
         if (Util_1.Util._inRange(newAttrs.width, -this.padding() * 2 - minSize, minSize)) {
@@ -5774 +9634 @@
           return;
         }
-        var t = new Util_1.Transform();
+        const t = new Util_1.Transform();
         t.rotate(Global_1.Konva.getAngle(this.rotation()));
         if (this._movingAnchorName && newAttrs.width < 0 && this._movingAnchorName.indexOf("left") >= 0) {
@@ -5875 +9735 @@
       update() {
         var _a;
-        var attrs = this._getNodeRect();
+        const attrs = this._getNodeRect();
         this.rotation(Util_1.Util._getRotation(attrs.rotation));
-        var width = attrs.width;
-        var height = attrs.height;
-        var enabledAnchors = this.enabledAnchors();
-        var resizeEnabled = this.resizeEnabled();
-        var padding = this.padding();
-        var anchorSize = this.anchorSize();
+        const width = attrs.width;
+        const height = attrs.height;
+        const enabledAnchors = this.enabledAnchors();
+        const resizeEnabled = this.resizeEnabled();
+        const padding = this.padding();
+        const anchorSize = this.anchorSize();
         const anchors = this.find("._anchor");
         anchors.forEach((node) => {
@@ -5977 +9837 @@
         if (this._transforming) {
           this._removeEvents();
-          var anchorNode = this.findOne("." + this._movingAnchorName);
+          const anchorNode = this.findOne("." + this._movingAnchorName);
           if (anchorNode) {
             anchorNode.stopDrag();
@@ -5996 +9856 @@
       }
       clone(obj) {
-        var node = Node_1.Node.prototype.clone.call(this, obj);
+        const node = Node_1.Node.prototype.clone.call(this, obj);
         return node;
       }
@@ -6643 +10503 @@
     ];
     function filterGaussBlurRGBA(imageData, radius) {
-      var pixels = imageData.data, width = imageData.width, height = imageData.height;
-      var x, y, i, p, yp, yi, yw, r_sum, g_sum, b_sum, a_sum, r_out_sum, g_out_sum, b_out_sum, a_out_sum, r_in_sum, g_in_sum, b_in_sum, a_in_sum, pr, pg, pb, pa, rbs;
-      var div = radius + radius + 1, widthMinus1 = width - 1, heightMinus1 = height - 1, radiusPlus1 = radius + 1, sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2, stackStart = new BlurStack(), stackEnd = null, stack = stackStart, stackIn = null, stackOut = null, mul_sum = mul_table[radius], shg_sum = shg_table[radius];
+      const pixels = imageData.data, width = imageData.width, height = imageData.height;
+      let x, y, i, p, yp, yi, yw, r_sum, g_sum, b_sum, a_sum, r_out_sum, g_out_sum, b_out_sum, a_out_sum, r_in_sum, g_in_sum, b_in_sum, a_in_sum, pr, pg, pb, pa, rbs;
+      let div = radius + radius + 1, widthMinus1 = width - 1, heightMinus1 = height - 1, radiusPlus1 = radius + 1, sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2, stackStart = new BlurStack(), stackEnd = null, stack = stackStart, stackIn = null, stackOut = null, mul_sum = mul_table[radius], shg_sum = shg_table[radius];
       for (i = 1; i < div; i++) {
         stack = stack.next = new BlurStack();
@@ -6804 +10664 @@
     }
     var Blur = function Blur2(imageData) {
-      var radius = Math.round(this.blurRadius());
+      const radius = Math.round(this.blurRadius());
       if (radius > 0) {
         filterGaussBlurRGBA(imageData, radius);
@@ -6824 +10684 @@
     var Validators_1 = require_Validators();
     var Brighten = function(imageData) {
-      var brightness = this.brightness() * 255, data = imageData.data, len = data.length, i;
+      let brightness = this.brightness() * 255, data = imageData.data, len = data.length, i;
       for (i = 0; i < len; i += 4) {
         data[i] += brightness;
@@ -6846 +10706 @@
     var Validators_1 = require_Validators();
     var Contrast = function(imageData) {
-      var adjust = Math.pow((this.contrast() + 100) / 100, 2);
-      var data = imageData.data, nPixels = data.length, red = 150, green = 150, blue = 150, i;
+      const adjust = Math.pow((this.contrast() + 100) / 100, 2);
+      let data = imageData.data, nPixels = data.length, red = 150, green = 150, blue = 150, i;
       for (i = 0; i < nPixels; i += 4) {
         red = data[i];
@@ -6891 +10751 @@
     var Validators_1 = require_Validators();
     var Emboss = function(imageData) {
-      var strength = this.embossStrength() * 10, greyLevel = this.embossWhiteLevel() * 255, direction = this.embossDirection(), blend = this.embossBlend(), dirY = 0, dirX = 0, data = imageData.data, w = imageData.width, h = imageData.height, w4 = w * 4, y = h;
+      let strength = this.embossStrength() * 10, greyLevel = this.embossWhiteLevel() * 255, direction = this.embossDirection(), blend = this.embossBlend(), dirY = 0, dirX = 0, data = imageData.data, w = imageData.width, h = imageData.height, w4 = w * 4, y = h;
       switch (direction) {
         case "top-left":
@@ -6929 +10789 @@
       }
       do {
-        var offsetY = (y - 1) * w4;
-        var otherY = dirY;
+        const offsetY = (y - 1) * w4;
+        let otherY = dirY;
         if (y + otherY < 1) {
           otherY = 0;
@@ -6937 +10797 @@
           otherY = 0;
         }
-        var offsetYOther = (y - 1 + otherY) * w * 4;
-        var x = w;
+        const offsetYOther = (y - 1 + otherY) * w * 4;
+        let x = w;
         do {
-          var offset = offsetY + (x - 1) * 4;
-          var otherX = dirX;
+          const offset = offsetY + (x - 1) * 4;
+          let otherX = dirX;
           if (x + otherX < 1) {
             otherX = 0;
@@ -6948 +10808 @@
             otherX = 0;
           }
-          var offsetOther = offsetYOther + (x - 1 + otherX) * 4;
-          var dR = data[offset] - data[offsetOther];
-          var dG = data[offset + 1] - data[offsetOther + 1];
-          var dB = data[offset + 2] - data[offsetOther + 2];
-          var dif = dR;
-          var absDif = dif > 0 ? dif : -dif;
-          var absG = dG > 0 ? dG : -dG;
-          var absB = dB > 0 ? dB : -dB;
+          const offsetOther = offsetYOther + (x - 1 + otherX) * 4;
+          const dR = data[offset] - data[offsetOther];
+          const dG = data[offset + 1] - data[offsetOther + 1];
+          const dB = data[offset + 2] - data[offsetOther + 2];
+          let dif = dR;
+          const absDif = dif > 0 ? dif : -dif;
+          const absG = dG > 0 ? dG : -dG;
+          const absB = dB > 0 ? dB : -dB;
           if (absG > absDif) {
             dif = dG;
@@ -6964 +10824 @@
           dif *= strength;
           if (blend) {
-            var r = data[offset] + dif;
-            var g = data[offset + 1] + dif;
-            var b = data[offset + 2] + dif;
+            const r = data[offset] + dif;
+            const g = data[offset + 1] + dif;
+            const b = data[offset + 2] + dif;
             data[offset] = r > 255 ? 255 : r < 0 ? 0 : r;
             data[offset + 1] = g > 255 ? 255 : g < 0 ? 0 : g;
             data[offset + 2] = b > 255 ? 255 : b < 0 ? 0 : b;
           } else {
-            var grey = greyLevel - dif;
+            let grey = greyLevel - dif;
             if (grey < 0) {
               grey = 0;
@@ -7000 +10860 @@
     var Validators_1 = require_Validators();
     function remap(fromValue, fromMin, fromMax, toMin, toMax) {
-      var fromRange = fromMax - fromMin, toRange = toMax - toMin, toValue;
+      let fromRange = fromMax - fromMin, toRange = toMax - toMin, toValue;
       if (fromRange === 0) {
         return toMin + toRange / 2;
@@ -7012 +10872 @@
     }
     var Enhance = function(imageData) {
-      var data = imageData.data, nSubPixels = data.length, rMin = data[0], rMax = rMin, r, gMin = data[1], gMax = gMin, g, bMin = data[2], bMax = bMin, b, i;
-      var enhanceAmount = this.enhance();
+      let data = imageData.data, nSubPixels = data.length, rMin = data[0], rMax = rMin, r, gMin = data[1], gMax = gMin, g, bMin = data[2], bMax = bMin, b, i;
+      const enhanceAmount = this.enhance();
       if (enhanceAmount === 0) {
         return;
@@ -7049 +10909 @@
         bMin = 0;
       }
-      var rMid, rGoalMax, rGoalMin, gMid, gGoalMax, gGoalMin, bMid, bGoalMax, bGoalMin;
+      let rMid, rGoalMax, rGoalMin, gMid, gGoalMax, gGoalMin, bMid, bGoalMax, bGoalMin;
       if (enhanceAmount > 0) {
         rGoalMax = rMax + enhanceAmount * (255 - rMax);
@@ -7086 +10946 @@
     exports.Grayscale = void 0;
     var Grayscale = function(imageData) {
-      var data = imageData.data, len = data.length, i, brightness;
+      let data = imageData.data, len = data.length, i, brightness;
       for (i = 0; i < len; i += 4) {
         brightness = 0.34 * data[i] + 0.5 * data[i + 1] + 0.16 * data[i + 2];
@@ -7111 +10971 @@
     Factory_1.Factory.addGetterSetter(Node_1.Node, "luminance", 0, (0, Validators_1.getNumberValidator)(), Factory_1.Factory.afterSetFilter);
     var HSL = function(imageData) {
-      var data = imageData.data, nPixels = data.length, v = 1, s = Math.pow(2, this.saturation()), h = Math.abs(this.hue() + 360) % 360, l = this.luminance() * 127, i;
-      var vsu = v * s * Math.cos(h * Math.PI / 180), vsw = v * s * Math.sin(h * Math.PI / 180);
-      var rr = 0.299 * v + 0.701 * vsu + 0.167 * vsw, rg = 0.587 * v - 0.587 * vsu + 0.33 * vsw, rb = 0.114 * v - 0.114 * vsu - 0.497 * vsw;
-      var gr = 0.299 * v - 0.299 * vsu - 0.328 * vsw, gg = 0.587 * v + 0.413 * vsu + 0.035 * vsw, gb = 0.114 * v - 0.114 * vsu + 0.293 * vsw;
-      var br = 0.299 * v - 0.3 * vsu + 1.25 * vsw, bg = 0.587 * v - 0.586 * vsu - 1.05 * vsw, bb = 0.114 * v + 0.886 * vsu - 0.2 * vsw;
-      var r, g, b, a;
+      let data = imageData.data, nPixels = data.length, v = 1, s = Math.pow(2, this.saturation()), h = Math.abs(this.hue() + 360) % 360, l = this.luminance() * 127, i;
+      const vsu = v * s * Math.cos(h * Math.PI / 180), vsw = v * s * Math.sin(h * Math.PI / 180);
+      const rr = 0.299 * v + 0.701 * vsu + 0.167 * vsw, rg = 0.587 * v - 0.587 * vsu + 0.33 * vsw, rb = 0.114 * v - 0.114 * vsu - 0.497 * vsw;
+      const gr = 0.299 * v - 0.299 * vsu - 0.328 * vsw, gg = 0.587 * v + 0.413 * vsu + 0.035 * vsw, gb = 0.114 * v - 0.114 * vsu + 0.293 * vsw;
+      const br = 0.299 * v - 0.3 * vsu + 1.25 * vsw, bg = 0.587 * v - 0.586 * vsu - 1.05 * vsw, bb = 0.114 * v + 0.886 * vsu - 0.2 * vsw;
+      let r, g, b, a;
       for (i = 0; i < nPixels; i += 4) {
         r = data[i + 0];
@@ -7142 +11002 @@
     var Validators_1 = require_Validators();
     var HSV = function(imageData) {
-      var data = imageData.data, nPixels = data.length, v = Math.pow(2, this.value()), s = Math.pow(2, this.saturation()), h = Math.abs(this.hue() + 360) % 360, i;
-      var vsu = v * s * Math.cos(h * Math.PI / 180), vsw = v * s * Math.sin(h * Math.PI / 180);
-      var rr = 0.299 * v + 0.701 * vsu + 0.167 * vsw, rg = 0.587 * v - 0.587 * vsu + 0.33 * vsw, rb = 0.114 * v - 0.114 * vsu - 0.497 * vsw;
-      var gr = 0.299 * v - 0.299 * vsu - 0.328 * vsw, gg = 0.587 * v + 0.413 * vsu + 0.035 * vsw, gb = 0.114 * v - 0.114 * vsu + 0.293 * vsw;
-      var br = 0.299 * v - 0.3 * vsu + 1.25 * vsw, bg = 0.587 * v - 0.586 * vsu - 1.05 * vsw, bb = 0.114 * v + 0.886 * vsu - 0.2 * vsw;
-      var r, g, b, a;
-      for (i = 0; i < nPixels; i += 4) {
+      const data = imageData.data, nPixels = data.length, v = Math.pow(2, this.value()), s = Math.pow(2, this.saturation()), h = Math.abs(this.hue() + 360) % 360;
+      const vsu = v * s * Math.cos(h * Math.PI / 180), vsw = v * s * Math.sin(h * Math.PI / 180);
+      const rr = 0.299 * v + 0.701 * vsu + 0.167 * vsw, rg = 0.587 * v - 0.587 * vsu + 0.33 * vsw, rb = 0.114 * v - 0.114 * vsu - 0.497 * vsw;
+      const gr = 0.299 * v - 0.299 * vsu - 0.328 * vsw, gg = 0.587 * v + 0.413 * vsu + 0.035 * vsw, gb = 0.114 * v - 0.114 * vsu + 0.293 * vsw;
+      const br = 0.299 * v - 0.3 * vsu + 1.25 * vsw, bg = 0.587 * v - 0.586 * vsu - 1.05 * vsw, bb = 0.114 * v + 0.886 * vsu - 0.2 * vsw;
+      let r, g, b, a;
+      for (let i = 0; i < nPixels; i += 4) {
         r = data[i + 0];
         g = data[i + 1];
@@ -7173 +11033 @@
     exports.Invert = void 0;
     var Invert = function(imageData) {
-      var data = imageData.data, len = data.length, i;
+      let data = imageData.data, len = data.length, i;
       for (i = 0; i < len; i += 4) {
         data[i] = 255 - data[i];
@@ -7195 +11055 @@
     var Validators_1 = require_Validators();
     var ToPolar = function(src, dst, opt) {
-      var srcPixels = src.data, dstPixels = dst.data, xSize = src.width, ySize = src.height, xMid = opt.polarCenterX || xSize / 2, yMid = opt.polarCenterY || ySize / 2, i, x, y, r = 0, g = 0, b = 0, a = 0;
-      var rad, rMax = Math.sqrt(xMid * xMid + yMid * yMid);
+      let srcPixels = src.data, dstPixels = dst.data, xSize = src.width, ySize = src.height, xMid = opt.polarCenterX || xSize / 2, yMid = opt.polarCenterY || ySize / 2, i, x, y, r = 0, g = 0, b = 0, a = 0;
+      let rad, rMax = Math.sqrt(xMid * xMid + yMid * yMid);
       x = xSize - xMid;
       y = ySize - yMid;
       rad = Math.sqrt(x * x + y * y);
       rMax = rad > rMax ? rad : rMax;
-      var rSize = ySize, tSize = xSize, radius, theta;
-      var conversion = 360 / tSize * Math.PI / 180, sin, cos;
+      let rSize = ySize, tSize = xSize, radius, theta;
+      let conversion = 360 / tSize * Math.PI / 180, sin, cos;
       for (theta = 0; theta < tSize; theta += 1) {
         sin = Math.sin(theta * conversion);
@@ -7223 +11083 @@
     };
     var FromPolar = function(src, dst, opt) {
-      var srcPixels = src.data, dstPixels = dst.data, xSize = src.width, ySize = src.height, xMid = opt.polarCenterX || xSize / 2, yMid = opt.polarCenterY || ySize / 2, i, x, y, dx, dy, r = 0, g = 0, b = 0, a = 0;
-      var rad, rMax = Math.sqrt(xMid * xMid + yMid * yMid);
+      let srcPixels = src.data, dstPixels = dst.data, xSize = src.width, ySize = src.height, xMid = opt.polarCenterX || xSize / 2, yMid = opt.polarCenterY || ySize / 2, i, x, y, dx, dy, r = 0, g = 0, b = 0, a = 0;
+      let rad, rMax = Math.sqrt(xMid * xMid + yMid * yMid);
       x = xSize - xMid;
       y = ySize - yMid;
       rad = Math.sqrt(x * x + y * y);
       rMax = rad > rMax ? rad : rMax;
-      var rSize = ySize, tSize = xSize, radius, theta, phaseShift = opt.polarRotation || 0;
-      var x1, y1;
+      let rSize = ySize, tSize = xSize, radius, theta, phaseShift = opt.polarRotation || 0;
+      let x1, y1;
       for (x = 0; x < xSize; x += 1) {
         for (y = 0; y < ySize; y += 1) {
@@ -7254 +11114 @@
     };
     var Kaleidoscope = function(imageData) {
-      var xSize = imageData.width, ySize = imageData.height;
-      var x, y, xoff, i, r, g, b, a, srcPos, dstPos;
-      var power = Math.round(this.kaleidoscopePower());
-      var angle = Math.round(this.kaleidoscopeAngle());
-      var offset = Math.floor(xSize * (angle % 360) / 360);
+      const xSize = imageData.width, ySize = imageData.height;
+      let x, y, xoff, i, r, g, b, a, srcPos, dstPos;
+      let power = Math.round(this.kaleidoscopePower());
+      const angle = Math.round(this.kaleidoscopeAngle());
+      const offset = Math.floor(xSize * (angle % 360) / 360);
       if (power < 1) {
         return;
       }
-      var tempCanvas = Util_1.Util.createCanvasElement();
+      const tempCanvas = Util_1.Util.createCanvasElement();
       tempCanvas.width = xSize;
       tempCanvas.height = ySize;
-      var scratchData = tempCanvas.getContext("2d").getImageData(0, 0, xSize, ySize);
+      const scratchData = tempCanvas.getContext("2d").getImageData(0, 0, xSize, ySize);
       Util_1.Util.releaseCanvas(tempCanvas);
       ToPolar(imageData, scratchData, {
@@ -7271 +11131 @@
         polarCenterY: ySize / 2
       });
-      var minSectionSize = xSize / Math.pow(2, power);
+      let minSectionSize = xSize / Math.pow(2, power);
       while (minSectionSize <= 8) {
         minSectionSize = minSectionSize * 2;
@@ -7277 +11137 @@
       }
       minSectionSize = Math.ceil(minSectionSize);
-      var sectionSize = minSectionSize;
-      var xStart = 0, xEnd = sectionSize, xDelta = 1;
+      let sectionSize = minSectionSize;
+      let xStart = 0, xEnd = sectionSize, xDelta = 1;
       if (offset + minSectionSize > xSize) {
         xStart = sectionSize;
@@ -7335 +11195 @@
     var Validators_1 = require_Validators();
     function pixelAt(idata, x, y) {
-      var idx = (y * idata.width + x) * 4;
-      var d = [];
+      let idx = (y * idata.width + x) * 4;
+      const d = [];
       d.push(idata.data[idx++], idata.data[idx++], idata.data[idx++], idata.data[idx++]);
       return d;
@@ -7344 +11204 @@
     }
     function rgbMean(pTab) {
-      var m = [0, 0, 0];
-      for (var i = 0; i < pTab.length; i++) {
+      const m = [0, 0, 0];
+      for (let i = 0; i < pTab.length; i++) {
         m[0] += pTab[i][0];
         m[1] += pTab[i][1];
@@ -7356 +11216 @@
     }
     function backgroundMask(idata, threshold) {
-      var rgbv_no = pixelAt(idata, 0, 0);
-      var rgbv_ne = pixelAt(idata, idata.width - 1, 0);
-      var rgbv_so = pixelAt(idata, 0, idata.height - 1);
-      var rgbv_se = pixelAt(idata, idata.width - 1, idata.height - 1);
-      var thres = threshold || 10;
+      const rgbv_no = pixelAt(idata, 0, 0);
+      const rgbv_ne = pixelAt(idata, idata.width - 1, 0);
+      const rgbv_so = pixelAt(idata, 0, idata.height - 1);
+      const rgbv_se = pixelAt(idata, idata.width - 1, idata.height - 1);
+      const thres = threshold || 10;
       if (rgbDistance(rgbv_no, rgbv_ne) < thres && rgbDistance(rgbv_ne, rgbv_se) < thres && rgbDistance(rgbv_se, rgbv_so) < thres && rgbDistance(rgbv_so, rgbv_no) < thres) {
-        var mean = rgbMean([rgbv_ne, rgbv_no, rgbv_se, rgbv_so]);
-        var mask = [];
-        for (var i = 0; i < idata.width * idata.height; i++) {
-          var d = rgbDistance(mean, [
+        const mean = rgbMean([rgbv_ne, rgbv_no, rgbv_se, rgbv_so]);
+        const mask = [];
+        for (let i = 0; i < idata.width * idata.height; i++) {
+          const d = rgbDistance(mean, [
             idata.data[i * 4],
             idata.data[i * 4 + 1],
@@ -7376 +11236 @@
     }
     function applyMask(idata, mask) {
-      for (var i = 0; i < idata.width * idata.height; i++) {
+      for (let i = 0; i < idata.width * idata.height; i++) {
         idata.data[4 * i + 3] = mask[i];
       }
     }
     function erodeMask(mask, sw, sh) {
-      var weights = [1, 1, 1, 1, 0, 1, 1, 1, 1];
-      var side = Math.round(Math.sqrt(weights.length));
-      var halfSide = Math.floor(side / 2);
-      var maskResult = [];
-      for (var y = 0; y < sh; y++) {
-        for (var x = 0; x < sw; x++) {
-          var so = y * sw + x;
-          var a = 0;
-          for (var cy = 0; cy < side; cy++) {
-            for (var cx = 0; cx < side; cx++) {
-              var scy = y + cy - halfSide;
-              var scx = x + cx - halfSide;
+      const weights = [1, 1, 1, 1, 0, 1, 1, 1, 1];
+      const side = Math.round(Math.sqrt(weights.length));
+      const halfSide = Math.floor(side / 2);
+      const maskResult = [];
+      for (let y = 0; y < sh; y++) {
+        for (let x = 0; x < sw; x++) {
+          const so = y * sw + x;
+          let a = 0;
+          for (let cy = 0; cy < side; cy++) {
+            for (let cx = 0; cx < side; cx++) {
+              const scy = y + cy - halfSide;
+              const scx = x + cx - halfSide;
               if (scy >= 0 && scy < sh && scx >= 0 && scx < sw) {
-                var srcOff = scy * sw + scx;
-                var wt = weights[cy * side + cx];
+                const srcOff = scy * sw + scx;
+                const wt = weights[cy * side + cx];
                 a += mask[srcOff] * wt;
               }
@@ -7406 +11266 @@
     }
     function dilateMask(mask, sw, sh) {
-      var weights = [1, 1, 1, 1, 1, 1, 1, 1, 1];
-      var side = Math.round(Math.sqrt(weights.length));
-      var halfSide = Math.floor(side / 2);
-      var maskResult = [];
-      for (var y = 0; y < sh; y++) {
-        for (var x = 0; x < sw; x++) {
-          var so = y * sw + x;
-          var a = 0;
-          for (var cy = 0; cy < side; cy++) {
-            for (var cx = 0; cx < side; cx++) {
-              var scy = y + cy - halfSide;
-              var scx = x + cx - halfSide;
+      const weights = [1, 1, 1, 1, 1, 1, 1, 1, 1];
+      const side = Math.round(Math.sqrt(weights.length));
+      const halfSide = Math.floor(side / 2);
+      const maskResult = [];
+      for (let y = 0; y < sh; y++) {
+        for (let x = 0; x < sw; x++) {
+          const so = y * sw + x;
+          let a = 0;
+          for (let cy = 0; cy < side; cy++) {
+            for (let cx = 0; cx < side; cx++) {
+              const scy = y + cy - halfSide;
+              const scx = x + cx - halfSide;
               if (scy >= 0 && scy < sh && scx >= 0 && scx < sw) {
-                var srcOff = scy * sw + scx;
-                var wt = weights[cy * side + cx];
+                const srcOff = scy * sw + scx;
+                const wt = weights[cy * side + cx];
                 a += mask[srcOff] * wt;
               }
@@ -7431 +11291 @@
     }
     function smoothEdgeMask(mask, sw, sh) {
-      var weights = [1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9];
-      var side = Math.round(Math.sqrt(weights.length));
-      var halfSide = Math.floor(side / 2);
-      var maskResult = [];
-      for (var y = 0; y < sh; y++) {
-        for (var x = 0; x < sw; x++) {
-          var so = y * sw + x;
-          var a = 0;
-          for (var cy = 0; cy < side; cy++) {
-            for (var cx = 0; cx < side; cx++) {
-              var scy = y + cy - halfSide;
-              var scx = x + cx - halfSide;
+      const weights = [1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9];
+      const side = Math.round(Math.sqrt(weights.length));
+      const halfSide = Math.floor(side / 2);
+      const maskResult = [];
+      for (let y = 0; y < sh; y++) {
+        for (let x = 0; x < sw; x++) {
+          const so = y * sw + x;
+          let a = 0;
+          for (let cy = 0; cy < side; cy++) {
+            for (let cx = 0; cx < side; cx++) {
+              const scy = y + cy - halfSide;
+              const scx = x + cx - halfSide;
               if (scy >= 0 && scy < sh && scx >= 0 && scx < sw) {
-                var srcOff = scy * sw + scx;
-                var wt = weights[cy * side + cx];
+                const srcOff = scy * sw + scx;
+                const wt = weights[cy * side + cx];
                 a += mask[srcOff] * wt;
               }
@@ -7456 +11316 @@
     }
     var Mask = function(imageData) {
-      var threshold = this.threshold(), mask = backgroundMask(imageData, threshold);
+      let threshold = this.threshold(), mask = backgroundMask(imageData, threshold);
       if (mask) {
         mask = erodeMask(mask, imageData.width, imageData.height);
@@ -7480 +11340 @@
     var Validators_1 = require_Validators();
     var Noise = function(imageData) {
-      var amount = this.noise() * 255, data = imageData.data, nPixels = data.length, half = amount / 2, i;
-      for (i = 0; i < nPixels; i += 4) {
+      const amount = this.noise() * 255, data = imageData.data, nPixels = data.length, half = amount / 2;
+      for (let i = 0; i < nPixels; i += 4) {
         data[i + 0] += half - 2 * half * Math.random();
         data[i + 1] += half - 2 * half * Math.random();
@@ -7503 +11363 @@
     var Validators_1 = require_Validators();
     var Pixelate = function(imageData) {
-      var pixelSize = Math.ceil(this.pixelSize()), width = imageData.width, height = imageData.height, x, y, i, red, green, blue, alpha, nBinsX = Math.ceil(width / pixelSize), nBinsY = Math.ceil(height / pixelSize), xBinStart, xBinEnd, yBinStart, yBinEnd, xBin, yBin, pixelsInBin, data = imageData.data;
+      let pixelSize = Math.ceil(this.pixelSize()), width = imageData.width, height = imageData.height, x, y, i, red, green, blue, alpha, nBinsX = Math.ceil(width / pixelSize), nBinsY = Math.ceil(height / pixelSize), xBinStart, xBinEnd, yBinStart, yBinEnd, xBin, yBin, pixelsInBin, data = imageData.data;
       if (pixelSize <= 0) {
         Util_1.Util.error("pixelSize value can not be <= 0");
@@ -7572 +11432 @@
     var Validators_1 = require_Validators();
     var Posterize = function(imageData) {
-      var levels = Math.round(this.levels() * 254) + 1, data = imageData.data, len = data.length, scale = 255 / levels, i;
+      let levels = Math.round(this.levels() * 254) + 1, data = imageData.data, len = data.length, scale = 255 / levels, i;
       for (i = 0; i < len; i += 1) {
         data[i] = Math.floor(data[i] / scale) * scale;
@@ -7592 +11452 @@
     var Validators_1 = require_Validators();
     var RGB = function(imageData) {
-      var data = imageData.data, nPixels = data.length, red = this.red(), green = this.green(), blue = this.blue(), i, brightness;
+      let data = imageData.data, nPixels = data.length, red = this.red(), green = this.green(), blue = this.blue(), i, brightness;
       for (i = 0; i < nPixels; i += 4) {
         brightness = (0.34 * data[i] + 0.5 * data[i + 1] + 0.16 * data[i + 2]) / 255;
@@ -7636 +11496 @@
     var Validators_1 = require_Validators();
     var RGBA = function(imageData) {
-      var data = imageData.data, nPixels = data.length, red = this.red(), green = this.green(), blue = this.blue(), alpha = this.alpha(), i, ia;
-      for (i = 0; i < nPixels; i += 4) {
-        ia = 1 - alpha;
+      const data = imageData.data, nPixels = data.length, red = this.red(), green = this.green(), blue = this.blue(), alpha = this.alpha();
+      for (let i = 0; i < nPixels; i += 4) {
+        const ia = 1 - alpha;
         data[i] = red * alpha + data[i] * ia;
         data[i + 1] = green * alpha + data[i + 1] * ia;
@@ -7686 +11546 @@
     exports.Sepia = void 0;
     var Sepia = function(imageData) {
-      var data = imageData.data, nPixels = data.length, i, r, g, b;
+      let data = imageData.data, nPixels = data.length, i, r, g, b;
       for (i = 0; i < nPixels; i += 4) {
         r = data[i + 0];
@@ -7707 +11567 @@
     exports.Solarize = void 0;
     var Solarize = function(imageData) {
-      var data = imageData.data, w = imageData.width, h = imageData.height, w4 = w * 4, y = h;
+      const data = imageData.data, w = imageData.width, h = imageData.height, w4 = w * 4;
+      let y = h;
       do {
-        var offsetY = (y - 1) * w4;
-        var x = w;
+        const offsetY = (y - 1) * w4;
+        let x = w;
         do {
-          var offset = offsetY + (x - 1) * 4;
-          var r = data[offset];
-          var g = data[offset + 1];
-          var b = data[offset + 2];
+          const offset = offsetY + (x - 1) * 4;
+          let r = data[offset];
+          let g = data[offset + 1];
+          let b = data[offset + 2];
           if (r > 127) {
             r = 255 - r;
@@ -7745 +11606 @@
     var Validators_1 = require_Validators();
     var Threshold = function(imageData) {
-      var level = this.threshold() * 255, data = imageData.data, len = data.length, i;
-      for (i = 0; i < len; i += 1) {
+      const level = this.threshold() * 255, data = imageData.data, len = data.length;
+      for (let i = 0; i < len; i += 1) {
         data[i] = data[i] < level ? 0 : 255;
       }