@statelyai/layout 0.0.1 → 0.0.2

package/src/layered/stretch-width.ts

@@ -0,0 +1,136 @@
+/*******************************************************************************
+ * Copyright (c) 2016, 2020 Kiel University and others.
+ *
+ * Translated from ELK v0.11.0 StretchWidthLayerer.java.
+ * Source commit: 54123e884b1ae743b453260f713b20c9bf5787f2
+ * SPDX-License-Identifier: EPL-2.0
+ *******************************************************************************/
+import type { GraphEdge } from "@statelyai/graph";
+import type { AcyclicOrientation, LayerAssigner, LayeredPhaseInput } from "./types";
+
+interface StretchNode {
+  id: string;
+  modelOrder: number;
+  index: number;
+  size: number;
+  rank: number;
+  incoming: StretchEdge[];
+  outgoing: StretchEdge[];
+}
+
+interface StretchEdge {
+  edge: GraphEdge;
+  source: StretchNode;
+  target: StretchNode;
+}
+
+function createGraph(input: LayeredPhaseInput, orientation: AcyclicOrientation): StretchNode[] {
+  const horizontal = input.direction === "left" || input.direction === "right";
+  const nodes = input.graph.nodes.map((node, modelOrder): StretchNode => ({
+    id: node.id,
+    modelOrder,
+    index: modelOrder,
+    size: horizontal
+      ? (input.sizes.get(node.id)?.height ?? 0)
+      : (input.sizes.get(node.id)?.width ?? 0),
+    rank: 0,
+    incoming: [],
+    outgoing: [],
+  }));
+  const nodeById = new Map(nodes.map((node) => [node.id, node]));
+  for (const graphEdge of input.graph.edges) {
+    if (graphEdge.sourceId === graphEdge.targetId) continue;
+    const reversed = orientation.reversedEdgeIds.has(graphEdge.id);
+    const source = nodeById.get(reversed ? graphEdge.targetId : graphEdge.sourceId);
+    const target = nodeById.get(reversed ? graphEdge.sourceId : graphEdge.targetId);
+    if (!source || !target) continue;
+    const edge = { edge: graphEdge, source, target };
+    source.outgoing.push(edge);
+    target.incoming.push(edge);
+  }
+  for (const node of nodes) {
+    node.rank = Math.max(
+      node.outgoing.length,
+      ...node.incoming.map((edge) => edge.source.outgoing.length),
+    );
+  }
+  const sorted = [...nodes].sort(
+    (left, right) => right.rank - left.rank || left.modelOrder - right.modelOrder,
+  );
+  for (const [index, node] of sorted.entries()) node.index = index;
+  return sorted;
+}
+
+export const assignLayersWithStretchWidth: LayerAssigner = (input, orientation) => {
+  if (input.graph.nodes.length === 0) return { layerByNodeId: new Map() };
+  const nodes = createGraph(input, orientation);
+  const minimumSize = Math.max(1, Math.min(...nodes.map((node) => node.size)));
+  const maximumSize = Math.max(1, Math.max(...nodes.map((node) => node.size)));
+  const normalizedSize = nodes.map((node) => node.size / minimumSize);
+  const dummySize = (input.settings["spacing.edgeEdge"] ?? 10) / minimumSize;
+  const indegree = nodes.map((node) => node.incoming.length);
+  const outdegree = nodes.map((node) => node.outgoing.length);
+  const averageOutdegree =
+    nodes.reduce((total, node) => total + node.outgoing.length, 0) / nodes.length;
+  let maximumWidth = maximumSize / minimumSize;
+
+  while (true) {
+    let widthCurrent = 0;
+    let widthUp = 0;
+    const layers: StretchNode[][] = [[]];
+    let currentLayer = layers[0] as StretchNode[];
+    const remainingNodes = [...nodes];
+    const remainingOutgoing = [...outdegree];
+    const alreadyPlacedInCurrentLayer = new Set<StretchNode>();
+    let reset = false;
+
+    while (remainingNodes.length > 0) {
+      const selected = remainingNodes.find((node) => (remainingOutgoing[node.index] ?? 0) <= 0);
+      const conditionGoUp = selected
+        ? widthCurrent -
+            (outdegree[selected.index] ?? 0) * dummySize +
+            (normalizedSize[selected.index] ?? 0) >
+            maximumWidth ||
+          widthUp + (indegree[selected.index] ?? 0) * dummySize >
+            maximumWidth * averageOutdegree * dummySize
+        : false;
+
+      if (!selected || (conditionGoUp && alreadyPlacedInCurrentLayer.size > 0)) {
+        for (const node of currentLayer) {
+          for (const edge of node.incoming) {
+            remainingOutgoing[edge.source.index] = (remainingOutgoing[edge.source.index] ?? 1) - 1;
+          }
+        }
+        currentLayer = [];
+        layers.push(currentLayer);
+        alreadyPlacedInCurrentLayer.clear();
+        widthCurrent = widthUp;
+        widthUp = 0;
+      } else if (conditionGoUp) {
+        maximumWidth++;
+        reset = true;
+        break;
+      } else {
+        currentLayer.push(selected);
+        remainingNodes.splice(remainingNodes.indexOf(selected), 1);
+        alreadyPlacedInCurrentLayer.add(selected);
+        widthCurrent =
+          widthCurrent -
+          (outdegree[selected.index] ?? 0) * dummySize +
+          (normalizedSize[selected.index] ?? 0);
+        widthUp += (indegree[selected.index] ?? 0) * dummySize;
+      }
+    }
+
+    if (reset) continue;
+    const layerByNodeId = new Map<string, number>();
+    const layerCount = layers.length;
+    for (const [bottomUpLayer, layer] of layers.entries()) {
+      for (const node of layer) layerByNodeId.set(node.id, layerCount - bottomUpLayer - 1);
+    }
+    return {
+      layerByNodeId,
+      seedOrder: [...layers].reverse().flatMap((layer) => layer.map((node) => node.id)),
+    };
+  }
+};

package/src/layered/types.ts

@@ -0,0 +1,111 @@
+import type { EntityRect, Graph, GraphEdge, GraphNode, GraphPort, Point } from "@statelyai/graph";
+import type { LayoutConstraints } from "@statelyai/graph/layout";
+import type { LayoutDirection } from "../types";
+import type { ElkLayeredOptionValueByName, LayeredAdvancedOptions } from "./elk-options";
+
+export interface NodeSize {
+  width: number;
+  height: number;
+}
+
+export interface LayeredSpacing {
+  node: number;
+  layer: number;
+}
+
+export interface LayoutPadding {
+  top: number;
+  right: number;
+  bottom: number;
+  left: number;
+}
+
+export interface LayeredPhaseInput {
+  graph: Graph<unknown, unknown, unknown, unknown>;
+  sizes: ReadonlyMap<string, NodeSize>;
+  direction: LayoutDirection;
+  spacing: LayeredSpacing;
+  padding: LayoutPadding;
+  constrainedLayerByNodeId: ReadonlyMap<string, number>;
+  settings: LayeredAdvancedOptions;
+  nodeSettings?: (node: GraphNode) => ElkLayeredOptionValueByName | undefined;
+  edgeSettings?: (edge: GraphEdge) => ElkLayeredOptionValueByName | undefined;
+  portSettings?: (port: GraphPort, node: GraphNode) => ElkLayeredOptionValueByName | undefined;
+}
+
+export interface AcyclicOrientation {
+  reversedEdgeIds: ReadonlySet<string>;
+}
+
+export interface LayerAssignment {
+  layerByNodeId: ReadonlyMap<string, number>;
+  /** Layer-internal seed order produced by layerers whose insertion order is observable. */
+  seedOrder?: readonly string[];
+}
+
+export interface LayerOrder {
+  layers: readonly (readonly string[])[];
+  /** Internal ELK sweep state retained for exact port-aware placement. */
+  inputPortOrderByNodeId?: ReadonlyMap<string, readonly string[]>;
+  /** Internal ELK sweep state retained for exact port-aware placement. */
+  outputPortOrderByNodeId?: ReadonlyMap<string, readonly string[]>;
+}
+
+export interface NodePlacement {
+  rectByNodeId: ReadonlyMap<string, EntityRect>;
+}
+
+export interface EdgeRoutes {
+  pointsByEdgeId: ReadonlyMap<string, readonly Point[]>;
+  /** ELK spline segment NUB controls retained until long-edge joining. */
+  splineNubControlsByEdgeId?: ReadonlyMap<string, readonly Point[]>;
+  /** Reversed fixed-side routes that must stay outside the node envelope during compaction. */
+  outsideFeedbackEdgeIds?: ReadonlySet<string>;
+}
+
+export type CycleBreaker = (input: LayeredPhaseInput) => AcyclicOrientation;
+
+export type LayerAssigner = (
+  input: LayeredPhaseInput,
+  orientation: AcyclicOrientation,
+) => LayerAssignment;
+
+export type CrossingMinimizer = (
+  input: LayeredPhaseInput,
+  orientation: AcyclicOrientation,
+  assignment: LayerAssignment,
+) => LayerOrder;
+
+export type NodePlacer = (input: LayeredPhaseInput, order: LayerOrder) => NodePlacement;
+
+export type EdgeRouter = (
+  input: LayeredPhaseInput,
+  orientation: AcyclicOrientation,
+  placement: NodePlacement,
+) => EdgeRoutes;
+
+export interface LayeredStrategies {
+  breakCycles?: CycleBreaker;
+  assignLayers?: LayerAssigner;
+  minimizeCrossings?: CrossingMinimizer;
+  placeNodes?: NodePlacer;
+  routeEdges?: EdgeRouter;
+}
+
+export interface LayeredLayoutOptions {
+  direction?: LayoutDirection;
+  spacing?: Partial<LayeredSpacing>;
+  padding?: number | Partial<LayoutPadding>;
+  constraints?: LayoutConstraints;
+  measure?: (node: GraphNode) => NodeSize;
+  crossingSweeps?: number;
+  strategies?: LayeredStrategies;
+  /** ELK-equivalent settings keyed by simplified names without vendor prefixes. */
+  settings?: LayeredAdvancedOptions;
+  /** Per-node settings for ELK options whose target is a node. */
+  nodeSettings?: (node: GraphNode) => ElkLayeredOptionValueByName | undefined;
+  /** Per-edge settings for ELK options whose target is an edge. */
+  edgeSettings?: (edge: GraphEdge) => ElkLayeredOptionValueByName | undefined;
+  /** Per-port settings for ELK options whose target is a port. */
+  portSettings?: (port: GraphPort, node: GraphNode) => ElkLayeredOptionValueByName | undefined;
+}

package/src/layout.ts

@@ -0,0 +1,202 @@
+import { getGraphIssues, type Graph, type GraphPatch, type VisualGraph } from "@statelyai/graph";
+import { LayoutError, UnsupportedLayoutError } from "./errors";
+import { boxAlgorithm } from "./box";
+import { fixedAlgorithm } from "./fixed";
+import { layeredAlgorithm } from "./layered";
+import { rectanglePackingAlgorithm } from "./packing";
+import { randomAlgorithm } from "./random";
+import { sporeCompactionAlgorithm, sporeOverlapRemovalAlgorithm } from "./spore";
+import type {
+  LayoutAlgorithm,
+  LayoutDiagnostic,
+  LayoutExecutionContext,
+  LayoutPhaseMetrics,
+  LayoutRequest,
+  LayoutResult,
+  LayoutScope,
+} from "./types";
+
+const algorithms = new Map<string, LayoutAlgorithm<never>>([
+  ["box", boxAlgorithm as LayoutAlgorithm<never>],
+  ["layered", layeredAlgorithm as LayoutAlgorithm<never>],
+  ["fixed", fixedAlgorithm as LayoutAlgorithm<never>],
+  ["rectpacking", rectanglePackingAlgorithm as LayoutAlgorithm<never>],
+  ["random", randomAlgorithm as LayoutAlgorithm<never>],
+  ["sporeCompaction", sporeCompactionAlgorithm as LayoutAlgorithm<never>],
+  ["sporeOverlap", sporeOverlapRemovalAlgorithm as LayoutAlgorithm<never>],
+]);
+
+function supportsScope(algorithm: LayoutAlgorithm<unknown>, scope: LayoutScope): boolean {
+  switch (scope.mode) {
+    case "full":
+      return algorithm.capabilities.full;
+    case "incremental":
+      return algorithm.capabilities.incremental;
+    case "partial":
+      return algorithm.capabilities.partial;
+    case "route-only":
+      return algorithm.capabilities.routeOnly;
+  }
+}
+
+function samePoints(
+  a: readonly { x: number; y: number }[] | undefined,
+  b: readonly { x: number; y: number }[] | undefined,
+): boolean {
+  if (a === b) return true;
+  if (!a || !b || a.length !== b.length) return false;
+  return a.every((point, index) => {
+    const other = b[index];
+    return other !== undefined && point.x === other.x && point.y === other.y;
+  });
+}
+
+function getLayoutPatches<N, E, G, P>(
+  input: Graph<N, E, G, P> | VisualGraph<N, E, G, P>,
+  output: VisualGraph<N, E, G, P>,
+): GraphPatch<N, E>[] {
+  const patches: GraphPatch<N, E>[] = [];
+  const outputNodes = new Map(output.nodes.map((node) => [node.id, node]));
+  const outputEdges = new Map(output.edges.map((edge) => [edge.id, edge]));
+
+  for (const node of input.nodes) {
+    const next = outputNodes.get(node.id);
+    if (!next) continue;
+    if (
+      node.x !== next.x ||
+      node.y !== next.y ||
+      node.width !== next.width ||
+      node.height !== next.height ||
+      node.ports !== next.ports
+    ) {
+      patches.push({
+        op: "updateNode",
+        id: node.id,
+        data: {
+          x: next.x,
+          y: next.y,
+          width: next.width,
+          height: next.height,
+          ...(next.ports === undefined ? {} : { ports: next.ports }),
+        },
+        description: "Apply layout geometry",
+      });
+    }
+  }
+  for (const edge of input.edges) {
+    const next = outputEdges.get(edge.id);
+    if (!next) continue;
+    if (
+      edge.x !== next.x ||
+      edge.y !== next.y ||
+      edge.width !== next.width ||
+      edge.height !== next.height ||
+      edge.routing !== next.routing ||
+      !samePoints(edge.points, next.points)
+    ) {
+      patches.push({
+        op: "updateEdge",
+        id: edge.id,
+        data: {
+          x: next.x,
+          y: next.y,
+          width: next.width,
+          height: next.height,
+          ...(next.routing === undefined ? {} : { routing: next.routing }),
+          ...(next.points === undefined ? {} : { points: next.points }),
+        },
+        description: "Apply layout geometry",
+      });
+    }
+  }
+  return patches;
+}
+
+/** Register or replace a layout algorithm for subsequent `getLayout` calls. */
+export function registerLayoutAlgorithm<O>(algorithm: LayoutAlgorithm<O>): () => void {
+  const previous = algorithms.get(algorithm.id);
+  algorithms.set(algorithm.id, algorithm as LayoutAlgorithm<never>);
+  return () => {
+    if (previous) algorithms.set(algorithm.id, previous);
+    else algorithms.delete(algorithm.id);
+  };
+}
+
+export function getLayoutAlgorithm(id: string): LayoutAlgorithm<unknown> | undefined {
+  return algorithms.get(id) as LayoutAlgorithm<unknown> | undefined;
+}
+
+/**
+ * Run a registered or inline algorithm against an `@statelyai/graph` graph.
+ * The input is not mutated.
+ */
+export async function getLayout<N, E, G, P, O = unknown>(
+  request: LayoutRequest<N, E, G, P, O>,
+): Promise<LayoutResult<N, E, G, P>> {
+  const startedAt = performance.now();
+  const scope = request.scope ?? { mode: "full" };
+  const diagnostics: LayoutDiagnostic[] = [];
+  const phases: LayoutPhaseMetrics[] = [];
+  const algorithm =
+    typeof request.algorithm === "object"
+      ? request.algorithm
+      : getLayoutAlgorithm(request.algorithm ?? "layered");
+
+  if (!algorithm) {
+    throw new LayoutError(
+      `Unknown layout algorithm: ${request.algorithm ?? "layered"}`,
+      "UNKNOWN_ALGORITHM",
+    );
+  }
+  if (!supportsScope(algorithm as LayoutAlgorithm<unknown>, scope)) {
+    throw new UnsupportedLayoutError(`${algorithm.id} does not support ${scope.mode} layout yet`);
+  }
+
+  const issues = getGraphIssues(request.graph as Graph);
+  if (issues.length > 0) {
+    throw new LayoutError(issues.map((issue) => issue.message).join("; "), "INVALID_GRAPH");
+  }
+
+  const context: LayoutExecutionContext = {
+    scope,
+    diagnostics,
+    ...(request.signal === undefined ? {} : { signal: request.signal }),
+    measurePhase(id, run) {
+      const phaseStartedAt = performance.now();
+      const record = () => {
+        phases.push({ id, durationMs: performance.now() - phaseStartedAt });
+      };
+      try {
+        const result = run();
+        if (result instanceof Promise) {
+          return result.finally(record) as typeof result;
+        }
+        record();
+        return result;
+      } catch (error) {
+        record();
+        throw error;
+      }
+    },
+    throwIfAborted() {
+      if (request.signal?.aborted) {
+        throw request.signal.reason ?? new Error("Layout aborted");
+      }
+    },
+  };
+  context.throwIfAborted();
+  const graph = await algorithm.layout(request.graph, request.options as O, context);
+  context.throwIfAborted();
+
+  return {
+    graph,
+    patches: getLayoutPatches(request.graph, graph),
+    diagnostics,
+    metrics: {
+      durationMs: performance.now() - startedAt,
+      nodeCount: graph.nodes.length,
+      edgeCount: graph.edges.length,
+      phases,
+    },
+  };
+}

package/src/packing.ts

@@ -0,0 +1,74 @@
+import type { Graph, VisualGraph, VisualNode } from "@statelyai/graph";
+import { getNodeSize, type LayoutOptions } from "@statelyai/graph/layout";
+import { getFixedLayout } from "./fixed";
+import type { LayoutPadding } from "./layered";
+import type { LayoutAlgorithm } from "./types";
+
+export interface RectanglePackingLayoutOptions extends Pick<
+  LayoutOptions,
+  "direction" | "measure"
+> {
+  spacing?: number;
+  padding?: number | Partial<LayoutPadding>;
+  targetWidth?: number;
+}
+
+function getPadding(value: RectanglePackingLayoutOptions["padding"]): LayoutPadding {
+  if (typeof value === "number") {
+    return { top: value, right: value, bottom: value, left: value };
+  }
+  return {
+    top: value?.top ?? 0,
+    right: value?.right ?? 0,
+    bottom: value?.bottom ?? 0,
+    left: value?.left ?? 0,
+  };
+}
+
+/** Deterministic shelf-based rectangle packing for `@statelyai/graph`. */
+export function getRectanglePackingLayout<N, E, G, P>(
+  graph: Graph<N, E, G, P> | VisualGraph<N, E, G, P>,
+  options: RectanglePackingLayoutOptions = {},
+): VisualGraph<N, E, G, P> {
+  const spacing = options.spacing ?? 20;
+  const padding = getPadding(options.padding);
+  const sizes = new Map(graph.nodes.map((node) => [node.id, getNodeSize(node, options)]));
+  const totalArea = [...sizes.values()].reduce(
+    (area, size) => area + (size.width + spacing) * (size.height + spacing),
+    0,
+  );
+  const targetWidth = options.targetWidth ?? Math.max(1, Math.sqrt(totalArea) * 1.5);
+  let x = padding.left;
+  let y = padding.top;
+  let rowHeight = 0;
+  const nodes: VisualNode<N, P>[] = [];
+
+  for (const node of graph.nodes) {
+    const size = sizes.get(node.id) ?? { width: 0, height: 0 };
+    if (x > padding.left && x + size.width > padding.left + targetWidth) {
+      x = padding.left;
+      y += rowHeight + spacing;
+      rowHeight = 0;
+    }
+    nodes.push({ ...node, x, y, ...size } as VisualNode<N, P>);
+    x += size.width + spacing;
+    rowHeight = Math.max(rowHeight, size.height);
+  }
+
+  return getFixedLayout({ ...graph, nodes }, { direction: options.direction ?? graph.direction });
+}
+
+export const rectanglePackingAlgorithm: LayoutAlgorithm<RectanglePackingLayoutOptions> = {
+  id: "rectpacking",
+  capabilities: {
+    full: true,
+    incremental: false,
+    partial: false,
+    routeOnly: false,
+    hierarchy: false,
+    ports: true,
+  },
+  layout(graph, options) {
+    return getRectanglePackingLayout(graph, options ?? {});
+  },
+};

package/src/random.ts

@@ -0,0 +1,142 @@
+/*******************************************************************************
+ * Copyright (c) 2010, 2015 Kiel University and others.
+ *
+ * Translated from ELK v0.11.0 RandomLayoutProvider.java.
+ * Source commit: 54123e884b1ae743b453260f713b20c9bf5787f2
+ * SPDX-License-Identifier: EPL-2.0
+ *******************************************************************************/
+import type { Graph, Point, VisualGraph, VisualNode } from "@statelyai/graph";
+import { getNodeSize, type LayoutOptions } from "@statelyai/graph/layout";
+import { getFixedLayout } from "./fixed";
+import { JavaRandom } from "./java-random";
+import type { LayoutPadding } from "./layered";
+import type { LayoutAlgorithm } from "./types";
+
+export interface RandomLayoutOptions extends Pick<LayoutOptions, "direction" | "measure"> {
+  spacing?: number;
+  padding?: number | Partial<LayoutPadding>;
+  aspectRatio?: number;
+  seed?: number;
+}
+
+function getPadding(value: RandomLayoutOptions["padding"]): LayoutPadding {
+  if (typeof value === "number") {
+    return { top: value, right: value, bottom: value, left: value };
+  }
+  return {
+    top: value?.top ?? 15,
+    right: value?.right ?? 15,
+    bottom: value?.bottom ?? 15,
+    left: value?.left ?? 15,
+  };
+}
+
+function borderPoint(source: VisualNode, target: VisualNode): Point {
+  const sourceCenter = {
+    x: source.x + source.width / 2,
+    y: source.y + source.height / 2,
+  };
+  const targetCenter = {
+    x: target.x + target.width / 2,
+    y: target.y + target.height / 2,
+  };
+  const dx = targetCenter.x - sourceCenter.x;
+  const dy = targetCenter.y - sourceCenter.y;
+  if (dx === 0 && dy === 0) return { x: source.x + source.width, y: sourceCenter.y };
+  const scale = Math.min(
+    dx === 0 ? Infinity : source.width / 2 / Math.abs(dx),
+    dy === 0 ? Infinity : source.height / 2 / Math.abs(dy),
+  );
+  return { x: sourceCenter.x + dx * scale, y: sourceCenter.y + dy * scale };
+}
+
+/** Seeded random distribution using Java's 48-bit `Random` sequence. */
+export function getRandomLayout<N, E, G, P>(
+  graph: Graph<N, E, G, P> | VisualGraph<N, E, G, P>,
+  options: RandomLayoutOptions = {},
+): VisualGraph<N, E, G, P> {
+  if (graph.nodes.length === 0) return getFixedLayout(graph, options);
+  const random = new JavaRandom(options.seed && options.seed !== 0 ? options.seed : Date.now());
+  const aspectRatio = Math.fround(options.aspectRatio ?? 1.6);
+  const spacing = Math.fround(options.spacing ?? 15);
+  const padding = getPadding(options.padding);
+  const sizes = new Map(graph.nodes.map((node) => [node.id, getNodeSize(node, options)]));
+  const nodeArea = [...sizes.values()].reduce((sum, size) => sum + size.width * size.height, 0);
+  const maximumWidth = Math.max(...[...sizes.values()].map((size) => size.width));
+  const maximumHeight = Math.max(...[...sizes.values()].map((size) => size.height));
+  const edgeFactor = 1 + graph.edges.length;
+  const drawArea = nodeArea + 2 * spacing * spacing * edgeFactor * graph.nodes.length;
+  const areaRoot = Math.sqrt(drawArea);
+  const drawWidth = Math.max(areaRoot * aspectRatio, maximumWidth);
+  const drawHeight = Math.max(areaRoot / aspectRatio, maximumHeight);
+  const nodes = graph.nodes.map((node): VisualNode<N, P> => {
+    const size = sizes.get(node.id) ?? { width: 0, height: 0 };
+    return {
+      ...node,
+      x: padding.left + random.nextDouble() * (drawWidth - size.width),
+      // ELK v0.11.0 intentionally uses left padding for both axes here.
+      y: padding.left + random.nextDouble() * (drawHeight - size.height),
+      ...size,
+    } as VisualNode<N, P>;
+  });
+  const nodeById = new Map(nodes.map((node) => [node.id, node]));
+  const totalWidth = drawWidth + padding.left + padding.right;
+  const totalHeight = drawHeight + padding.top + padding.bottom;
+  const edges = graph.edges.map((edge) => {
+    const source = nodeById.get(edge.sourceId);
+    const target = nodeById.get(edge.targetId);
+    if (!source || !target) return edge;
+    const start = borderPoint(source, target);
+    const end = borderPoint(target, source);
+    const bendCount = random.nextInt(5) + (source === target ? 1 : 0);
+    const distance = Math.hypot(end.x - start.x, end.y - start.y);
+    const maximumDeviation = distance * 0.2;
+    const points: Point[] = [start];
+    for (let index = 1; index <= bendCount; index++) {
+      const progress = index / (bendCount + 1);
+      points.push({
+        x: Math.min(
+          totalWidth - 1,
+          Math.max(
+            1,
+            start.x +
+              (end.x - start.x) * progress +
+              random.nextFloat() * maximumDeviation -
+              maximumDeviation / 2,
+          ),
+        ),
+        y: Math.min(
+          totalHeight - 1,
+          Math.max(
+            1,
+            start.y +
+              (end.y - start.y) * progress +
+              random.nextFloat() * maximumDeviation -
+              maximumDeviation / 2,
+          ),
+        ),
+      });
+    }
+    points.push(end);
+    return { ...edge, points, routing: "polyline" as const };
+  });
+  return getFixedLayout(
+    { ...graph, nodes, edges },
+    { direction: options.direction ?? graph.direction },
+  );
+}
+
+export const randomAlgorithm: LayoutAlgorithm<RandomLayoutOptions> = {
+  id: "random",
+  capabilities: {
+    full: true,
+    incremental: false,
+    partial: false,
+    routeOnly: false,
+    hierarchy: false,
+    ports: false,
+  },
+  layout(graph, options) {
+    return getRandomLayout(graph, options ?? {});
+  },
+};