ui/components/pane_group/
render.rs

1//! [`Render`] impl for [`PaneGroup`]: recursive `h_flex`/`v_flex` +
2//! [`ResizablePanel`] layout, click-to-focus, the active-pane highlight
3//! border, and the `key_context`/`on_action` wiring that makes
4//! `pane_actions`'s actions drive this group for free once mounted.
5//! Divider drag math lives in [`super::divider`].
6
7use gpui::{AnyElement, Axis, Entity, MouseButton, canvas};
8
9use super::{Member, PaneAxis, PaneGroup, SplitDirection};
10use crate::{
11    ClosePane, FocusDown, FocusLeft, FocusRight, FocusUp, Pane, ResizablePanel, SplitDown,
12    SplitLeft, SplitRight, SplitUp, prelude::*,
13};
14
15impl PaneGroup {
16    fn render_member(
17        &self,
18        member: &Member,
19        path: Vec<usize>,
20        window: &mut Window,
21        cx: &mut Context<Self>,
22    ) -> AnyElement {
23        match member {
24            Member::Leaf(pane) => self.render_leaf(pane, cx),
25            Member::Split(axis) => self.render_axis(axis, path, window, cx),
26        }
27    }
28
29    fn render_leaf(&self, pane: &Entity<Pane>, cx: &mut Context<Self>) -> AnyElement {
30        let is_active = pane.entity_id() == self.active_pane.entity_id();
31        let focus_target = pane.clone();
32        let leaf_id = pane.entity_id().as_u64();
33
34        let _ = is_active;
35        div()
36            .id(("pane-leaf", leaf_id))
37            // Test-only (no-op in release builds, per `debug_selector`'s own
38            // cfg gate): lets tests locate a specific pane leaf's real
39            // rendered bounds by its stable entity id, e.g. to assert split
40            // quadrants or resize deltas.
41            .debug_selector(move || format!("PANE-LEAF-{leaf_id}"))
42            .size_full()
43            .overflow_hidden()
44            // No active-pane border: the active tab's accent already indicates
45            // focus, and a border would inset the (otherwise flush) panes.
46            .on_mouse_down(
47                MouseButton::Left,
48                cx.listener(move |this, _, window, cx| {
49                    this.active_pane = focus_target.clone();
50                    window.focus(&this.focus_handle, cx);
51                    cx.notify();
52                }),
53            )
54            .child(pane.clone())
55            .into_any_element()
56    }
57
58    fn render_axis(
59        &self,
60        pane_axis: &PaneAxis,
61        path: Vec<usize>,
62        window: &mut Window,
63        cx: &mut Context<Self>,
64    ) -> AnyElement {
65        let axis = pane_axis.axis;
66        let mut container = match axis {
67            Axis::Horizontal => h_flex(),
68            Axis::Vertical => v_flex(),
69        }
70        .id(format!("pane-axis-{path:?}"))
71        .size_full()
72        .overflow_hidden();
73
74        let measure = pane_axis.bounds.clone();
75        container = container.child(
76            canvas(
77                move |bounds, _, _| measure.set(Some(bounds)),
78                |_, _, _, _| {},
79            )
80            .absolute()
81            .size_full(),
82        );
83
84        let n = pane_axis.members.len();
85        for (ix, child) in pane_axis.members.iter().enumerate() {
86            let mut child_path = path.clone();
87            child_path.push(ix);
88            let child_el = self.render_member(child, child_path, window, cx);
89
90            container = container.child(
91                ResizablePanel::new()
92                    .axis(axis)
93                    .fraction(pane_axis.flexes[ix])
94                    .child(child_el),
95            );
96
97            if ix + 1 < n {
98                container = container.child(self.render_divider(
99                    path.clone(),
100                    ix,
101                    axis,
102                    pane_axis.flexes[ix],
103                    pane_axis.flexes[ix + 1],
104                    window,
105                    cx,
106                ));
107            }
108        }
109
110        container.into_any_element()
111    }
112}
113
114impl Render for PaneGroup {
115    fn render(&mut self, window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
116        let content = self.render_member(&self.root, Vec::new(), window, cx);
117
118        div()
119            .id("pane-group")
120            .key_context("PaneGroup")
121            .track_focus(&self.focus_handle)
122            .size_full()
123            .on_action(cx.listener(|this, _: &SplitRight, _, cx| {
124                this.split(SplitDirection::Right, cx);
125            }))
126            .on_action(cx.listener(|this, _: &SplitDown, _, cx| {
127                this.split(SplitDirection::Down, cx);
128            }))
129            .on_action(cx.listener(|this, _: &SplitLeft, _, cx| {
130                this.split(SplitDirection::Left, cx);
131            }))
132            .on_action(cx.listener(|this, _: &SplitUp, _, cx| {
133                this.split(SplitDirection::Up, cx);
134            }))
135            .on_action(cx.listener(|this, _: &ClosePane, _, cx| {
136                let _ = this.close_active(cx);
137            }))
138            .on_action(cx.listener(|this, _: &FocusLeft, _, cx| {
139                this.focus(SplitDirection::Left, cx);
140            }))
141            .on_action(cx.listener(|this, _: &FocusRight, _, cx| {
142                this.focus(SplitDirection::Right, cx);
143            }))
144            .on_action(cx.listener(|this, _: &FocusUp, _, cx| {
145                this.focus(SplitDirection::Up, cx);
146            }))
147            .on_action(cx.listener(|this, _: &FocusDown, _, cx| {
148                this.focus(SplitDirection::Down, cx);
149            }))
150            .child(content)
151    }
152}
ui/components/pane_group/render.rs

ui/components/pane_group/
render.rs
