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
//! # GPUI-RSX
//!
//! 一个为 GPUI 提供 JSX-like 语法的过程宏,让 UI 开发更加简洁和直观。
//!
//! ## 示例
//!
//! ```rust,ignore
//! use gpui::*;
//! use gpui_rsx::rsx;
//!
//! impl Render for MyView {
//! fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
//! rsx! {
//! <div class="flex flex-col gap-4 p-4">
//! <h1>{"Hello GPUI"}</h1>
//! <button
//! bg="blue-500"
//! text="white"
//! px="4"
//! py="2"
//! rounded="md"
//! onClick={cx.listener(|view, _, cx| {
//! println!("clicked");
//! })}
//! >
//! {"Click me"}
//! </button>
//! </div>
//! }
//! }
//! }
//! ```
use TokenStream;
use parse_macro_input;
use generate_code;
use RsxElement;
/// RSX 宏 - 将 HTML-like 语法转换为 GPUI 代码
///
/// # 语法
///
/// ## 基本元素
/// ```ignore
/// rsx! { <div>{"Hello"}</div> }
/// ```
///
/// ## 属性
/// ```ignore
/// rsx! {
/// <div
/// flex
/// flex_col
/// gap={px(16.0)}
/// bg={rgb(0xffffff)}
/// />
/// }
/// ```
///
/// ## 嵌套
/// ```ignore
/// rsx! {
/// <div>
/// <span>{"Item 1"}</span>
/// <span>{"Item 2"}</span>
/// </div>
/// }
/// ```
///
/// ## 表达式
/// ```ignore
/// rsx! {
/// <div>
/// {format!("Count: {}", self.count)}
/// {self.render_child()}
/// </div>
/// }
/// ```
///
/// ## 条件渲染
/// ```ignore
/// rsx! {
/// <div>
/// {if self.show {
/// rsx! { <span>{"Visible"}</span> }
/// } else {
/// rsx! { <span>{"Hidden"}</span> }
/// }}
/// </div>
/// }
/// ```