Fix the focus issue partly

There still are two issues:
- Even if you try to unfocus clicking on the parent control, Omnibar still has focus
- Pressing on a mode control may lose Omnibar's focus

Author: 0x5bfa

src/Files.App.Controls/Omnibar/Omnibar.cs

@@ -18,12 +18,13 @@ namespace Files.App.Controls
 	[TemplatePart(Name = "PART_ModesHostGrid", Type = typeof(Grid))]
 	// Visual states
 	[TemplateVisualState(Name = "Focused", GroupName = "FocusStates")]
-	[TemplateVisualState(Name = "Unfocused", GroupName = "FocusStates")]
+	[TemplateVisualState(Name = "Normal", GroupName = "FocusStates")]
 	public partial class Omnibar : Control
 	{
 		private const string ModesHostGrid = "PART_ModesHostGrid";
 
 		private Grid? _modesHostGrid;
+		private bool _wasAscendantFocused;
 		private bool _isFocused;
 
 		public Omnibar()
@@ -64,13 +65,12 @@ protected override void OnApplyTemplate()
 				_modesHostGrid.ColumnDefinitions.Add(new() { Width = GridLength.Auto });
 				Grid.SetColumn(mode, _modesHostGrid.Children.Count);
 				_modesHostGrid.Children.Add(mode);
-				mode.Host = _modesHostGrid;
+				mode.Host = this;
 			}
 
 			var parentElement = this.FindAscendant<FrameworkElement>()!;
-			parentElement.GettingFocus += ParentElement_GettingFocus;
-			parentElement.GotFocus += ParentElement_GotFocus;
-			GettingFocus += Omnibar_GettingFocus;
+			parentElement.PointerPressed += ParentElement_PointerPressed;
+
 			GotFocus += Omnibar_GotFocus;
 			LostFocus += Omnibar_LostFocus;
 
@@ -79,7 +79,23 @@ protected override void OnApplyTemplate()
 			base.OnApplyTemplate();
 		}
 
-		// Private methods
+		// Methods
+
+		internal void ChangeExpandedMode(OmnibarMode modeToExpand)
+		{
+			if (_modesHostGrid is null || Modes is null)
+				throw new NullReferenceException();
+
+			// Reset
+			foreach (var column in _modesHostGrid.ColumnDefinitions)
+				column.Width = GridLength.Auto;
+			foreach (var mode in Modes)
+				VisualStateManager.GoToState(mode, "Collapsed", true);
+
+			// Expand the given mode
+			VisualStateManager.GoToState(modeToExpand, "Visible", true);
+			_modesHostGrid.ColumnDefinitions[_modesHostGrid.Children.IndexOf(modeToExpand)].Width = new(1, GridUnitType.Star);
+		}
 
 		private void UpdateVisualStates()
 		{
@@ -91,27 +107,35 @@ private void UpdateVisualStates()
 
 		// Events
 
-		private void Omnibar_GettingFocus(UIElement sender, GettingFocusEventArgs args)
+		private void ParentElement_PointerPressed(object sender, PointerRoutedEventArgs e)
 		{
-		}
+			// Lost focus
+			if (_isFocused)
+			{
+				_isFocused = _wasAscendantFocused = false;
+				UpdateVisualStates();
 
-		private void ParentElement_GettingFocus(UIElement sender, GettingFocusEventArgs args)
-		{
-		}
+				return;
+			}
 
-		private void ParentElement_GotFocus(object sender, RoutedEventArgs e)
-		{
+			_wasAscendantFocused = true;
 		}
 
 		private void Omnibar_GotFocus(object sender, RoutedEventArgs e)
 		{
+			if (_wasAscendantFocused)
+			{
+				_isFocused = _wasAscendantFocused = false;
+				return;
+			}
+
 			_isFocused = true;
 			UpdateVisualStates();
 		}
 
 		private void Omnibar_LostFocus(object sender, RoutedEventArgs e)
 		{
-			_isFocused = false;
+			_isFocused = _wasAscendantFocused = false;
 			UpdateVisualStates();
 		}
 	}

src/Files.App.Controls/Omnibar/OmnibarMode.Properties.cs

@@ -17,6 +17,9 @@ public partial class OmnibarMode
 		[GeneratedDependencyProperty]
 		public partial string? Text { get; set; }
 
+		[GeneratedDependencyProperty]
+		public partial string? TextPlaceholder { get; set; }
+
 		[GeneratedDependencyProperty]
 		public partial bool HideContentOnInactive { get; set; }
 
@@ -33,9 +36,18 @@ public partial class OmnibarMode
 		public partial bool IsDefault { get; set; }
 
 		[GeneratedDependencyProperty]
-		internal partial Grid? Host { get; set; }
+		internal partial Omnibar? Host { get; set; }
+
+		[GeneratedDependencyProperty]
+		internal partial bool IsHostFocused { get; set; }
+
+		//partial void OnHostChanged(Grid? newValue)
+		//{
+		//	if (_isHostInitialized)
+		//		throw new InvalidOperationException("Host is already set and cannot be changed again.");
+		//}
 
-		partial void OnHostChanged(Grid? newValue)
+		partial void OnIsHostFocusedChanged(bool newValue)
 		{
 			UpdateVisualStates();
 		}

src/Files.App.Controls/Omnibar/OmnibarMode.cs

@@ -10,6 +10,12 @@
 
 namespace Files.App.Controls
 {
+	// Template parts
+	[TemplatePart(Name = "PART_ModeClickBorder", Type = typeof(Border))]
+	[TemplatePart(Name = "PART_InputTextBox", Type = typeof(TextBox))]
+	// Visual states
+	[TemplateVisualState(Name = "Collapsed", GroupName = "InputVisibilityStates")]
+	[TemplateVisualState(Name = "Visible", GroupName = "InputVisibilityStates")]
 	public partial class OmnibarMode : Control
 	{
 		private const string ModeClickBorder = "PART_ModeClickBorder";
@@ -18,6 +24,7 @@ public partial class OmnibarMode : Control
 		private Border? _modeClickArea;
 		private TextBox? _inputTextBox;
 
+		private bool _isHostInitialized;
 		private bool _isHoveredOver;
 		private bool _isPressed;
 
@@ -33,6 +40,9 @@ protected override void OnApplyTemplate()
 			_inputTextBox = GetTemplateChild(InputTextBox) as TextBox
 				?? throw new MissingFieldException($"Could not find {InputTextBox} in the given {nameof(OmnibarMode)}'s style.");
 
+			if (IsDefault)
+				Host!.ChangeExpandedMode(this);
+
 			UpdateVisualStates();
 
 			_modeClickArea.PointerEntered += OmnibarMode_PointerEntered;
@@ -49,12 +59,6 @@ private void UpdateVisualStates()
 				this,
 				_isPressed ? "PointerPressed" : _isHoveredOver ? "PointerOver" : "PointerNormal",
 				true);
-
-			if (IsDefault && Host is not null)
-			{
-				VisualStateManager.GoToState(this, "Visible",true);
-				Host.ColumnDefinitions[Host.Children.IndexOf(this)].Width = new(1, GridUnitType.Star);
-			}
 		}
 
 		// Events
@@ -78,6 +82,8 @@ private void OmnibarMode_PointerReleased(object sender, PointerRoutedEventArgs e
 			_isHoveredOver = true;
 			_isPressed = false;
 			UpdateVisualStates();
+
+			Host!.ChangeExpandedMode(this);
 		}
 
 		private void OmnibarMode_PointerExited(object sender, PointerRoutedEventArgs e)

src/Files.App.Controls/Omnibar/OmnibarMode.xaml

@@ -46,6 +46,8 @@
 							Grid.Column="1"
 							HorizontalAlignment="Stretch"
 							HorizontalContentAlignment="Stretch"
+							PlaceholderText="{TemplateBinding TextPlaceholder}"
+							Text="{TemplateBinding Text}"
 							Visibility="Collapsed">
 							<TextBox.Resources>
 								<SolidColorBrush x:Key="TextControlBackground" Color="Transparent" />
@@ -79,7 +81,7 @@
 							</VisualStateGroup>
 
 							<VisualStateGroup x:Name="InputVisibilityStates">
-								<VisualState x:Name="Hidden" />
+								<VisualState x:Name="Collapsed" />
 								<VisualState x:Name="Visible">
 									<VisualState.Setters>
 										<Setter Target="PART_InputTextBox.Visibility" Value="Visible" />

tests/Files.App.UITests/Views/OmnibarPage.xaml

@@ -67,7 +67,8 @@
 				<controls:OmnibarMode
 					HideContentOnInactive="True"
 					IsDefault="True"
-					Text="A">
+					Text="Path..."
+					TextPlaceholder="Enter text...">
 					<controls:OmnibarMode.IconOnActive>
 						<controls:ThemedIcon
 							Width="16"
@@ -82,7 +83,10 @@
 							Style="{StaticResource App.ThemedIcons.Omnibar.Path}" />
 					</controls:OmnibarMode.IconOnInactive>
 				</controls:OmnibarMode>
-				<controls:OmnibarMode HideContentOnInactive="True" Text="B">
+				<controls:OmnibarMode
+					HideContentOnInactive="True"
+					Text="Palette..."
+					TextPlaceholder="Enter a palette command...">
 					<controls:OmnibarMode.IconOnActive>
 						<controls:ThemedIcon
 							Width="16"
@@ -97,7 +101,7 @@
 							Style="{StaticResource App.ThemedIcons.Omnibar.Commands}" />
 					</controls:OmnibarMode.IconOnInactive>
 				</controls:OmnibarMode>
-				<controls:OmnibarMode Text="C">
+				<controls:OmnibarMode Text="Search..." TextPlaceholder="Enter a search query...">
 					<controls:OmnibarMode.IconOnActive>
 						<controls:ThemedIcon
 							Width="16"