2022-03-06 20:34:20 -05:00
|
|
|
// Copyright 2022 Jeremy Wall
|
|
|
|
//
|
|
|
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
// you may not use this file except in compliance with the License.
|
|
|
|
// You may obtain a copy of the License at
|
|
|
|
//
|
|
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
//
|
|
|
|
// Unless required by applicable law or agreed to in writing, software
|
|
|
|
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
// See the License for the specific language governing permissions and
|
|
|
|
// limitations under the License.
|
|
|
|
use sycamore::prelude::*;
|
2022-10-29 10:15:22 -04:00
|
|
|
use tracing::debug;
|
2022-03-06 20:34:20 -05:00
|
|
|
|
2022-10-30 18:39:05 -04:00
|
|
|
#[derive(Prop)]
|
|
|
|
pub struct TabState<'a, G: Html> {
|
|
|
|
pub children: Children<'a, G>,
|
2022-10-29 10:15:22 -04:00
|
|
|
pub selected: Option<String>,
|
2022-10-30 18:39:05 -04:00
|
|
|
tablist: Vec<(&'static str, &'static str)>,
|
2022-03-06 20:34:20 -05:00
|
|
|
}
|
|
|
|
|
2022-09-25 17:04:46 -04:00
|
|
|
#[component]
|
2022-10-30 18:39:05 -04:00
|
|
|
pub fn TabbedView<'a, G: Html>(cx: Scope<'a>, state: TabState<'a, G>) -> View<G> {
|
|
|
|
let TabState {
|
|
|
|
children,
|
|
|
|
selected,
|
|
|
|
tablist,
|
|
|
|
} = state;
|
|
|
|
let tablist = create_signal(cx, tablist.clone());
|
|
|
|
let children = children.call(cx);
|
2022-09-25 17:04:46 -04:00
|
|
|
view! {cx,
|
2022-10-29 10:15:22 -04:00
|
|
|
nav {
|
|
|
|
ul(class="tabs") {
|
|
|
|
Indexed(
|
|
|
|
iterable=tablist,
|
|
|
|
view=move |cx, (href, show)| {
|
|
|
|
debug!(?selected, show, "identifying tab");
|
|
|
|
let class = if selected.as_ref().map_or(false, |selected| selected == show) {
|
|
|
|
"no-print selected"
|
|
|
|
} else {
|
|
|
|
"no-print"
|
|
|
|
};
|
|
|
|
view! {cx,
|
|
|
|
li(class=class) { a(href=href) { (show) } }
|
|
|
|
}
|
2022-03-23 20:26:58 -04:00
|
|
|
}
|
2022-10-29 10:15:22 -04:00
|
|
|
)
|
2022-03-23 20:26:58 -04:00
|
|
|
}
|
2022-10-29 10:15:22 -04:00
|
|
|
}
|
2022-03-23 20:26:58 -04:00
|
|
|
main(class=".conatiner-fluid") {
|
2022-10-30 18:39:05 -04:00
|
|
|
(children)
|
2022-03-07 16:22:51 -05:00
|
|
|
}
|
2022-09-25 17:04:46 -04:00
|
|
|
}
|
2022-03-06 20:34:20 -05:00
|
|
|
}
|