Tree
data, interaction, view. The ui-gallery page Tree, painted with no terminal and no window at each of the documented profiles:
bash
ui-gallery --render --page tree --profile full|enhanced|baseline sparkles:ui data, interaction, view tokyo-night
Welcome ▕ Tree · data, interaction, view █
Primitives ▕ █
Layout ▕ █
Tracks ▕ The data layer is a flat arena with index links and no interaction █
Text ▕ state. The opened set and the selection live beside it, keyed by node █
Themes ▕ identity. flatten turns the two into visible rows and precomputes the █
Slots ▕ guide rails, so no renderer re-derives them. █
Decoration ▕ █
Effects ▕ ┌─────────────────────────────────────────────────────────────────────┐ █
Grid ▕ │ your view │ █
Components ▕ │ ├─ ▸ src/ │ █
▸ Tree ▕ │ ├─ ▸ docs/ │ █
Property tree ▕ │ └─ ▪ README.md │ █
Table ▕ └─────────────────────────────────────────────────────────────────────┘ █
Scrolling ▕ █
State ▕ ┌─────────────────────────────────────────────────────────────────────┐ █
Split ▕ │ the same data, everything open │ ░
Dock ▕ │ ├─ ▾ src/ │ ░
Terminal ▕ │ │ ├─ ▾ sparkles/ │ ░
▕ │ │ │ ├─ ◆ widget.d │ ░
▕ │ │ │ ├─ ◆ layout.d │ ░
▕ │ │ │ └─ ◆ theme.d │ ░
▕ │ │ ├─ ▫ dub.sdl │ ░
▕ │ │ └─ ▾ components/ │ ░
▕ │ │ ├─ ◆ chrome.d │ ░
▕ │ │ └─ ◆ tree_widget.d │ ░
▕ │ ├─ ▾ docs/ │ ░
▕ │ │ ├─ ▪ index.md │ ░
▕ │ │ └─ ▪ layout.md │ ░
▕
pages ↓ down ↑ up → expand ← collapse / up ⏎ toggle O open all C close all ? keys q quit sparkles:ui data, interaction, view tokyo-night
Welcome ▕ Tree · data, interaction, view █
Primitives ▕ █
Layout ▕ █
Tracks ▕ The data layer is a flat arena with index links and no interaction █
Text ▕ state. The opened set and the selection live beside it, keyed by node █
Themes ▕ identity. flatten turns the two into visible rows and precomputes the █
Slots ▕ guide rails, so no renderer re-derives them. █
Decoration ▕ █
Effects ▕ ┌─────────────────────────────────────────────────────────────────────┐ █
Grid ▕ │ your view │ █
Components ▕ │ ├─ ▸ src/ │ █
▸ Tree ▕ │ ├─ ▸ docs/ │ █
Property tree ▕ │ └─ ▪ README.md │ █
Table ▕ └─────────────────────────────────────────────────────────────────────┘ █
Scrolling ▕ █
State ▕ ┌─────────────────────────────────────────────────────────────────────┐ █
Split ▕ │ the same data, everything open │ ░
Dock ▕ │ ├─ ▾ src/ │ ░
Terminal ▕ │ │ ├─ ▾ sparkles/ │ ░
▕ │ │ │ ├─ ◆ widget.d │ ░
▕ │ │ │ ├─ ◆ layout.d │ ░
▕ │ │ │ └─ ◆ theme.d │ ░
▕ │ │ ├─ ▫ dub.sdl │ ░
▕ │ │ └─ ▾ components/ │ ░
▕ │ │ ├─ ◆ chrome.d │ ░
▕ │ │ └─ ◆ tree_widget.d │ ░
▕ │ ├─ ▾ docs/ │ ░
▕ │ │ ├─ ▪ index.md │ ░
▕ │ │ └─ ▪ layout.md │ ░
▕
pages ↓ down ↑ up → expand ← collapse / up ⏎ toggle O open all C close all ? keys q quit sparkles:ui data, interaction, view tokyo-night
Welcome | Tree * data, interaction, view #
Primitives | #
Layout | #
Tracks | The data layer is a flat arena with index links and no interaction #
Text | state. The opened set and the selection live beside it, keyed by node #
Themes | identity. flatten turns the two into visible rows and precomputes the #
Slots | guide rails, so no renderer re-derives them. #
Decoration | #
Effects | +---------------------------------------------------------------------+ #
Grid | | your view | #
Components | | +- > src/ | #
> Tree | | +- > docs/ | #
Property tree | | +- * README.md | #
Table | +---------------------------------------------------------------------+ #
Scrolling | #
State | +---------------------------------------------------------------------+ #
Split | | the same data, everything open | |
Dock | | +- v src/ | |
Terminal | | | +- v sparkles/ | |
| | | | +- * widget.d | |
| | | | +- * layout.d | |
| | | | +- * theme.d | |
| | | +- . dub.sdl | |
| | | +- v components/ | |
| | | +- * chrome.d | |
| | | +- * tree_widget.d | |
| | +- v docs/ | |
| | | +- * index.md | |
| | | +- * layout.md | |
|
pages v down ^ up > expand < collapse / up < toggle O open all C close all ? keys q quit What each profile gives up
The frame's degradation report: one line per substitution, and the capability the target lacked. full is empty when the page asks for nothing a terminal cannot do.
text
alpha-flattened ×4 (alpha)text
color-folded ×105 (colorDepth)
alpha-flattened ×4 (alpha)text
color-dropped ×105 (colorDepth)
ascii-border ×3 (unicode)
ascii-scrollbar ×1 (unicode)
ascii-glyph ×31 (unicode)
alpha-flattened ×4 (alpha)These are the files dub test :ui-gallery compares every render against, so a change to this page that is not re-blessed fails CI.