jsakamoto / BlazingStory

The clone of "Storybook" for Blazor, a frontend workshop for building UI components and pages in isolation.
https://jsakamoto.github.io/BlazingStory/
Mozilla Public License 2.0
319 stars 15 forks source link

RenderFragments as a Component Parameter #19

Open Kristianfriis opened 1 year ago

Kristianfriis commented 1 year ago

Hey there, First of, big thanks for bringing Storybook to Blazor.

I am having a usecase where a button component has a RenderFragtment for ChildComponents. This is mostly for the text inside a label. I would like to make it possible to insert text in the Controls panel BlazingStory provides, but it is ever only a "-".

image

I am setting up the Story as follows:

<Stories TComponent="AsButton">
    <ArgType For="_=>_!.Look" Control="ControlType.Select" />
    <ArgType For="_=>_!.Icon" Control="ControlType.Select" />
    <ArgType For="_=>_!.IconPosition" Control="ControlType.Select" />
    <ArgType For="_=>_!.TextSize" Control="ControlType.Select" />
    <ArgType For="_=>_!.Color" Control="ControlType.Select" />
    <ArgType For="_=>_!.Block" Control="ControlType.Select" />

    <Story Name="As Button">
        <Arguments>
            <Arg For="_ => _!.Look" Value="AsButtonLook.Active" />
            <Arg For="_ => _!.TextSize" Value="AsFontSizes.One" />
            <Arg For="_ => _!.Icon" Value="AsIcons.Gear" />
            <Arg For="_ => _!.Color" Value="AsTextColors.Default" />
            <Arg For="_ => _!.IconPosition" Value="AsPosition.Default" />
            <Arg For="_ => _!.Block" Value="@false" />
        </Arguments>

        <Template>
            <AsButton
                OnClick="@(OnClick)"
                @attributes="context.Args">
                Test
            </AsButton>
        </Template>
    </Story>

</Stories>
jsakamoto commented 9 months ago

@Kristianfriis Thank you for the proposal. Could you try out the latest version of Blazing Story? I supported RenderFragment in the parameter control UI. And don't forget to check out the document https://github.com/jsakamoto/BlazingStory#configure-component-parameters-which-type-is-renderfragment before you try it.

Thanks!