.

crates/core/src/link.rs

@@ -0,0 +1,122 @@
+use gpui::prelude::FluentBuilder as _;
+use gpui::{
+    App, BoxShadow, ClickEvent, ElementId, InteractiveElement as _, IntoElement,
+    ParentElement as _, RenderOnce, Role, SharedString, StatefulInteractiveElement as _,
+    Styled as _, Window, px,
+};
+use gpui_native_theme::ActiveTheme as _;
+
+use crate::common::h_flex;
+
+/// The click handler. When set it replaces the default `href` opening.
+type ClickHandler = Box<dyn Fn(&ClickEvent, &mut Window, &mut App)>;
+
+/// Link component.
+#[derive(IntoElement)]
+pub struct Link {
+    id: ElementId,
+    label: Option<SharedString>,
+    href: Option<SharedString>,
+    disabled: bool,
+    a11y_label: Option<SharedString>,
+    on_click: Option<ClickHandler>,
+}
+
+impl Link {
+    /// Creates a link without a label or target.
+    pub fn new<I>(id: I) -> Self
+    where
+        I: Into<ElementId>,
+    {
+        Self {
+            id: id.into(),
+            label: None,
+            href: None,
+            disabled: false,
+            a11y_label: None,
+            on_click: None,
+        }
+    }
+
+    /// Sets the visible label.
+    pub fn label<L>(mut self, label: L) -> Self
+    where
+        L: Into<SharedString>,
+    {
+        self.label = Some(label.into());
+        self
+    }
+
+    /// Sets the URL the link opens through the platform.
+    pub fn href<U>(mut self, href: U) -> Self
+    where
+        U: Into<SharedString>,
+    {
+        self.href = Some(href.into());
+        self
+    }
+
+    /// Renders the link inert, unfocusable, and dimmed; disabled always wins.
+    pub fn disabled(mut self, disabled: bool) -> Self {
+        self.disabled = disabled;
+        self
+    }
+
+    /// Overrides the accessibility label, which defaults to the visible label.
+    pub fn accessibility_label<L>(mut self, label: L) -> Self
+    where
+        L: Into<SharedString>,
+    {
+        self.a11y_label = Some(label.into());
+        self
+    }
+
+    /// Replaces the default `href` opening with this handler.
+    pub fn on_click<F>(mut self, handler: F) -> Self
+    where
+        F: Fn(&ClickEvent, &mut Window, &mut App) + 'static,
+    {
+        self.on_click = Some(Box::new(handler));
+        self
+    }
+}
+
+impl RenderOnce for Link {
+    fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement {
+        let theme = cx.theme();
+        let colors = theme.colors;
+        let ramps = theme.ramps;
+        let on_click = self.on_click;
+        let href = self.href;
+        let a11y_label = self.a11y_label.or_else(|| self.label.clone());
+
+        h_flex()
+            .id(self.id)
+            .text_sm()
+            .text_color(colors.accent)
+            .underline()
+            .role(Role::Link)
+            .when_some(a11y_label, |link, label| link.aria_label(label))
+            .when(self.disabled, |link| link.opacity(0.5))
+            .when(!self.disabled, |link| {
+                link.cursor_pointer()
+                    .focusable()
+                    .tab_stop(true)
+                    .hover(move |style| style.text_color(ramps.primary.hover))
+                    .focus_visible(|style| {
+                        style.shadow(vec![
+                            BoxShadow::new(px(0.), px(0.), colors.ring).spread_radius(px(3.)),
+                        ])
+                    })
+                    .on_click(move |event, window, cx| match on_click.as_ref() {
+                        Some(on_click) => on_click(event, window, cx),
+                        None => {
+                            if let Some(href) = href.as_ref() {
+                                cx.open_url(href);
+                            }
+                        }
+                    })
+            })
+            .when_some(self.label, |link, label| link.child(label))
+    }
+}

crates/core/src/toggle.rs

@@ -0,0 +1,128 @@
+use gpui::prelude::FluentBuilder as _;
+use gpui::{
+    App, BoxShadow, ElementId, InteractiveElement as _, IntoElement, ParentElement as _,
+    RenderOnce, Role, SharedString, StatefulInteractiveElement as _, Styled as _, Toggled, Window,
+    px,
+};
+use gpui_native_theme::ActiveTheme as _;
+
+use crate::common::h_flex;
+
+/// The change handler, fired with the next pressed state.
+type ChangeHandler = Box<dyn Fn(bool, &mut Window, &mut App)>;
+
+/// A toggle component.
+#[derive(IntoElement)]
+pub struct Toggle {
+    id: ElementId,
+    label: Option<SharedString>,
+    pressed: bool,
+    disabled: bool,
+    a11y_label: Option<SharedString>,
+    on_change: Option<ChangeHandler>,
+}
+
+impl Toggle {
+    /// Creates an unpressed toggle.
+    pub fn new<I>(id: I) -> Self
+    where
+        I: Into<ElementId>,
+    {
+        Self {
+            id: id.into(),
+            label: None,
+            pressed: false,
+            disabled: false,
+            a11y_label: None,
+            on_change: None,
+        }
+    }
+
+    /// Sets the visible label.
+    pub fn label<L>(mut self, label: L) -> Self
+    where
+        L: Into<SharedString>,
+    {
+        self.label = Some(label.into());
+        self
+    }
+
+    /// Sets the current pressed state; the toggle never owns it.
+    pub fn pressed(mut self, pressed: bool) -> Self {
+        self.pressed = pressed;
+        self
+    }
+
+    /// Renders the toggle inert, unfocusable, and dimmed; disabled always wins.
+    pub fn disabled(mut self, disabled: bool) -> Self {
+        self.disabled = disabled;
+        self
+    }
+
+    /// Overrides the accessibility label, which defaults to the visible label.
+    pub fn accessibility_label<L>(mut self, label: L) -> Self
+    where
+        L: Into<SharedString>,
+    {
+        self.a11y_label = Some(label.into());
+        self
+    }
+
+    /// Sets the change handler, fired with the next pressed state.
+    pub fn on_change<F>(mut self, handler: F) -> Self
+    where
+        F: Fn(bool, &mut Window, &mut App) + 'static,
+    {
+        self.on_change = Some(Box::new(handler));
+        self
+    }
+}
+
+impl RenderOnce for Toggle {
+    fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement {
+        let theme = cx.theme();
+        let colors = theme.colors;
+        let ramps = theme.ramps;
+        let on_change = self.on_change;
+        let next = !self.pressed;
+        let a11y_label = self.a11y_label.or_else(|| self.label.clone());
+
+        h_flex()
+            .id(self.id)
+            .justify_center()
+            .h_7()
+            .px_3()
+            .rounded(theme.radius.control)
+            .text_sm()
+            .text_color(colors.foreground)
+            .role(Role::Button)
+            .when_some(a11y_label, |toggle, label| toggle.aria_label(label))
+            .aria_toggled(Toggled::from(self.pressed))
+            .when(self.pressed, |toggle| {
+                toggle
+                    .bg(ramps.secondary.hover)
+                    .hover(|style| style.bg(ramps.secondary.pressed))
+            })
+            .when(!self.pressed, |toggle| {
+                toggle
+                    .hover(|style| style.bg(colors.muted))
+                    .active(|style| style.bg(ramps.secondary.hover))
+            })
+            .when(self.disabled, |toggle| toggle.opacity(0.5))
+            .when(!self.disabled, |toggle| {
+                toggle
+                    .cursor_pointer()
+                    .focusable()
+                    .tab_stop(true)
+                    .focus_visible(|style| {
+                        style.shadow(vec![
+                            BoxShadow::new(px(0.), px(0.), colors.ring).spread_radius(px(3.)),
+                        ])
+                    })
+                    .when_some(on_change, |toggle, on_change| {
+                        toggle.on_click(move |_, window, cx| on_change(next, window, cx))
+                    })
+            })
+            .when_some(self.label, |toggle, label| toggle.child(label))
+    }
+}