Merge branch 'dev'

cidhuang · May 19, 2024 · bdded4d · bdded4d
2 parents 5e7270c + e8e6ca4
commit bdded4d
Show file tree

Hide file tree

Showing 3 changed files with 157 additions and 64 deletions.
diff --git a/src/components/SystemMapCanvas/InputTextArea.tsx b/src/components/SystemMapCanvas/InputTextArea.tsx
@@ -23,16 +23,20 @@ export const InputTextArea = ({
     setValue(value0.replaceAll("\\n", "\\\n").replaceAll("\n", "\\n"));
   }, [value0, visible]);
 
-  function handleKeyDown(event: SyntheticEvent) {
-    const e = event as unknown as KeyboardEvent;
-    if (e.code === "Enter") {
-      if (value.replaceAll(" ", "").replaceAll("\n", "") === "") {
-        onKeyEnterDown(value0);
-        return;
-      }
-      onKeyEnterDown(value.replaceAll("\\n", "\n").replaceAll("\\\n", "\\n"));
+  useEffect(() => {
+    if (value.replaceAll(" ", "").replaceAll("\n", "") === "") {
+      onKeyEnterDown(value0);
+      return;
+    }
+    if (value.indexOf("\n") >= 0) {
+      onKeyEnterDown(
+        value
+          .replaceAll("\n", "")
+          .replaceAll("\\n", "\n")
+          .replaceAll("\\\n", "\\n"),
+      );
     }
-  }
+  }, [value]);
 
   return (
     <div
@@ -43,7 +47,6 @@ export const InputTextArea = ({
       <textarea
         placeholder=""
         value={value}
-        onKeyDown={handleKeyDown}
         onChange={(e) => setValue(e.target.value)}
         style={{ width: width, height: height, resize: "none" }}
       ></textarea>

diff --git a/src/components/SystemMapCanvas/SystemMapCanvas.tsx b/src/components/SystemMapCanvas/SystemMapCanvas.tsx
@@ -79,6 +79,9 @@ export const SystemMapCanvas = ({
     handleDoubleClick,
     handleClick,
     handleContextMenu,
+    handleTouchStart,
+    handleTouchMove,
+    handleTouchUp,
   ] = useMouse(
     app,
     ref,
@@ -87,7 +90,8 @@ export const SystemMapCanvas = ({
     editingText,
     dispatch,
     itemName,
-    handleEdit,
+    editTextStart,
+    editTextEnd,
   );
 
   const [
@@ -176,13 +180,19 @@ export const SystemMapCanvas = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [state.cmdUndoReset]);
 
-  function handleEdit(item: string) {
+  function editTextStart(item: string) {
     if (isVariable(item)) {
       setEditingText(item);
     }
   }
 
-  function handleNameKeyEnterDown(value: string) {
+  function editTextEnd() {
+    setEditingText("");
+    setSelected("");
+    setInputVisible(false);
+  }
+
+  function changeText(value: string) {
     const item = structuredClone(
       state.items.variables.find((variable) => variable.name === editingText),
     );
@@ -216,6 +226,9 @@ export const SystemMapCanvas = ({
           onMouseUp={handleMouseUp}
           onDoubleClick={handleDoubleClick}
           onClick={handleClick}
+          onTouchStart={handleTouchStart}
+          onTouchMove={handleTouchMove}
+          onTouchEnd={handleTouchUp}
         ></Stage>
       </div>
       <InputTextArea
@@ -224,7 +237,7 @@ export const SystemMapCanvas = ({
         width={inputWidth}
         height={inputHeight}
         value0={inputValue}
-        onKeyEnterDown={handleNameKeyEnterDown}
+        onKeyEnterDown={changeText}
       />
     </div>
   );