ruitl 0.2.1

Template compiler for type-safe, server-rendered HTML components in Rust
Documentation 
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

//! Hello World example for RUITL
//!
//! This example demonstrates the basic capabilities of RUITL including:
//! - Creating components with props
//! - HTML generation
//! - Basic component rendering

use ruitl::prelude::*;

// Define props for our greeting component
#[derive(Debug, Clone, serde::Serialize, serde::Deserialize)]
pub struct GreetingProps {
    pub name: String,
    pub message: Option<String>,
}

impl ComponentProps for GreetingProps {}

// Greeting component
#[derive(Debug)]
pub struct Greeting;

impl Component for Greeting {
    type Props = GreetingProps;

    fn render(&self, props: &Self::Props, _context: &ComponentContext) -> Result<Html> {
        let message = props.message.as_deref().unwrap_or("Hello");

        Ok(Html::Element(
            ruitl::html::div()
                .child(Html::Element(
                    ruitl::html::h1().text(&format!("{}, {}!", message, props.name)),
                ))
                .child(Html::Element(ruitl::html::p().text("Welcome to RUITL!"))),
        ))
    }
}

// Simple page layout component
#[derive(Debug)]
pub struct Layout;

impl Component for Layout {
    type Props = EmptyProps;

    fn render(&self, _props: &Self::Props, _context: &ComponentContext) -> Result<Html> {
        Ok(Html::Element(
            ruitl::html::html()
                .child(Html::Element(ruitl::html::head().child(Html::Element(
                    ruitl::html::HtmlElement::new("title").text("RUITL Hello World"),
                ))))
                .child(Html::Element(
                    ruitl::html::body().child(Html::Element(
                        ruitl::html::div()
                            .child(Html::Element(ruitl::html::h1().text("RUITL Demo")))
                            .child(Html::Element(
                                ruitl::html::p().text("This is a basic RUITL example."),
                            )),
                    )),
                )),
        ))
    }
}

#[tokio::main]
async fn main() -> Result<()> {
    println!("🚀 RUITL Hello World Example");

    // Create greeting component with props
    let greeting = Greeting;
    let greeting_props = GreetingProps {
        name: "World".to_string(),
        message: Some("Hello".to_string()),
    };

    // Render the greeting component
    let context = ComponentContext::new();
    let greeting_html = greeting.render(&greeting_props, &context)?;
    println!("Greeting HTML: {}", greeting_html.render());

    // Create and render layout component
    let layout = Layout;
    let layout_html = layout.render(&EmptyProps, &context)?;
    println!("Layout HTML: {}", layout_html.render());

    // Demonstrate different greeting messages
    let greetings = vec![("Alice", "Hi"), ("Bob", "Hey"), ("Charlie", "Howdy")];

    for (name, message) in greetings {
        let props = GreetingProps {
            name: name.to_string(),
            message: Some(message.to_string()),
        };
        let html = greeting.render(&props, &context)?;
        println!("{}: {}", name, html.render());
    }

    println!("✅ Example completed successfully!");
    Ok(())
}

#[cfg(test)]
mod tests {
    use super::*;

    #[test]
    fn test_greeting_component() {
        let greeting = Greeting;
        let props = GreetingProps {
            name: "Test".to_string(),
            message: Some("Hi".to_string()),
        };
        let context = ComponentContext::new();

        let result = greeting.render(&props, &context);
        assert!(result.is_ok());

        let html = result.unwrap();
        let rendered = html.render();
        assert!(rendered.contains("Hi, Test!"));
        assert!(rendered.contains("Welcome to RUITL!"));
    }

    #[test]
    fn test_layout_component() {
        let layout = Layout;
        let context = ComponentContext::new();

        let result = layout.render(&EmptyProps, &context);
        assert!(result.is_ok());

        let html = result.unwrap();
        let rendered = html.render();
        assert!(rendered.contains("<html>"));
        assert!(rendered.contains("RUITL Hello World"));
        assert!(rendered.contains("RUITL Demo"));
    }
}