// AdvancedFeatures.ruitl - Test template for conditional rendering and loops
component AdvancedFeatures {
props {
title: String,
items: Vec<String>,
show_header: bool = true,
user_role: String = "guest",
count: usize = 0,
}
}
ruitl AdvancedFeatures(title: String, items: Vec<String>, show_header: bool, user_role: String, count: usize) {
<div class="advanced-features">
if show_header {
<header class="header">
<h1>{title}</h1>
if user_role == "admin" {
<span class="badge admin">Administrator</span>
} else {
<span class="badge user">User</span>
}
</header>
}
<main class="content">
if count > 0 {
<p>You have {count} items to display:</p>
if !items.is_empty() {
<ul class="item-list">
for item in items {
<li class="item">
<span class="item-text">{item}</span>
if user_role == "admin" {
<button class="delete-btn">Delete</button>
}
</li>
}
</ul>
} else {
<p class="empty-message">No items available</p>
}
} else {
<div class="welcome">
<h2>Welcome!</h2>
<p>Get started by adding some items.</p>
</div>
}
</main>
<footer class="footer">
<p>
if count == 1 {
<span>You have 1 item</span>
} else {
<span>You have {count} items</span>
}
</p>
if user_role == "admin" {
<div class="admin-controls">
<button class="btn btn-primary">Add Item</button>
<button class="btn btn-secondary">Manage Users</button>
</div>
}
</footer>
</div>
}