leptos_bootstrap/v5/
carousel.rs1use leptos::prelude::*;
2use uuid::Uuid;
3
4#[component]
5pub fn Carousel<'a>(#[prop(optional, into)] class: &'a str, children: Children) -> impl IntoView {
6 let class = format!("carousel slide {}", class);
7 let id = Uuid::new_v4();
8 let hash_id = format!("#{}", id);
9 view! {
10 <div id=id.to_string() class=class>
11 <div class="carousel-inner">
12 {children()}
13 </div>
14 <button class="carousel-control-prev" type="button" data-bs-target=hash_id.clone() data-bs-slide="prev">
15 <span class="carousel-control-prev-icon" aria-hidden="true"></span>
16 <span class="visually-hidden">Previous</span>
17 </button>
18 <button class="carousel-control-next" type="button" data-bs-target=hash_id data-bs-slide="next">
19 <span class="carousel-control-next-icon" aria-hidden="true"></span>
20 <span class="visually-hidden">Next</span>
21 </button>
22 </div>
23 }
24}
25
26#[component]
27pub fn CarouselItem<'a>(
28 #[prop(optional)] active: bool,
29 #[prop(optional, into)] class: &'a str,
30 children: Children,
31) -> impl IntoView {
32 let mut class = format!("carousel-item {}", class);
33 if active {
34 class.push_str(" active");
35 }
36 view! {
37 <div class=class>
38 {children()}
39 </div>
40 }
41}