react-native-windows 0.74.4 → 0.74.6

package/Microsoft.ReactNative/Fabric/Composition/ScrollViewComponentView.cpp

@@ -578,19 +578,22 @@ winrt::Microsoft::ReactNative::ComponentView ScrollViewComponentView::Create(
   return winrt::make<ScrollViewComponentView>(compContext, tag, reactContext);
 }
 
+facebook::react::SharedViewProps ScrollViewComponentView::defaultProps() noexcept {
+  static auto const defaultViewProps = std::make_shared<facebook::react::ScrollViewProps const>();
+  return defaultViewProps;
+}
+
 ScrollViewComponentView::ScrollViewComponentView(
     const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext,
     facebook::react::Tag tag,
     winrt::Microsoft::ReactNative::ReactContext const &reactContext)
     : Super(
+          ScrollViewComponentView::defaultProps(),
           compContext,
           tag,
           reactContext,
           ComponentViewFeatures::Default & ~ComponentViewFeatures::Background,
           false) {
-  static auto const defaultProps = std::make_shared<facebook::react::ScrollViewProps const>();
-  m_props = defaultProps;
-
   // m_element.Content(m_contentPanel);
 
   /*
@@ -683,7 +686,8 @@ ScrollViewComponentView::ScrollViewComponentView(
 void ScrollViewComponentView::MountChildComponentView(
     const winrt::Microsoft::ReactNative::ComponentView &childComponentView,
     uint32_t index) noexcept {
-  base_type::MountChildComponentView(childComponentView, index);
+  // Call ComponentView::UnmountChildComponentView instead of base to handle out own Visual hosting
+  ComponentView::MountChildComponentView(childComponentView, index);
 
   ensureVisual();
   m_scrollVisual.InsertAt(
@@ -694,7 +698,8 @@ void ScrollViewComponentView::MountChildComponentView(
 void ScrollViewComponentView::UnmountChildComponentView(
     const winrt::Microsoft::ReactNative::ComponentView &childComponentView,
     uint32_t index) noexcept {
-  base_type::UnmountChildComponentView(childComponentView, index);
+  // Call ComponentView::UnmountChildComponentView instead of base to handle out own Visual hosting
+  ComponentView::UnmountChildComponentView(childComponentView, index);
   m_scrollVisual.Remove(childComponentView.as<ComponentView>()->OuterVisual());
 }
 
@@ -710,22 +715,17 @@ void ScrollViewComponentView::updateProps(
     facebook::react::Props::Shared const &props,
     facebook::react::Props::Shared const &oldProps) noexcept {
   const auto &newViewProps = *std::static_pointer_cast<const facebook::react::ScrollViewProps>(props);
-  const auto &oldViewProps = *std::static_pointer_cast<const facebook::react::ScrollViewProps>(m_props);
+  const auto &oldViewProps =
+      *std::static_pointer_cast<const facebook::react::ScrollViewProps>(oldProps ? oldProps : viewProps());
 
   ensureVisual();
 
   if (!oldProps || oldViewProps.backgroundColor != newViewProps.backgroundColor) {
     updateBackgroundColor(newViewProps.backgroundColor);
   }
-  if (oldViewProps.testId != newViewProps.testId) {
-    m_visual.Comment(winrt::to_hstring(newViewProps.testId));
-  }
 
   // update BaseComponentView props
-  updateTransformProps(oldViewProps, newViewProps, m_visual);
-  Super::updateProps(props, oldProps);
-
-  m_props = std::static_pointer_cast<facebook::react::ViewProps const>(props);
+  base_type::updateProps(props, oldProps);
 }
 
 void ScrollViewComponentView::updateState(
@@ -758,16 +758,9 @@ void ScrollViewComponentView::updateLayoutMetrics(
   // Set Position & Size Properties
   ensureVisual();
 
-  if ((layoutMetrics.displayType != m_layoutMetrics.displayType)) {
-    OuterVisual().IsVisible(layoutMetrics.displayType != facebook::react::DisplayType::None);
-  }
-
   m_verticalScrollbarComponent->updateLayoutMetrics(layoutMetrics);
   m_horizontalScrollbarComponent->updateLayoutMetrics(layoutMetrics);
-  Super::updateLayoutMetrics(layoutMetrics, oldLayoutMetrics);
-  m_visual.Size(
-      {layoutMetrics.frame.size.width * layoutMetrics.pointScaleFactor,
-       layoutMetrics.frame.size.height * layoutMetrics.pointScaleFactor});
+  base_type::updateLayoutMetrics(layoutMetrics, oldLayoutMetrics);
   m_scrollVisual.Size(
       {layoutMetrics.frame.size.width * layoutMetrics.pointScaleFactor,
        layoutMetrics.frame.size.height * layoutMetrics.pointScaleFactor});
@@ -785,10 +778,6 @@ void ScrollViewComponentView::updateContentVisualSize() noexcept {
 
 void ScrollViewComponentView::prepareForRecycle() noexcept {}
 
-facebook::react::SharedViewProps ScrollViewComponentView::viewProps() noexcept {
-  return m_props;
-}
-
 /*
 ScrollViewComponentView::ScrollInteractionTrackerOwner::ScrollInteractionTrackerOwner(
     ScrollViewComponentView *outer)
@@ -835,7 +824,7 @@ void ScrollViewComponentView::OnPointerDown(const winrt::Windows::UI::Input::Poi
 */
 
 void ScrollViewComponentView::onThemeChanged() noexcept {
-  updateBackgroundColor(std::static_pointer_cast<const facebook::react::ScrollViewProps>(m_props)->backgroundColor);
+  updateBackgroundColor(std::static_pointer_cast<const facebook::react::ScrollViewProps>(viewProps())->backgroundColor);
   m_verticalScrollbarComponent->OnThemeChanged();
   m_horizontalScrollbarComponent->OnThemeChanged();
   Super::onThemeChanged();
@@ -925,6 +914,8 @@ void ScrollViewComponentView::OnKeyDown(
       args.Handled(lineRight(true));
       break;
   }
+
+  base_type::OnKeyDown(source, args);
 }
 
 bool ScrollViewComponentView::scrollToEnd(bool animate) noexcept {
@@ -1131,37 +1122,35 @@ void ScrollViewComponentView::StartBringIntoView(
   }
 }
 
-void ScrollViewComponentView::ensureVisual() noexcept {
-  if (!m_visual) {
-    m_visual = m_compContext.CreateSpriteVisual();
-    m_scrollVisual = m_compContext.CreateScrollerVisual();
-    m_verticalScrollbarComponent = std::make_shared<ScrollBarComponent>(*this, m_compContext, m_reactContext, true);
-    m_horizontalScrollbarComponent = std::make_shared<ScrollBarComponent>(*this, m_compContext, m_reactContext, false);
-    m_visual.InsertAt(m_scrollVisual, 0);
-    m_visual.InsertAt(m_verticalScrollbarComponent->Visual(), 1);
-    m_visual.InsertAt(m_horizontalScrollbarComponent->Visual(), 2);
-    m_scrollPositionChangedRevoker = m_scrollVisual.ScrollPositionChanged(
-        winrt::auto_revoke,
-        [this](
-            winrt::IInspectable const & /*sender*/,
-            winrt::Microsoft::ReactNative::Composition::Experimental::IScrollPositionChangedArgs const &args) {
-          updateStateWithContentOffset();
-          auto eventEmitter = GetEventEmitter();
-          if (eventEmitter) {
-            facebook::react::ScrollViewMetrics scrollMetrics;
-            scrollMetrics.containerSize.height = m_layoutMetrics.frame.size.height;
-            scrollMetrics.containerSize.width = m_layoutMetrics.frame.size.width;
-            scrollMetrics.contentOffset.x = args.Position().x / m_layoutMetrics.pointScaleFactor;
-            scrollMetrics.contentOffset.y = args.Position().y / m_layoutMetrics.pointScaleFactor;
-            scrollMetrics.zoomScale = 1.0;
-            scrollMetrics.contentSize.height = std::max(m_contentSize.height, m_layoutMetrics.frame.size.height);
-            scrollMetrics.contentSize.width = std::max(m_contentSize.width, m_layoutMetrics.frame.size.width);
-            std::static_pointer_cast<facebook::react::ScrollViewEventEmitter const>(eventEmitter)
-                ->onScroll(scrollMetrics);
-          }
-        });
-    OuterVisual().InsertAt(m_visual, 0);
-  }
+winrt::Microsoft::ReactNative::Composition::Experimental::IVisual ScrollViewComponentView::createVisual() noexcept {
+  auto visual = m_compContext.CreateSpriteVisual();
+  m_scrollVisual = m_compContext.CreateScrollerVisual();
+  m_verticalScrollbarComponent = std::make_shared<ScrollBarComponent>(*this, m_compContext, m_reactContext, true);
+  m_horizontalScrollbarComponent = std::make_shared<ScrollBarComponent>(*this, m_compContext, m_reactContext, false);
+  visual.InsertAt(m_scrollVisual, 0);
+  visual.InsertAt(m_verticalScrollbarComponent->Visual(), 1);
+  visual.InsertAt(m_horizontalScrollbarComponent->Visual(), 2);
+  m_scrollPositionChangedRevoker = m_scrollVisual.ScrollPositionChanged(
+      winrt::auto_revoke,
+      [this](
+          winrt::IInspectable const & /*sender*/,
+          winrt::Microsoft::ReactNative::Composition::Experimental::IScrollPositionChangedArgs const &args) {
+        updateStateWithContentOffset();
+        auto eventEmitter = GetEventEmitter();
+        if (eventEmitter) {
+          facebook::react::ScrollViewMetrics scrollMetrics;
+          scrollMetrics.containerSize.height = m_layoutMetrics.frame.size.height;
+          scrollMetrics.containerSize.width = m_layoutMetrics.frame.size.width;
+          scrollMetrics.contentOffset.x = args.Position().x / m_layoutMetrics.pointScaleFactor;
+          scrollMetrics.contentOffset.y = args.Position().y / m_layoutMetrics.pointScaleFactor;
+          scrollMetrics.zoomScale = 1.0;
+          scrollMetrics.contentSize.height = std::max(m_contentSize.height, m_layoutMetrics.frame.size.height);
+          scrollMetrics.contentSize.width = std::max(m_contentSize.width, m_layoutMetrics.frame.size.width);
+          std::static_pointer_cast<facebook::react::ScrollViewEventEmitter const>(eventEmitter)
+              ->onScroll(scrollMetrics);
+        }
+      });
+  return visual;
 }
 
 facebook::react::Tag ScrollViewComponentView::hitTest(
@@ -1174,19 +1163,19 @@ facebook::react::Tag ScrollViewComponentView::hitTest(
       ptViewport.x + m_scrollVisual.ScrollPosition().x / m_layoutMetrics.pointScaleFactor,
       ptViewport.y + m_scrollVisual.ScrollPosition().y / m_layoutMetrics.pointScaleFactor};
 
-  facebook::react::Tag targetTag;
+  facebook::react::Tag targetTag = -1;
 
-  if ((ignorePointerEvents || m_props->pointerEvents == facebook::react::PointerEventsMode::Auto ||
-       m_props->pointerEvents == facebook::react::PointerEventsMode::BoxOnly) &&
+  if ((ignorePointerEvents || viewProps()->pointerEvents == facebook::react::PointerEventsMode::Auto ||
+       viewProps()->pointerEvents == facebook::react::PointerEventsMode::BoxOnly) &&
       ptViewport.x >= 0 && ptViewport.x <= m_layoutMetrics.frame.size.width && ptViewport.y >= 0 &&
       ptViewport.y <= m_layoutMetrics.frame.size.height) {
-    if ((ignorePointerEvents || m_props->pointerEvents == facebook::react::PointerEventsMode::Auto ||
-         m_props->pointerEvents == facebook::react::PointerEventsMode::BoxNone) &&
+    if ((ignorePointerEvents || viewProps()->pointerEvents == facebook::react::PointerEventsMode::Auto ||
+         viewProps()->pointerEvents == facebook::react::PointerEventsMode::BoxNone) &&
         anyHitTestHelper(targetTag, ptContent, localPt))
       return targetTag;
 
-    if (ignorePointerEvents || m_props->pointerEvents == facebook::react::PointerEventsMode::Auto ||
-        m_props->pointerEvents == facebook::react::PointerEventsMode::BoxOnly) {
+    if (ignorePointerEvents || viewProps()->pointerEvents == facebook::react::PointerEventsMode::Auto ||
+        viewProps()->pointerEvents == facebook::react::PointerEventsMode::BoxOnly) {
       return this->Tag();
     }
   }
@@ -1208,10 +1197,6 @@ facebook::react::Point ScrollViewComponentView::getClientOffset() const noexcept
           parentOffset.y};
 }
 
-winrt::Microsoft::ReactNative::Composition::Experimental::IVisual ScrollViewComponentView::Visual() const noexcept {
-  return m_visual;
-}
-
 std::string ScrollViewComponentView::DefaultControlType() const noexcept {
   return "scrollbar";
 }

package/Microsoft.ReactNative/Fabric/Composition/ScrollViewComponentView.h

@@ -20,7 +20,7 @@ namespace winrt::Microsoft::ReactNative::Composition::implementation {
 
 struct ScrollBarComponent;
 
-struct ScrollViewComponentView : ScrollViewComponentViewT<ScrollViewComponentView, ComponentView> {
+struct ScrollViewComponentView : ScrollViewComponentViewT<ScrollViewComponentView, ViewComponentView> {
   /*
 struct ScrollInteractionTrackerOwner : public winrt::implements<
                                            ScrollInteractionTrackerOwner,
@@ -51,7 +51,7 @@ struct ScrollInteractionTrackerOwner : public winrt::implements<
 };
 
 */
-  using Super = ScrollViewComponentViewT<ScrollViewComponentView, ComponentView>;
+  using Super = ScrollViewComponentViewT<ScrollViewComponentView, ViewComponentView>;
 
   [[nodiscard]] static winrt::Microsoft::ReactNative::ComponentView Create(
       const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext,
@@ -72,7 +72,6 @@ struct ScrollInteractionTrackerOwner : public winrt::implements<
       facebook::react::LayoutMetrics const &layoutMetrics,
       facebook::react::LayoutMetrics const &oldLayoutMetrics) noexcept override;
   void prepareForRecycle() noexcept override;
-  facebook::react::SharedViewProps viewProps() noexcept override;
   void OnKeyDown(
       const winrt::Microsoft::ReactNative::Composition::Input::KeyboardSource &source,
       const winrt::Microsoft::ReactNative::Composition::Input::KeyRoutedEventArgs &args) noexcept override;
@@ -82,7 +81,6 @@ struct ScrollInteractionTrackerOwner : public winrt::implements<
   facebook::react::Tag hitTest(facebook::react::Point pt, facebook::react::Point &localPt, bool ignorePointerEvents)
       const noexcept override;
   facebook::react::Point getClientOffset() const noexcept override;
-  winrt::Microsoft::ReactNative::Composition::Experimental::IVisual Visual() const noexcept override;
 
   void onThemeChanged() noexcept override;
   void OnPointerReleased(
@@ -100,6 +98,8 @@ struct ScrollInteractionTrackerOwner : public winrt::implements<
 
   void scrollTo(winrt::Windows::Foundation::Numerics::float3 offset, bool animate) noexcept;
 
+  static facebook::react::SharedViewProps defaultProps() noexcept;
+
   ScrollViewComponentView(
       const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext,
       facebook::react::Tag tag,
@@ -111,9 +111,9 @@ struct ScrollInteractionTrackerOwner : public winrt::implements<
   bool lineDown(bool animate) noexcept;
   bool lineLeft(bool animate) noexcept;
   bool lineRight(bool animate) noexcept;
+  winrt::Microsoft::ReactNative::Composition::Experimental::IVisual createVisual() noexcept override;
 
  private:
-  void ensureVisual() noexcept;
   void updateContentVisualSize() noexcept;
   bool scrollToEnd(bool animate) noexcept;
   bool scrollToStart(bool animate) noexcept;
@@ -125,14 +125,12 @@ struct ScrollInteractionTrackerOwner : public winrt::implements<
   void updateStateWithContentOffset() noexcept;
 
   facebook::react::Size m_contentSize;
-  winrt::Microsoft::ReactNative::Composition::Experimental::ISpriteVisual m_visual{nullptr};
   winrt::Microsoft::ReactNative::Composition::Experimental::IScrollVisual m_scrollVisual{nullptr};
   std::shared_ptr<ScrollBarComponent> m_horizontalScrollbarComponent{nullptr};
   std::shared_ptr<ScrollBarComponent> m_verticalScrollbarComponent{nullptr};
   winrt::Microsoft::ReactNative::Composition::Experimental::IScrollVisual::ScrollPositionChanged_revoker
       m_scrollPositionChangedRevoker{};
 
-  facebook::react::SharedViewProps m_props;
   float m_zoomFactor{1.0f};
   bool m_isScrollingFromInertia = false;
   bool m_isScrolling = false;

package/Microsoft.ReactNative/Fabric/Composition/SwitchComponentView.cpp

@@ -29,13 +29,12 @@ SwitchComponentView::SwitchComponentView(
     facebook::react::Tag tag,
     winrt::Microsoft::ReactNative::ReactContext const &reactContext)
     : base_type(
+          SwitchComponentView::defaultProps(),
           compContext,
           tag,
           reactContext,
           ComponentViewFeatures::Default & ~ComponentViewFeatures::Background,
-          false) {
-  m_props = std::make_shared<facebook::react::SwitchProps const>();
-}
+          false) {}
 
 winrt::Microsoft::ReactNative::ComponentView SwitchComponentView::Create(
     const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext,
@@ -72,24 +71,17 @@ void SwitchComponentView::HandleCommand(
 void SwitchComponentView::updateProps(
     facebook::react::Props::Shared const &props,
     facebook::react::Props::Shared const &oldProps) noexcept {
-  const auto &oldViewProps = *std::static_pointer_cast<const facebook::react::SwitchProps>(m_props);
+  const auto &oldViewProps =
+      *std::static_pointer_cast<const facebook::react::SwitchProps>(oldProps ? oldProps : viewProps());
   const auto &newViewProps = *std::static_pointer_cast<const facebook::react::SwitchProps>(props);
 
-  ensureVisual();
-
   if (oldViewProps.backgroundColor != newViewProps.backgroundColor ||
       oldViewProps.thumbTintColor != newViewProps.thumbTintColor || oldViewProps.value != newViewProps.value ||
       oldViewProps.disabled != newViewProps.disabled) {
     m_visualUpdateRequired = true;
   }
-  if (oldViewProps.testId != newViewProps.testId) {
-    m_visual.Comment(winrt::to_hstring(newViewProps.testId));
-  }
 
-  // update BaseComponentView props
-  updateTransformProps(oldViewProps, newViewProps, m_visual);
   Super::updateProps(props, oldProps);
-  m_props = std::static_pointer_cast<facebook::react::ViewProps const>(props);
 }
 
 void SwitchComponentView::updateState(
@@ -99,17 +91,7 @@ void SwitchComponentView::updateState(
 void SwitchComponentView::updateLayoutMetrics(
     facebook::react::LayoutMetrics const &layoutMetrics,
     facebook::react::LayoutMetrics const &oldLayoutMetrics) noexcept {
-  // Set Position & Size Properties
-  ensureVisual();
-
-  if ((layoutMetrics.displayType != m_layoutMetrics.displayType)) {
-    OuterVisual().IsVisible(layoutMetrics.displayType != facebook::react::DisplayType::None);
-  }
-
   Super::updateLayoutMetrics(layoutMetrics, oldLayoutMetrics);
-  m_visual.Size(
-      {layoutMetrics.frame.size.width * layoutMetrics.pointScaleFactor,
-       layoutMetrics.frame.size.height * layoutMetrics.pointScaleFactor});
 
   if (oldLayoutMetrics.pointScaleFactor != layoutMetrics.pointScaleFactor) {
     handleScaleChange();
@@ -135,7 +117,7 @@ void SwitchComponentView::handleScaleChange() noexcept {
 }
 
 void SwitchComponentView::updateVisuals() noexcept {
-  const auto switchProps = std::static_pointer_cast<const facebook::react::SwitchProps>(m_props);
+  const auto &props = switchProps();
   auto &theme = *this->theme();
   winrt::Microsoft::ReactNative::Composition::Experimental::IBrush defaultColor;
   winrt::Microsoft::ReactNative::Composition::Experimental::IBrush fillColor;
@@ -144,8 +126,8 @@ void SwitchComponentView::updateVisuals() noexcept {
   auto thumbWidth = SwitchConstants::thumbWidth;
   auto thumbHeight = SwitchConstants::thumbWidth;
 
-  if (switchProps->value) {
-    if (switchProps->disabled) {
+  if (props.value) {
+    if (props.disabled) {
       defaultColor = theme.PlatformBrush("ToggleSwitchStrokeOnDisabled");
       fillColor = theme.PlatformBrush("ToggleSwitchFillOnDisabled");
       thumbFill = theme.PlatformBrush("ToggleSwitchKnobFillOnDisabled");
@@ -163,7 +145,7 @@ void SwitchComponentView::updateVisuals() noexcept {
       thumbFill = theme.PlatformBrush("ToggleSwitchKnobFillOn");
     }
   } else {
-    if (switchProps->disabled) {
+    if (props.disabled) {
       defaultColor = theme.PlatformBrush("ToggleSwitchStrokeOffDisabled");
       fillColor = theme.PlatformBrush("ToggleSwitchFillOffDisabled");
       thumbFill = theme.PlatformBrush("ToggleSwitchKnobFillOffDisabled");
@@ -182,7 +164,7 @@ void SwitchComponentView::updateVisuals() noexcept {
     }
   }
 
-  if (switchProps->disabled) {
+  if (props.disabled) {
     thumbWidth = SwitchConstants::thumbWidth;
   } else if (m_pressed) {
     thumbWidth = SwitchConstants::thumbWidthPressed;
@@ -194,18 +176,18 @@ void SwitchComponentView::updateVisuals() noexcept {
     thumbWidth = SwitchConstants::thumbWidth;
   }
 
-  if (!switchProps->disabled && switchProps->thumbTintColor) {
-    thumbFill = theme.Brush(*switchProps->thumbTintColor);
+  if (!props.disabled && props.thumbTintColor) {
+    thumbFill = theme.Brush(*props.thumbTintColor);
   }
 
-  if (!switchProps->disabled && switchProps->onTintColor && switchProps->value) {
-    fillColor = theme.Brush(*switchProps->onTintColor);
-  } else if (!switchProps->disabled && switchProps->tintColor && !switchProps->value) {
-    fillColor = theme.Brush(*switchProps->tintColor);
+  if (!props.disabled && props.onTintColor && props.value) {
+    fillColor = theme.Brush(*props.onTintColor);
+  } else if (!props.disabled && props.tintColor && !props.value) {
+    fillColor = theme.Brush(*props.tintColor);
   }
 
   // switch track - outline
-  if ((!switchProps->onTintColor && switchProps->value) || (!switchProps->tintColor && !switchProps->value)) {
+  if ((!props.onTintColor && props.value) || (!props.tintColor && !props.value)) {
     m_trackVisual.StrokeThickness(std::round(SwitchConstants::trackStrokeThickness * m_layoutMetrics.pointScaleFactor));
     m_trackVisual.StrokeBrush(defaultColor);
   } else {
@@ -220,7 +202,7 @@ void SwitchComponentView::updateVisuals() noexcept {
     m_thumbVisual.AnimationClass(winrt::Microsoft::ReactNative::Composition::Experimental::AnimationClass::None);
   }
 
-  if (switchProps->value) {
+  if (props.value) {
     m_thumbVisual.Offset(
         {(SwitchConstants::trackWidth - (SwitchConstants::thumbMargin + thumbWidth)) * m_layoutMetrics.pointScaleFactor,
          offsetY,
@@ -249,47 +231,18 @@ void SwitchComponentView::FinalizeUpdates(winrt::Microsoft::ReactNative::Compone
   base_type::FinalizeUpdates(updateMask);
 }
 
-void SwitchComponentView::prepareForRecycle() noexcept {}
-
-facebook::react::SharedViewProps SwitchComponentView::viewProps() noexcept {
-  return m_props;
-}
-
-void SwitchComponentView::ensureVisual() noexcept {
-  if (!m_visual) {
-    m_visual = m_compContext.CreateSpriteVisual();
-    OuterVisual().InsertAt(m_visual, 0);
-
-    m_trackVisual = m_compContext.CreateRoundedRectangleVisual();
-    m_visual.InsertAt(m_trackVisual, 0);
-
-    m_thumbVisual = m_compContext.CreateRoundedRectangleVisual();
-    m_thumbVisual.AnimationClass(winrt::Microsoft::ReactNative::Composition::Experimental::AnimationClass::SwitchThumb);
-    m_trackVisual.InsertAt(m_thumbVisual, 0);
-
-    handleScaleChange();
-  }
-}
+winrt::Microsoft::ReactNative::Composition::Experimental::IVisual SwitchComponentView::createVisual() noexcept {
+  auto visual = m_compContext.CreateSpriteVisual();
 
-facebook::react::Tag SwitchComponentView::hitTest(
-    facebook::react::Point pt,
-    facebook::react::Point &localPt,
-    bool ignorePointerEvents) const noexcept {
-  facebook::react::Point ptLocal{pt.x - m_layoutMetrics.frame.origin.x, pt.y - m_layoutMetrics.frame.origin.y};
-
-  if ((ignorePointerEvents || m_props->pointerEvents == facebook::react::PointerEventsMode::Auto ||
-       m_props->pointerEvents == facebook::react::PointerEventsMode::BoxOnly) &&
-      ptLocal.x >= 0 && ptLocal.x <= m_layoutMetrics.frame.size.width && ptLocal.y >= 0 &&
-      ptLocal.y <= m_layoutMetrics.frame.size.height) {
-    localPt = ptLocal;
-    return Tag();
-  }
+  m_trackVisual = m_compContext.CreateRoundedRectangleVisual();
+  visual.InsertAt(m_trackVisual, 0);
 
-  return -1;
-}
+  m_thumbVisual = m_compContext.CreateRoundedRectangleVisual();
+  m_thumbVisual.AnimationClass(winrt::Microsoft::ReactNative::Composition::Experimental::AnimationClass::SwitchThumb);
+  m_trackVisual.InsertAt(m_thumbVisual, 0);
 
-winrt::Microsoft::ReactNative::Composition::Experimental::IVisual SwitchComponentView::Visual() const noexcept {
-  return m_visual;
+  handleScaleChange();
+  return visual;
 }
 
 void SwitchComponentView::onThemeChanged() noexcept {
@@ -304,9 +257,7 @@ void SwitchComponentView::OnPointerPressed(
     return;
   }
 
-  const auto switchProps = std::static_pointer_cast<const facebook::react::SwitchProps>(m_props);
-
-  if (!switchProps->disabled) {
+  if (!switchProps().disabled) {
     m_pressed = true;
     m_supressAnimationForNextFrame = true;
 
@@ -364,27 +315,30 @@ void SwitchComponentView::OnKeyUp(
 }
 
 bool SwitchComponentView::toggle() noexcept {
-  const auto switchProps = std::static_pointer_cast<const facebook::react::SwitchProps>(m_props);
-
-  if (switchProps->disabled || !m_eventEmitter)
+  if (switchProps().disabled || !m_eventEmitter)
     return false;
 
   auto switchEventEmitter = std::static_pointer_cast<facebook::react::SwitchEventEmitter const>(m_eventEmitter);
 
   facebook::react::SwitchEventEmitter::OnChange args;
-  args.value = !(switchProps->value);
+  args.value = !(switchProps().value);
   args.target = Tag();
 
   switchEventEmitter->onChange(args);
   return true;
 }
 
-bool SwitchComponentView::focusable() const noexcept {
-  return m_props->focusable;
-}
-
 std::string SwitchComponentView::DefaultControlType() const noexcept {
   return "switch";
 }
 
+facebook::react::SharedViewProps SwitchComponentView::defaultProps() noexcept {
+  static auto const defaultProps = std::make_shared<facebook::react::SwitchProps const>();
+  return defaultProps;
+}
+
+const facebook::react::SwitchProps &SwitchComponentView::switchProps() const noexcept {
+  return *std::static_pointer_cast<const facebook::react::SwitchProps>(viewProps());
+}
+
 } // namespace winrt::Microsoft::ReactNative::Composition::implementation

package/Microsoft.ReactNative/Fabric/Composition/SwitchComponentView.h

@@ -13,8 +13,8 @@
 
 namespace winrt::Microsoft::ReactNative::Composition::implementation {
 
-struct SwitchComponentView : SwitchComponentViewT<SwitchComponentView, ComponentView> {
-  using Super = SwitchComponentViewT<SwitchComponentView, ComponentView>;
+struct SwitchComponentView : SwitchComponentViewT<SwitchComponentView, ViewComponentView> {
+  using Super = SwitchComponentViewT<SwitchComponentView, ViewComponentView>;
 
   [[nodiscard]] static winrt::Microsoft::ReactNative::ComponentView Create(
       const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext,
@@ -37,9 +37,6 @@ struct SwitchComponentView : SwitchComponentViewT<SwitchComponentView, Component
       facebook::react::LayoutMetrics const &layoutMetrics,
       facebook::react::LayoutMetrics const &oldLayoutMetrics) noexcept override;
   void FinalizeUpdates(winrt::Microsoft::ReactNative::ComponentViewUpdateMask updateMask) noexcept override;
-  void prepareForRecycle() noexcept override;
-  facebook::react::SharedViewProps viewProps() noexcept override;
-  bool focusable() const noexcept override;
   void onThemeChanged() noexcept override;
   void OnKeyUp(
       const winrt::Microsoft::ReactNative::Composition::Input::KeyboardSource &source,
@@ -53,9 +50,6 @@ struct SwitchComponentView : SwitchComponentViewT<SwitchComponentView, Component
   void OnPointerExited(
       const winrt::Microsoft::ReactNative::Composition::Input::PointerRoutedEventArgs &args) noexcept override;
 
-  facebook::react::Tag hitTest(facebook::react::Point pt, facebook::react::Point &localPt, bool ignorePointerEvents)
-      const noexcept override;
-  winrt::Microsoft::ReactNative::Composition::Experimental::IVisual Visual() const noexcept override;
   std::string DefaultControlType() const noexcept override;
 
   SwitchComponentView(
@@ -63,6 +57,10 @@ struct SwitchComponentView : SwitchComponentViewT<SwitchComponentView, Component
       facebook::react::Tag tag,
       winrt::Microsoft::ReactNative::ReactContext const &reactContext);
 
+  static facebook::react::SharedViewProps defaultProps() noexcept;
+  const facebook::react::SwitchProps &switchProps() const noexcept;
+  winrt::Microsoft::ReactNative::Composition::Experimental::IVisual createVisual() noexcept override;
+
  private:
   void ensureVisual() noexcept;
   bool toggle() noexcept;
@@ -74,10 +72,8 @@ struct SwitchComponentView : SwitchComponentViewT<SwitchComponentView, Component
   bool m_supressAnimationForNextFrame{false};
   bool m_visualUpdateRequired{true};
   facebook::react::Size m_contentSize;
-  winrt::Microsoft::ReactNative::Composition::Experimental::ISpriteVisual m_visual{nullptr};
   winrt::Microsoft::ReactNative::Composition::Experimental::IRoundedRectangleVisual m_trackVisual{nullptr};
   winrt::Microsoft::ReactNative::Composition::Experimental::IRoundedRectangleVisual m_thumbVisual{nullptr};
-  facebook::react::SharedViewProps m_props;
 };
 
 } // namespace winrt::Microsoft::ReactNative::Composition::implementation