revue 2.71.1

A Vue-style TUI framework for Rust with CSS styling
Documentation
//! Tree widget demos

use crate::example::Example;
use crate::theme_colors;
use revue::prelude::*;
use revue::widget::{FileTree, Tree, TreeNode};

pub fn examples() -> Vec<Example> {
    let (_primary, _success, _warning, _error, _info, muted, _text, _) = theme_colors();

    vec![
        Example::new(
            "Tree",
            "Hierarchical tree with expandable nodes",
            Border::rounded().title(" Tree ").child(
                vstack()
                    .gap(1)
                    .child(
                        Tree::new()
                            .node(
                                TreeNode::new("src")
                                    .expanded(true)
                                    .child(TreeNode::new("widget"))
                                    .child(TreeNode::new("style"))
                                    .child(TreeNode::new("lib.rs")),
                            )
                            .node(TreeNode::new("Cargo.toml"))
                            .node(TreeNode::new("README.md")),
                    )
                    .child(Text::new(""))
                    .child(Text::new("• Expandable nodes").fg(muted))
                    .child(Text::new("• Hierarchical data").fg(muted))
                    .child(Text::new("• Collapse/expand").fg(muted)),
            ),
        ),
        Example::new(
            "File Tree",
            "File explorer with file and folder icons",
            Border::rounded().title(" File Tree ").child(
                vstack()
                    .gap(1)
                    .child(FileTree::new())
                    .child(Text::new(""))
                    .child(Text::new("• File/folder icons").fg(muted))
                    .child(Text::new("• Directory nesting").fg(muted))
                    .child(Text::new("• File explorer view").fg(muted)),
            ),
        ),
        Example::new(
            "Org Chart",
            "Organizational hierarchy with reporting structure",
            Border::rounded().title(" Org Chart ").child(
                vstack()
                    .gap(1)
                    .child(
                        Tree::new().node(
                            TreeNode::new("CEO")
                                .expanded(true)
                                .child(
                                    TreeNode::new("CTO")
                                        .child(TreeNode::new("Engineering"))
                                        .child(TreeNode::new("DevOps")),
                                )
                                .child(
                                    TreeNode::new("CFO")
                                        .child(TreeNode::new("Finance"))
                                        .child(TreeNode::new("Accounting")),
                                ),
                        ),
                    )
                    .child(Text::new(""))
                    .child(Text::new("• Organizational view").fg(muted))
                    .child(Text::new("• Reporting structure").fg(muted))
                    .child(Text::new("• Employee hierarchy").fg(muted)),
            ),
        ),
        Example::new(
            "JSON Tree",
            "Tree visualization of JSON data structure",
            Border::rounded().title(" JSON Tree ").child(
                vstack()
                    .gap(1)
                    .child(
                        Tree::new().node(
                            TreeNode::new("{ } root")
                                .expanded(true)
                                .child(TreeNode::new("\"name\": \"revue\""))
                                .child(TreeNode::new("\"version\": \"2.52.0\""))
                                .child(
                                    TreeNode::new("\"dependencies\": { }")
                                        .child(TreeNode::new("\"ratatui\": \"0.29\""))
                                        .child(TreeNode::new("\"tokio\": \"1.0\"")),
                                )
                                .child(TreeNode::new("\"features\": [\"full\", \"async\"]")),
                        ),
                    )
                    .child(Text::new(""))
                    .child(Text::new("• JSON visualization").fg(muted))
                    .child(Text::new("• Expand objects").fg(muted))
                    .child(Text::new("• Key/value pairs").fg(muted)),
            ),
        ),
        Example::new(
            "Checklist Tree",
            "Nested task tree with checkbox progress states",
            Border::rounded().title(" Checklist Tree ").child(
                vstack()
                    .gap(1)
                    .child(
                        Tree::new()
                            .node(
                                TreeNode::new("☑ Phase 1: Setup")
                                    .child(TreeNode::new("☑ Initialize project"))
                                    .child(TreeNode::new("☑ Configure CI")),
                            )
                            .node(
                                TreeNode::new("◐ Phase 2: Development")
                                    .expanded(true)
                                    .child(TreeNode::new("☑ Core features"))
                                    .child(TreeNode::new("☐ Testing"))
                                    .child(TreeNode::new("☐ Documentation")),
                            )
                            .node(
                                TreeNode::new("☐ Phase 3: Release")
                                    .child(TreeNode::new("☐ Review"))
                                    .child(TreeNode::new("☐ Deploy")),
                            ),
                    )
                    .child(Text::new(""))
                    .child(Text::new("• Progress tracking").fg(muted))
                    .child(Text::new("• Nested tasks").fg(muted))
                    .child(Text::new("• Checkbox states").fg(muted)),
            ),
        ),
        Example::new(
            "Category Tree",
            "Category browser with emoji icons and navigation",
            Border::rounded().title(" Category Tree ").child(
                vstack()
                    .gap(1)
                    .child(
                        Tree::new()
                            .node(
                                TreeNode::new("📁 Documents")
                                    .expanded(true)
                                    .child(TreeNode::new("📄 Reports"))
                                    .child(TreeNode::new("📄 Spreadsheets")),
                            )
                            .node(
                                TreeNode::new("📁 Images")
                                    .child(TreeNode::new("🖼 Photos"))
                                    .child(TreeNode::new("🎨 Graphics")),
                            )
                            .node(
                                TreeNode::new("📁 Code")
                                    .child(TreeNode::new("⚙ Rust"))
                                    .child(TreeNode::new("⚙ TypeScript")),
                            ),
                    )
                    .child(Text::new(""))
                    .child(Text::new("• Category browser").fg(muted))
                    .child(Text::new("• Emoji icons").fg(muted))
                    .child(Text::new("• Navigation tree").fg(muted)),
            ),
        ),
    ]
}