add button

examples/gallery/Cargo.toml

@@ -7,6 +7,7 @@ description = "Live preview of every component against the resolved system theme
 [dependencies]
 gpui = { workspace = true }
 gpui_platform = { workspace = true }
+gpui-native-core = { workspace = true }
 gpui-native-icons = { workspace = true }
 gpui-native-theme = { workspace = true }
 

examples/gallery/src/main.rs

@@ -4,20 +4,25 @@ use gpui::{
     ParentElement as _, Render, SharedString, StatefulInteractiveElement as _, Styled as _, Window,
     WindowBounds, WindowOptions, div, px, size,
 };
+use gpui_native_core::button::{Button, ButtonVariant};
+use gpui_native_core::common::{h_flex, v_flex};
 use gpui_native_icons::{IconAssets, IconRole, icon};
-use gpui_native_theme::Theme;
+use gpui_native_theme::{ActiveTheme as _, Theme};
 use gpui_platform::application;
 
-struct Gallery;
+struct Gallery {
+    button_clicks: usize,
+}
 
 impl Render for Gallery {
     fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
-        let theme = Theme::global(cx);
+        let theme = cx.theme();
         let colors = theme.colors;
         let variant = theme.variant;
         let source = gpui_native_theme::detected_source(cx);
         let mode_override = gpui_native_theme::mode_override(cx);
         let active_preset = gpui_native_theme::active_preset(cx);
+        let gallery = cx.entity();
 
         let swatches: [(&str, gpui::Hsla); 18] = [
             ("background", colors.background),
@@ -68,6 +73,13 @@ impl Render for Gallery {
             ),
         ];
 
+        let button_variants = [
+            ("primary", ButtonVariant::Primary),
+            ("secondary", ButtonVariant::Secondary),
+            ("ghost", ButtonVariant::Ghost),
+            ("destructive", ButtonVariant::Destructive),
+        ];
+
         div()
             .size_full()
             .font_family(".SystemUIFont")
@@ -93,7 +105,7 @@ impl Render for Gallery {
                             .text_sm()
                             .text_color(colors.muted_foreground)
                             .child(format!(
-                                "phase B — theme engine · source: {source} · variant: {variant:?}"
+                                "phase C — button · source: {source} · variant: {variant:?}"
                             )),
                     ),
             )
@@ -141,6 +153,47 @@ impl Render for Gallery {
                             })),
                     ),
             )
+            .child(
+                v_flex()
+                    .gap_2()
+                    .child(section_label(
+                        "button · native refs — NSButton, WinUI Button, Adwaita, Breeze",
+                        colors,
+                    ))
+                    .child(
+                        h_flex()
+                            .flex_wrap()
+                            .gap_2()
+                            .children(button_variants.map(|(name, variant)| {
+                                let gallery = gallery.clone();
+                                Button::new(SharedString::from(format!("gallery-button-{name}")))
+                                    .label(button_label(variant))
+                                    .variant(variant)
+                                    .on_click(move |_, _, cx| {
+                                        gallery.update(cx, |gallery, cx| {
+                                            gallery.button_clicks += 1;
+                                            cx.notify();
+                                        });
+                                    })
+                            }))
+                            .child(
+                                Button::new("gallery-button-disabled")
+                                    .label("Disabled")
+                                    .disabled(true),
+                            )
+                            .child(
+                                Button::new("gallery-button-icon")
+                                    .label("Open")
+                                    .icon(IconRole::Folder),
+                            ),
+                    )
+                    .child(
+                        div()
+                            .text_xs()
+                            .text_color(colors.muted_foreground)
+                            .child(format!("clicked {} times", self.button_clicks)),
+                    ),
+            )
             .child(
                 div()
                     .flex()
@@ -217,6 +270,15 @@ impl Render for Gallery {
     }
 }
 
+fn button_label(variant: ButtonVariant) -> &'static str {
+    match variant {
+        ButtonVariant::Primary => "Primary",
+        ButtonVariant::Secondary => "Secondary",
+        ButtonVariant::Ghost => "Ghost",
+        ButtonVariant::Destructive => "Delete",
+    }
+}
+
 fn section_label(text: &str, colors: gpui_native_theme::ColorTokens) -> impl IntoElement + use<> {
     div()
         .text_sm()
@@ -280,7 +342,7 @@ fn main() {
                         cx.refresh_windows();
                     })
                     .detach();
-                cx.new(|_| Gallery)
+                cx.new(|_| Gallery { button_clicks: 0 })
             },
         ) {
             eprintln!("failed to open gallery window: {err}");