Help the user understand the current topic of conversation visually. Lead with the visual, keep prose brief, and pick the smallest view that makes the key point clear.

Use the conversation and relevant source to establish real names, paths, data, and ordering. Label proposed structures and assumptions so the user can distinguish them from current behaviour. Keep only the calls, files, props, states, and boundaries needed to answer the current question.

Pick the shape

What needs explaining	View
Logic or an algorithm	Pseudocode showing the relevant conditions and actions
Runtime control flow	Call tree, with nesting for calls and ordering for execution
User interface structure	Component tree annotated with the state and module boundaries that matter
File responsibility or a broad refactor	Shallow file tree with a short responsibility beside each relevant entry
Component interaction or data flow	Mermaid sequence or flow diagram
What changes in an existing shape	`diff` sketch of the component tree, file tree, call tree, or pseudocode
Mostly new code, context needed to show ownership or order, or a copyable target	Whole block in the appropriate code language
Visual layout, state comparison, or a concept too dense for an inline diagram	One focused HTML artifact; read HTML.md for this branch

show-me

Pick the shape