sycamore icon indicating copy to clipboard operation
sycamore copied to clipboard

Allow child props to work with parent component that uses empty parenthesis

Open Innominus opened this issue 2 years ago • 0 comments

Currently, when you try to use a parent component with empty parenthesis and a child as a singular prop, it will give you the following error: "expected a valid node"

A simple code example:

use sycamore::prelude::*;


#[derive(Prop)]
pub struct Props<'a, G: Html> {
    children: Children<'a, G>,
}

#[component]
pub fn DrawerOverlay<'a, G: Html>(
    cx: Scope<'a>,
    props: Props<'a, G>,
) -> View<G> {
    let children = props.children.call(cx);
    view! { cx,
        (children)
    }
}

#[component]
pub fn TitleBar<G: Html>(
    cx: Scope,
) -> View<G> {
    view! { cx,
        "Title bar"
    }
}
use examples::sub_component::{DrawerOverlay, TitleBar};
use sycamore::prelude::*;

mod examples;

#[component]
fn App<G: Html>(cx: Scope<'_>) -> View<G> {
    view! { cx,
        // Component with sub item
        h1 {"Sub component"}
        DrawerOverlay() {
            div(class="w-full h-full flex flex-col items-center") {
                TitleBar
                div {
                    "Home!"
                }
            }
        }
    }
}

fn main() {
    sycamore::render(|cx| {
        view! { cx,
            App {}
        }
    });
}

The example errors when calling:

DrawerOverlay() {(child elements)} 

This works if you omit the parenthesis:

DrawerOverlay {(child elements)}

Repository with reproduced error here: https://github.com/Innominus/sycamore-child-error

Version: Sycamore - Master

Innominus avatar Sep 30 '22 07:09 Innominus