Struct SpanTree 

pub struct SpanTree;

A hierarchical span tree component for trace visualization.

Displays hierarchical spans with horizontal timing bars aligned to a shared time axis. Each row shows a label with tree expand/collapse indicators on the left, and a proportional duration bar on the right.

Visual Format

┌─ Trace ─────────────────────────────────────────┐
│ Label                     │ 0ms    500ms   1000ms│
│───────────────────────────┼──────────────────────│
│ ▾ frontend/request        │ ████████████████████ │
│   ▾ api/handler           │   ██████████████     │
│     db/query              │     ████             │
│     cache/lookup          │          ███         │
│   auth/validate           │ ███                  │
└─────────────────────────────────────────────────┘

Keyboard Navigation

• Up/k: Move selection up
• Down/j: Move selection down
• Right/l: Expand selected node
• Left/h: Collapse selected node
• Space/Enter: Toggle expand/collapse
• Shift+Right: Increase label width
• Shift+Left: Decrease label width

Example

use envision::component::{
    Component, SpanTree, SpanTreeState, SpanTreeMessage, SpanNode,
};
use ratatui::style::Color;

let root = SpanNode::new("req", "frontend/request", 0.0, 1000.0)
    .with_color(Color::Cyan)
    .with_child(
        SpanNode::new("api", "api/handler", 50.0, 800.0)
            .with_color(Color::Yellow)
            .with_child(SpanNode::new("db", "db/query", 100.0, 400.0).with_color(Color::Green))
    );

let mut state = SpanTreeState::new(vec![root]);

// Navigate through spans
SpanTree::update(&mut state, SpanTreeMessage::SelectDown);
SpanTree::update(&mut state, SpanTreeMessage::Collapse);

Trait Implementations

impl Component for SpanTree

type State = SpanTreeState

The component’s internal state type.

type Message = SpanTreeMessage

Messages this component can receive.

type Output = SpanTreeOutput

Messages this component can emit to its parent.

fn init() -> Self::State

Initialize the component state.

fn update(state: &mut Self::State, msg: Self::Message) -> Option<Self::Output>

Update component state based on a message.

fn handle_event( state: &Self::State, event: &Event, ctx: &EventContext, ) -> Option<Self::Message>

Maps an input event to a component message.

fn view(state: &Self::State, ctx: &mut RenderContext<'_, '_>)

Render the component to the given area.

fn traced_view(state: &Self::State, ctx: &mut RenderContext<'_, '_>)

Renders the component with optional tracing instrumentation.

fn dispatch_event( state: &mut Self::State, event: &Event, ctx: &EventContext, ) -> Option<Self::Output>

Dispatches an event by mapping it to a message and updating state.