reya/coop
1
0
Fork 0
Code Issues Pull Requests Releases Activity

wip: refactor tabs

Browse Source
This commit is contained in:
Ren Amamiya
2026-03-11 16:30:21 +07:00
parent affb339237
commit 4aabab3e4e
29 changed files with 130 additions and 171 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
crates/ui/src/tab/mod.rs
View File

@@ -1,11 +1,11 @@
use gpui::prelude::FluentBuilder;
use gpui::{
div, px, AnyElement, App, Div, InteractiveElement, IntoElement, MouseButton, ParentElement,
RenderOnce, StatefulInteractiveElement, Styled, Window,
AnyElement, App, Div, InteractiveElement, IntoElement, MouseButton, ParentElement, RenderOnce,
StatefulInteractiveElement, Styled, Window, div, px,
};
use theme::{ActiveTheme, TABBAR_HEIGHT};
use crate::{Selectable, Sizable, Size};
use crate::{Selectable, Sizable, Size, h_flex};
pub mod tab_bar;
@@ -106,59 +106,44 @@ impl Sizable for Tab {
impl RenderOnce for Tab {
fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement {
let (text_color, hover_text_color, bg_color, border_color) =
match (self.selected, self.disabled) {
(true, false) => (
cx.theme().tab_active_foreground,
cx.theme().tab_hover_foreground,
cx.theme().tab_active_background,
cx.theme().border,
),
(false, false) => (
cx.theme().tab_inactive_foreground,
cx.theme().tab_hover_foreground,
cx.theme().ghost_element_background,
cx.theme().border_transparent,
),
(true, true) => (
cx.theme().tab_inactive_foreground,
cx.theme().tab_hover_foreground,
cx.theme().ghost_element_background,
cx.theme().border_disabled,
),
(false, true) => (
cx.theme().tab_inactive_foreground,
cx.theme().tab_hover_foreground,
cx.theme().ghost_element_background,
cx.theme().border_disabled,
),
};
let (text_color, bg_color) = match (self.selected, self.disabled) {
(true, false) => (
cx.theme().tab_active_foreground,
cx.theme().tab_active_background,
),
(false, false) => (cx.theme().tab_foreground, cx.theme().tab_background),
(true, true) => (cx.theme().text_muted, cx.theme().tab_background),
(false, true) => (cx.theme().text_placeholder, cx.theme().tab_background),
};
self.base
.id(self.ix)
.h(TABBAR_HEIGHT)
.px_4()
.group("")
.relative()
.flex()
.items_center()
.flex_shrink_0()
.cursor_pointer()
.overflow_hidden()
.text_xs()
.text_ellipsis()
.text_color(text_color)
.bg(bg_color)
.border_l(px(1.))
.border_r(px(1.))
.border_color(border_color)
.when(!self.selected && !self.disabled, |this| {
this.hover(|this| this.text_color(hover_text_color))
})
.when_some(self.prefix, |this, prefix| {
this.child(prefix).text_color(text_color)
})
.when_some(self.label, |this, label| this.child(label))
.when_some(self.suffix, |this, suffix| this.child(suffix))
.child(
h_flex()
.h(TABBAR_HEIGHT - px(8.))
.px_1()
.text_xs()
.text_ellipsis()
.text_color(text_color)
.bg(bg_color)
.rounded(cx.theme().radius)
.when(cx.theme().shadow && self.selected, |this| this.shadow_xs())
.when_some(self.prefix, |this, prefix| this.child(prefix))
.when_some(self.label, |this, label| this.child(label))
.when_some(self.suffix, |this, suffix| {
this.child(
div()
.pl_4()
.invisible()
.group_hover("", |this| this.visible())
.child(suffix),
)
}),
)
.on_mouse_down(MouseButton::Left, |_ev, _window, cx| {
cx.stop_propagation();
})