tree demo

Author: willmcgugan

CHANGELOG.md

@@ -30,6 +30,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 - Added support for in-band terminal resize protocol https://github.com/Textualize/textual/pull/5217
 - Added TEXTUAL_THEME environment var, which should be a comma separated list of desired themes
 - Added `Widget.is_scrolling`
+- Added `Tree.add_json`
 
 ### Changed
 

src/textual/demo/data.py

@@ -1,3 +1,5 @@
+import json
+
 COUNTRIES = [
     "Afghanistan",
     "Albania",
@@ -325,3 +327,89 @@
 1989-11-17,All Dogs Go to Heaven,Animation,Don Bluth,27,G,84
 1989-12-20,Tango & Cash,Action,Andrei Konchalovsky,63,R,104
 """
+
+MOVIES_JSON = """{
+  "decades": {
+    "1980s": {
+      "genres": {
+        "action": {
+          "franchises": {
+            "terminator": {
+              "name": "The Terminator",
+              "movies": [
+                {
+                  "title": "The Terminator",
+                  "year": 1984,
+                  "director": "James Cameron",
+                  "stars": ["Arnold Schwarzenegger", "Linda Hamilton", "Michael Biehn"],
+                  "boxOffice": 78371200,
+                  "quotes": ["I'll be back", "Come with me if you want to live"]
+                }
+              ]
+            },
+            "rambo": {
+              "name": "Rambo",
+              "movies": [
+                {
+                  "title": "First Blood",
+                  "year": 1982,
+                  "director": "Ted Kotcheff",
+                  "stars": ["Sylvester Stallone", "Richard Crenna", "Brian Dennehy"],
+                  "boxOffice": 47212904
+                },
+                {
+                  "title": "Rambo: First Blood Part II",
+                  "year": 1985,
+                  "director": "George P. Cosmatos",
+                  "stars": ["Sylvester Stallone", "Richard Crenna", "Charles Napier"],
+                  "boxOffice": 150415432
+                }
+              ]
+            }
+          },
+          "standalone_classics": {
+            "die_hard": {
+              "title": "Die Hard",
+              "year": 1988,
+              "director": "John McTiernan",
+              "stars": ["Bruce Willis", "Alan Rickman", "Reginald VelJohnson"],
+              "boxOffice": 140700000,
+              "location": "Nakatomi Plaza",
+              "quotes": ["Yippee-ki-yay, motherf***er"]
+            },
+            "predator": {
+              "title": "Predator",
+              "year": 1987,
+              "director": "John McTiernan",
+              "stars": ["Arnold Schwarzenegger", "Carl Weathers", "Jesse Ventura"],
+              "boxOffice": 98267558,
+              "location": "Val Verde jungle",
+              "quotes": ["Get to the chopper!"]
+            }
+          },
+          "common_themes": [
+            "Cold War politics",
+            "One man army",
+            "Revenge plots",
+            "Military operations",
+            "Law enforcement"
+          ],
+          "typical_elements": {
+            "weapons": ["M60 machine gun", "Desert Eagle", "Explosive arrows"],
+            "vehicles": ["Military helicopters", "Muscle cars", "Tanks"],
+            "locations": ["Urban jungle", "Actual jungle", "Industrial facilities"]
+          }
+        }
+      }
+    }
+  },
+  "metadata": {
+    "total_movies": 4,
+    "date_compiled": "2024",
+    "box_office_total": 467654094,
+    "most_frequent_actor": "Arnold Schwarzenegger",
+    "most_frequent_director": "John McTiernan"
+  }
+}"""
+
+MOVIES_TREE = json.loads(MOVIES_JSON)

src/textual/demo/widgets.py

@@ -11,7 +11,7 @@
 from textual import containers, events, lazy, on
 from textual.app import ComposeResult
 from textual.binding import Binding
-from textual.demo.data import COUNTRIES, MOVIES
+from textual.demo.data import COUNTRIES, MOVIES, MOVIES_TREE
 from textual.demo.page import PageScreen
 from textual.reactive import reactive, var
 from textual.suggester import SuggestFromList
@@ -38,6 +38,7 @@
     Switch,
     TabbedContent,
     TextArea,
+    Tree,
 )
 
 WIDGETS_MD = """\
@@ -635,6 +636,41 @@ def switch_theme() -> None:
         self.set_timer(0.3, switch_theme)
 
 
+class Trees(containers.VerticalGroup):
+    DEFAULT_CLASSES = "column"
+    TREES_MD = """\
+## Tree
+
+The Tree widget displays hierarchical data.
+
+There is also the Tree widget's cousin, DirectoryTree, to navigate folders and files on the filesystem.
+    """
+    DEFAULT_CSS = """
+    Trees {
+        Tree {
+            height: 16;            
+            &.-maximized { height: 1fr; }            
+        }
+        VerticalGroup {
+            border: heavy transparent;            
+            &:focus-within { border: heavy $border; }
+        }
+    }
+
+    """
+
+    def compose(self) -> ComposeResult:
+        yield Markdown(self.TREES_MD)
+        with containers.VerticalGroup():
+            yield Tree("80s movies")
+
+    def on_mount(self) -> None:
+        tree = self.query_one(Tree)
+        tree.show_root = False
+        tree.add_json(MOVIES_TREE)
+        tree.root.expand()
+
+
 class TextAreas(containers.VerticalGroup):
     ALLOW_MAXIMIZE = True
     DEFAULT_CLASSES = "column"
@@ -743,5 +779,6 @@ def compose(self) -> ComposeResult:
             yield Sparklines()
             yield Switches()
             yield TextAreas()
+            yield Trees()
             yield YourWidgets()
         yield Footer()

src/textual/widgets/_tree.py

@@ -785,6 +785,52 @@ def __init__(
 
         super().__init__(name=name, id=id, classes=classes, disabled=disabled)
 
+    def add_json(self, json_data: object, node: TreeNode | None = None) -> None:
+        """Adds JSON data to a node.
+
+        Args:
+            json_data: An object decoded from JSON.
+            node: Node to add data to.
+
+        """
+
+        if node is None:
+            node = self.root
+
+        from rich.highlighter import ReprHighlighter
+
+        highlighter = ReprHighlighter()
+
+        def add_node(name: str, node: TreeNode, data: object) -> None:
+            """Adds a node to the tree.
+
+            Args:
+                name: Name of the node.
+                node: Parent node.
+                data: Data associated with the node.
+            """
+            if isinstance(data, dict):
+                node.set_label(Text(f"{{}} {name}"))
+                for key, value in data.items():
+                    new_node = node.add("")
+                    add_node(key, new_node, value)
+            elif isinstance(data, list):
+                node.set_label(Text(f"[] {name}"))
+                for index, value in enumerate(data):
+                    new_node = node.add("")
+                    add_node(str(index), new_node, value)
+            else:
+                node.allow_expand = False
+                if name:
+                    label = Text.assemble(
+                        Text.from_markup(f"[b]{name}[/b]="), highlighter(repr(data))
+                    )
+                else:
+                    label = Text(repr(data))
+                node.set_label(label)
+
+        add_node("", node, json_data)
+
     @property
     def cursor_node(self) -> TreeNode[TreeDataType] | None:
         """The currently selected node, or ``None`` if no selection."""