fix drawing

src/pages/editor/components/canvas/drawingUtils.ts

@@ -19,6 +19,76 @@ export const createDrawingObject = ({
 
   if (tool === "rectangle") {
     const activeShape = useShapeStore.getState().activeShape;
+
+    // برای دایره، مرکز و شعاع را محاسبه می‌کنیم
+    if (activeShape === "circle") {
+      const centerX = (startPos.x + pointerPos.x) / 2;
+      const centerY = (startPos.y + pointerPos.y) / 2;
+      const radius = Math.max(Math.abs(width), Math.abs(height)) / 2;
+
+      return {
+        id: tempObject?.id || `rect-${Date.now()}`,
+        type: "rectangle",
+        x: centerX,
+        y: centerY,
+        width: radius * 2,
+        height: radius * 2,
+        fill: "#3b82f6",
+        stroke: "#1e40af",
+        strokeWidth: 0,
+        shapeType: activeShape,
+      };
+    }
+
+    // برای مثلث، مرکز را محاسبه می‌کنیم و سپس گوشه بالا-چپ را
+    if (activeShape === "triangle") {
+      const centerX = (startPos.x + pointerPos.x) / 2;
+      const centerY = (startPos.y + pointerPos.y) / 2;
+      const size = Math.max(Math.abs(width), Math.abs(height));
+
+      // گوشه بالا-چپ مستطیل محدودکننده
+      const x = centerX - size / 2;
+      const y = centerY - size / 2;
+
+      return {
+        id: tempObject?.id || `rect-${Date.now()}`,
+        type: "rectangle",
+        x: x,
+        y: y,
+        width: size,
+        height: size,
+        fill: "#3b82f6",
+        stroke: "#1e40af",
+        strokeWidth: 0,
+        shapeType: activeShape,
+      };
+    }
+
+    // برای شکل انتزاعی، مرکز را محاسبه می‌کنیم و سپس گوشه بالا-چپ را
+    if (activeShape === "abstract") {
+      const centerX = (startPos.x + pointerPos.x) / 2;
+      const centerY = (startPos.y + pointerPos.y) / 2;
+      const size = Math.max(Math.abs(width), Math.abs(height));
+
+      // گوشه بالا-چپ مستطیل محدودکننده
+      const x = centerX - size / 2;
+      const y = centerY - size / 2;
+
+      return {
+        id: tempObject?.id || `rect-${Date.now()}`,
+        type: "rectangle",
+        x: x,
+        y: y,
+        width: size,
+        height: size,
+        fill: "#3b82f6",
+        stroke: "#1e40af",
+        strokeWidth: 0,
+        shapeType: activeShape,
+      };
+    }
+
+    // برای سایر اشکال (مستطیل)
     return {
       id: tempObject?.id || `rect-${Date.now()}`,
       type: "rectangle",

src/pages/editor/components/canvas/useDrawingHandlers.ts

@@ -51,15 +51,23 @@ export const useDrawingHandlers = () => {
         const pointerPos = stage.getPointerPosition();
         if (!pointerPos) return;
 
+        // تبدیل موقعیت به مختصات واقعی لایه (با در نظر گرفتن scale)
+        const scaleX = stage.scaleX();
+        const scaleY = stage.scaleY();
+        const realPos = {
+            x: pointerPos.x / scaleX,
+            y: pointerPos.y / scaleY,
+        };
+
         setIsDrawing(true);
-        setStartPos(pointerPos);
+        setStartPos(realPos);
 
         if (tool === "text") {
             const newText: EditorObject = {
                 id: `text-${Date.now()}`,
                 type: "text",
-                x: pointerPos.x,
-                y: pointerPos.y,
+                x: realPos.x,
+                y: realPos.y,
                 text: "متن جدید",
                 fontSize: defaults.fontSize,
                 fontFamily: defaults.fontFamily,
@@ -75,7 +83,7 @@ export const useDrawingHandlers = () => {
         }
 
         if (tool === "grid") {
-            addTable(pointerPos.x, pointerPos.y, 4, 5);
+            addTable(realPos.x, realPos.y, 4, 5);
             setSelectedTableId(null);
             setTool("select");
         }
@@ -90,7 +98,15 @@ export const useDrawingHandlers = () => {
         const pointerPos = stage.getPointerPosition();
         if (!pointerPos) return;
 
-        const newObject = createDrawingObject({ tool, startPos, pointerPos, tempObject });
+        // تبدیل موقعیت به مختصات واقعی لایه (با در نظر گرفتن scale)
+        const scaleX = stage.scaleX();
+        const scaleY = stage.scaleY();
+        const realPos = {
+            x: pointerPos.x / scaleX,
+            y: pointerPos.y / scaleY,
+        };
+
+        const newObject = createDrawingObject({ tool, startPos, pointerPos: realPos, tempObject });
         if (!newObject) return;
 
         if (!tempObject) {