UI Inversion

RenderFragments allow you to pass UI snippets as parameters, enabling the creation of highly flexible 'Templated Components'.

1. ChildContent

If you define a property of type RenderFragment named ChildContent, you can nest UI inside your component just like an HTML tag. <MyCard> <h1>Hello</h1> </MyCard>. This is the foundation of structural components like Modals, Cards, and Tabs.

2. Generics and RowTemplates

You can create a generic Grid<TItem> component where the user defines how each row should look. <RowTemplate> <td>@context.Name</td> </RowTemplate>. The @context variable is automatically mapped to TItem, giving you full IntelliSense inside the template.

3. Architect Insight

Q: "How many RenderFragments is too many?"

Architect Answer: "There's no hard limit, but keep it readable. If a component has 10 different templates, it's likely trying to do too much. A good 'Card' might have a Header, Body, and Footer fragment. If you need more, consider splitting the component into smaller, more granular pieces."