update guide line

2026-04-26 11:19:23 +03:30
parent 3cac084aa5
commit a10c618113
4 changed files with 64 additions and 64 deletions
@@ -86,9 +86,9 @@ const EditorCanvas = ({ catalogSize }: EditorCanvasProps) => {
      guides.map((guide) =>
        guide.id === id
          ? {
-              ...guide,
-              position,
-            }
+            ...guide,
+            position,
+          }
          : guide,
      ),
    );
@@ -250,59 +250,59 @@ const EditorCanvas = ({ catalogSize }: EditorCanvasProps) => {
          />
          <div className="absolute -top-6 -left-6 w-6 h-6 bg-slate-200 border border-slate-300" />
          <div ref={stageWrapRef} className="shadow-lg">
-        <Stage
-          ref={stageRef}
-          width={stageSize.width * finalScale}
-          height={stageSize.height * finalScale}
-          scaleX={finalScale}
-          scaleY={finalScale}
-          onMouseDown={handleStageMouseDownWithGuideReset}
-          onMouseMove={handleStageMouseMove}
-          onMouseUp={handleStageMouseUp}
-          onDragMove={handleDragMove}
-          onDragEnd={handleDragEnd}
-        >
-          <Layer listening={false}>
-            <Rect
-              x={0}
-              y={0}
-              width={stageSize.width}
-              height={stageSize.height}
-              fill="#ffffff"
-              listening={false}
-            />
-          </Layer>
+            <Stage
+              ref={stageRef}
+              width={stageSize.width * finalScale}
+              height={stageSize.height * finalScale}
+              scaleX={finalScale}
+              scaleY={finalScale}
+              onMouseDown={handleStageMouseDownWithGuideReset}
+              onMouseMove={handleStageMouseMove}
+              onMouseUp={handleStageMouseUp}
+              onDragMove={handleDragMove}
+              onDragEnd={handleDragEnd}
+            >
+              <Layer listening={false}>
+                <Rect
+                  x={0}
+                  y={0}
+                  width={stageSize.width}
+                  height={stageSize.height}
+                  fill="#ffffff"
+                  listening={false}
+                />
+              </Layer>

-          <ObjectsLayer
-            layerRef={layerRef}
-            objects={objects}
-            selectedObjectIds={selectedObjectIds}
-            selectedCellId={selectedCellId}
-            tool={tool}
-            transformerRef={transformerRef}
-            selectedObject={selectedObject}
-            isGroupedWithMask={isGroupedWithMask}
-            maskObject={maskObject}
-            canGroup={canGroup}
-            canUngroup={canUngroup}
-            onSelect={handleSelect}
-            onUpdate={handleObjectUpdate}
-            onCellClick={handleCellClick}
-            onCellDblClick={handleCellDblClick}
-            onGroup={handleGroupWithMask}
-            onUngroup={handleUngroupFromMask}
-          />
-          <GuidesLayer
-            guides={guides}
-            stageWidth={stageSize.width}
-            stageHeight={stageSize.height}
-            activeGuideIds={activeGuideIds}
-            selectedGuideId={selectedGuideId}
-            draftGuide={draftGuide}
-            onGuideSelect={setSelectedGuideId}
-            onGuideDragEnd={handleGuideDragEnd}
-          />
-        </Stage>
+              <ObjectsLayer
+                layerRef={layerRef}
+                objects={objects}
+                selectedObjectIds={selectedObjectIds}
+                selectedCellId={selectedCellId}
+                tool={tool}
+                transformerRef={transformerRef}
+                selectedObject={selectedObject}
+                isGroupedWithMask={isGroupedWithMask}
+                maskObject={maskObject}
+                canGroup={canGroup}
+                canUngroup={canUngroup}
+                onSelect={handleSelect}
+                onUpdate={handleObjectUpdate}
+                onCellClick={handleCellClick}
+                onCellDblClick={handleCellDblClick}
+                onGroup={handleGroupWithMask}
+                onUngroup={handleUngroupFromMask}
+              />
+              <GuidesLayer
+                guides={guides}
+                stageWidth={stageSize.width}
+                stageHeight={stageSize.height}
+                activeGuideIds={activeGuideIds}
+                selectedGuideId={selectedGuideId}
+                draftGuide={draftGuide}
+                onGuideSelect={setSelectedGuideId}
+                onGuideDragEnd={handleGuideDragEnd}
+              />
+            </Stage>
          </div>
        </div>
      </div>
@@ -14,10 +14,10 @@ const AbstractShape = ({ obj, isSelected, onSelect, onUpdate, draggable }: Shape
    const abstractScale = 0.85;
    const radius = baseRadius * abstractScale;
    const innerRadius = radius * 0.5;
-    
+
    const actualStrokeWidth = obj.strokeWidth ?? 0;
    const hasStroke = actualStrokeWidth > 0;
-    
+
    // برای نمایش انتخاب: اگر strokeWidth واقعی > 0 است، از آن استفاده کن، وگرنه stroke را برای انتخاب نمایش بده
    const displayStroke = isSelected
        ? (hasStroke ? obj.stroke : "#3b82f6")
@@ -26,7 +26,7 @@ const AbstractShape = ({ obj, isSelected, onSelect, onUpdate, draggable }: Shape
            : (isMask && !showGuide)
                ? "transparent"
                : (hasStroke ? obj.stroke : undefined);
-    
+
    const displayStrokeWidth = isSelected
        ? (hasStroke ? actualStrokeWidth : 3)
        : (isMask && showGuide ? 2 : actualStrokeWidth);
@@ -10,10 +10,10 @@ const CircleShape = ({ obj, isSelected, onSelect, onUpdate, draggable }: ShapePr

    const isMask = obj.isMask || false;
    const showGuide = obj.showMaskGuide !== false;
-    
+
    const actualStrokeWidth = obj.strokeWidth ?? 0;
    const hasStroke = actualStrokeWidth > 0;
-    
+
    // برای نمایش انتخاب: اگر strokeWidth واقعی > 0 است، از آن استفاده کن، وگرنه stroke را برای انتخاب نمایش بده
    const displayStroke = isSelected
        ? (hasStroke ? obj.stroke : "#3b82f6")
@@ -22,7 +22,7 @@ const CircleShape = ({ obj, isSelected, onSelect, onUpdate, draggable }: ShapePr
            : (isMask && !showGuide)
                ? "transparent"
                : (hasStroke ? obj.stroke : undefined);
-    
+
    const displayStrokeWidth = isSelected
        ? (hasStroke ? actualStrokeWidth : 3)
        : (isMask && showGuide ? 2 : actualStrokeWidth);
@@ -11,10 +11,10 @@ const TriangleShape = ({ obj, isSelected, onSelect, onUpdate, draggable }: Shape
    const isMask = obj.isMask || false;
    const showGuide = obj.showMaskGuide !== false;
    const radius = Math.min((obj.width || 100) / 2, (obj.height || 100) / 2);
-    
+
    const actualStrokeWidth = obj.strokeWidth ?? 0;
    const hasStroke = actualStrokeWidth > 0;
-    
+
    // برای نمایش انتخاب: اگر strokeWidth واقعی > 0 است، از آن استفاده کن، وگرنه stroke را برای انتخاب نمایش بده
    const displayStroke = isSelected
        ? (hasStroke ? obj.stroke : "#3b82f6")
@@ -23,7 +23,7 @@ const TriangleShape = ({ obj, isSelected, onSelect, onUpdate, draggable }: Shape
            : (isMask && !showGuide)
                ? "transparent"
                : (hasStroke ? obj.stroke : undefined);
-    
+
    const displayStrokeWidth = isSelected
        ? (hasStroke ? actualStrokeWidth : 3)
        : (isMask && showGuide ? 2 : actualStrokeWidth);