fix(tool): mousePointer

components/label/components/AssistShapeComponent.tsx

@@ -6,6 +6,7 @@ import React, {
   useImperativeHandle,
   useRef,
 } from "react"
+import { useTopToolsStore } from "../useTopToolsStore"
 
 interface AssistShapeComponentProps {
   size: number
@@ -16,7 +17,9 @@ const AssistShapeComponent = (
   ref: React.Ref<unknown> | undefined
 ) => {
   const { size } = props
+  const scale = useTopToolsStore((state) => state.scale)
   const canvasRef = useRef<HTMLCanvasElement>(null)
+  const lastPointerRef = useRef<{ x: number; y: number } | null>(null)
 
   const drawAssistShape = useCallback(
     (centerX: number, centerY: number) => {
@@ -24,7 +27,7 @@ const AssistShapeComponent = (
       const ctx = canvas?.getContext("2d")
       if (!canvas || !ctx) return
 
-      const radius = Math.max(1, size)
+      const radius = Math.max(1, size * scale)
       const side = radius * 2
       const left = centerX - radius
       const top = centerY - radius
@@ -38,7 +41,7 @@ const AssistShapeComponent = (
       ctx.arc(centerX, centerY, radius, 0, Math.PI * 2)
       ctx.stroke()
     },
-    [size]
+    [scale, size]
   )
 
   useEffect(() => {
@@ -47,7 +50,11 @@ const AssistShapeComponent = (
     canvas.width = window.innerWidth
     canvas.height = window.innerHeight
     const rect = canvas.getBoundingClientRect()
-    drawAssistShape(rect.width / 2, rect.height / 2)
+    const center = lastPointerRef.current || {
+      x: rect.width / 2,
+      y: rect.height / 2,
+    }
+    drawAssistShape(center.x, center.y)
   }, [drawAssistShape])
 
   const updateAssistShape = (event: { clientX: number; clientY: number }) => {
@@ -56,6 +63,7 @@ const AssistShapeComponent = (
     const rect = canvas.getBoundingClientRect()
     const centerX = event.clientX - rect.left
     const centerY = event.clientY - rect.top
+    lastPointerRef.current = { x: centerX, y: centerY }
     drawAssistShape(centerX, centerY)
   }
 

components/label/components/TopTools.tsx

@@ -55,6 +55,7 @@ import {
   Paintbrush,
   Pen,
   SquarePen,
+  SquareDashedMousePointer,
   Tag,
   Timer,
 } from "lucide-react"
@@ -2082,7 +2083,7 @@ const TopTools = (
               onClick={() => {
                 setAssistToolEnabled(!assistToolEnabled)
               }}>
-              <Eclipse size={16} />
+              <SquareDashedMousePointer size={16} />
             </ActionIcon>
             <NumberInput
               value={assistToolSize}