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

package/dist/es/components/VLMAnnotation/VLMLabelMaker/index.mjs

@@ -1,25 +1,25 @@
-var be = Object.defineProperty, Pe = Object.defineProperties;
-var Ue = Object.getOwnPropertyDescriptors;
-var de = Object.getOwnPropertySymbols;
-var Xe = Object.prototype.hasOwnProperty, We = Object.prototype.propertyIsEnumerable;
-var ge = (s, f, a) => f in s ? be(s, f, { enumerable: !0, configurable: !0, writable: !0, value: a }) : s[f] = a, q = (s, f) => {
-  for (var a in f || (f = {}))
-    Xe.call(f, a) && ge(s, a, f[a]);
-  if (de)
-    for (var a of de(f))
-      We.call(f, a) && ge(s, a, f[a]);
+var Pe = Object.defineProperty, Ue = Object.defineProperties;
+var Xe = Object.getOwnPropertyDescriptors;
+var le = Object.getOwnPropertySymbols;
+var Fe = Object.prototype.hasOwnProperty, We = Object.prototype.propertyIsEnumerable;
+var ge = (s, l, u) => l in s ? Pe(s, l, { enumerable: !0, configurable: !0, writable: !0, value: u }) : s[l] = u, q = (s, l) => {
+  for (var u in l || (l = {}))
+    Fe.call(l, u) && ge(s, u, l[u]);
+  if (le)
+    for (var u of le(l))
+      We.call(l, u) && ge(s, u, l[u]);
   return s;
-}, he = (s, f) => Pe(s, Ue(f));
-import { jsxs as Re, jsx as M } from "react/jsx-runtime";
-import { useRef as g, useState as I, useCallback as _, useEffect as h } from "react";
-import { fabric as b } from "fabric";
-import { useKeyPress as P } from "ahooks";
+}, he = (s, l) => Ue(s, Xe(l));
+import { jsxs as Re, jsx as S } from "react/jsx-runtime";
+import { useRef as R, useState as A, useCallback as P, useEffect as h } from "react";
+import { fabric as U } from "fabric";
+import { useKeyPress as X } from "ahooks";
 import Oe from "classnames";
 import "./style.less.mjs";
-import Fe from "../components/Toolbar.mjs";
-import { useOCRLoadingIcon as Ye } from "./hooks/useOCRLoadingIcon.mjs";
-import { useRegionNameText as je } from "./hooks/useRegionNameText.mjs";
-import { useCropRegionImage as ye } from "./hooks/useCropRegionImage.mjs";
+import ye from "../components/Toolbar.mjs";
+import { useOCRLoadingIcon as be } from "./hooks/useOCRLoadingIcon.mjs";
+import { useRegionNameText as Ye } from "./hooks/useRegionNameText.mjs";
+import { useCropRegionImage as je } from "./hooks/useCropRegionImage.mjs";
 import { useDrawingMode as ze } from "./hooks/useDrawingMode.mjs";
 import { useRegionLoader as He } from "./hooks/useRegionLoader.mjs";
 import { useCanvasSetup as Ze } from "./hooks/useCanvasSetup.mjs";
@@ -36,42 +36,42 @@ import { canvasToImageCoords as tt, imageToCanvasCoords as ot } from "./utils/co
 import { REGION_NAME_PREFIX as rt, DEFAULT_REGION_NAME as nt, ZOOM_PRECISION_ERROR as st, TEXT_LAYOUT_RECT_FILL_COLOR as it, TEXT_LAYOUT_RECT_STROKE_COLOR as ct, TRANSPARENT_FILL as at, BASE_STROKE_WIDTH as ft } from "../constants.mjs";
 const Wt = ({
   sample: s,
-  labelDefinitions: f,
-  labels: a,
+  labelDefinitions: l,
+  labels: u,
   onImageLoad: pe,
-  onChange: A,
+  onChange: x,
   onRegionSelect: J,
   onRegionChange: H,
-  ocrRecognize: ve,
-  activeLabelValue: E,
+  ocrRecognize: Te,
+  activeLabelValue: g,
   onClearActive: Z,
   selectedRegion: Q,
   onAppendTextToActive: Ee,
   readOnly: c
 }) => {
   var ue, me;
-  const V = g(null), p = g(null), [Te, Ce] = I(!0), [e, Ne] = I(), [S, Ie] = I(), [R, ee] = I(1), [v, L] = I(c || !1), [T, k] = I(!1), [K, Ae] = I({
+  const V = R(null), T = R(null), [ve, Ce] = A(!0), [t, Ne] = A(), [D, Ie] = A(), [p, ee] = A(1), [E, _] = A(c || !1), [v, I] = A(!1), [K, Ae] = A({
     left: 0,
     top: 0
-  }), U = g({
+  }), F = R({
     left: 0,
     top: 0
-  }), ke = g({
+  }), xe = R({
     width: 0,
     height: 0
-  }), u = g(/* @__PURE__ */ new Map()), te = g(null), oe = g(void 0), re = g(!1), ne = g(!1), X = g({
+  }), a = R(/* @__PURE__ */ new Map()), te = R(null), oe = R(void 0), re = R(!1), ne = R(!1), W = R({
     width: 0,
     height: 0
-  }), se = g(!1), {
-    updateOCRLoadingIcon: we,
-    ocrLoadingIconMapRef: w
-  } = Ye(e), {
-    updateRegionNameText: W,
+  }), se = R(!1), {
+    updateOCRLoadingIcon: ke,
+    ocrLoadingIconMapRef: k
+  } = be(t), {
+    updateRegionNameText: O,
     regionNameTextMapRef: C
-  } = je(e), ie = ye(s == null ? void 0 : s.fileUrl), xe = _((o) => {
-    e && (C.current.forEach((t, r) => {
+  } = Ye(t), ie = je(s == null ? void 0 : s.fileUrl), we = P((o) => {
+    t && (C.current.forEach((e, r) => {
       const n = r.left || 0, i = r.top || 0;
-      t.set({
+      e.set({
         left: n,
         // 与标注框左边对齐
         top: i,
@@ -81,144 +81,144 @@ const Wt = ({
         scaleY: 1 / o
         // 反向缩放，抵消画布缩放
       });
-    }), e.renderAll());
-  }, [e]), {
-    updateCanvas: D
+    }), t.renderAll());
+  }, [t]), {
+    updateCanvas: L
   } = Ze({
     sample: s,
-    image: S,
+    image: D,
     onImageLoad: pe,
     canvasRef: V,
-    containerRef: p,
+    containerRef: T,
     canvasInitializedRef: re,
-    bgImagePositionRef: U,
-    bgImageSizeRef: ke,
-    rectMapRef: u,
+    bgImagePositionRef: F,
+    bgImageSizeRef: xe,
+    rectMapRef: a,
     updateTextLayersRef: te,
-    onRectPositionUpdated: xe,
+    onRectPositionUpdated: we,
     setCanvas: Ne,
     setImage: Ie,
     setScale: ee,
     setBgImagePosition: Ae,
     setLoading: Ce
-  }), Me = _(() => {
-    const o = Array.from(u.current.values());
-    o.forEach((t, r) => {
-      t.name = `${rt}${r + 1}`;
-    }), u.current.forEach((t, r) => {
+  }), Me = P(() => {
+    const o = Array.from(a.current.values());
+    o.forEach((e, r) => {
+      e.name = `${rt}${r + 1}`;
+    }), a.current.forEach((e, r) => {
       const n = C.current.get(r);
-      n && (n.set("text", t.name || nt), e == null || e.renderAll());
-    }), A && A(o);
-  }, [A, e]), {
+      n && (n.set("text", e.name || nt), t == null || t.renderAll());
+    }), x && x(o);
+  }, [x, t]), {
     zoom: Se
   } = Ve({
-    canvas: e,
+    canvas: t,
     setScale: ee,
     isZoomingRef: se
-  }), O = _(
-    (o, t) => tt(o, t, e, S, U),
-    [e, S, K]
+  }), y = P(
+    (o, e) => tt(o, e, t, D, F),
+    [t, D, K]
     // 添加 bgImagePosition 作为依赖，确保在图片位置更新后函数能正确工作
-  ), $ = _(
-    (o, t) => ot(o, t, e, U),
-    [e, K]
+  ), $ = P(
+    (o, e) => ot(o, e, t, F),
+    [t, K]
     // 添加 bgImagePosition 作为依赖，确保在图片位置更新后函数能正确工作
   ), {
-    updateTextLayers: F,
-    textLayersMapRef: l,
+    updateTextLayers: b,
+    textLayersMapRef: m,
     textLayoutContentMapRef: Y
   } = Ke({
-    canvas: e,
+    canvas: t,
     imageToCanvasCoords: $,
-    activeLabelValue: E,
+    activeLabelValue: g,
     onAppendTextToActive: Ee
   });
-  te.current = F;
+  te.current = b;
   const {
     performOCRIfNeeded: ce,
     ocrRecognizingRef: ut
   } = qe({
-    ocrRecognize: ve,
-    onChange: A,
-    updateTextLayers: F,
-    canvas: e,
-    updateOCRLoadingIcon: we,
-    rectMapRef: u,
-    textLayersMapRef: l,
+    ocrRecognize: Te,
+    onChange: x,
+    updateTextLayers: b,
+    canvas: t,
+    updateOCRLoadingIcon: ke,
+    rectMapRef: a,
+    textLayersMapRef: m,
     textLayoutContentMapRef: Y
   }), {
     updateRegionShapeAndImage: ae
   } = $e({
-    canvas: e,
-    image: S,
-    draggable: v,
-    canvasToImageCoords: O,
+    canvas: t,
+    image: D,
+    draggable: E,
+    canvasToImageCoords: y,
     imageToCanvasCoords: $,
     cropRegionImage: ie,
-    onChange: A,
+    onChange: x,
     onRegionChange: H,
     performOCRIfNeeded: ce,
-    updateTextLayers: F,
-    rectMapRef: u,
+    updateTextLayers: b,
+    rectMapRef: a,
     regionNameTextMapRef: C,
-    ocrLoadingIconMapRef: w
+    ocrLoadingIconMapRef: k
   });
   h(() => {
-    D();
-  }, [D]), h(() => {
-    e && (l.current.forEach((o) => {
-      o.forEach((t) => {
-        t.off("mousedown"), t.off("mouseover"), t.off("mouseout"), e.remove(t), Y.current.delete(t);
+    L();
+  }, [L]), h(() => {
+    t && (m.current.forEach((o) => {
+      o.forEach((e) => {
+        e.off("mousedown"), e.off("mouseover"), e.off("mouseout"), t.remove(e), Y.current.delete(e);
       });
-    }), l.current.clear(), C.current.forEach((o) => {
-      e.remove(o);
-    }), C.current.clear(), w.current.forEach((o) => {
-      e.remove(o);
-    }), w.current.clear(), u.current.forEach((o, t) => {
-      t.off("modified"), t.off("moved"), e.remove(t);
-    }), u.current.clear(), ne.current = !1, oe.current = void 0, e.renderAll());
-  }, [e, s == null ? void 0 : s.id]), h(() => {
-    if (!p.current)
+    }), m.current.clear(), C.current.forEach((o) => {
+      t.remove(o);
+    }), C.current.clear(), k.current.forEach((o) => {
+      t.remove(o);
+    }), k.current.clear(), a.current.forEach((o, e) => {
+      e.off("modified"), e.off("moved"), t.remove(e);
+    }), a.current.clear(), ne.current = !1, oe.current = void 0, t.renderAll());
+  }, [t, s == null ? void 0 : s.id]), h(() => {
+    if (!T.current)
       return;
-    X.current = {
-      width: p.current.offsetWidth,
-      height: p.current.offsetHeight
+    W.current = {
+      width: T.current.offsetWidth,
+      height: T.current.offsetHeight
     };
     const o = new ResizeObserver(() => {
-      if (!p.current || se.current)
+      if (!T.current || se.current)
         return;
-      if (e) {
-        const d = e.getZoom();
-        if (Math.abs(d - R) > st)
+      if (t) {
+        const d = t.getZoom();
+        if (Math.abs(d - p) > st)
           return;
       }
-      const t = p.current.offsetWidth, r = p.current.offsetHeight, n = X.current.width, i = X.current.height;
-      (t !== n || r !== i) && (X.current = {
-        width: t,
+      const e = T.current.offsetWidth, r = T.current.offsetHeight, n = W.current.width, i = W.current.height;
+      (e !== n || r !== i) && (W.current = {
+        width: e,
         height: r
-      }, D());
+      }, L());
     });
-    return o.observe(p.current), () => {
+    return o.observe(T.current), () => {
       o.disconnect();
     };
-  }, [D, e, R]), P("ctrl", () => {
-    c || (T && (k(!1), j()), L(!0));
+  }, [L, t, p]), X("ctrl", () => {
+    c || (v && (I(!1), w()), _(!0));
   }, {
     events: ["keydown"]
-  }), P("ctrl", () => {
-    c || L(!1);
+  }), X("ctrl", () => {
+    c || _(!1);
   }, {
     events: ["keyup"]
   }), h(() => {
-    if (!e)
+    if (!t)
       return;
-    const o = ft / R, t = /* @__PURE__ */ new Set();
-    l.current.forEach((r) => {
+    const o = ft / p, e = /* @__PURE__ */ new Set();
+    m.current.forEach((r) => {
       r.forEach((n) => {
-        t.add(n);
+        e.add(n);
       });
-    }), e.getObjects().forEach((r) => {
-      r instanceof b.Rect && !t.has(r) && r.set({
+    }), t.getObjects().forEach((r) => {
+      r instanceof U.Rect && !e.has(r) && r.set({
         strokeWidth: o,
         strokeUniform: !0,
         objectCaching: !1,
@@ -226,7 +226,7 @@ const Wt = ({
         statefullCache: !1,
         noScaleCache: !1
       });
-    }), l.current.forEach((r) => {
+    }), m.current.forEach((r) => {
       r.forEach((n) => {
         n.set({
           fill: it,
@@ -249,86 +249,90 @@ const Wt = ({
         // 与标注框左边对齐
         top: d,
         // 下边缘与标注框上边缘对齐（因为 originY 是 'bottom'）
-        scaleX: 1 / R,
+        scaleX: 1 / p,
         // 反向缩放，抵消画布缩放
-        scaleY: 1 / R
+        scaleY: 1 / p
         // 反向缩放，抵消画布缩放
       });
-      const m = w.current.get(n);
-      if (m) {
+      const f = k.current.get(n);
+      if (f) {
         const N = n.getScaledWidth();
-        n.getScaledHeight(), m.set({
+        n.getScaledHeight(), f.set({
           left: i,
           // top 位置由动画控制，这里不更新
-          scaleX: 1 / R,
+          scaleX: 1 / p,
           // 反向缩放，抵消画布缩放，保持固定视觉粗细
-          scaleY: 1 / R
+          scaleY: 1 / p
           // 反向缩放，抵消画布缩放，保持固定视觉粗细
         });
-        const x = m.getObjects();
-        if (x && x.length > 0) {
-          const y = N * R;
-          x.forEach((z) => {
-            z instanceof b.Rect && z.set("width", y);
+        const M = f.getObjects();
+        if (M && M.length > 0) {
+          const j = N * p;
+          M.forEach((z) => {
+            z instanceof U.Rect && z.set("width", j);
           });
         }
       }
-    }), e.renderAll();
-  }, [e, R]), Be({
-    canvas: e,
-    draggable: v,
-    drawingMode: T
+    }), t.renderAll();
+  }, [t, p]), Be({
+    canvas: t,
+    draggable: E,
+    drawingMode: v,
+    textLayersMapRef: m
   });
   const {
     performDelete: B
   } = Je({
-    canvas: e,
+    canvas: t,
     onRegionChange: H,
     updateRegionNames: Me,
-    rectMapRef: u,
-    textLayersMapRef: l,
+    rectMapRef: a,
+    textLayersMapRef: m,
     textLayoutContentMapRef: Y,
     regionNameTextMapRef: C,
-    ocrLoadingIconMapRef: w
+    ocrLoadingIconMapRef: k
   }), {
     createDeleteControl: G
   } = Qe({
     performDelete: B
   });
   Ge({
-    canvas: e,
+    canvas: t,
     onRegionSelect: J,
     createDeleteControl: G,
-    textLayersMapRef: l,
-    rectMapRef: u
+    textLayersMapRef: m,
+    rectMapRef: a
   });
   const {
-    stopDraw: j
+    stopDraw: w
   } = ze({
-    canvas: e,
-    drawingMode: T,
-    draggable: v,
-    setDrawingMode: k,
-    canvasToImageCoords: O,
-    labelDefinitions: f,
-    onChange: A,
+    canvas: t,
+    drawingMode: v,
+    draggable: E,
+    setDrawingMode: I,
+    canvasToImageCoords: y,
+    labelDefinitions: l,
+    onChange: x,
     cropRegionImage: ie,
     updateRegionShapeAndImage: ae,
     performOCRIfNeeded: ce,
     createDeleteControl: G,
-    updateRegionNameText: W,
+    updateRegionNameText: O,
     onRegionChange: H,
     onRegionSelect: J,
-    rectMapRef: u
+    rectMapRef: a,
+    textLayersMapRef: m
   });
   h(() => {
-    c && (L(!0), k(!1), j());
-  }, [c, j]), h(() => {
-    if (!e)
+    g && (I(!1), w());
+  }, [g, w]), h(() => {
+    c && (_(!0), I(!1), w());
+  }, [c, w]), h(() => {
+    if (!t)
       return;
     const o = () => {
-      e.getObjects().forEach((t) => {
-        t instanceof b.Rect && t.selectable && (t.set({
+      t.getObjects().forEach((e) => {
+        e instanceof U.Rect && e.selectable && (e.set({
           lockMovementX: c,
           lockMovementY: c,
           lockScalingX: c,
@@ -336,125 +340,140 @@ const Wt = ({
           hasControls: !c
           // 在只读模式下，如果有 activeLabelValue，我们可能希望它保持选中状态
           // 但不允许用户通过点击来取消选中或选中其他（这个由 canvas.selection 控制）
-        }), c && t.controls);
-      }), e.requestRenderAll();
+        }), c && e.controls);
+      }), t.requestRenderAll();
     };
-    return o(), e.on("object:added", o), () => {
-      e.off("object:added", o);
+    return o(), t.on("object:added", o), () => {
+      t.off("object:added", o);
     };
-  }, [e, c]), He({
-    canvas: e,
+  }, [t, c]), He({
+    canvas: t,
     sample: s,
-    image: S,
+    image: D,
     bgImagePosition: K,
     canvasInitializedRef: re,
-    bgImagePositionRef: U,
+    bgImagePositionRef: F,
     sampleRef: oe,
     labelsLoadedRef: ne,
-    rectMapRef: u,
-    textLayersMapRef: l,
+    rectMapRef: a,
+    textLayersMapRef: m,
     textLayoutContentMapRef: Y,
     regionNameTextMapRef: C,
-    ocrLoadingIconMapRef: w,
+    ocrLoadingIconMapRef: k,
     imageToCanvasCoords: $,
     updateRegionShapeAndImage: ae,
     createDeleteControl: G,
-    updateRegionNameText: W,
-    updateTextLayers: F
+    updateRegionNameText: O,
+    updateTextLayers: b
   }), h(() => {
-    if (!a || a.length === 0)
+    if (!u || u.length === 0)
       return;
     let o = !1;
-    u.current.forEach((t, r) => {
-      var d, m;
-      const n = a.find((N) => N.id === t.id);
+    a.current.forEach((e, r) => {
+      var d, f;
+      const n = u.find((N) => N.id === e.id);
       if (!n)
         return;
-      const i = he(q(q({}, t), n), {
+      const i = he(q(q({}, e), n), {
         // Keep shape from canvas to avoid desync
-        shape: t.shape,
-        image: (d = n.image) != null ? d : t.image,
-        textLayouts: (m = n.textLayouts) != null ? m : t.textLayouts
+        shape: e.shape,
+        image: (d = n.image) != null ? d : e.image,
+        textLayouts: (f = n.textLayouts) != null ? f : e.textLayouts
       });
-      (i.name !== t.name || i.content !== t.content || i.image !== t.image || i.textLayouts !== t.textLayouts) && (u.current.set(r, i), i.name !== t.name && W(r, i), o = !0);
-    }), o && (e == null || e.renderAll());
-  }, [a, e, W]), et({
-    canvas: e,
-    drawingMode: T,
-    draggable: v,
-    textLayersMapRef: l
+      (i.name !== e.name || i.content !== e.content || i.image !== e.image || i.textLayouts !== e.textLayouts) && (a.current.set(r, i), i.name !== e.name && O(r, i), o = !0);
+    }), o && (t == null || t.renderAll());
+  }, [u, t, O]), et({
+    canvas: t,
+    drawingMode: v,
+    draggable: E,
+    textLayersMapRef: m
   }), h(() => {
-    if (e && Q === null) {
+    if (t && Q === null) {
       const o = /* @__PURE__ */ new Set();
-      l.current.forEach((r) => {
+      m.current.forEach((r) => {
         r.forEach((n) => {
           o.add(n);
         });
-      }), e.getObjects().forEach((r) => {
-        r instanceof b.Rect && !o.has(r) && r.set({
+      }), t.getObjects().forEach((r) => {
+        r instanceof U.Rect && !o.has(r) && r.set({
           fill: at
           // 移除填充色
         });
-      }), e.getActiveObject() && (e.discardActiveObject(), e.renderAll());
+      }), t.getActiveObject() && (t.discardActiveObject(), t.renderAll());
     }
-  }, [e, Q]), h(() => {
+  }, [t, Q]), h(() => {
     var r;
-    if (!e)
+    if (!t)
       return;
-    const o = (r = E == null ? void 0 : E.region) == null ? void 0 : r.id;
-    let t = !1;
-    l.current.forEach((n, i) => {
-      const d = u.current.get(i);
+    const o = (r = g == null ? void 0 : g.region) == null ? void 0 : r.id;
+    let e = !1;
+    m.current.forEach((n, i) => {
+      const d = a.current.get(i);
       if (d && n.length > 0) {
-        const m = o === d.id;
+        const f = o === d.id;
         n.forEach((N) => {
-          N.visible !== m && (N.set({
-            visible: m
-          }), t = !0);
+          N.visible !== f && (N.set({
+            visible: f
+          }), e = !0);
         });
       }
-    }), t && e.renderAll();
-  }, [e, E]), h(() => {
-    if (!e || !E || !Z)
+    }), e && t.renderAll();
+  }, [t, g]), h(() => {
+    var n, i;
+    if (!t)
       return;
-    const o = (t) => {
-      var le;
-      const r = (le = t.e) == null ? void 0 : le.target;
+    const o = (n = g == null ? void 0 : g.region) == null ? void 0 : n.id;
+    if (!o)
+      return;
+    let e = null;
+    if (a.current.forEach((d, f) => {
+      d.id === o && (e = f);
+    }), !e)
+      return;
+    e.bringToFront(), ((i = m.current.get(e)) != null ? i : []).forEach((d) => {
+      d.bringToFront();
+    }), t.renderAll();
+  }, [t, g, a, m]), h(() => {
+    if (!t || !g || !Z)
+      return;
+    const o = (e) => {
+      var de;
+      const r = (de = e.e) == null ? void 0 : de.target;
       if ((r == null ? void 0 : r.tagName) === "INPUT" || (r == null ? void 0 : r.tagName) === "TEXTAREA")
         return;
-      const n = e.getPointer(t.e), i = n.x, d = n.y, m = O(i, d), N = E.region, {
-        x,
-        y,
+      const n = t.getPointer(e.e), i = n.x, d = n.y, f = y(i, d), N = g.region, {
+        x: M,
+        y: j,
         width: z,
-        height: _e
+        height: Le
       } = N.shape;
-      m.x >= x && m.x <= x + z && m.y >= y && m.y <= y + _e || Z();
+      f.x >= M && f.x <= M + z && f.y >= j && f.y <= j + Le || Z();
     };
-    return e.on("mouse:down", o), () => {
-      e.off("mouse:down", o);
+    return t.on("mouse:down", o), () => {
+      t.off("mouse:down", o);
     };
-  }, [e, E, Z, O]);
-  const fe = _((o) => {
-    const t = o.target;
-    if ((t == null ? void 0 : t.tagName) === "INPUT" || (t == null ? void 0 : t.tagName) === "TEXTAREA" || !e || c)
+  }, [t, g, Z, y]);
+  const fe = P((o) => {
+    const e = o.target;
+    if ((e == null ? void 0 : e.tagName) === "INPUT" || (e == null ? void 0 : e.tagName) === "TEXTAREA" || !t || c)
       return;
-    const r = e.getActiveObject();
-    !r || !(r instanceof b.Rect) || B(r);
-  }, [e, B]);
-  P("Delete", fe), P("Backspace", fe), P("r", (o) => {
-    const t = o.target;
-    (t == null ? void 0 : t.tagName) === "INPUT" || (t == null ? void 0 : t.tagName) === "TEXTAREA" || t != null && t.isContentEditable || c || !T && !v && k(!0);
+    const r = t.getActiveObject();
+    !r || !(r instanceof U.Rect) || B(r);
+  }, [t, B]);
+  X("Delete", fe), X("Backspace", fe), X("r", (o) => {
+    const e = o.target;
+    (e == null ? void 0 : e.tagName) === "INPUT" || (e == null ? void 0 : e.tagName) === "TEXTAREA" || e != null && e.isContentEditable || c || !v && !E && I(!0);
   }, {
     exactMatch: !1
     // 允许大小写
   });
-  const Le = () => {
-    c || (T && (k(!1), j()), L(!v));
-  }, De = () => {
-    c || (v && L(!1), k(!T));
+  const De = () => {
+    c || (v && (I(!1), w()), _(!E));
+  }, _e = () => {
+    c || (E && _(!1), I(!v));
   };
   return h(() => () => {
-    e && e.dispose();
+    t && t.dispose();
   }, []), /* @__PURE__ */ Re("div", {
     style: {
       width: "100%",
@@ -462,28 +481,28 @@ const Wt = ({
       display: "flex",
       position: "relative"
     },
-    children: [Te && /* @__PURE__ */ M("div", {
+    children: [ve && /* @__PURE__ */ S("div", {
       className: "vlm-loading-overlay",
-      children: /* @__PURE__ */ M("div", {
+      children: /* @__PURE__ */ S("div", {
         className: "vlm-loading-spinner"
       })
-    }), /* @__PURE__ */ M("div", {
+    }), /* @__PURE__ */ S("div", {
       className: "vlm-marker-toolbar",
-      children: /* @__PURE__ */ M(Fe, {
-        drawingMode: T,
-        draggable: v,
-        scale: R,
-        onToggleDrawingMode: De,
-        onToggleDrag: Le,
+      children: /* @__PURE__ */ S(ye, {
+        drawingMode: v,
+        draggable: E,
+        scale: p,
+        onToggleDrawingMode: _e,
+        onToggleDrag: De,
         onZoom: Se,
-        onFitToScreen: D,
+        onFitToScreen: L,
         readOnly: c
       })
     }), /* @__PURE__ */ Re("div", {
-      ref: p,
+      ref: T,
       className: Oe({
         "vlm-label-maker-wrap": !0,
-        draggable: v
+        draggable: E
       }),
       onContextMenu: (o) => {
         o.preventDefault();
@@ -492,10 +511,10 @@ const Wt = ({
         flex: 1,
         position: "relative"
       },
-      children: [(((ue = s == null ? void 0 : s.sampleFileName) == null ? void 0 : ue.originalName) || ((me = s == null ? void 0 : s.sampleFileName) == null ? void 0 : me.name)) && /* @__PURE__ */ M("div", {
+      children: [(((ue = s == null ? void 0 : s.sampleFileName) == null ? void 0 : ue.originalName) || ((me = s == null ? void 0 : s.sampleFileName) == null ? void 0 : me.name)) && /* @__PURE__ */ S("div", {
         className: "vlm-image-name",
         children: s.sampleFileName.originalName || s.sampleFileName.name
-      }), /* @__PURE__ */ M("canvas", {
+      }), /* @__PURE__ */ S("canvas", {
         className: "vlm-label-maker-canvas",
         ref: V
       })]