From 7b82cd38a4838e6e2a6756cece649048cb0dddd9 Mon Sep 17 00:00:00 2001
From: graphemecluster <graphemecluster@gmail.com>
Date: Wed, 14 Apr 2021 14:45:04 +0800
Subject: [PATCH 1/3] Make the stroke center line unclickable

---
 src/components/StrokeCenterLine.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/StrokeCenterLine.css b/src/components/StrokeCenterLine.css
index 646ffcd..63273c2 100644
--- a/src/components/StrokeCenterLine.css
+++ b/src/components/StrokeCenterLine.css
@@ -2,4 +2,5 @@
   fill: none;
   stroke: #ffffff;
   stroke-width: 1px;
+  pointer-events: none;
 }
\ No newline at end of file

From 4930d856568f1791098fa4a62b44f22f0b07f0d1 Mon Sep 17 00:00:00 2001
From: graphemecluster <graphemecluster@gmail.com>
Date: Wed, 14 Apr 2021 14:45:04 +0800
Subject: [PATCH 2/3] Make the cursor `move` while moving
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

移動のときカーソルを `move` にする
---
 src/components/Glyph.css | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/Glyph.css b/src/components/Glyph.css
index 9028b84..7d6ab67 100644
--- a/src/components/Glyph.css
+++ b/src/components/Glyph.css
@@ -1,6 +1,7 @@
 .strokes-deselected polygon {
   fill: #000000;
   stroke: none;
+  cursor: move;
 }
 
 .xormask-fill {
@@ -21,4 +22,5 @@
 .strokes-selected polygon {
   fill: #cc0000;
   stroke: none;
+  cursor: move;
 }

From 473014000778fbd8726e1b8d6a88e88c661e22b0 Mon Sep 17 00:00:00 2001
From: Kurogoma <gogottt2009-hp@yahoo.co.jp>
Date: Sat, 7 Oct 2023 13:51:34 +0900
Subject: [PATCH 3/3] Strokes in the preview is not movable

---
 src/components/Glyph.css  |  4 +++-
 src/components/Glyph.tsx  | 10 ++++++++--
 src/components/Stroke.tsx |  7 ++++++-
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/src/components/Glyph.css b/src/components/Glyph.css
index 7d6ab67..3425798 100644
--- a/src/components/Glyph.css
+++ b/src/components/Glyph.css
@@ -1,7 +1,6 @@
 .strokes-deselected polygon {
   fill: #000000;
   stroke: none;
-  cursor: move;
 }
 
 .xormask-fill {
@@ -22,5 +21,8 @@
 .strokes-selected polygon {
   fill: #cc0000;
   stroke: none;
+}
+
+.movable-stroke {
   cursor: move;
 }
diff --git a/src/components/Glyph.tsx b/src/components/Glyph.tsx
index a331297..ae8fec0 100644
--- a/src/components/Glyph.tsx
+++ b/src/components/Glyph.tsx
@@ -31,7 +31,10 @@ const GlyphComponent = (props: GlyphComponentProps) => {
       <g className="strokes-deselected">
         {nonSelection.map((index) => (
           <g key={index} onMouseDown={(evt) => props.handleMouseDownDeselectedStroke?.(evt, index)}>
-            <Stroke polygons={polygonsSep[index]} />
+            <Stroke
+              polygons={polygonsSep[index]}
+              className={props.handleMouseDownDeselectedStroke ? "movable-stroke" : ""}
+            />
           </g>
         ))}
       </g>
@@ -51,7 +54,10 @@ const GlyphComponent = (props: GlyphComponentProps) => {
       <g className="strokes-selected">
         {selection.map((index) => (
           <g key={index} onMouseDown={(evt) => props.handleMouseDownSelectedStroke?.(evt, index)}>
-            <Stroke polygons={polygonsSep[index]} />
+            <Stroke
+              polygons={polygonsSep[index]}
+              className={props.handleMouseDownSelectedStroke ? "movable-stroke" : ""}
+            />
           </g>
         ))}
       </g>
diff --git a/src/components/Stroke.tsx b/src/components/Stroke.tsx
index 83c8f65..775ec85 100644
--- a/src/components/Stroke.tsx
+++ b/src/components/Stroke.tsx
@@ -4,12 +4,17 @@ import { Polygons } from '@kurgm/kage-engine';
 
 export interface StrokeComponentProps {
   polygons: Polygons;
+  className?: string;
 }
 
 const StrokeComponent = (props: StrokeComponentProps) => (
   <>
     {props.polygons.array.map((polygon, i) => (
-      <polygon key={i} points={polygon.array.map(({ x, y }) => `${x},${y} `).join("")} />
+      <polygon
+        key={i}
+        className={props.className}
+        points={polygon.array.map(({ x, y }) => `${x},${y} `).join("")}
+      />
     ))}
   </>
 );