Make variable chevron focusable (#1096)

* give chevron focus

* fix merge issues

* fix key

src/Calculator/Resources/en-US/Resources.resw

@@ -4418,6 +4418,10 @@
     <value>Graph Options</value>
     <comment>Heading for the Graph Options flyout in Graphing mode.</comment>
   </data>
+  <data name="VariableAreaSettings.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>Variable options</value>
+    <comment>Screen reader prompt for the variable settings button</comment>
+  </data>
   <data name="LineThicknessBox.Header" xml:space="preserve">
     <value>Line Thickness</value>
     <comment>Heading for the Graph Options flyout in Graphing mode.</comment>

src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml

@@ -209,11 +209,17 @@
                                              Text="{x:Bind Max, Mode=OneWay}"/>
                                 </Grid>
                             </Grid>
-                            <FontIcon Margin="0,6,0,0"
+                            <Button x:Uid="VariableAreaSettings"
-                                      VerticalAlignment="Center"
+                                    Margin="0,6,0,0"
-                                      FontFamily="{StaticResource CalculatorFontFamily}"
+                                    HorizontalAlignment="Center"
-                                      FontSize="9"
+                                    VerticalAlignment="Center"
-                                      Glyph="{x:Bind local:EquationInputArea.GetChevronIcon(SliderSettingsVisible), Mode=OneWay}"/>
+                                    Background="Transparent"
+                                    Click="VariableAreaClicked"
+                                    Tapped="VariableAreaButtonTapped">
+                                <FontIcon FontFamily="{StaticResource CalculatorFontFamily}"
+                                          FontSize="9"
+                                          Glyph="{x:Bind local:EquationInputArea.GetChevronIcon(SliderSettingsVisible), Mode=OneWay}"/>
+                            </Button>
                         </StackPanel>
                     </Border>
                 </Grid>

src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp

@@ -451,7 +451,26 @@ String ^ EquationInputArea::GetChevronIcon(bool isCollapsed)
 
 void EquationInputArea::VariableAreaTapped(Object ^ sender, TappedRoutedEventArgs ^ e)
 {
-    auto selectedVariableViewModel = static_cast<VariableViewModel ^>(static_cast<Grid ^>(sender)->DataContext);
+    ToggleVariableArea(static_cast<VariableViewModel ^>(static_cast<FrameworkElement ^>(sender)->DataContext));
+}
+
+void EquationInputArea::VariableAreaButtonTapped(Object ^ sender, TappedRoutedEventArgs ^ e)
+{
+    e->Handled = true;
+}
+  
+void EquationInputArea::EquationTextBox_EquationFormatRequested(Object ^ sender, MathRichEditBoxFormatRequest ^ e)
+{
+    EquationFormatRequested(sender, e);
+}
+
+void EquationInputArea::VariableAreaClicked(Object ^ sender, RoutedEventArgs ^ e)
+{
+    ToggleVariableArea(static_cast<VariableViewModel ^>(static_cast<Button ^>(sender)->DataContext));
+}
+
+void EquationInputArea::ToggleVariableArea(VariableViewModel ^ selectedVariableViewModel)
+{
     selectedVariableViewModel->SliderSettingsVisible = !selectedVariableViewModel->SliderSettingsVisible;
 
     // Collapse all other slider settings that are open
@@ -462,11 +481,7 @@ void EquationInputArea::VariableAreaTapped(Object ^ sender, TappedRoutedEventArg
             variableViewModel->SliderSettingsVisible = false;
         }
     }
-}
 
-void EquationInputArea::EquationTextBox_EquationFormatRequested(Object ^ sender, MathRichEditBoxFormatRequest ^ e)
-{
-    EquationFormatRequested(sender, e);
 }
 
 void EquationInputArea::Slider_ValueChanged(Object ^ sender, RangeBaseValueChangedEventArgs ^ e)

src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.h

@@ -66,12 +66,16 @@ public
         void TextBoxLosingFocus(Windows::UI::Xaml::Controls::TextBox ^ textbox, Windows::UI::Xaml::Input::LosingFocusEventArgs ^ args);
         void TextBoxKeyDown(Windows::UI::Xaml::Controls::TextBox ^ textbox, Windows::UI::Xaml::Input::KeyRoutedEventArgs ^ e);
         void SubmitTextbox(Windows::UI::Xaml::Controls::TextBox ^ textbox);
+        void VariableAreaClicked(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void VariableAreaButtonTapped(Platform::Object ^ sender, Windows::UI::Xaml::Input::TappedRoutedEventArgs ^ e);
         void VariableAreaTapped(Platform::Object ^ sender, Windows::UI::Xaml::Input::TappedRoutedEventArgs ^ e);
         void EquationTextBox_EquationFormatRequested(Platform::Object ^ sender, CalculatorApp::Controls::MathRichEditBoxFormatRequest ^ e);
         void Slider_ValueChanged(Platform::Object ^ sender, Windows::UI::Xaml::Controls::Primitives::RangeBaseValueChangedEventArgs ^ e);
 
         CalculatorApp::ViewModel::EquationViewModel ^ GetViewModelFromEquationTextBox(Platform::Object ^ sender);
 
+        void ToggleVariableArea(CalculatorApp::ViewModel::VariableViewModel ^ selectedVariableViewModel);
+
         Windows::UI::ViewManagement::AccessibilitySettings ^ m_accessibilitySettings;
         Windows::UI::ViewManagement::UISettings ^ m_uiSettings;
         int m_lastLineColorIndex;