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
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
//! DOM (Document Object Model) system for widget styling
//!
//! Provides a DOM-like tree structure for CSS selector matching and style cascade.
//! Enables Textual-like CSS styling with full selector support.
//!
//! # Overview
//!
//! The DOM system enables powerful CSS styling:
//!
//! ```css
//! /* Type selectors */
//! Button { background: blue; }
//!
//! /* Class selectors */
//! .primary { color: white; }
//!
//! /* ID selectors */
//! #submit { border: thick; }
//!
//! /* Pseudo-classes */
//! Button:focus { border-color: cyan; }
//! Input:disabled { opacity: 0.5; }
//!
//! /* Combinators */
//! .sidebar > Button { width: 100%; }
//! .card Button.danger { background: red; }
//! ```
//!
//! # Core Components
//!
//! | Component | Description | Use Case |
//! |-----------|-------------|----------|
//! | [`DomNode`] | DOM tree node | Widget metadata and state |
//! | [`DomId`] | Unique node identifier | Tracking nodes |
//! | [`DomRenderer`] | DOM manager | Style resolution and rendering |
//! | [`StyleResolver`] | CSS matcher | Selector matching |
//! | [`Query`] | DOM queries | Finding nodes by selector |
//!
//! # Quick Start
//!
//! ```rust,ignore
//! use revue::prelude::*;
//! use revue::dom::{DomNode, WidgetMeta};
//!
//! // Create a DOM node with metadata
//! let node = DomNode::new(
//! DomId::new(),
//! WidgetMeta::new("Button")
//! .class("primary")
//! .id("submit")
//! );
//! ```
//!
//! # CSS Selector Support
//!
//! ## Supported Selectors
//!
//! | Selector | Example | Matches |
//! |----------|---------|---------|
//! | Type | `Button` | All Button widgets |
//! | Class | `.primary` | Widgets with class "primary" |
//! | ID | `#submit` | Widget with id "submit" |
//! | Universal | `*` | All widgets |
//! | Pseudo-class | `:hover` | Widgets in hover state |
//! | Descendant | `.panel Button` | Buttons inside .panel |
//! | Child | `.panel > Button` | Direct children of .panel |
//!
//! ## Selector Specificity
//!
//! Selectors are ranked by specificity (highest to lowest):
//! 1. ID selectors (`#id`)
//! 2. Class selectors (`.class`)
//! 3. Type selectors (`Button`)
//! 4. Universal selectors (`*`)
//!
//! # DOM Queries
//!
//! ```rust,ignore
//! use revue::dom::Query;
//!
//! // Query nodes by CSS selector
//! let results = Query::new(".primary Button");
//! for node in results.find_all(&dom) {
//! println!("Found button: {:?}", node);
//! }
//!
//! // Query single node
//! if let Some(node) = Query::new("#submit").find_first(&dom) {
//! println!("Found submit button");
//! }
//! ```
//!
//! # Widget Metadata
//!
//! ```rust,ignore
//! use revue::dom::WidgetMeta;
//!
//! let meta = WidgetMeta::new("Button")
//! .id("my-button")
//! .class("primary")
//! .class("large")
//! .state("hover", true)
//! .state("focus", false);
//! ```
//!
//! # Style Resolution
//!
//! The style resolution process:
//! 1. Parse CSS into stylesheet
//! 2. Match selectors to DOM nodes
//! 3. Sort by specificity
//! 4. Apply declarations in order
//! 5. Merge with inline styles
//! 6. Inherit from parent
//!
//! # Performance
//!
//! - DOM nodes use object pooling for efficiency
//! - Style resolution is cached per node
//! - Selector matching uses optimized algorithms
//! - Dirty tracking minimizes recomputation
pub use ;
pub use ;
pub use ;
pub use ;
pub use ;
pub use ;
/// Unique identifier for DOM nodes
pub type NodeId = u64;
/// Generate a unique node ID