feat: Shift the first bezier control along with new vertex

src/shapes/line.spec.ts

@@ -679,6 +679,33 @@ describe("addNewVertex", () => {
     });
   });
 
+  test("should shift the fist bezier control along with new vertex", () => {
+    const v = { x: -10, y: -10 };
+    const c = { c1: { x: 0, y: 0 }, c2: { x: 0, y: 0 } };
+    const shape = struct.create({
+      p: { x: 1, y: 0 },
+      q: { x: 10, y: 0 },
+      body: [{ p: { x: 2, y: 3 } }, { p: { x: 3, y: 4 } }],
+      curves: [c, c, c],
+    });
+    expect(addNewVertex(shape, 1, v)).toEqual({
+      body: [{ p: v }, { p: { x: 2, y: 3 } }, { p: { x: 3, y: 4 } }],
+      curves: [undefined, { c1: { x: -11, y: -10 }, c2: { x: 0, y: 0 } }, c, c],
+    });
+    expect(addNewVertex(shape, 2, v)).toEqual({
+      body: [{ p: { x: 2, y: 3 } }, { p: v }, { p: { x: 3, y: 4 } }],
+      curves: [c, undefined, { c1: { x: -12, y: -13 }, c2: { x: 0, y: 0 } }, c],
+    });
+    expect(addNewVertex(shape, 3, v)).toEqual({
+      body: [{ p: { x: 2, y: 3 } }, { p: { x: 3, y: 4 } }, { p: v }],
+      curves: [c, c, undefined, { c1: { x: -13, y: -14 }, c2: { x: 0, y: 0 } }],
+    });
+    expect(addNewVertex(shape, 4, v)).toEqual({
+      body: [{ p: { x: 2, y: 3 } }, { p: { x: 3, y: 4 } }, { p: shape.q }],
+      q: v,
+    });
+  });
+
   test("should insert new vertex to the top when index is 0", () => {
     const c = { id: "a", rate: { x: 0.5, y: 0.2 } };
     const shape0 = struct.create({ p: { x: 0, y: 0 }, q: { x: 10, y: 0 }, pConnection: c });

src/shapes/line.ts

@@ -502,6 +502,22 @@ function shiftCurves(
   return ret.length > 0 ? ret : undefined;
 }
 
+function shiftCurveAtVertex(curves: LineShape["curves"], index: number, v: IVec2): LineShape["curves"] {
+  const ret: LineShape["curves"] = curves?.concat() ?? [];
+
+  const curveForward = ret?.[index];
+  if (isBezieirControl(curveForward)) {
+    ret[index] = { c1: add(curveForward.c1, v), c2: curveForward.c2 };
+  }
+
+  const curveBackward = index > 0 ? ret?.[index - 1] : undefined;
+  if (isBezieirControl(curveBackward)) {
+    ret[index - 1] = { c1: curveBackward.c1, c2: add(curveBackward.c2, v) };
+  }
+
+  return ret;
+}
+
 export function patchVertices(
   shape: LineShape,
   data: [index: number, p: IVec2, c: ConnectionPoint | undefined][],
@@ -588,11 +604,6 @@ export function addNewVertex(shape: LineShape, index: number, p: IVec2, c?: Conn
           : [{ p: shape.p, c: shape.pConnection }],
         curves: shape.curves ? [undefined, ...shape.curves] : undefined,
       };
-    case 1:
-      return {
-        body: shape.body ? [{ p, c }, ...shape.body] : [{ p, c }],
-        curves: shape.curves ? [undefined, ...shape.curves] : undefined,
-      };
     case 2 + (shape.body?.length ?? 0):
       return {
         body: shape.body
@@ -602,16 +613,23 @@ export function addNewVertex(shape: LineShape, index: number, p: IVec2, c?: Conn
         qConnection: c,
       };
     default:
-      if (shape.body) {
+      if (shape.body && shape.body.length > 0) {
         const body = [...shape.body.slice(0, index - 1), { p, c }, ...shape.body.slice(index - 1)];
         if (shape.curves && shape.curves.length >= index) {
-          const curves = [...shape.curves.slice(0, index - 1), undefined, ...shape.curves.slice(index - 1)];
+          const curves = shiftCurveAtVertex(
+            [...shape.curves.slice(0, index - 1), undefined, ...shape.curves.slice(index - 1)],
+            index,
+            sub(p, index === 1 ? shape.p : shape.body[index - 2].p),
+          );
           return { body, curves };
         } else {
           return { body };
         }
       } else {
-        return { body: [{ p, c }] };
+        return {
+          body: [{ p, c }],
+          curves: shape.curves ? shiftCurveAtVertex([undefined, ...shape.curves], index, sub(p, shape.p)) : undefined,
+        };
       }
   }
 }