ant-design-blazor/components/menu/MenuItem.razor
Maksim 2324347ce4
feature(module: tooltip): use TitleTemplate in Tooltip (#2711)
* Use TitleTemplate in Tooltip

* optimize demo

Co-authored-by: James Yeung <shunjiey@hotmail.com>
2022-09-16 14:17:30 +08:00

72 lines
2.2 KiB
C#

@namespace AntDesign
@inherits AntDomComponentBase
<CascadingValue Value="this" IsFixed>
@* There is no need to render the tooltip if there is no inline mode. Tooltip will be only showing menu content if menu is collapsed to icon version && only for root menu *@
@if (RootMenu.Mode == MenuMode.Inline && ParentMenu is null)
{
<Tooltip TitleTemplate="@content(this)" Placement="@Placement.Right" Disabled="TooltipDisabled">
<Unbound Context="tooltip">
<li class="@ClassMapper.Class" role="menuitem" style="@((PaddingLeft>0? $"padding-left:{PaddingLeft}px;":"")+@Style)" @onclick="HandleOnClick" @key="Key" @ref="tooltip.Current">
@icon(this)
<span class="ant-menu-title-content">
@if (RouterLink == null)
{
@content(this)
}
else
{
<MenuLink Href="@RouterLink" Match="@RouterMatch">@content(this)</MenuLink>
}
</span>
</li>
</Unbound>
</Tooltip>
}
else
{
<li class="@ClassMapper.Class" role="menuitem" style="@((PaddingLeft>0? $"padding-left:{PaddingLeft}px;":"")+@Style)" @onclick="HandleOnClick" @key="Key">
@icon(this)
<span class="ant-menu-title-content">
@if (RouterLink == null)
{
@content(this)
}
else
{
<MenuLink Href="@RouterLink" Match="@RouterMatch">@content(this)</MenuLink>
}
</span>
</li>
}
</CascadingValue>
@code {
RenderFragment<MenuItem> content = item =>
@<Template>
@if (item.Title != null)
{
@item.Title
}
else
{
@item.ChildContent
}
</Template>
;
RenderFragment<MenuItem> icon = item =>
@<Template>
@if (item.IconTemplate != null)
{
<span role="img" class=" anticon anticon-container">
@item.IconTemplate
</span>
}
else if (item.Icon != null)
{
<Icon Type="@item.Icon" />
}
</Template>
;
}