1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
//! # Theme System Module
//!
//! Comprehensive theming system inspired by shadcn/ui, providing consistent design tokens
//! and automatic light/dark mode support across all components.
//! ## Architecture
//!
//! ### Design Tokens (`tokens.rs`)
//! - **Colors**: Semantic color palette with light/dark variants
//! - **Typography**: Font families, sizes, and weights
//! - **Spacing**: Consistent spacing scale for layouts
//! - **Border Radius**: Standardized corner radius values
//! - **Shadows**: Elevation system for depth and hierarchy
//!
//! ### Theme Management (`theme.rs`)
//! - **Theme Variants**: Light and dark mode configurations
//! - **Global State**: Thread-safe theme storage and access
//! - **Runtime Switching**: Dynamic theme changes without restart
//!
//! ## Color System
//!
//! Colors follow semantic naming conventions:
//! - `primary` / `primary_foreground`: Main brand colors
//! - `secondary` / `secondary_foreground`: Supporting colors
//! - `muted` / `muted_foreground`: Subtle, less prominent colors
//! - `accent` / `accent_foreground`: Highlight colors for interactions
//! - `destructive`: Error and danger states
//! - `background` / `foreground`: Base canvas colors
//!
//! ## Usage Patterns
//!
//! ```rust,ignore
//! // Initialize theme at app startup
//! fn init_app(cx: &mut App) {
//! theme::install_theme(cx, theme::Theme::dark());
//! kael_ui::init(cx);
//! }
//!
//! // Access theme in components
//! fn render(cx: &mut App) -> impl IntoElement {
//! let theme = use_theme();
//!
//! div()
//! .bg(theme.tokens.primary)
//! .text_color(theme.tokens.primary_foreground)
//! .child("Themed content")
//! }
//!
//! // Switch themes dynamically
//! fn toggle_theme(cx: &mut App) {
//! let current = use_theme();
//! let new_theme = match current.variant {
//! ThemeVariant::Light => Theme::dark(),
//! ThemeVariant::Dark => Theme::light(),
//! };
//! install_theme(cx, new_theme);
//! }
//! ```
//!
//! ## Design Decisions
//!
//! - **shadcn/ui Compatibility**: Token names and values match shadcn/ui specifications
//! - **Performance**: Global static storage minimizes allocation overhead
//! - **Thread Safety**: Mutex-protected global state for multi-threaded access
//! - **Extensibility**: Easy to add new theme variants or custom tokens
//! - **Consistency**: All components automatically use theme tokens
//!
pub use ;
pub use ThemeTokens;