From 2a3c71cd5830b227834045ba1cf1c88f651b4396 Mon Sep 17 00:00:00 2001 From: Darren Burns Date: Tue, 11 Jun 2024 13:32:51 +0100 Subject: [PATCH 1/3] Expand the click target area for the tree --- src/textual/widgets/_tree.py | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/textual/widgets/_tree.py b/src/textual/widgets/_tree.py index 686382433d..dbb0c64a4d 100644 --- a/src/textual/widgets/_tree.py +++ b/src/textual/widgets/_tree.py @@ -1089,6 +1089,8 @@ def get_guides(style: Style) -> tuple[str, str, str, str]: else: line_style = base_style + line_style += Style(meta={"line": y}) + guides = Text(style=line_style) guides_append = guides.append @@ -1124,7 +1126,7 @@ def get_guides(style: Style) -> tuple[str, str, str, str]: ) label = self.render_label(line.path[-1], line_style, label_style).copy() - label.stylize(Style(meta={"node": line.node._id, "line": y})) + label.stylize(Style(meta={"node": line.node._id})) guides.append(label) segments = list(guides.render(self.app.console)) From f8f8c6d61b1091a3b7ddc9e6c3dbc07ca80af303 Mon Sep 17 00:00:00 2001 From: Darren Burns Date: Tue, 11 Jun 2024 13:39:31 +0100 Subject: [PATCH 2/3] Update the changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 952495aaee..5269c25679 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/). ### Changed - `home` and `end` now works horizontally instead of vertically in DataTable https://github.com/Textualize/textual/pull/4633 +- `Tree` and `DirectoryTree` nodes now have a bigger click target, spanning the full line https://github.com/Textualize/textual/pull/4636 ### Fixed From 2317cea051e8dd346501587be575a385239dc64a Mon Sep 17 00:00:00 2001 From: Darren Burns Date: Tue, 11 Jun 2024 13:55:34 +0100 Subject: [PATCH 3/3] Update snapshots --- .../__snapshots__/test_snapshots.ambr | 738 +++++++++--------- 1 file changed, 369 insertions(+), 369 deletions(-) diff --git a/tests/snapshot_tests/__snapshots__/test_snapshots.ambr b/tests/snapshot_tests/__snapshots__/test_snapshots.ambr index f19d71aa8f..d39d170cce 100644 --- a/tests/snapshot_tests/__snapshots__/test_snapshots.ambr +++ b/tests/snapshot_tests/__snapshots__/test_snapshots.ambr @@ -18399,136 +18399,136 @@ font-weight: 700; } - .terminal-1907613470-matrix { + .terminal-1982379915-matrix { font-family: Fira Code, monospace; font-size: 20px; line-height: 24.4px; font-variant-east-asian: full-width; } - .terminal-1907613470-title { + .terminal-1982379915-title { font-size: 18px; font-weight: bold; font-family: arial; } - .terminal-1907613470-r1 { fill: #e2e3e3 } - .terminal-1907613470-r2 { fill: #e2e3e3;font-weight: bold } - .terminal-1907613470-r3 { fill: #c5c8c6 } - .terminal-1907613470-r4 { fill: #008139 } - .terminal-1907613470-r5 { fill: #211505;font-weight: bold } - .terminal-1907613470-r6 { fill: #fea62b;font-weight: bold } - .terminal-1907613470-r7 { fill: #e2e3e3;font-style: italic; } + .terminal-1982379915-r1 { fill: #e2e3e3 } + .terminal-1982379915-r2 { fill: #e2e3e3;font-weight: bold } + .terminal-1982379915-r3 { fill: #c5c8c6 } + .terminal-1982379915-r4 { fill: #008139 } + .terminal-1982379915-r5 { fill: #211505;font-weight: bold } + .terminal-1982379915-r6 { fill: #fea62b;font-weight: bold } + .terminal-1982379915-r7 { fill: #e2e3e3;font-style: italic; } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - DirectoryTreeReloadApp + DirectoryTreeReloadApp - + - - 📂 test_directory_tree_reloading0 - ├── 📂 b1 - │   ├── 📂 c1 - │   │   ┣━━ 📂 d1 - │   │   ┃   ┣━━ 📄 f1.txt - │   │   ┃   ┗━━ 📄 f2.txt - │   │   ┣━━ 📄 f1.txt - │   │   ┗━━ 📄 f2.txt - │   ├── 📄 f1.txt - │   └── 📄 f2.txt - ├── 📄 f1.txt - └── 📄 f2.txt - - - - - - - - - - - + + 📂 test_directory_tree_reloading0 + ├── 📂 b1 + │   ├── 📂 c1 + │   │   ┣━━ 📂 d1 + │   │   ┃   ┣━━ 📄 f1.txt + │   │   ┃   ┗━━ 📄 f2.txt + │   │   ┣━━ 📄 f1.txt + │   │   ┗━━ 📄 f2.txt + │   ├── 📄 f1.txt + │   └── 📄 f2.txt + ├── 📄 f1.txt + └── 📄 f2.txt + + + + + + + + + + + @@ -20204,143 +20204,143 @@ font-weight: 700; } - .terminal-4125634320-matrix { + .terminal-2483219576-matrix { font-family: Fira Code, monospace; font-size: 20px; line-height: 24.4px; font-variant-east-asian: full-width; } - .terminal-4125634320-title { + .terminal-2483219576-title { font-size: 18px; font-weight: bold; font-family: arial; } - .terminal-4125634320-r1 { fill: #c5c8c6 } - .terminal-4125634320-r2 { fill: #e3e3e3 } - .terminal-4125634320-r3 { fill: #e2e3e3 } - .terminal-4125634320-r4 { fill: #008139 } - .terminal-4125634320-r5 { fill: #14191f } - .terminal-4125634320-r6 { fill: #e2e3e3;font-weight: bold } - .terminal-4125634320-r7 { fill: #98e024 } - .terminal-4125634320-r8 { fill: #211505;font-weight: bold } - .terminal-4125634320-r9 { fill: #fea62b;font-weight: bold } - .terminal-4125634320-r10 { fill: #58d1eb;font-weight: bold } - .terminal-4125634320-r11 { fill: #f4005f;font-style: italic; } - .terminal-4125634320-r12 { fill: #23568b } - .terminal-4125634320-r13 { fill: #a7a9ab } + .terminal-2483219576-r1 { fill: #c5c8c6 } + .terminal-2483219576-r2 { fill: #e3e3e3 } + .terminal-2483219576-r3 { fill: #e2e3e3 } + .terminal-2483219576-r4 { fill: #008139 } + .terminal-2483219576-r5 { fill: #14191f } + .terminal-2483219576-r6 { fill: #e2e3e3;font-weight: bold } + .terminal-2483219576-r7 { fill: #98e024 } + .terminal-2483219576-r8 { fill: #211505;font-weight: bold } + .terminal-2483219576-r9 { fill: #fea62b;font-weight: bold } + .terminal-2483219576-r10 { fill: #58d1eb;font-weight: bold } + .terminal-2483219576-r11 { fill: #f4005f;font-style: italic; } + .terminal-2483219576-r12 { fill: #23568b } + .terminal-2483219576-r13 { fill: #a7a9ab } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - TreeApp + TreeApp - + - - ⭘TreeApp - ▼ Root - └── ▼ {} JSON▁▁ - ├── code='5060292302201' - ├── ▼ {} product - │   ┣━━ _id='5060292302201' - │   ┣━━ ▶ [] _keywords - │   ┣━━ ▶ [] added_countries_tags - │   ┣━━ ▶ [] additives_debug_tags - │   ┣━━ additives_n=2 - │   ┣━━ additives_old_n=2 - │   ┣━━ ▶ [] additives_old_tags - │   ┣━━ ▶ [] additives_original_tags - │   ┣━━ ▶ [] additives_prev_original_tags - │   ┣━━ ▶ [] additives_tags - │   ┣━━ additives_tags_n=None - │   ┣━━ allergens='en:milk' - │   ┣━━ ▶ [] allergens_debug_tags - │   ┣━━ allergens_from_ingredients='en:milk, milk' - │   ┣━━ allergens_from_user='(en) en:milk' - │   ┣━━ ▶ [] allergens_hierarchy - │   ┣━━ ▶ [] allergens_tags - ▉ -  a Add node c Clear t Toggle root + + ⭘TreeApp + ▼ Root + └── ▼ {} JSON▁▁ + ├── code='5060292302201' + ├── ▼ {} product + │   ┣━━ _id='5060292302201' + │   ┣━━ ▶ [] _keywords + │   ┣━━ ▶ [] added_countries_tags + │   ┣━━ ▶ [] additives_debug_tags + │   ┣━━ additives_n=2 + │   ┣━━ additives_old_n=2 + │   ┣━━ ▶ [] additives_old_tags + │   ┣━━ ▶ [] additives_original_tags + │   ┣━━ ▶ [] additives_prev_original_tags + │   ┣━━ ▶ [] additives_tags + │   ┣━━ additives_tags_n=None + │   ┣━━ allergens='en:milk' + │   ┣━━ ▶ [] allergens_debug_tags + │   ┣━━ allergens_from_ingredients='en:milk, milk' + │   ┣━━ allergens_from_user='(en) en:milk' + │   ┣━━ ▶ [] allergens_hierarchy + │   ┣━━ ▶ [] allergens_tags + ▉ +  a Add node c Clear t Toggle root @@ -20370,144 +20370,144 @@ font-weight: 700; } - .terminal-4170054082-matrix { + .terminal-1448741579-matrix { font-family: Fira Code, monospace; font-size: 20px; line-height: 24.4px; font-variant-east-asian: full-width; } - .terminal-4170054082-title { + .terminal-1448741579-title { font-size: 18px; font-weight: bold; font-family: arial; } - .terminal-4170054082-r1 { fill: #c5c8c6 } - .terminal-4170054082-r2 { fill: #24292f } - .terminal-4170054082-r3 { fill: #e1e1e1 } - .terminal-4170054082-r4 { fill: #e2e3e3 } - .terminal-4170054082-r5 { fill: #96989b } - .terminal-4170054082-r6 { fill: #008139 } - .terminal-4170054082-r7 { fill: #4ebf71;font-weight: bold } - .terminal-4170054082-r8 { fill: #939393;font-weight: bold } - .terminal-4170054082-r9 { fill: #4ebf71;text-decoration: underline; } - .terminal-4170054082-r10 { fill: #e1e1e1;text-decoration: underline; } - .terminal-4170054082-r11 { fill: #fea62b;font-weight: bold } - .terminal-4170054082-r12 { fill: #a7a9ab } - .terminal-4170054082-r13 { fill: #a6742c;font-weight: bold } - .terminal-4170054082-r14 { fill: #727579 } + .terminal-1448741579-r1 { fill: #c5c8c6 } + .terminal-1448741579-r2 { fill: #24292f } + .terminal-1448741579-r3 { fill: #e1e1e1 } + .terminal-1448741579-r4 { fill: #e2e3e3 } + .terminal-1448741579-r5 { fill: #96989b } + .terminal-1448741579-r6 { fill: #008139 } + .terminal-1448741579-r7 { fill: #4ebf71;font-weight: bold } + .terminal-1448741579-r8 { fill: #939393;font-weight: bold } + .terminal-1448741579-r9 { fill: #4ebf71;text-decoration: underline; } + .terminal-1448741579-r10 { fill: #e1e1e1;text-decoration: underline; } + .terminal-1448741579-r11 { fill: #fea62b;font-weight: bold } + .terminal-1448741579-r12 { fill: #a7a9ab } + .terminal-1448741579-r13 { fill: #a6742c;font-weight: bold } + .terminal-1448741579-r14 { fill: #727579 } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - MarkdownApp + MarkdownApp - + - - ▊ - ▼ Ⅰ Textual Markdown Browser▊ - └── Ⅱ Do You Want to Know More?▊Textual Markdown Browser - ▊ - ▊Welcome fellow adventurer! If you ran  - ▊markdown.py from the terminal you are  - ▊viewing demo.md with Textual's built  - ▊in Markdown widget. - ▊ - ▊The widget supports much of the  - ▊Markdown spec. There is also an  - ▊optional Table of Contents sidebar  - ▊which you will see to your left. - ▊ - ▊ - ▊Do You Want to Know More? - ▊ - ▊See example.md for more examples of  - ▊what this can do. - ▊ - ▊ - ▊ - ▊ -  t TOC b Back f Forward + + ▊ + ▼ Ⅰ Textual Markdown Browser▊ + └── Ⅱ Do You Want to Know More?▊Textual Markdown Browser + ▊ + ▊Welcome fellow adventurer! If you ran  + ▊markdown.py from the terminal you are  + ▊viewing demo.md with Textual's built  + ▊in Markdown widget. + ▊ + ▊The widget supports much of the  + ▊Markdown spec. There is also an  + ▊optional Table of Contents sidebar  + ▊which you will see to your left. + ▊ + ▊ + ▊Do You Want to Know More? + ▊ + ▊See example.md for more examples of  + ▊what this can do. + ▊ + ▊ + ▊ + ▊ +  t TOC b Back f Forward @@ -26757,142 +26757,142 @@ font-weight: 700; } - .terminal-3055615940-matrix { + .terminal-25896823-matrix { font-family: Fira Code, monospace; font-size: 20px; line-height: 24.4px; font-variant-east-asian: full-width; } - .terminal-3055615940-title { + .terminal-25896823-title { font-size: 18px; font-weight: bold; font-family: arial; } - .terminal-3055615940-r1 { fill: #c5c8c6 } - .terminal-3055615940-r2 { fill: #24292f } - .terminal-3055615940-r3 { fill: #e1e1e1 } - .terminal-3055615940-r4 { fill: #e2e3e3 } - .terminal-3055615940-r5 { fill: #96989b } - .terminal-3055615940-r6 { fill: #008139 } - .terminal-3055615940-r7 { fill: #4ebf71;font-weight: bold } - .terminal-3055615940-r8 { fill: #939393;font-weight: bold } - .terminal-3055615940-r9 { fill: #4ebf71;text-decoration: underline; } - .terminal-3055615940-r10 { fill: #14191f } - .terminal-3055615940-r11 { fill: #e1e1e1;font-style: italic; } - .terminal-3055615940-r12 { fill: #e1e1e1;font-weight: bold } + .terminal-25896823-r1 { fill: #c5c8c6 } + .terminal-25896823-r2 { fill: #24292f } + .terminal-25896823-r3 { fill: #e1e1e1 } + .terminal-25896823-r4 { fill: #e2e3e3 } + .terminal-25896823-r5 { fill: #96989b } + .terminal-25896823-r6 { fill: #008139 } + .terminal-25896823-r7 { fill: #4ebf71;font-weight: bold } + .terminal-25896823-r8 { fill: #939393;font-weight: bold } + .terminal-25896823-r9 { fill: #4ebf71;text-decoration: underline; } + .terminal-25896823-r10 { fill: #14191f } + .terminal-25896823-r11 { fill: #e1e1e1;font-style: italic; } + .terminal-25896823-r12 { fill: #e1e1e1;font-weight: bold } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - MarkdownExampleApp + MarkdownExampleApp - + - - ▊ - ▼ Ⅰ Markdown Viewer▊ - ├── Ⅱ Features▊Markdown Viewer - ├── Ⅱ Tables▊ - └── Ⅱ Code Blocks▊This is an example of Textual's MarkdownViewer - ▊widget. - ▊ - ▊ - ▊Features - ▊ - ▊Markdown syntax and extensions are supported.▂▂ - ▊ - ▊● Typography emphasis, strong, inline code etc. - ▊● Headers - ▊● Lists (bullet and ordered) - ▊● Syntax highlighted code blocks - ▊● Tables! - ▊ - ▊ - ▊Tables - ▊ - ▊Tables are displayed in a DataTable widget. - ▊ - ▊ + + ▊ + ▼ Ⅰ Markdown Viewer▊ + ├── Ⅱ Features▊Markdown Viewer + ├── Ⅱ Tables▊ + └── Ⅱ Code Blocks▊This is an example of Textual's MarkdownViewer + ▊widget. + ▊ + ▊ + ▊Features + ▊ + ▊Markdown syntax and extensions are supported.▂▂ + ▊ + ▊● Typography emphasis, strong, inline code etc. + ▊● Headers + ▊● Lists (bullet and ordered) + ▊● Syntax highlighted code blocks + ▊● Tables! + ▊ + ▊ + ▊Tables + ▊ + ▊Tables are displayed in a DataTable widget. + ▊ + ▊ @@ -47173,133 +47173,133 @@ font-weight: 700; } - .terminal-3765519511-matrix { + .terminal-2807779303-matrix { font-family: Fira Code, monospace; font-size: 20px; line-height: 24.4px; font-variant-east-asian: full-width; } - .terminal-3765519511-title { + .terminal-2807779303-title { font-size: 18px; font-weight: bold; font-family: arial; } - .terminal-3765519511-r1 { fill: #e2e3e3 } - .terminal-3765519511-r2 { fill: #211505;font-weight: bold } - .terminal-3765519511-r3 { fill: #1a1000;font-weight: bold } - .terminal-3765519511-r4 { fill: #c5c8c6 } + .terminal-2807779303-r1 { fill: #e2e3e3 } + .terminal-2807779303-r2 { fill: #211505;font-weight: bold } + .terminal-2807779303-r3 { fill: #1a1000;font-weight: bold } + .terminal-2807779303-r4 { fill: #c5c8c6 } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - TreeClearingSnapshotApp + TreeClearingSnapshotApp - + - - ▼ Left▶ Right - - - - - - - - - - - - - - - - - - - - - - + + ▼ Left▶ Right + + + + + + + + + + + + + + + + + + + + + + @@ -47330,133 +47330,133 @@ font-weight: 700; } - .terminal-3137592172-matrix { + .terminal-89071480-matrix { font-family: Fira Code, monospace; font-size: 20px; line-height: 24.4px; font-variant-east-asian: full-width; } - .terminal-3137592172-title { + .terminal-89071480-title { font-size: 18px; font-weight: bold; font-family: arial; } - .terminal-3137592172-r1 { fill: #e2e3e3 } - .terminal-3137592172-r2 { fill: #211505;font-weight: bold } - .terminal-3137592172-r3 { fill: #c5c8c6 } - .terminal-3137592172-r4 { fill: #fea62b;font-weight: bold } + .terminal-89071480-r1 { fill: #e2e3e3 } + .terminal-89071480-r2 { fill: #211505;font-weight: bold } + .terminal-89071480-r3 { fill: #c5c8c6 } + .terminal-89071480-r4 { fill: #fea62b;font-weight: bold } - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - TreeApp + TreeApp - + - - ▼ Dune - ┗━━ ▼ Characters - ┣━━ Paul - ┣━━ Jessica - ┗━━ Chani - - - - - - - - - - - - - - - - - - + + ▼ Dune + ┗━━ ▼ Characters + ┣━━ Paul + ┣━━ Jessica + ┗━━ Chani + + + + + + + + + + + + + + + + + +