Text selection, refactors, code reviews

[frouaix]

Text selection for text blocks
Code review (human and agent)

[Copilot]

Pull request overview

This PR strengthens and exposes regular text() selection capabilities across the core + GUI layers, refactors the demo pages into reusable modules/styles, and adds integration documentation for consumers.

Changes:

• Add a GUI-side TextSelectionManager plus a block-tree adapter that derives per-character bounds from rendered text() blocks.
• Centralize renderer-compatible text measurement/layout helpers in core (text-layout.ts) and export selection/layout types from vitrine.
• Add/refactor multiple text-selection demos and document how to enable selection for regular text() blocks.

Reviewed changes

Copilot reviewed 26 out of 26 changed files in this pull request and generated 12 comments.

Show a summary per file

File	Description
test-results/.last-run.json	Adds a last-run test status artifact.
packages/gui/src/selection/character-bounds-adapter.ts	New adapter to build a CharacterBoundsProvider from a block tree using core text layout helpers.
packages/gui/src/selection/TextSelectionManager.ts	New selection state manager: caret/range overlays, pointer drag selection, keyboard navigation.
packages/gui/src/index.ts	Exports the new selection manager + adapter from vitrine-gui.
packages/gui/src/component.ts	Integrates selection into VitrineComponent (events, focus/keydown handling, overlay composition).
packages/demo/vite.config.ts	Registers new text-selection demo HTML entry points.
packages/demo/text-selection.html	New full-feature text selection demo page.
packages/demo/text-selection.css	Styling for the main text selection demo.
packages/demo/text-selection-setup.js	Demo bootstrap + UI controls for multi-user selections.
packages/demo/text-selection-scene.js	Demo scene construction for text selection.
packages/demo/text-selection-minimal.html	Minimal click/hit-test validation page.
packages/demo/text-selection-minimal.css	Styling for minimal test page.
packages/demo/text-selection-minimal-setup.js	Minimal demo hit-test logging code.
packages/demo/text-selection-minimal-scene.js	Minimal demo scene definition.
packages/demo/text-selection-debug.html	Debug-focused selection demo page.
packages/demo/text-selection-debug.css	Styling for debug demo.
packages/demo/text-selection-debug-setup.js	Debug demo bootstrap + click logging.
packages/demo/text-selection-debug-scene.js	Debug scene with many varied text() blocks (wrap, baseline, fonts).
packages/demo/gallery.html	Updates gallery nav ring to include the new debug demo.
packages/demo/component-demo.html	Updates nav to link to text selection debug page.
packages/core/src/index.ts	Exports selection/layout types + text layout helpers from core.
packages/core/src/core/text-layout.ts	New shared text measurement/layout utilities used by renderer and selection.
packages/core/src/core/selection-types.ts	New exported selection/layout-related types.
packages/core/src/core/renderer-immediate.ts	Refactors text outline + hit-test bounds to use shared core text layout helpers; tweaks getContext options.
packages/core/src/core/context.ts	Improves measureText ascent/descent fallback behavior.
docs/TEXT_SELECTION_REGULAR_TEXT.md	New docs on enabling selection for regular text() blocks in VitrineComponent.

[Copilot]

getCanvasCoordinates() returns coordinates in CSS pixels relative to the displayed canvas element, but selection hit-testing uses scene/logical coordinates. If the canvas is scaled via CSS (e.g. canvas { width: 100% } in the demos), hit-testing will be offset/scaled incorrectly. Convert from CSS px to logical coords using the canvas bounding rect and the configured logical size (or use the same conversion logic as EventManager: css → buffer → logical).

Suggested change

	const { left: xwCanvas, top: ywCanvas } = this.canvas.getBoundingClientRect();
	const { clientX: xwPointer, clientY: ywPointer } = e;
	return {
	x: xwPointer - xwCanvas,
	y: ywPointer - ywCanvas
	const rwCanvas = this.canvas.getBoundingClientRect();
	const { left: xwCanvas, top: ywCanvas, width: wwCanvas, height: hwCanvas } = rwCanvas;
	if (wwCanvas === 0 || hwCanvas === 0) return null;
	const { clientX: xwPointer, clientY: ywPointer } = e;
	const xwCss = xwPointer - xwCanvas;
	const ywCss = ywPointer - ywCanvas;
	return {
	x: (xwCss * this.canvas.width) / wwCanvas,
	y: (ywCss * this.canvas.height) / hwCanvas

[Copilot]

Pull request overview

Copilot reviewed 65 out of 67 changed files in this pull request and generated 8 comments.

Files not reviewed (1)

• pnpm-lock.yaml: Language not supported

[Copilot]

Pull request overview

Copilot reviewed 65 out of 67 changed files in this pull request and generated 7 comments.

Files not reviewed (1)

• pnpm-lock.yaml: Language not supported

[Copilot]

Pull request overview

Copilot reviewed 65 out of 67 changed files in this pull request and generated 3 comments.

Files not reviewed (1)

• pnpm-lock.yaml: Language not supported

[Copilot]

maxProbe = 20000 hard-limits how many insertion indices can be discovered for a text block. For any selectable text longer than 20k chars, selection geometry will truncate and keyboard navigation / range rendering can’t reach the tail. Consider removing the hard cap (rely on the miss-streak termination), or making the probe limit configurable and/or derived from a known text length.

[Copilot]

groupInsertionPointsByLine() does an O(n·lines) search (lineGroups.find(...)) for every insertion point and then later sorts again per line group. This can become a noticeable hot path for long text blocks or frequent re-rendering while dragging selections. A more scalable approach is to bucket by a quantized y/height key (Map) or pre-sort points by y and group in a single pass, avoiding repeated linear scans and per-group sorts.