@glodon-aiot/dataset-annotation 3.10.0-alpha.22 → 3.10.0-alpha.23

package/dist/es/components/DetectionAnnotation/components/LabelMaker/RectLabel.mjs

@@ -23,7 +23,7 @@ const z = {
   active: !1
 };
 class M {
-  constructor(i, s, c) {
+  constructor(i, s, a) {
     d(this, "config");
     d(this, "color");
     d(this, "_active", !1);
@@ -31,7 +31,7 @@ class M {
     d(this, "_label", null);
     d(this, "_hover", !1);
     d(this, "_strokeRect");
-    this._canvas = s, this.handlers = c, g.Rect.prototype.cornerColor = "blue", this.config = f(f({}, z), i), this.color = X(i.color), this._active = this.config.active || !1, s && this.render(s);
+    this._canvas = s, this.handlers = a, g.Rect.prototype.cornerColor = "blue", this.config = f(f({}, z), i), this.color = X(i.color), this._active = this.config.active || !1, s && this.render(s);
   }
   get object() {
     return this._fabricRect;
@@ -47,8 +47,8 @@ class M {
     return this._hover;
   }
   set hover(i) {
-    var s, c;
-    this._hover = i, i ? (s = this._fabricRect) == null || s.set(this.hoverStyle) : this.active || (c = this._fabricRect) == null || c.set(this.normalStyle), this.canvas.requestRenderAll();
+    var s, a;
+    this._hover = i, i ? (s = this._fabricRect) == null || s.set(this.hoverStyle) : this.active || (a = this._fabricRect) == null || a.set(this.normalStyle), this.canvas.requestRenderAll();
   }
   get canvas() {
     return this._canvas;
@@ -83,7 +83,7 @@ class M {
       cornerStrokeColor: "#84868C",
       cornerColor: "#FFFFFF",
       transparentCorners: !1
-    }, s = 0, c = new g.Rect(
+    }, s = 0, a = new g.Rect(
       // this.config.points?.map((p) => ({ x: p[0], y: p[1] })),
       C(f(f({
         left: this.config.points[0][0],
@@ -95,19 +95,19 @@ class M {
         lockScalingFlip: !0
       })
     );
-    c.setControlsVisibility({
+    a.setControlsVisibility({
       mtr: !1
     });
-    const a = () => {
-      if (c.canvas !== this.canvas) {
-        this.canvas.off("after:render", a);
+    const c = () => {
+      if (a.canvas !== this.canvas) {
+        this.canvas.off("after:render", c);
         return;
       }
       this.canvas.contextContainer.strokeStyle = `rgb(${this.color[0]},${this.color[1]}, ${this.color[2]})`;
-      const o = c.getBoundingRect();
+      const o = a.getBoundingRect();
       this._strokeRect = this.canvas.contextContainer.strokeRect(o.left + 0.5, o.top + 0.5, o.width, o.height);
     };
-    return this.canvas.on("after:render", a), c;
+    return this.canvas.on("after:render", c), a;
   }
   scaledNumber(i) {
     return i / this.canvas.getZoom();
@@ -133,25 +133,28 @@ class M {
   //   });
   // }
   createLabelName() {
-    const [i, s, c] = this.color, a = new g.Text(this.handlers.renderLabelItem ? this.handlers.renderLabelItem(this.config) : this.config.name, {
+    const [i, s, a] = this.color, c = new g.Text(this.handlers.renderLabelItem ? this.handlers.renderLabelItem(this.config) : this.config.name, {
       fill: "#FFFFFF",
       fontSize: 12,
       selectable: !1,
+      evented: !1,
       top: 4,
       left: 8
     }), o = new g.Rect({
       selectable: !1,
+      evented: !1,
       strokeWidth: 0,
-      fill: `rgb(${i},${s},${c})`,
+      fill: `rgb(${i},${s},${a})`,
       rx: 2,
       ry: 2,
-      width: (a.width || 0) + 16,
-      height: (a.height || 0) + 8,
+      width: (c.width || 0) + 16,
+      height: (c.height || 0) + 8,
       left: 0,
       top: 0
     });
-    return new g.Group([o, a], {
+    return new g.Group([o, c], {
       selectable: !1,
+      evented: !1,
       // lockScalingX: false,
       // lockScalingY: false,
       scaleX: 1 / this.canvas.getZoom(),
@@ -162,19 +165,19 @@ class M {
     var i, s;
     if (this._fabricRect) {
       if (this._label || (this._label = this.createLabelName(), this.setLabelPosition()), this._label.canvas === this.canvas) {
-        const c = this._label.getObjects().find((o) => o.type === "rect"), a = this._label.getObjects().find((o) => o.type === "text");
-        if (a) {
-          a.set({
+        const a = this._label.getObjects().find((o) => o.type === "rect"), c = this._label.getObjects().find((o) => o.type === "text");
+        if (c) {
+          c.set({
             text: this.handlers.renderLabelItem ? this.handlers.renderLabelItem(this.config) : this.config.name,
             left: 8
             // fontSize: this.scaledNumber(12),
           });
-          const o = (a.getBoundingRect().width || 0) + 16;
-          c == null || c.set({
+          const o = (c.getBoundingRect().width || 0) + 16;
+          a == null || a.set({
             fill: `rgba(${this.color[0]},${this.color[1]}, ${this.color[2]}, 1)`,
             width: o,
             left: -o / 2
-          }), a.set({
+          }), c.set({
             left: -o / 2 + 8
           });
           const r = ((i = this._fabricRect.aCoords) == null ? void 0 : i.tl.x) !== void 0 ? (s = this._fabricRect.aCoords) == null ? void 0 : s.tl.x : void 0;
@@ -195,12 +198,12 @@ class M {
     const i = this._label.getObjects().find((b) => b.type === "rect");
     if (!i)
       return;
-    const s = i.height ? i.height : void 0, c = i.width ? i.width : void 0, a = ((r = this._fabricRect.aCoords) == null ? void 0 : r.tl.y) !== void 0 && s !== void 0 && i.scaleY ? ((t = this._fabricRect.aCoords) == null ? void 0 : t.tl.y) - s / this.canvas.getZoom() : void 0, o = ((e = this._fabricRect.aCoords) == null ? void 0 : e.tl.x) !== void 0 ? (h = this._fabricRect.aCoords) == null ? void 0 : h.tl.x : void 0;
+    const s = i.height ? i.height : void 0, a = i.width ? i.width : void 0, c = ((r = this._fabricRect.aCoords) == null ? void 0 : r.tl.y) !== void 0 && s !== void 0 && i.scaleY ? ((t = this._fabricRect.aCoords) == null ? void 0 : t.tl.y) - s / this.canvas.getZoom() : void 0, o = ((e = this._fabricRect.aCoords) == null ? void 0 : e.tl.x) !== void 0 ? (h = this._fabricRect.aCoords) == null ? void 0 : h.tl.x : void 0;
     this._label.set({
-      top: a,
+      top: c,
       left: o,
       height: s,
-      width: c,
+      width: a,
       scaleX: 1 / this.canvas.getZoom(),
       scaleY: 1 / this.canvas.getZoom()
     }), this.config = f({}, this.config);
@@ -222,7 +225,7 @@ class M {
     this.canvas.on("selection:created", s), this.canvas.on("selection:updated", s), this.canvas.on("selection:cleared", (o) => {
       this.active && (this.active = !1);
     });
-    const c = (o) => {
+    const a = (o) => {
       var b, y, x, S, $, L;
       const r = o.transform.action;
       o.transform.corner;
@@ -276,10 +279,10 @@ class M {
         });
       }
       this.canvas.renderAll();
-    }, a = (o) => {
-      c(o), this.setLabelPosition();
+    }, c = (o) => {
+      a(o), this.setLabelPosition();
     };
-    this._fabricRect.on("moving", a), this._fabricRect.on("scaling", a), this._fabricRect.on("rotating", a), this._fabricRect.on("skewing", a), this._fabricRect.on("resizing", a), this.canvas.on("object:removed", (o) => {
+    this._fabricRect.on("moving", c), this._fabricRect.on("scaling", c), this._fabricRect.on("rotating", c), this._fabricRect.on("skewing", c), this._fabricRect.on("resizing", c), this.canvas.on("object:removed", (o) => {
       o.target === this._fabricRect && this.destroy();
     }), this.canvas.on("object:modified", (o) => {
       o.target === this._fabricRect && (this.setLabelPosition(), this.handlers.onChange && this.handlers.onChange(this));