Tree diagrams in chat
Agents draw hierarchies with characters, and the diagram only survives while the box on screen is wider than its widest line, so on a phone it reads as noise. A tree block in a chat message is read back into an actual hierarchy and drawn as a real tree, with labels that wrap inside their own node, folding branches, and depth shown by indentation rather than character padding.
What it is
Agents draw hierarchies with characters:
Happy customers
├── Their expectations
│ ├── Expectations we create
│ └── Expectations they bring
└── Their actual experience
├── Buying and receiving
└── Getting help
That works because every line is padded to sit in the right column. The meaning lives in the alignment, not in the characters themselves.
Which means the diagram only survives while the box on screen is wider than its widest line. On a
phone it is not. The block wraps, a label folds onto the next row flush against the │ rail, and
the alignment that was the structure is gone. The diagram reads as noise.
Making the text smaller or adding a sideways scrollbar does not fix this — it just makes an unreadable diagram smaller, or one you have to pan across.
Where to find it
Nothing has to be opened: a tree block is drawn where the agent wrote it, inline in the message. The switch that turns the behaviour off lives at Settings → Appearance → Message Formatting → "Show tree diagrams as interactive trees".
How it behaves
What happens now
A tree is read back into an actual hierarchy and drawn as a real tree. A block may hold more than one top-level section — an outline written as stacked sections is a forest, and every section in it is drawn:
Labels wrap under themselves, inside their own node, instead of into a neighbouring column. This is the part that fixes phones.
Each branch folds. Click anywhere on a node — the chevron, its label, or the description under it — to collapse the branch you are not interested in; click again and it comes back. The vertical guide line beside a branch folds it too, the way an outliner does.
The whole thing folds at once. A button above the tree collapses every branch down to its root — every root, when the block drew more than one section — so a long diagram becomes a one-line summary you can reopen a branch at a time. The same button flips to Expand all once it is folded.
Depth is shown by indentation, a soft guide line, and label weight — not by character padding — so it survives any screen width. The root is boldest, the level under it a step lighter, and everything deeper is normal text, which lets you find the top of a branch without reading it. Everything on the same level looks the same, whether or not it has children.
A description written under a label stays with that label, in smaller muted text. Agents write these a lot:
├── Buying and receiving │ Choosing, ordering, paying, and getting the productA headline that runs onto a second line is still one headline. If the top line of a diagram is long enough to be written across two rows, both rows are read as the single line they were meant to be — the diagram still draws as a tree rather than falling back to plain text.
Everything starts fully expanded, so you never have to click to see something the plain block would have shown you.
What it will never do
- Touch a block it cannot fully read as a tree. There is no "close enough". If a single line does not fit the shape, the whole block renders exactly as it always has.
- Touch anything you labelled as code. A block tagged with a real language is left alone whatever is inside it.
- Redraw a table, a drawn panel, or a log. These are explicitly refused.
- Change what you copy. Copying gives you the exact characters the agent wrote, in either view.
- Cost anything or wait on anything. There is no AI call, no network request, and nothing cached. It is plain text parsing that finishes instantly.
Seeing the original
A three-dot (⋯) menu sits at the top-right of the block, next to the copy button. Open it and choose Show original text to see the exact block the agent wrote; the same menu then offers Show as a tree to flip back.
Diagrams it deliberately leaves alone
Some things look like trees but are not, and drawing them as trees would assert a structure the author did not mean:
- Flow diagrams that use arrows (
├─▶,├─◀). The arrows mean sequence, not containment. - A tree drawn with no root line — just branches. Rare enough (about 1 in 100 real diagrams) that it is left as plain text rather than guessed at.
tree's own summary line (2 directories, 0 files) at the bottom of its output.
In every one of these the block renders as it always did, so nothing is lost.
If you would rather it did not
Settings → Appearance → Message Formatting → "Show tree diagrams as interactive trees." Turn it off and every fenced block renders exactly as it did before this existed.
Related
- Code blocks that are really prose — the sibling feature, for when a fence was a lie about prose rather than about structure. They share the same three-dot menu.
- Agent Message Display — how agent narration and tool activity are laid out around these blocks.
Last verified 2026-10-06