react-native-windows 0.66.3 → 0.67.0-preview.3

package/Microsoft.ReactNative/Views/Image/ImageViewManager.cpp

@@ -8,17 +8,20 @@
 
 #include "ImageViewManager.h"
 
+#include <UI.Xaml.Automation.h>
 #include <winrt/Windows.Foundation.h>
 
 #include <IReactInstance.h>
 #include <Utils/PropertyHandlerUtils.h>
 #include <Utils/PropertyUtils.h>
 #include <Views/ShadowNodeBase.h>
+#include "DynamicAutomationProperties.h"
 #include "ReactImage.h"
 
 namespace winrt {
 using namespace Windows::Foundation;
 using namespace xaml::Controls;
+using namespace xaml::Automation::Peers;
 } // namespace winrt
 
 // Such code is better to move to a seperate parser layer
@@ -79,6 +82,12 @@ class ImageShadowNode : public ShadowNodeBase {
     ShadowNodeBase::createView(props);
     auto reactImage{m_view.as<ReactImage>()};
 
+    // Image should default to "accessible: false", but this is not done on the JS level
+    // https://reactnative.dev/docs/image#accessible
+    xaml::Automation::AutomationProperties::SetAccessibilityView(*reactImage, winrt::AccessibilityView::Raw);
+    DynamicAutomationProperties::SetAccessibilityRole(
+        *reactImage, winrt::Microsoft::ReactNative::AccessibilityRoles::Image);
+
     m_onLoadEndToken = reactImage->OnLoadEnd([imageViewManager{static_cast<ImageViewManager *>(GetViewManager())},
                                               reactImage](const auto &, const bool &succeeded) {
       ReactImageSource source{reactImage->Source()};
@@ -116,9 +125,7 @@ bool ImageViewManager::UpdateProperty(
     const std::string &propertyName,
     const winrt::Microsoft::ReactNative::JSValue &propertyValue) {
   auto grid{nodeToUpdate->GetView().as<winrt::Grid>()};
-
-  if (grid == nullptr)
-    return true;
+  auto reactImage{grid.as<ReactImage>()};
 
   bool finalizeBorderRadius{false};
   bool ret = true;
@@ -127,21 +134,24 @@ bool ImageViewManager::UpdateProperty(
     setSource(grid, propertyValue);
   } else if (propertyName == "resizeMode") {
     auto resizeMode{json_type_traits<facebook::react::ImageResizeMode>::parseJson(propertyValue)};
-    auto reactImage{grid.as<ReactImage>()};
     reactImage->ResizeMode(resizeMode);
   } else if (
       propertyName == "blurRadius" &&
       (propertyValue.Type() == winrt::Microsoft::ReactNative::JSValueType::Double ||
        propertyValue.Type() == winrt::Microsoft::ReactNative::JSValueType::Int64)) {
-    auto reactImage{grid.as<ReactImage>()};
     reactImage->BlurRadius(propertyValue.AsSingle());
   } else if (propertyName == "tintColor") {
     const auto isValidColorValue = IsValidColorValue(propertyValue);
     if (isValidColorValue || propertyValue.IsNull()) {
-      auto reactImage{grid.as<ReactImage>()};
       const auto color = isValidColorValue ? ColorFrom(propertyValue) : winrt::Colors::Transparent();
       reactImage->TintColor(color);
     }
+    // Override default accessibility behavior
+  } else if (propertyName == "accessible" && propertyValue.IsNull()) {
+    xaml::Automation::AutomationProperties::SetAccessibilityView(*reactImage, winrt::AccessibilityView::Raw);
+  } else if (propertyName == "accessibilityRole" && propertyValue.IsNull()) {
+    DynamicAutomationProperties::SetAccessibilityRole(
+        *reactImage, winrt::Microsoft::ReactNative::AccessibilityRoles::Image);
   } else if (TryUpdateCornerRadiusOnNode(nodeToUpdate, grid, propertyName, propertyValue)) {
     finalizeBorderRadius = true;
   } else if (TryUpdateBorderProperties(nodeToUpdate, grid, propertyName, propertyValue)) {

package/Microsoft.ReactNative/Views/Image/ReactImage.cpp

@@ -13,6 +13,7 @@
 #include <winrt/Windows.Web.Http.h>
 
 #include <Utils/ValueUtils.h>
+#include "DynamicAutomationPeer.h"
 #include "Unicode.h"
 #include "XamlView.h"
 #include "cdebug.h"
@@ -25,6 +26,7 @@ using namespace xaml;
 using namespace xaml::Media;
 using namespace xaml::Media::Imaging;
 using namespace Windows::Web::Http;
+using namespace xaml::Automation::Peers;
 } // namespace winrt
 
 using Microsoft::Common::Unicode::Utf8ToUtf16;
@@ -44,6 +46,8 @@ winrt::Size ReactImage::ArrangeOverride(winrt::Size finalSize) {
     if (auto brush{Background().try_as<ReactImageBrush>()}) {
       brush->AvailableSize(finalSize);
     }
+  } else if (auto brush{Background().try_as<winrt::ImageBrush>()}) {
+    brush.Stretch(ResizeModeToStretch(finalSize));
   }
 
   return finalSize;
@@ -57,6 +61,10 @@ void ReactImage::OnLoadEnd(winrt::event_token const &token) noexcept {
   m_onLoadEndEvent.remove(token);
 }
 
+winrt::AutomationPeer ReactImage::OnCreateAutomationPeer() {
+  return winrt::make<winrt::Microsoft::ReactNative::implementation::DynamicAutomationPeer>(*this);
+}
+
 void ReactImage::ResizeMode(facebook::react::ImageResizeMode value) {
   if (m_resizeMode != value) {
     m_resizeMode = value;
@@ -71,7 +79,7 @@ void ReactImage::ResizeMode(facebook::react::ImageResizeMode value) {
     } else if (auto brush{Background().try_as<ReactImageBrush>()}) {
       brush->ResizeMode(value);
     } else if (auto bitmapBrush{Background().as<winrt::ImageBrush>()}) {
-      bitmapBrush.Stretch(ResizeModeToStretch(m_resizeMode));
+      bitmapBrush.Stretch(ResizeModeToStretch());
     }
   }
 }
@@ -112,8 +120,12 @@ void ReactImage::TintColor(winrt::Color value) {
   }
 }
 
-winrt::Stretch ReactImage::ResizeModeToStretch(facebook::react::ImageResizeMode value) {
-  switch (value) {
+winrt::Stretch ReactImage::ResizeModeToStretch() {
+  return ResizeModeToStretch({static_cast<float>(ActualWidth()), static_cast<float>(ActualHeight())});
+}
+
+winrt::Stretch ReactImage::ResizeModeToStretch(winrt::Size size) {
+  switch (m_resizeMode) {
     case facebook::react::ImageResizeMode::Cover:
       return winrt::Stretch::UniformToFill;
     case facebook::react::ImageResizeMode::Stretch:
@@ -121,7 +133,7 @@ winrt::Stretch ReactImage::ResizeModeToStretch(facebook::react::ImageResizeMode
     case facebook::react::ImageResizeMode::Contain:
       return winrt::Stretch::Uniform;
     default: // ResizeMode::Center || ResizeMode::Repeat
-      if (m_imageSource.height < ActualHeight() && m_imageSource.width < ActualWidth()) {
+      if (m_imageSource.height < size.Height && m_imageSource.width < size.Width) {
         return winrt::Stretch::None;
       } else {
         return winrt::Stretch::Uniform;
@@ -300,13 +312,7 @@ winrt::fire_and_forget ReactImage::SetBackground(bool fireLoadEndEvent) {
       bool createImageBrush{!imageBrush};
       if (createImageBrush) {
         imageBrush = winrt::ImageBrush{};
-
-        strong_this->m_imageBrushOpenedRevoker =
-            imageBrush.ImageOpened(winrt::auto_revoke, [weak_this, imageBrush](const auto &, const auto &) {
-              if (auto strong_this{weak_this.get()}) {
-                imageBrush.Stretch(strong_this->ResizeModeToStretch(strong_this->m_resizeMode));
-              }
-            });
+        imageBrush.Stretch(strong_this->ResizeModeToStretch());
       }
 
       if (source.sourceFormat == ImageSourceFormat::Svg) {
@@ -356,6 +362,7 @@ winrt::fire_and_forget ReactImage::SetBackground(bool fireLoadEndEvent) {
                   if (auto bitmap{imageBrush.ImageSource().try_as<winrt::BitmapImage>()}) {
                     strong_this->m_imageSource.height = bitmap.PixelHeight();
                     strong_this->m_imageSource.width = bitmap.PixelWidth();
+                    imageBrush.Stretch(strong_this->ResizeModeToStretch());
                   }
 
                   strong_this->m_onLoadEndEvent(*strong_this, true);

package/Microsoft.ReactNative/Views/Image/ReactImage.h

@@ -39,6 +39,7 @@ struct ReactImage : xaml::Controls::GridT<ReactImage> {
 
   // Overrides
   winrt::Windows::Foundation::Size ArrangeOverride(winrt::Windows::Foundation::Size finalSize);
+  xaml::Automation::Peers::AutomationPeer OnCreateAutomationPeer();
 
   // Events
   winrt::event_token OnLoadEnd(winrt::Windows::Foundation::EventHandler<bool> const &handler);
@@ -66,7 +67,8 @@ struct ReactImage : xaml::Controls::GridT<ReactImage> {
   void TintColor(winrt::Windows::UI::Color value);
 
  private:
-  xaml::Media::Stretch ResizeModeToStretch(facebook::react::ImageResizeMode value);
+  xaml::Media::Stretch ResizeModeToStretch();
+  xaml::Media::Stretch ResizeModeToStretch(winrt::Windows::Foundation::Size size);
   winrt::Windows::Foundation::IAsyncOperation<winrt::Windows::Storage::Streams::InMemoryRandomAccessStream>
   GetImageMemoryStreamAsync(ReactImageSource source);
   winrt::fire_and_forget SetBackground(bool fireLoadEndEvent);

package/Microsoft.ReactNative/Views/RawTextViewManager.cpp

@@ -4,19 +4,12 @@
 #include "pch.h"
 
 #include "RawTextViewManager.h"
-#include "TextViewManager.h"
-#include "VirtualTextViewManager.h"
 
 #include <Views/ShadowNodeBase.h>
+#include <Views/Text/TextVisitors.h>
 
-#include <INativeUIManager.h>
-#include <Utils/ShadowNodeTypeUtils.h>
-#include <Utils/ValueUtils.h>
-
-#include <Modules/NativeUIManager.h>
-#include <Modules/PaperUIManagerModule.h>
-#include <UI.Xaml.Controls.h>
 #include <UI.Xaml.Documents.h>
+#include <Utils/ValueUtils.h>
 #include <winrt/Windows.Foundation.h>
 
 namespace winrt {
@@ -52,56 +45,14 @@ bool RawTextViewManager::UpdateProperty(
   if (propertyName == "text") {
     run.Text(asHstring(propertyValue));
     static_cast<RawTextShadowNode *>(nodeToUpdate)->originalText = winrt::hstring{};
-    NotifyAncestorsTextChanged(nodeToUpdate);
+    ApplyTextTransformToChild(nodeToUpdate);
+    NotifyAncestorsTextPropertyChanged(nodeToUpdate, PropertyChangeType::Text);
   } else {
     return Super::UpdateProperty(nodeToUpdate, propertyName, propertyValue);
   }
   return true;
 }
 
-void RawTextViewManager::NotifyAncestorsTextChanged(ShadowNodeBase *nodeToUpdate) {
-  if (auto uiManager = GetNativeUIManager(GetReactContext()).lock()) {
-    auto host = uiManager->getHost();
-    ShadowNodeBase *parent = static_cast<ShadowNodeBase *>(host->FindShadowNodeForTag(nodeToUpdate->GetParent()));
-    TextTransform textTransform = TextTransform::Undefined;
-    auto isNested = false;
-    while (parent) {
-      auto viewManager = parent->GetViewManager();
-      const auto nodeType = viewManager->GetName();
-      if (IsTextShadowNode(parent)) {
-        const auto textViewManager = static_cast<TextViewManager *>(viewManager);
-        if (textTransform == TextTransform::Undefined) {
-          textTransform = textViewManager->GetTextTransformValue(parent);
-        }
-
-        VirtualTextShadowNode::ApplyTextTransform(
-            *nodeToUpdate, textTransform, /* forceUpdate = */ false, /* isRoot = */ false);
-
-        if (!isNested && parent->m_children.size() == 1) {
-          auto view = parent->GetView();
-          auto textBlock = view.try_as<winrt::TextBlock>();
-          if (textBlock != nullptr) {
-            const auto run = nodeToUpdate->GetView().try_as<winrt::Run>();
-            if (run != nullptr) {
-              textBlock.Text(run.Text());
-            }
-          }
-        }
-
-        (static_cast<TextViewManager *>(viewManager))->OnDescendantTextPropertyChanged(parent);
-
-        // We have reached the parent TextBlock, so there're no more parent <Text> elements in this tree.
-        break;
-      } else if (IsVirtualTextShadowNode(parent) && textTransform == TextTransform::Undefined) {
-        textTransform = static_cast<VirtualTextShadowNode *>(parent)->textTransform;
-      }
-
-      parent = static_cast<ShadowNodeBase *>(host->FindShadowNodeForTag(parent->GetParent()));
-      isNested = true;
-    }
-  }
-}
-
 void RawTextViewManager::SetLayoutProps(
     ShadowNodeBase & /*nodeToUpdate*/,
     const XamlView & /*viewToUpdate*/,

package/Microsoft.ReactNative/Views/RawTextViewManager.h

@@ -41,9 +41,6 @@ class RawTextViewManager : public ViewManagerBase {
       const winrt::Microsoft::ReactNative::JSValue &propertyValue) override;
 
   XamlView CreateViewCore(int64_t tag, const winrt::Microsoft::ReactNative::JSValueObject &) override;
-
- private:
-  void NotifyAncestorsTextChanged(ShadowNodeBase *nodeToUpdate);
 };
 
 } // namespace Microsoft::ReactNative

package/Microsoft.ReactNative/Views/ShadowNodeBase.h

@@ -16,6 +16,8 @@ namespace Microsoft::ReactNative {
 
 class ViewManagerBase;
 
+enum class PointerEventsKind : uint8_t { Auto = 0, BoxNone, BoxOnly, None };
+
 enum class ShadowEdges : uint8_t {
   Left = 0,
   Top,
@@ -128,6 +130,9 @@ struct REACTWINDOWS_EXPORT ShadowNodeBase : public ShadowNode {
   bool m_onMouseEnterRegistered = false;
   bool m_onMouseLeaveRegistered = false;
 
+  // Pointer events
+  PointerEventsKind m_pointerEvents = PointerEventsKind::Auto;
+
   // Support Keyboard
  public:
   void UpdateHandledKeyboardEvents(

package/Microsoft.ReactNative/Views/Text/TextHighlighterVisitor.cpp

@@ -0,0 +1,52 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+#include "TextHighlighterVisitor.h"
+#include <Utils/ValueUtils.h>
+#include <Views/RawTextViewManager.h>
+#include <Views/TextViewManager.h>
+#include <Views/VirtualTextViewManager.h>
+#include "TextVisitorScope.h"
+
+namespace winrt {
+using namespace xaml::Documents;
+} // namespace winrt
+
+namespace Microsoft::ReactNative {
+
+void TextHighlighterVisitor::VisitRawText(ShadowNodeBase *node) {
+  const auto textNode = static_cast<RawTextShadowNode *>(node);
+  m_startIndex += textNode->GetView().as<winrt::Run>().Text().size();
+}
+
+void TextHighlighterVisitor::VisitVirtualText(ShadowNodeBase *node) {
+  const auto textNode = static_cast<VirtualTextShadowNode *>(node);
+  const auto foregroundColor = textNode->foregroundColor;
+  const auto backgroundColor = textNode->backgroundColor;
+  const auto needsHighlighter = RequiresTextHighlighter(foregroundColor, backgroundColor);
+  TextVisitorScope<Color> foregroundScope{m_foregroundColors, foregroundColor};
+  TextVisitorScope<Color> backgroundScope{m_backgroundColors, backgroundColor};
+
+  const auto startIndex = m_startIndex;
+  const auto initialHighlighterCount = highlighters.size();
+  Super::VisitVirtualText(node);
+
+  if (needsHighlighter) {
+    winrt::TextHighlighter highlighter;
+    highlighter.Background(SolidBrushFromColor(m_backgroundColors.top().value()));
+    const auto inheritedForegroundColor = m_foregroundColors.top();
+    if (inheritedForegroundColor.has_value()) {
+      highlighter.Foreground(SolidBrushFromColor(inheritedForegroundColor.value()));
+    }
+    highlighter.Ranges().Append({startIndex, m_startIndex - startIndex});
+    highlighters.push_back(highlighter);
+  } else if (highlighters.size() == initialHighlighterCount) {
+    textNode->hasDescendantTextHighlighter = false;
+  }
+}
+
+bool TextHighlighterVisitor::RequiresTextHighlighter(Color foregroundColor, Color backgroundColor) {
+  return backgroundColor || m_backgroundColors.top() && foregroundColor;
+}
+
+} // namespace Microsoft::ReactNative

package/Microsoft.ReactNative/Views/Text/TextHighlighterVisitor.h

@@ -0,0 +1,37 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+#pragma once
+
+#include <Utils/TextTransform.h>
+#include <stack>
+#include "TextVisitor.h"
+
+namespace Microsoft::ReactNative {
+
+class TextHighlighterVisitor : public TextVisitor {
+  using Super = TextVisitor;
+  using Color = std::optional<winrt::Windows::UI::Color>;
+
+ public:
+  TextHighlighterVisitor(Color foregroundColor, Color backgroundColor) : Super() {
+    m_foregroundColors.push(foregroundColor);
+    m_backgroundColors.push(backgroundColor);
+  }
+
+  std::vector<xaml::Documents::TextHighlighter> highlighters{};
+
+ protected:
+  void VisitRawText(ShadowNodeBase *node) override;
+
+  void VisitVirtualText(ShadowNodeBase *node) override;
+
+ private:
+  int m_startIndex{0};
+  std::stack<Color> m_foregroundColors;
+  std::stack<Color> m_backgroundColors;
+
+  bool RequiresTextHighlighter(Color foregroundColor, Color backgroundColor);
+};
+
+} // namespace Microsoft::ReactNative