8fdef818cc
Iter 6. Cierra el ciclo del theme: ya teníamos paleta themed + widgets que la consumen, faltaba el control UI para rotar entre presets en vivo. Ahora hay un botón yahweh que muestra el theme actual y al click avanza al siguiente. crates/modules/ui_engine/widgets/theme-switcher/: - pub fn theme_switcher(cx: &mut App) -> impl IntoElement: botón clickable con bg=panel_alt, hover=row_hover, label "Tema: <name> ▸". Al click hace Theme::set(cx, Theme::next_after(current.name)). - 2 tests #[gpui::test]: smoke + verificación de cambio de global. - Dev-dep gpui con test-support. Migración: - nakui-explorer: header pasa a flex_row con label flex_grow + switcher alineado derecha. - yahweh-widget-meta-form (sidebar): mismo pattern en el header "Nakui" del sidebar. Tests stack: 115 → 117. Beneficio: click cambia toda la paleta en vivo. 6 presets disponibles (Nebula, Aurora, Sunset, Flat Dark, Solarized Light, High Contrast) ciclables circularmente. Limitación: TextInput entities tienen colors hardcoded; migrar text_input al theme es iter futura. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
92 lines
3.2 KiB
Rust
92 lines
3.2 KiB
Rust
//! `yahweh-widget-theme-switcher` — botón clickable para ciclar
|
|
//! entre los presets de `Theme`.
|
|
//!
|
|
//! El botón muestra el nombre del theme actual; al click avanza al
|
|
//! siguiente preset según [`Theme::next_after`] (rotación circular
|
|
//! sobre [`Theme::all`]).
|
|
//!
|
|
//! El cambio se aplica con `Theme::set(cx, ...)` que invalida el
|
|
//! global y dispara redraws en todos los widgets que observan el
|
|
//! theme via `cx.observe_global::<Theme>()`. Para widgets que NO
|
|
//! observan el theme (ej. los themed wrappers de banner/card en su
|
|
//! versión actual, que leen el theme dentro de `render`), basta con
|
|
//! que el render se vuelva a invocar — esto sucede automáticamente
|
|
//! tras `cx.set_global` que marca todos los views como dirty.
|
|
//!
|
|
//! # Uso
|
|
//!
|
|
//! ```ignore
|
|
//! use yahweh_widget_theme_switcher::theme_switcher;
|
|
//!
|
|
//! // Adentro de Render::render:
|
|
//! let switcher = theme_switcher(cx);
|
|
//! header.child(switcher)
|
|
//! ```
|
|
|
|
#![forbid(unsafe_code)]
|
|
|
|
use gpui::{div, prelude::*, px, App, ClickEvent, IntoElement, SharedString, Window};
|
|
use yahweh_theme::Theme;
|
|
|
|
/// Construye el switcher: una `Div` clickable con el nombre del
|
|
/// theme actual + flecha indicadora. Al click rota al siguiente
|
|
/// preset.
|
|
///
|
|
/// Estilo: padding consistente con el resto de los chrome controls
|
|
/// del repo (`px(8/4)`), `bg(theme.bg_panel_alt)`, `text_color(fg_text)`.
|
|
/// Sin border, hover sutil con `bg_row_hover`.
|
|
///
|
|
/// El handler del click usa `cx.update_global::<Theme>` para
|
|
/// reemplazar el theme global; los widgets que leen
|
|
/// `Theme::global` en su próximo render verán el nuevo.
|
|
pub fn theme_switcher(cx: &mut App) -> impl IntoElement {
|
|
let theme = Theme::global(cx).clone();
|
|
let label = format!("Tema: {} ▸", theme.name);
|
|
|
|
div()
|
|
.id("yahweh-theme-switcher")
|
|
.px(px(8.))
|
|
.py(px(4.))
|
|
.bg(theme.bg_panel_alt.clone())
|
|
.text_color(theme.fg_text)
|
|
.text_size(px(11.))
|
|
.rounded(px(3.))
|
|
.hover(move |d| d.bg(theme.bg_row_hover))
|
|
.child(SharedString::from(label))
|
|
.on_click(|_event: &ClickEvent, _window: &mut Window, cx: &mut App| {
|
|
let current_name = Theme::global(cx).name;
|
|
let next = Theme::next_after(current_name);
|
|
Theme::set(cx, next);
|
|
})
|
|
}
|
|
|
|
#[cfg(test)]
|
|
mod tests {
|
|
use super::*;
|
|
use gpui::TestAppContext;
|
|
|
|
#[gpui::test]
|
|
fn switcher_constructs_with_theme_installed(cx: &mut TestAppContext) {
|
|
cx.update(|cx| {
|
|
Theme::install_default(cx);
|
|
let _div = theme_switcher(cx);
|
|
// Smoke: si llegamos aquí sin panic, el constructor lee
|
|
// el global, deriva colors, y construye un Div.
|
|
});
|
|
}
|
|
|
|
#[gpui::test]
|
|
fn theme_set_changes_global(cx: &mut TestAppContext) {
|
|
cx.update(|cx| {
|
|
Theme::install_default(cx);
|
|
let initial_name = Theme::global(cx).name;
|
|
// Ciclo manual sin pasar por el handler del click.
|
|
let next = Theme::next_after(initial_name);
|
|
Theme::set(cx, next.clone());
|
|
let after = Theme::global(cx).name;
|
|
assert_eq!(after, next.name);
|
|
assert_ne!(after, initial_name, "el ciclo debe cambiar el name");
|
|
});
|
|
}
|
|
}
|