Overhauling a CAD Engine: Rebuilding Multileader Text Layout & Editor Mechanics

Hey everyone! 👋

I just shipped a massive architectural overhaul to our Multileader (MLEADER) graphics engine alongside some long-overdue quality-of-life updates to our canvas Text Editor[cite: 1]. Here is a quick look at what changed, why I changed it, and how I solved it[cite: 1].

🛠 1. Moving to Structured Rich Text Data (TextSegment[])

The Problem

Previously, multileaders treated text as a single string block[cite: 1]. This made formatting highly rigid and prone to failure when dealing with native DXF inline codes (\H, \f, \L, etc.)[cite: 1]. Worse yet, a legacy layout constraint meant that only the first line of text would actually render[cite: 1].

The Solution

I completely decoupled text storage from raw string fields[cite: 1]. Multileader content is now processed into an array of typed segments (TextSegment[]), bringing true multi-line and per-character rich text formatting support[cite: 1]. I also isolated the recursive parsing logic into a unified utility: text-parser-utils.ts[cite: 1].

🎨 2. Solving Variable Row Heights & Text Overlaps

The Problem

When text strings contain varying font sizes or special character drops (like g, j, p, y), standard static height offsets cause lines to overlap, clip, or look completely crushed[cite: 1].

The Solution

I migrated from a static "entity-wide" height constant to a dynamic per-row ribbon architecture[cite: 1]:

• First-Row Scaling: The attachment offset is now dynamically scaled using the maximum character height of the first row only, preventing inconsistent alignment[cite: 1].
• Per-Row Ribbon Bounds: Each row computes its own bounding box on layout passes[cite: 1]. Mixed font sizes on a single line will never bleed into adjacent rows[cite: 1].
• Coordinate Tree Alignment: I aligned the rendering coordinate space to mirror our primary canvas Text entity[cite: 1]. This explicitly resolves selection box overflows for unusually tall or accented characters[cite: 1].
• Line-Weight Inheritance: Underline thickness now dynamically inherits its thickness from the adjacent leader line weight[cite: 1].

🖱 3. Inline Canvas Text Editor Integration

Building a modern CAD experience means getting rid of modal popups or manual text prompt windows[cite: 1].

• Double-Click-To-Edit: Users can now double-click a multileader to activate an in-place text editor directly on the canvas with real-time cursor tracking, character selection, and accurate hit-testing[cite: 1].
• Creation Flow Hooks: The moment a user places the final point of a new leader, the application automatically kicks into the inline text editor state right at the text-placement position[cite: 1].
• Layout Anchoring: The editor popup accurately anchors to the stub side of the leader[cite: 1]. Frame-resize handles (grips) allow word-wrap behaviors to scale exactly like standard canvas text bodies[cite: 1].

⚡ 4. General UX & Framework Refinements

I polished out some of the most annoying workflow friction points inside the core workspace:

• Command Optimization: Commands like Leader+ or Leader- now check your active canvas selection first[cite: 1]. If a valid multileader is highlighted, it bypasses the manual item selection step[cite: 1].
• Canvas Focus Locks: Pressing Enter while adjusting the text height input box immediately returns viewport focus back to the canvas context[cite: 1].
• The Ghost Height Bug: Fixed a silent bug where modifying the font size on specific multileader elements would run fine but result in a no-op due to a missing internal text height setter[cite: 1].
• Clean Closures: Clicking outside the boundaries of an active text editor gracefully closes out and saves the current state without accidentally registering a brand new selection window on your canvas[cite: 1].