refactoring

src/canvas-builder/create-animated-layout-params/resolve-animated-layout-algorithm/resolve-animated-layout-algorithm.ts

@@ -30,7 +30,7 @@ export const resolveAnimatedLayoutAlgorithm = (
         edgeStiffness:
           config?.edgeStiffness ?? forceDirectedDefaults.edgeStiffness,
         stopVelocity:
-          config?.stopVelocity ?? forceDirectedDefaults.convergenceVelocity,
+          config?.stopVelocity ?? forceDirectedDefaults.stopVelocity,
         maxForce: config?.maxForce ?? forceDirectedDefaults.maxForce,
         nodeForceCoefficient:
           config?.nodeForceCoefficient ??

src/canvas-builder/create-layout-params/resolve-layout-algorithm/resolve-layout-algorithm.ts

@@ -44,7 +44,7 @@ export const resolveLayoutAlgorithm = (
         edgeStiffness:
           config?.edgeStiffness ?? forceDirectedDefaults.edgeStiffness,
         stopVelocity:
-          config?.stopVelocity ?? forceDirectedDefaults.convergenceVelocity,
+          config?.stopVelocity ?? forceDirectedDefaults.stopVelocity,
         maxForce: config?.maxForce ?? forceDirectedDefaults.maxForce,
         nodeForceCoefficient:
           config?.nodeForceCoefficient ??

src/canvas-builder/shared/force-directed-defaults.ts

@@ -7,7 +7,7 @@ export const forceDirectedDefaults = Object.freeze({
   edgeStiffness: 1e3,
   dtSec: 1e-2,
   maxIterations: 1000,
-  convergenceVelocity: 10,
+  stopVelocity: 10,
   maxForce: 1e7,
   nodeForceCoefficient: 1,
   barnesHutAreaRadiusThreshold: 1e-2,

src/edges/edge-shape.ts

@@ -1,7 +1,8 @@
+import { EdgeElement } from "@/element";
 import { EdgeRenderParams } from "./edge-render-params";
 
 export interface EdgeShape {
-  readonly element: SVGSVGElement;
+  readonly element: EdgeElement;
 
   render(params: EdgeRenderParams): void;
 }

src/edges/shapes/interactive-edge-shape/interactive-edge-shape.ts

@@ -8,9 +8,10 @@ import { edgeConstants } from "../../edge-constants";
 import { InteractiveEdgeError } from "./interactive-edge-error";
 import { EventHandler } from "@/event-subject";
 import { StructuredEdgeRenderModel } from "../../structure-render-model";
+import { EdgeElement } from "@/element";
 
 export class InteractiveEdgeShape implements StructuredEdgeShape {
-  public readonly element: SVGSVGElement;
+  public readonly element: EdgeElement;
 
   public readonly group: SVGGElement;
 

src/edges/shapes/midpoint-edge-shape/midpoint-edge-shape.ts

@@ -2,6 +2,7 @@ import { EventHandler } from "@/event-subject";
 import { EdgeRenderParams } from "../../edge-render-params";
 import { StructuredEdgeRenderModel } from "../../structure-render-model";
 import { StructuredEdgeShape } from "../../structured-edge-shape";
+import { EdgeElement } from "@/element";
 
 export class MidpointEdgeShape implements StructuredEdgeShape {
   public readonly group: SVGGElement;
@@ -14,7 +15,7 @@ export class MidpointEdgeShape implements StructuredEdgeShape {
 
   public readonly onAfterRender: EventHandler<StructuredEdgeRenderModel>;
 
-  public readonly element: SVGSVGElement;
+  public readonly element: EdgeElement;
 
   public constructor(
     private readonly baseShape: StructuredEdgeShape,

src/element/edge-element.ts

@@ -0,0 +1 @@
+export type EdgeElement = HTMLElement | SVGSVGElement;

src/element/index.ts

@@ -1,2 +1,3 @@
 export type { NodeElement } from "./node-element";
 export type { PortElement } from "./port-element";
+export type { EdgeElement } from "./edge-element";

src/html-view/core-html-view/core-html-view.ts

@@ -8,13 +8,14 @@ import { createContainer } from "./create-container";
 import { prepareNodeElement } from "./prepare-node-element";
 import { Identifier } from "@/identifier";
 import { restoreNodeElement } from "./restore-node-element";
+import { EdgeElement } from "@/element";
 
 export class CoreHtmlView implements HtmlView {
   private readonly host = createHost();
 
   private readonly container = createContainer();
 
-  private readonly edgeIdToElementMap = new Map<Identifier, SVGSVGElement>();
+  private readonly edgeIdToElementMap = new Map<Identifier, EdgeElement>();
 
   private readonly attachedNodeIds = new Set<Identifier>();
 

src/index.ts

@@ -115,4 +115,4 @@ export type {
 
 export { EventSubject } from "./event-subject";
 
-export type { NodeElement, PortElement } from "./element";
+export type { NodeElement, PortElement, EdgeElement } from "./element";

src/layouts/animated-layout-algorithm/force-directed-animated-layout-algorithm/force-directed-animated-layout-algorithm.ts

@@ -21,7 +21,7 @@ export class ForceDirectedAnimatedLayoutAlgorithm
 
   private readonly nodeForcesApplicationStrategy: NodeForcesApplicationStrategy;
 
-  private readonly convergenceVelocity: number;
+  private readonly stopVelocity: number;
 
   private readonly maxTimeDeltaSec: number;
 
@@ -34,7 +34,7 @@ export class ForceDirectedAnimatedLayoutAlgorithm
   private readonly fillerLayoutAlgorithm: LayoutAlgorithm;
 
   public constructor(params: ForceDirectedAnimatedLayoutAlgorithmParams) {
-    this.convergenceVelocity = params.stopVelocity;
+    this.stopVelocity = params.stopVelocity;
     this.maxTimeDeltaSec = params.maxTimeDeltaSec;
     this.nodeMass = params.nodeMass;
     this.edgeEquilibriumLength = params.edgeEquilibriumLength;
@@ -83,7 +83,7 @@ export class ForceDirectedAnimatedLayoutAlgorithm
 
     const maxVelocity = iteration.apply();
 
-    if (maxVelocity < this.convergenceVelocity) {
+    if (maxVelocity < this.stopVelocity) {
       const hasUnsetCoords = graph.getAllNodeIds().some((nodeId) => {
         const node = graph.getNode(nodeId);
 

src/layouts/layout-algorithm/force-directed-layout-algorithm/force-directed-layout-algorithm.ts

@@ -28,15 +28,15 @@ export class ForceDirectedLayoutAlgorithm implements LayoutAlgorithm {
 
   private readonly edgeStiffness: number;
 
-  private readonly convergenceVelocity: number;
+  private readonly stopVelocity: number;
 
   public constructor(params: ForceDirectedLayoutAlgorithmParams) {
     this.maxIterations = params.maxIterations;
     this.dtSec = params.dtSec;
     this.nodeMass = params.nodeMass;
     this.edgeEquilibriumLength = params.edgeEquilibriumLength;
     this.edgeStiffness = params.edgeStiffness;
-    this.convergenceVelocity = params.stopVelocity;
+    this.stopVelocity = params.stopVelocity;
 
     this.distanceVectorGenerator = new DistanceVectorGenerator(params.rand);
 
@@ -82,7 +82,7 @@ export class ForceDirectedLayoutAlgorithm implements LayoutAlgorithm {
 
       const maxVelocity = iteration.apply();
 
-      if (maxVelocity < this.convergenceVelocity) {
+      if (maxVelocity < this.stopVelocity) {
         break;
       }
     }

src/viewport-controller/viewport-controller.spec.ts

@@ -478,7 +478,7 @@ describe("ViewportController", () => {
       element,
     });
 
-    viewportController.center({ x: 200, y: 200 });
+    viewportController.center({ x: 200, y: 200 }, undefined);
 
     expect(viewportStore.getContentMatrix()).toEqual({
       scale: 1,

src/viewport-controller/viewport-controller.ts

@@ -25,7 +25,7 @@ export class ViewportController {
     this.viewportStore.patchContentMatrix(request);
   }
 
-  public center(target: Point, config?: CenterConfig | undefined): void {
+  public center(target: Point, config: CenterConfig | undefined): void {
     const { width, height } = this.viewportStore.getDimensions();
     const viewportCenter: Point = { x: width / 2, y: height / 2 };