mirror of
https://github.com/adoyle0/thaw.git
synced 2025-03-13 05:59:49 -04:00
🦄 refactor: option_comp
This commit is contained in:
parent
a6e30e38a0
commit
e0c21b5f28
3 changed files with 27 additions and 48 deletions
|
@ -82,7 +82,7 @@ pub fn Button(
|
||||||
<Icon icon=icon style=icon_style/>
|
<Icon icon=icon style=icon_style/>
|
||||||
}
|
}
|
||||||
}/>
|
}/>
|
||||||
<OptionComp value=children view=move |cx, children| {
|
<OptionComp value=children view=|cx, children| {
|
||||||
children(cx).into_view(cx)
|
children(cx).into_view(cx)
|
||||||
}/>
|
}/>
|
||||||
</button>
|
</button>
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
use crate::utils::mount_style::mount_style;
|
use crate::{components::*, utils::mount_style::mount_style};
|
||||||
use leptos::*;
|
use leptos::*;
|
||||||
use stylers::style_sheet_str;
|
use stylers::style_sheet_str;
|
||||||
|
|
||||||
#[component]
|
#[component]
|
||||||
pub fn Card(
|
pub fn Card(
|
||||||
cx: Scope,
|
cx: Scope,
|
||||||
#[prop(default = None)] title: Option<String>,
|
#[prop(optional)] title: MaybeSignal<String>,
|
||||||
#[prop(default = None)] header: Option<Children>,
|
#[prop(default = None)] header: Option<Children>,
|
||||||
#[prop(default = None)] header_extra: Option<Children>,
|
#[prop(default = None)] header_extra: Option<Children>,
|
||||||
children: Children,
|
children: Children,
|
||||||
|
@ -16,41 +16,25 @@ pub fn Card(
|
||||||
cx, class=class_name,
|
cx, class=class_name,
|
||||||
<div class="melt-card">
|
<div class="melt-card">
|
||||||
{
|
{
|
||||||
if header.is_some() || title.is_some() {
|
if header.is_some() || title.get().is_empty() {
|
||||||
view! {
|
view! {
|
||||||
cx, class=class_name,
|
cx, class=class_name,
|
||||||
<div class="melt-card__header">
|
<div class="melt-card__header">
|
||||||
<div class="melt-card__header-content">
|
<div class="melt-card__header-content">
|
||||||
{
|
<OptionComp value=header view=|cx, header| {
|
||||||
if let Some(header) = header {
|
header(cx).into_view(cx)
|
||||||
view! {
|
}>
|
||||||
cx,
|
{ title.get() }
|
||||||
<>
|
</OptionComp>
|
||||||
{ header(cx) }
|
|
||||||
</>
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
view! {
|
|
||||||
cx,
|
|
||||||
<>
|
|
||||||
{ title }
|
|
||||||
</>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</div>
|
</div>
|
||||||
{
|
<OptionComp value=header_extra view=move |cx, header_extra| {
|
||||||
if let Some(header_extra) = header_extra {
|
view! {
|
||||||
view! {
|
cx, class=class_name,
|
||||||
cx, class=class_name,
|
<div class="melt-card__header-extra">
|
||||||
<div class="melt-card__header-extra">
|
{ header_extra(cx)}
|
||||||
{ header_extra(cx)}
|
</div>
|
||||||
</div>
|
|
||||||
}.into()
|
|
||||||
} else {
|
|
||||||
None
|
|
||||||
}
|
}
|
||||||
}
|
}/>
|
||||||
</div>
|
</div>
|
||||||
}.into()
|
}.into()
|
||||||
} else {
|
} else {
|
||||||
|
@ -60,18 +44,14 @@ pub fn Card(
|
||||||
<div class="melt-card__content">
|
<div class="melt-card__content">
|
||||||
{ children(cx) }
|
{ children(cx) }
|
||||||
</div>
|
</div>
|
||||||
{
|
<OptionComp value=footer view=move |cx, footer| {
|
||||||
if let Some(footer) = footer {
|
view! {
|
||||||
view! {
|
cx, class=class_name,
|
||||||
cx, class=class_name,
|
<div class="melt-card__footer">
|
||||||
<div class="melt-card__footer">
|
{ footer(cx) }
|
||||||
{ footer(cx) }
|
</div>
|
||||||
</div>
|
|
||||||
}.into()
|
|
||||||
} else {
|
|
||||||
None
|
|
||||||
}
|
}
|
||||||
}
|
}/>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,3 @@
|
||||||
use super::Fallback;
|
|
||||||
use leptos::*;
|
use leptos::*;
|
||||||
|
|
||||||
#[component]
|
#[component]
|
||||||
|
@ -6,16 +5,16 @@ pub fn OptionComp<T, VF, IV>(
|
||||||
cx: Scope,
|
cx: Scope,
|
||||||
value: Option<T>,
|
value: Option<T>,
|
||||||
view: VF,
|
view: VF,
|
||||||
#[prop(optional)] fallback: Option<Fallback>,
|
#[prop(optional)] children: Option<Children>,
|
||||||
) -> impl IntoView
|
) -> impl IntoView
|
||||||
where
|
where
|
||||||
VF: Fn(Scope, T) -> IV + 'static,
|
VF: FnOnce(Scope, T) -> IV + 'static,
|
||||||
IV: IntoView,
|
IV: IntoView,
|
||||||
{
|
{
|
||||||
if let Some(value) = value {
|
if let Some(value) = value {
|
||||||
view(cx, value).into_view(cx)
|
view(cx, value).into_view(cx)
|
||||||
} else if let Some(fallback) = &fallback {
|
} else if let Some(children) = children {
|
||||||
(fallback.children)(cx).into_view(cx)
|
children(cx).into_view(cx)
|
||||||
} else {
|
} else {
|
||||||
().into_view(cx)
|
().into_view(cx)
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue