2023-06-15 18:02:21 +08:00
|
|
|
use super::use_tabs;
|
|
|
|
use crate::utils::mount_style::mount_style;
|
|
|
|
use leptos::*;
|
|
|
|
use stylers::style_sheet_str;
|
|
|
|
|
|
|
|
#[derive(Clone)]
|
|
|
|
pub(crate) struct TabOptions {
|
|
|
|
pub key: &'static str,
|
|
|
|
pub label: &'static str,
|
|
|
|
}
|
|
|
|
|
|
|
|
#[component]
|
2023-08-29 09:11:22 +08:00
|
|
|
pub fn Tab(key: &'static str, label: &'static str, children: Children) -> impl IntoView {
|
2023-06-15 18:02:21 +08:00
|
|
|
let class_name = mount_style("tab", || style_sheet_str!("./src/tabs/tab.css"));
|
2023-08-29 09:11:22 +08:00
|
|
|
let tabs = use_tabs();
|
2023-06-15 18:02:21 +08:00
|
|
|
tabs.push_tab_options(TabOptions { key, label });
|
2023-08-29 09:11:22 +08:00
|
|
|
view! { class=class_name,
|
2023-06-15 18:02:21 +08:00
|
|
|
<div class="melt-tab" class=("melt-tab--hidden", move || key != tabs.get_key()) >
|
2023-08-29 09:11:22 +08:00
|
|
|
{ children() }
|
2023-06-15 18:02:21 +08:00
|
|
|
</div>
|
|
|
|
}
|
|
|
|
}
|