mermaid-js/mermaid · error
Line ${origLineNo}: Unexpected indentation without box-drawi
Error message
Line ${origLineNo}: Unexpected indentation without box-drawing characters. In box-drawing format, use ├── or └── prefixes for indented nodes. What it means
In box-drawing mode, indentation is conveyed by branch connectors (├──/└──), not by leading whitespace. If a line has leading whitespace but contains no box-drawing characters at all, the preprocessor treats it as a mixed-format input and throws, reporting the original line number, because the intended nesting cannot be determined.
Source
Thrown at packages/mermaid/src/diagrams/treeView/boxDrawingPreprocessor.ts:196
);
}
const indent = INDENT_UNIT.repeat(depth);
outputLines.push(indent + content);
outLineNo++;
lineMap.set(outLineNo, origLineNo);
} else if (/^[\s─━│┃└┗├┣]+$/.test(normalized)) {
// Entire line is box-drawing decoration and whitespace — skip
continue;
} else if (ALL_BOX_CHARS.test(normalized)) {
// Has box chars but no branch char — likely content containing a box char (e.g. "Section ─ A.txt")
// Treat as root-level item
outputLines.push(line);
outLineNo++;
lineMap.set(outLineNo, origLineNo);
} else if (/^\s+/.test(normalized)) {
// Leading whitespace without box chars in box mode → likely mixed format
throw new Error(
`Line ${origLineNo}: Unexpected indentation without box-drawing characters. ` +
`In box-drawing format, use ├── or └── prefixes for indented nodes.`
);
} else {
// No box chars, no leading whitespace → root-level item (depth 0)
outputLines.push(line);
outLineNo++;
lineMap.set(outLineNo, origLineNo);
}
}
return { text: outputLines.join('\n'), lineMap };
}
View on GitHub (pinned to d93e9c88c0)
Solutions
- Make every indented line use ├── or └── connectors so it is unambiguously box-drawing.
- Switch the whole diagram to indentation format so no box chars are present and auto-detection picks indentation mode.
- Remove the offending whitespace-indented lines or de-indent them to depth 0.
- Normalise the editor to preserve box-drawing characters and avoid space-indenting children.
Example fix
// before — mixed formats (box mode + space indent)
├── root
childA
childB
// after — consistent box-drawing
├── root
├── childA
├── childB Defensive patterns
Strategy: validation
Validate before calling
// In box mode, reject whitespace-indented lines that have no box glyphs
const BOX = /[├└┗│┃─━]/;
for (let i = 0; i < lines.length; i++) {
if (/^\s+/.test(lines[i]) && !BOX.test(lines[i])) {
throw new Error(`Line ${i + 1}: indentation without box characters`);
}
} Type guard
const isMixedFormatError = (e): boolean => e instanceof Error && /Unexpected indentation without box-drawing/.test(e.message);
Try / catch
try {
await mermaid.run({ nodes: [el] });
} catch (e) {
if (e instanceof Error && /Unexpected indentation without box-drawing/.test(e.message)) {
// normalise the whole tree to one format (box-drawing or indentation)
} else { throw e; }
} Prevention
- Use one tree format per diagram; don't mix indentation and box connectors.
- Configure the editor to preserve box-drawing characters.
- De-indent stray lines or convert them to ├── form.
When it happens
Trigger: A treeView diagram auto-detected as (or set to) box-drawing mode that contains lines indented with plain spaces/tabs and no ├/└/─/│ glyphs.
Common situations: Mixing an indentation-based tree with a box-drawing tree in one diagram; pasting source code snippets with leading spaces inside a box-drawing tree; editors that convert tabs to spaces breaking connectors; partial format migration.
Related errors
AI-assisted analysis of mermaid-js/mermaid@d93e9c88c0 (2026-08-12).
Data as JSON: /api/errors/6fff18cbe7410250.
Report an issue: GitHub.