block-beta: v11 regression — column widths ignore text content, causing text overflow and narrow diagrams

[khaullen]

Description

In Mermaid 11.13.0, the block-beta column width calculation no longer accounts for text content when blocks span multiple columns (:N syntax). Columns are sized proportionally by span count alone, ignoring the minimum width needed to fit text labels. This causes text to overflow/crop out of its containing <rect> and the overall diagram to render far narrower than necessary.

This is a regression from 11.12.x, where column widths correctly expanded to fit text content.

Steps to reproduce

block-beta
  columns 6
  space:1 RO("Reserve"):5
  space:6
  block:PaidBlock:1
    columns 2
    UserX1["CR"] UserX2["CR"] UserZ1["CR"]
  end
  space:5
  space:6
  PA["Paid proceeds (actual)<br/>$613"]:1 DEF["Deficit<br/>$5,155"]:5
  CA["Cash back (actual)<br/>$128"]:1 SPO["Spoilage (35 unsold)<br/>$5,640"]:5
  space:6
  block:CashbackBlock:1
    columns 2
    UserZ2["ZO"] UserZ3["CR"]
  end
  space:5
  space:6
  RI("Reserve"):1 block:RestBlock:5
    columns 4
    RA1["BSC"] RA2["MA"] RA3["NO"] RA4["SO"]
  end
  PaidBlock --> PA
  CA --> CashbackBlock
  RestBlock -- "Commission ($326)" --> RI

Loading

Expected behavior (11.12.x and earlier)

Diagram renders at 1059px wide. Column 1 expands to fit "Paid proceeds (actual)" text. All labels are fully visible.

Actual behavior (11.13.0)

Diagram renders at 340px wide. Column 1 is only 41px — the <rect> is 40.7px but the <foreignObject> text needs 160px. Text overflows and is cropped.

Evidence from SVG output

11.13.0 (broken): PA node <rect width="40.725"> but <foreignObject width="160.09375">
11.12.0 (correct): Column 1 is wide enough to contain all text labels

Version bisect

Mermaid version	Diagram width	Status
11.4.1	1059px	✅ Correct
11.6.0	1059px	✅ Correct
11.9.0	1059px	✅ Correct
11.12.0	1059px	✅ Correct
11.13.0	340px	❌ Broken

The regression was introduced in 11.13.0 (released 2026-03-09).

Root cause

The block-beta layout engine calculates column widths proportionally (a :1 block gets 1/6 of the total width in a 6-column grid) without checking whether the allocated width can actually contain the text label. In 11.12.x, column widths were based on content size; in 11.13.0, they appear to use a fixed proportional allocation.

Related issues

• Block diagram - node width is bugged #6474 — widthInColumns not affecting visual width (same underlying layout bug)
• block-beta column span is not taking full width of the block #6316 — column span not taking full width
• Disproportional block width changes (without need to do so) #5659 — disproportional block width changes

Setup

• Mermaid version: 11.13.0 (works correctly on 11.12.0)
• Tested with @mermaid-js/mermaid-cli via Puppeteer
• Also reproduces on GitHub Gist rendering