ant-design-blazor/components/menu/SubMenu.razor

100 lines
4.2 KiB
C#
Raw Normal View History

@namespace AntDesign
@inherits AntDomComponentBase
@using AntDesign.Internal
@{
string prefixCls = $"{RootMenu.PrefixCls}-submenu";
}
@if (RootMenu.InternalMode == MenuMode.Inline)
{
feat(module: overlay): OverlayTrigger not bound to a div (#937) * feat(module:overlay): OverlayTrigger not bound to a div * feat(module:overlay): OverlayTrigger not bound to a div * feat(module:overlay): Logic transfer to single Overlay * feat(module:overlay): remove obsolete duplication * feat(module:Tooltip): Add for unbounded oncontextmenu event handler * feat(module:tooltip): unbound js event listeners remove * docs(module:tooltip): unbound explanation * fix(module:button): attach Ref to top level html element @ref * feat(module:dropdown&tooltip&popconfirm&popover): Overlay not bound to a div * docs(module:dropdown&tooltip&popconfirm&popover): unbound explanation * feat(module:OverlayTrigger): common logic relocation * feat(module:overlaytrigger): Overlay not bound to a div * feat(module:DatePicker): Overlay not bound to a div * feat(module:select): Overlay not boud to div * fix(module:select): onclickarrow event relocation * fix(module:select): rename Show to OnArrowClick * feat(module:avatar): Overlay not bound to a div * docs(module:avatar): demo switch to unbound version * feat(module:autocomplete): partial OverlayTrigger not bound to a div * feat(module:slider): tooltip * docs(module:slider): tooltip * fix(module:overlay): add SetVisible method * feat: set Ref where missing, performance components register Ref when missing IsFixed flag for CascadeValue changed hard-code sequence numbers when using RenderTreeBuilder Rate component use Tooltip Unbound version Tabs test fix * fix: revert changes (accidental) * feat(module:upload): tooltip with unbound usage * feat(module:table): column use of unbound tooltip * feat(module:autocomplete):overlay unbound from div * fix(module:upload): missing div restore Co-authored-by: James Yeung <shunjiey@hotmail.com>
2021-01-21 17:20:10 +08:00
<li class="@ClassMapper.Class" role="menuitem" @key="Key" style="position:relative;@Style" @ref="Ref">
<div class="@(prefixCls)-title" style="@PaddingStyle" role="button" @onclick="HandleOnTitleClick" aria-haspopup="true">
<span class="ant-menu-title-content">
@if (TitleTemplate != null)
{
@TitleTemplate
}
else if (Title != null)
{
@Title
}
</span>
<i class="@(prefixCls)-arrow"></i>
</div>
<ul direction="ltr" class="@SubMenuMapper.Class" role="menu" aria-expanded="@IsOpen">
feat(module: overlay): OverlayTrigger not bound to a div (#937) * feat(module:overlay): OverlayTrigger not bound to a div * feat(module:overlay): OverlayTrigger not bound to a div * feat(module:overlay): Logic transfer to single Overlay * feat(module:overlay): remove obsolete duplication * feat(module:Tooltip): Add for unbounded oncontextmenu event handler * feat(module:tooltip): unbound js event listeners remove * docs(module:tooltip): unbound explanation * fix(module:button): attach Ref to top level html element @ref * feat(module:dropdown&tooltip&popconfirm&popover): Overlay not bound to a div * docs(module:dropdown&tooltip&popconfirm&popover): unbound explanation * feat(module:OverlayTrigger): common logic relocation * feat(module:overlaytrigger): Overlay not bound to a div * feat(module:DatePicker): Overlay not bound to a div * feat(module:select): Overlay not boud to div * fix(module:select): onclickarrow event relocation * fix(module:select): rename Show to OnArrowClick * feat(module:avatar): Overlay not bound to a div * docs(module:avatar): demo switch to unbound version * feat(module:autocomplete): partial OverlayTrigger not bound to a div * feat(module:slider): tooltip * docs(module:slider): tooltip * fix(module:overlay): add SetVisible method * feat: set Ref where missing, performance components register Ref when missing IsFixed flag for CascadeValue changed hard-code sequence numbers when using RenderTreeBuilder Rate component use Tooltip Unbound version Tabs test fix * fix: revert changes (accidental) * feat(module:upload): tooltip with unbound usage * feat(module:table): column use of unbound tooltip * feat(module:autocomplete):overlay unbound from div * fix(module:upload): missing div restore Co-authored-by: James Yeung <shunjiey@hotmail.com>
2021-01-21 17:20:10 +08:00
<CascadingValue Value="this" IsFixed="@true">
@ChildContent
</CascadingValue>
</ul>
</li>
}
else if (RootMenu.InlineCollapsed || RootMenu.InternalMode == MenuMode.Horizontal || Level == 0)
{
if (Placement == null)
{
Placement = (RootMenu.Mode == MenuMode.Horizontal && Parent == null) ? AntDesign.Placement.BottomLeft : AntDesign.Placement.RightTop;
}
<CascadingValue Value="this" Name="SubMenu" IsFixed>
<CascadingValue Value="@prefixCls" Name="PrefixCls" IsFixed>
<SubMenuTrigger @ref="_overlayTrigger"
TriggerClass="@ClassMapper.Class"
Visible="IsOpen"
ComplexAutoCloseAndVisible="true"
BoundaryAdjustMode="@TriggerBoundaryAdjustMode.None"
Disabled="Disabled"
Placement="Placement.Value"
OnVisibleChange="OnOverlayVisibleChange"
OnOverlayHiding="OnOverlayHiding"
Trigger="new Trigger[] { RootMenu?.TriggerSubMenuAction ?? AntDesign.Trigger.Hover }"
OverlayClassName="@PopupClassName"
PlacementCls="@($"{prefixCls}-popup {RootMenu.PrefixCls} {RootMenu.PrefixCls}-{RootMenu.Theme} {prefixCls}-placement-{_placement.Name}")">
<ChildContent>
<div class="@(prefixCls)-title" role="button">
<span class="ant-menu-title-content">
@if (TitleTemplate != null)
{
@TitleTemplate
}
else if (Title != null)
{
@Title
}
</span>
@GetArrow()
</div>
</ChildContent>
<Overlay>
<ul direction="ltr" class="@(SubMenuMapper.Class)" style="@_popupMinWidthStyle" role="menu">
<CascadingValue Value="this" IsFixed="@true">
@ChildContent
</CascadingValue>
</ul>
</Overlay>
</SubMenuTrigger>
</CascadingValue>
</CascadingValue>
}
@code
{
private RenderFragment GetArrow()
{
string prefixCls = $"{RootMenu.PrefixCls}-submenu";
if (RootMenu.PrefixCls.Contains("dropdown"))
{
return @<span class="@(prefixCls)-expand-icon">
<span role="img" aria-label="right" class="anticon anticon-right @(prefixCls)-arrow-icon">
<svg viewBox="64 64 896 896" focusable="false" class="" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true">
<path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"></path>
</svg>
</span>
</span>;
}
else if (Parent is AntDesign.SubMenu || RootMenu.Mode == MenuMode.Vertical)
{
return @<i class="@(prefixCls)-arrow"></i>;
}
return default;
}
}