diff --git a/crates/gpui2/src/element.rs b/crates/gpui2/src/element.rs
index 4890b79a9acc811ea72816a4a01dbd45634e1667..a92dbd6ff94a98165f5b200bc4eadedb2471bf5a 100644
--- a/crates/gpui2/src/element.rs
+++ b/crates/gpui2/src/element.rs
@@ -198,14 +198,19 @@ impl<V> AnyElement<V> {
 pub trait Component<V> {
     fn render(self) -> AnyElement<V>;
 
-    fn when(mut self, condition: bool, then: impl FnOnce(Self) -> Self) -> Self
+    fn map<U>(self, f: impl FnOnce(Self) -> U) -> U
     where
         Self: Sized,
+        U: Component<V>,
     {
-        if condition {
-            self = then(self);
-        }
-        self
+        f(self)
+    }
+
+    fn when(self, condition: bool, then: impl FnOnce(Self) -> Self) -> Self
+    where
+        Self: Sized,
+    {
+        self.map(|this| if condition { then(this) } else { this })
     }
 }
 
diff --git a/crates/ui2/src/components/panel.rs b/crates/ui2/src/components/panel.rs
index c4a9ac511160a0bb5a9ba51a6b4b5bc70e99c7a8..5d941eb50ea3e7c8084b73c7792a2b6dcd0c378a 100644
--- a/crates/ui2/src/components/panel.rs
+++ b/crates/ui2/src/components/panel.rs
@@ -98,16 +98,14 @@ impl<V: 'static> Panel<V> {
         v_stack()
             .id(self.id.clone())
             .flex_initial()
-            .when(
-                self.current_side == PanelSide::Left || self.current_side == PanelSide::Right,
-                |this| this.h_full().w(current_size),
-            )
-            .when(self.current_side == PanelSide::Left, |this| this.border_r())
-            .when(self.current_side == PanelSide::Right, |this| {
-                this.border_l()
+            .map(|this| match self.current_side {
+                PanelSide::Left | PanelSide::Right => this.h_full().w(current_size),
+                PanelSide::Bottom => this,
             })
-            .when(self.current_side == PanelSide::Bottom, |this| {
-                this.border_b().w_full().h(current_size)
+            .map(|this| match self.current_side {
+                PanelSide::Left => this.border_r(),
+                PanelSide::Right => this.border_l(),
+                PanelSide::Bottom => this.border_b().w_full().h(current_size),
             })
             .bg(cx.theme().colors().surface)
             .border_color(cx.theme().colors().border)
diff --git a/crates/ui2/src/elements/input.rs b/crates/ui2/src/elements/input.rs
index 3f82512b843e520ebca5ec8a880fb9758792446c..2884470ce21193085e165cc1b0b92fb710c585a0 100644
--- a/crates/ui2/src/elements/input.rs
+++ b/crates/ui2/src/elements/input.rs
@@ -94,14 +94,13 @@ impl Input {
             .active(|style| style.bg(input_active_bg))
             .flex()
             .items_center()
-            .child(
-                div()
-                    .flex()
-                    .items_center()
-                    .text_sm()
-                    .when(self.value.is_empty(), |this| this.child(placeholder_label))
-                    .when(!self.value.is_empty(), |this| this.child(label)),
-            )
+            .child(div().flex().items_center().text_sm().map(|this| {
+                if self.value.is_empty() {
+                    this.child(placeholder_label)
+                } else {
+                    this.child(label)
+                }
+            }))
     }
 }