feat: resolve highlight binding issue.

src/Ursa.Themes.Semi/Controls/NavMenu.axaml

@@ -26,6 +26,13 @@
                 Grid.Row="0"
                 Background="{TemplateBinding u:NavMenuItem.Background}"
                 CornerRadius="4">
+                <Border.ContextFlyout>
+                    <Flyout>
+                        <Border>
+                            <StackPanel Name="PART_OverflowPanel"></StackPanel>
+                        </Border>
+                    </Flyout>
+                </Border.ContextFlyout>
                 <Grid HorizontalAlignment="Stretch">
                     <Grid.Margin>
                         <MultiBinding Converter="{StaticResource NavMarginConverter}">
@@ -66,54 +73,47 @@
                     </PathIcon>
                 </Grid>
             </Border>
-            <LayoutTransformControl
-                Name="PART_Transform"
+            <ItemsPresenter
+                Name="PART_ItemsPresenter"
                 Grid.Row="1"
                 VerticalAlignment="Top"
-                RenderTransformOrigin="0.5,0">
-                <ItemsPresenter Grid.IsSharedSizeScope="True" ItemsPanel="{Binding ItemsPanel, RelativeSource={RelativeSource TemplatedParent}}" />
-                <LayoutTransformControl.Transitions>
+                Grid.IsSharedSizeScope="True"
+                ItemsPanel="{Binding ItemsPanel, RelativeSource={RelativeSource TemplatedParent}}"
+                RenderTransformOrigin="0.5,0" >
+                <ItemsPresenter.Transitions>
                     <Transitions>
-                        <TransformOperationsTransition Property="LayoutTransform" Duration="0.1" />
+                        <DoubleTransition Property="Height" Duration="0.1"></DoubleTransition>
+                        <TransformOperationsTransition Property="RenderTransform" Duration="0.1" />
                     </Transitions>
-                </LayoutTransformControl.Transitions>
-            </LayoutTransformControl>
+                </ItemsPresenter.Transitions>
+            </ItemsPresenter>
         </Grid>
     </ControlTemplate>
     <ControlTemplate x:Key="TopLevelCollapsedNavMenuItemTemplate" TargetType="u:NavMenuItem">
         <Border
             Name="PART_Border"
-            CornerRadius="4"
             MinWidth="32"
             MinHeight="32"
+            HorizontalAlignment="Left"
             Background="{TemplateBinding u:NavMenuItem.Background}"
-            HorizontalAlignment="Left">
+            CornerRadius="4">
             <Grid>
                 <ContentPresenter
                     Name="PART_IconPresenter"
                     Content="{Binding Icon, RelativeSource={RelativeSource TemplatedParent}}"
                     ContentTemplate="{Binding IconTemplate, RelativeSource={RelativeSource TemplatedParent}}" />
-                <Popup
-                    Name="PART_Popup"
-                    IsLightDismissEnabled="True"
-                    Placement="RightEdgeAlignedTop"
-                    PlacementTarget="{Binding #PART_IconPresenter}">
-                    <Border Theme="{DynamicResource CardBorder}" Grid.IsSharedSizeScope="True" Padding="4">
-                        <ItemsPresenter ItemsPanel="{Binding ItemsPanel, RelativeSource={RelativeSource TemplatedParent}}" />
-                    </Border>
-                </Popup>
             </Grid>
         </Border>
     </ControlTemplate>
     <ControlTemplate x:Key="CollapsedNavMenuItemTemplate" TargetType="u:NavMenuItem">
         <Border
             Name="PART_Border"
-            CornerRadius="4"
             MinWidth="24"
             MinHeight="24"
+            HorizontalAlignment="Stretch"
             Background="{TemplateBinding u:NavMenuItem.Background}"
-            HorizontalAlignment="Stretch">
-            <Grid >
+            CornerRadius="4">
+            <Grid>
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition Width="Auto" SharedSizeGroup="Icon" />
                     <ColumnDefinition Width="*" />
@@ -137,16 +137,19 @@
                     Width="8"
                     Height="8"
                     Margin="12,0"
-                    RenderTransform="rotate(-90deg)"
                     Data="{DynamicResource NavigationMenuItemExpandIconGlyph}"
-                    Foreground="{DynamicResource NavigationMenuItemExpandIconForeground}">
-                </PathIcon>
-                <Popup Grid.Column="0"
+                    Foreground="{DynamicResource NavigationMenuItemExpandIconForeground}"
+                    RenderTransform="rotate(-90deg)" />
+                <Popup
                     Name="PART_Popup"
+                    Grid.Column="0"
                     IsLightDismissEnabled="True"
                     Placement="RightEdgeAlignedTop"
                     PlacementTarget="{Binding #PART_Border}">
-                    <Border Theme="{DynamicResource CardBorder}" Grid.IsSharedSizeScope="True" Padding="4">
+                    <Border
+                        Padding="4"
+                        Grid.IsSharedSizeScope="True"
+                        Theme="{DynamicResource CardBorder}">
                         <ItemsPresenter ItemsPanel="{Binding ItemsPanel, RelativeSource={RelativeSource TemplatedParent}}" />
                     </Border>
                 </Popup>
@@ -154,14 +157,20 @@
         </Border>
     </ControlTemplate>
     <ControlTheme x:Key="{x:Type u:NavMenuItem}" TargetType="u:NavMenuItem">
-        <Setter Property="Background" Value="Transparent"></Setter>
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="ItemsPanel">
+            <ItemsPanelTemplate>
+                <u:OverflowStackPanel></u:OverflowStackPanel>
+            </ItemsPanelTemplate>
+        </Setter>
         <Style Selector="^">
             <Setter Property="Template" Value="{StaticResource DefaultNavMenuItemTemplate}" />
             <Style Selector="^:selected">
                 <Setter Property="Background" Value="{DynamicResource NavigationMenuItemSelectedBackground}" />
             </Style>
-            <Style Selector="^:vertical-collapsed /template/ LayoutTransformControl#PART_Transform">
-                <Setter Property="LayoutTransform" Value="scale(1,0)" />
+            <Style Selector="^:vertical-collapsed /template/ ItemsPresenter#PART_ItemsPresenter">
+                <Setter Property="Height" Value="0"></Setter>
+                <Setter Property="RenderTransform" Value="scale(1,0)" />
             </Style>
             <Style Selector="^:vertical-collapsed /template/ PathIcon#PART_ExpanderIcon">
                 <Setter Property="RenderTransform" Value="rotate(180deg)" />
@@ -170,18 +179,18 @@
                 <Setter Property="IsVisible" Value="False" />
             </Style>
             <Style Selector="^ /template/ Border#PART_Border:pointerover">
-                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}"></Setter>
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}" />
             </Style>
         </Style>
-        
+<!--
         <Style Selector="^:horizontal-collapsed:first-level">
             <Setter Property="Template" Value="{StaticResource TopLevelCollapsedNavMenuItemTemplate}" />
             <Style Selector="^ /template/ Border#PART_Border">
-                <Setter Property="ToolTip.Tip" Value="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}"/>
-                <Setter Property="ToolTip.ShowDelay" Value="0"/>
+                <Setter Property="ToolTip.Tip" Value="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}" />
+                <Setter Property="ToolTip.ShowDelay" Value="0" />
             </Style>
             <Style Selector="^/template/ Border#PART_Border:pointerover">
-                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}"></Setter>
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}" />
             </Style>
         </Style>
         <Style Selector="^:horizontal-collapsed:not(:first-level)">
@@ -193,9 +202,10 @@
                 <Setter Property="IsVisible" Value="False" />
             </Style>
             <Style Selector="^/template/ Border#PART_Border:pointerover">
-                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}"></Setter>
+                <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}" />
             </Style>
         </Style>
+        -->
     </ControlTheme>
 
 </ResourceDictionary>