upstream-tldraw/templates/agent/shared/format/convertTldrawShapesToPeripheralShapes.ts

import { Box, Editor, TLShape } from 'tldraw'
import { PeripheralShapeCluster } from './PeripheralShapesCluster'

export function convertTldrawShapesToPeripheralShapes(
	editor: Editor,
	shapes: TLShape[],
	{ padding = 0 }: { padding?: number } = {}
): PeripheralShapeCluster[] {
	if (shapes.length === 0) return []
	const groups: { shapes: TLShape[]; bounds: Box; numberOfShapes: number }[] = []

	const expandedBounds = shapes.map((shape) => {
		return {
			shape,
			bounds: editor.getShapeMaskedPageBounds(shape)!.clone().expandBy(padding),
		}
	})
	for (let i = 0; i < expandedBounds.length; i++) {
		const item = expandedBounds[i]
		if (i === 0) {
			groups[0] = {
				shapes: [item.shape],
				bounds: item.bounds,
				numberOfShapes: 1,
			}
			continue
		}
		let didLand = false
		for (const group of groups) {
			if (group.bounds.includes(item.bounds)) {
				group.shapes.push(item.shape)
				group.bounds.expand(item.bounds)
				group.numberOfShapes++
				didLand = true
				break
			}
		}
		if (!didLand) {
			groups.push({
				shapes: [item.shape],
				bounds: item.bounds,
				numberOfShapes: 1,
			})
		}
	}

	return groups.map((group) => {
		const shrunkBounds = group.bounds.clone().expandBy(-padding)
		return {
			bounds: shrunkBounds,
			numberOfShapes: group.numberOfShapes,
		}
	})
}