feat: center3 layout algorithm

now all "aesthetic axioms" are respected

Signed-off-by: Andres Correa Casablanca <castarco@coderspirit.xyz>

Author: castarco

src/BeautifulTree.tsx

@@ -1,7 +1,7 @@
 import { edgesIterator, postOrderIterator } from './traversal'
 import type { Tree } from './types'
 import type { WrappedTreeWithLayout } from './layouts'
-export { computeLeftShiftLayout, computeCenter2Layout } from './layouts'
+export { computeLeftShiftLayout, computeCenter3Layout } from './layouts'
 
 export interface BeautifulTreeProps {
 	readonly id: string

src/layouts.ts

@@ -66,10 +66,12 @@ const _computeCenter2Layout = (
 	depth = 0,
 	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
 	offsets: number[],
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	tracer: { maxX: number },
 ): DeepWriteable<TreeWithLayout> => {
 	const children = tree.children?.map((child) => ({
 		edgeData: child.edgeData,
-		node: _computeCenter2Layout(child.node, depth + 1, offsets),
+		node: _computeCenter2Layout(child.node, depth + 1, offsets, tracer),
 	}))
 
 	let x: number
@@ -89,6 +91,7 @@ const _computeCenter2Layout = (
 		x = Math.max(offsets[depth] ?? 0, c)
 		m = x - c
 	}
+	tracer.maxX = Math.max(tracer.maxX, x)
 	offsets[depth] = 1 + x
 
 	return {
@@ -103,15 +106,144 @@ const _computeCenter2Layout = (
 	} satisfies Readonly<TreeWithLayout> as DeepWriteable<TreeWithLayout>
 }
 
-export const computeCenter2Layout = (
+const _inPlaceEvenSpacingUpdate = (
+	numChildren: number,
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	tree: DeepWriteable<TreeWithLayout>,
+	shift: number,
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	offsets: number[],
+	depth: number,
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	tracer: { maxX: number },
+): void => {
+	if (numChildren === 0) {
+		tree.meta.pos.x += shift
+		tree.meta.m = 0
+	} else if (numChildren === 1) {
+		// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+		tree.meta.pos.x = tree.children![0]!.node.meta.pos.x
+		tree.meta.m = 0
+	} else {
+		const c = // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+			(tree.children![0]!.node.meta.pos.x +
+				// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+				tree.children![numChildren - 1]!.node.meta.pos.x) *
+			0.5
+		tree.meta.pos.x = Math.max(offsets[depth] ?? 0, c)
+	}
+	tracer.maxX = Math.max(tracer.maxX, tree.meta.pos.x)
+	offsets[depth] = 1 + tree.meta.pos.x
+}
+
+const _siblingsEvenSpacing = (
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	tree: DeepWriteable<TreeWithLayout>,
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	offsets: number[],
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	tracer: { maxX: number },
+	depth = 0,
+	shift = 0,
+	// eslint-disable-next-line sonarjs/cognitive-complexity
+): void => {
+	const numChildren = tree.children?.length ?? 0
+	let lastFixedIdx: number | undefined
+	let maxSpacing = 1
+	for (const [idx, child] of (tree.children ?? []).entries()) {
+		const isFixed = (child.node.children?.length ?? 0) > 0
+		if (isFixed) {
+			if (lastFixedIdx !== undefined) {
+				const spacing =
+					(child.node.meta.pos.x -
+						// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+						tree.children![lastFixedIdx]!.node.meta.pos.x) /
+					(idx - lastFixedIdx)
+				maxSpacing = Math.max(maxSpacing, spacing)
+			}
+			lastFixedIdx = idx
+		}
+	}
+
+	let accShift = shift
+	for (const [idx, child] of (tree.children ?? []).entries()) {
+		if (idx === 0) {
+			if (numChildren > 1) {
+				accShift = Math.max(
+					0,
+					shift +
+						// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+						tree.children![1]!.node.meta.pos.x -
+						maxSpacing -
+						child.node.meta.pos.x,
+				)
+			}
+		} else {
+			accShift =
+				shift +
+				Math.max(
+					0,
+					// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+					tree.children![idx - 1]!.node.meta.pos.x +
+						maxSpacing -
+						child.node.meta.pos.x,
+				)
+		}
+		_siblingsEvenSpacing(child.node, offsets, tracer, depth + 1, accShift)
+	}
+
+	_inPlaceEvenSpacingUpdate(numChildren, tree, shift, offsets, depth, tracer)
+}
+
+const _cousinsEvenSpacing = (
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	tree: DeepWriteable<TreeWithLayout>,
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	offsets: number[],
+	// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+	tracer: { maxX: number },
+	depth = 0,
+	shift = 0,
+): void => {
+	const numChildren = tree.children?.length ?? 0
+
+	const nextOffset = offsets[depth + 1]
+	let accShift = shift
+	if (
+		numChildren >= 2 &&
+		nextOffset !== undefined &&
+		// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+		(tree.children![0]!.node.children?.length ?? 0) === 0
+	) {
+		// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+		const mid = tree.children![1]!.node.meta.pos.x - 1
+		// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+		accShift = shift + Math.max(0, mid - tree.children![0]!.node.meta.pos.x)
+	}
+
+	for (const [idx, child] of (tree.children ?? []).entries()) {
+		if (idx === 0) {
+			_cousinsEvenSpacing(child.node, offsets, tracer, depth + 1, accShift)
+		} else {
+			_cousinsEvenSpacing(child.node, offsets, tracer, depth + 1, shift)
+		}
+	}
+
+	_inPlaceEvenSpacingUpdate(numChildren, tree, shift, offsets, depth, tracer)
+}
+
+export const computeCenter3Layout = (
 	tree: Readonly<Tree>,
 ): Readonly<WrappedTreeWithLayout> => {
 	const offsets: number[] = []
-	const t = _computeCenter2Layout(tree, 0, offsets)
-
 	const tracer = { maxX: 0 }
+
+	const t = _computeCenter2Layout(tree, 0, offsets, tracer)
 	_addMods(t, 0, tracer)
 
+	_cousinsEvenSpacing(t, [], tracer)
+	_siblingsEvenSpacing(t, [], tracer)
+
 	return {
 		tree: t,
 		maxY: offsets.length - 1,