API Reference

Core types and patterns. The crate is used as gpui::*.

Application

Entry point. Creates the platform, wgpu device, and event loop. Use Application::new().run().

Application::new().run(|cx: &mut App| { ... })
rust
use gpui::*; fn main() { Application::new().run(|cx: &mut App| { cx.open_window(WindowOptions::default(), |_, cx| { cx.new(|_| MyView) }).unwrap(); }); }

App

Application context passed to the run callback. Provides window creation, global state, and platform access.

App
rust
// Open a window (first arg is window options, second is a callback) cx.open_window(WindowOptions::default(), |_, cx| { cx.new(|_| MyView) }); // On WASM: activate to ensure events work cx.activate(true); // Spawn an async task cx.spawn(|mut cx| async move { // Async work cx.update(|cx| { /* update on main thread */ }).ok(); });

Context<T>

Context available inside a view. Used for notifications, listeners, spawning child views.

Context<'a, T>
rust
impl Render for MyView { fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement { cx.notify(); // schedule re-render (required on WASM) div() .id("btn") .on_click(cx.listener(|this, _event, _window, cx| { // this: &mut Self // cx: &mut Context<Self> this.count += 1; cx.notify(); })) .child(self.count.to_string()) } }

Render

Trait that every view must implement. Returns the element tree. Takes &mut self, &mut Window, &mut Context<Self>.

trait Render { fn render(&mut self, window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement; }
rust
use gpui::*; struct MyView; impl Render for MyView { fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement { cx.notify(); div() .size_full() .bg(rgb(0x0c0c0c)) .child("Hello") } }

Element

Building block. All UI is composed of elements via the builder pattern. Most UI uses div() with style modifiers.

trait Element: 'static
rust
// Main element functions: div() -> Div // The universal container // No span(), h1(), button(), etc. — use div() with // text_size(), font_weight(), .child("text") instead. // Custom elements implement Element directly: struct MyElement; impl Element for MyElement { fn layout(&mut self, cx: &mut LayoutContext) -> ElementLayout { todo!() } fn paint(&mut self, cx: &mut PaintContext) { todo!() } }

Styling

Chainable style methods on every element.

Style shortcuts on all element types
rust
use gpui::*; div() .flex() // display: flex .flex_col() // flex-direction: column .flex_1() // flex-grow: 1, flex-shrink: 1, flex-basis: 0 .size_full() // width: 100%, height: 100% .gap_4() // gap: 16px .p_6() // padding: 24px .px_3() // padding-left/right: 12px .py_2() // padding-top/bottom: 8px .w_full() // width: 100% .h(px(56.0)) // explicit height: 56px .rounded_xl() // border-radius: 12px .border_1() // border-width: 1px .bg(rgb(0x0c0c0c)) // background color .text_color(rgb(0xffffff)) // text color .text_size(px(24.0)) // font size .font_weight(FontWeight::BOLD) // font weight .hover(|s| s.bg(rgb(0x333333))) // hover style .overflow_y_scroll() // scrollable

Events

Event listeners need .id() on the element. Listeners receive 4 args: (this, event, window, cx).

cx.listener(|this: &mut Self, event: &ClickEvent, window: &mut Window, cx: &mut Context<Self>| { ... })
rust
use gpui::*; div() .id("interactive") // REQUIRED for on_click .on_click(cx.listener(|this, _event: &ClickEvent, _window, cx| { this.clicked = true; cx.notify(); })) .on_mouse_down(MouseButton::Left, cx.listener(|this, _event, _window, cx| { // MouseDownEvent cx.notify(); })) .on_hover(cx.listener(|this, &hovered, _window, cx| { // hovered: bool (true on enter, false on leave) cx.notify(); })) .child("Interact") // Prevent event bubbling div().id("inner") .on_click(cx.listener(|_, _, _, cx| { cx.stop_propagation(); }))

WASM Entry Point

For WASM targets, use #[wasm_bindgen(start)] and console_error_panic_hook.

#[wasm_bindgen(start)] pub fn start()
rust
use gpui::*; use wasm_bindgen::prelude::*; #[wasm_bindgen(start)] pub fn start() { console_error_panic_hook::set_once(); Application::new().run(|cx: &mut App| { cx.activate(true); // required for WASM cx.open_window(WindowOptions::default(), |_, cx| { cx.new(|_| MyView) }).unwrap(); }); }