react-native-windows 0.76.10 → 0.76.12

package/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputProps.cpp

@@ -24,6 +24,7 @@ WindowsTextInputProps::WindowsTextInputProps(
           */
 
       allowFontScaling(convertRawProp(context, rawProps, "allowFontScaling", sourceProps.allowFontScaling, {true})),
+      autoCorrect(convertRawProp(context, rawProps, "autoCorrect", sourceProps.autoCorrect, {true})),
       clearTextOnFocus(convertRawProp(context, rawProps, "clearTextOnFocus", sourceProps.clearTextOnFocus, {false})),
       editable(convertRawProp(context, rawProps, "editable", sourceProps.editable, {true})),
       maxLength(convertRawProp(context, rawProps, "maxLength", sourceProps.maxLength, {0})),
@@ -36,7 +37,7 @@ WindowsTextInputProps::WindowsTextInputProps(
       selection(convertRawProp(context, rawProps, "selection", sourceProps.selection, {})),
       selectionColor(convertRawProp(context, rawProps, "selectionColor", sourceProps.selectionColor, {})),
       selectTextOnFocus(convertRawProp(context, rawProps, "selectTextOnFocus", sourceProps.selectTextOnFocus, {false})),
-      spellCheck(convertRawProp(context, rawProps, "spellCheck", sourceProps.spellCheck, {false})),
+      spellCheck(convertRawProp(context, rawProps, "spellCheck", sourceProps.spellCheck, {true})),
       text(convertRawProp(context, rawProps, "text", sourceProps.text, {})),
       mostRecentEventCount(
           convertRawProp(context, rawProps, "mostRecentEventCount", sourceProps.mostRecentEventCount, {0})),
@@ -47,7 +48,10 @@ WindowsTextInputProps::WindowsTextInputProps(
       autoCapitalize(convertRawProp(context, rawProps, "autoCapitalize", sourceProps.autoCapitalize, {})),
       clearTextOnSubmit(convertRawProp(context, rawProps, "clearTextOnSubmit", sourceProps.clearTextOnSubmit, {false})),
       submitKeyEvents(convertRawProp(context, rawProps, "submitKeyEvents", sourceProps.submitKeyEvents, {})),
-      autoFocus(convertRawProp(context, rawProps, "autoFocus", sourceProps.autoFocus, {false})) {}
+      autoFocus(convertRawProp(context, rawProps, "autoFocus", sourceProps.autoFocus, {false})),
+      textAlign(
+          convertRawProp(context, rawProps, "textAlign", sourceProps.textAlign, facebook::react::TextAlignment::Left)) {
+}
 
 void WindowsTextInputProps::setProp(
     const PropsParserContext &context,

package/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputProps.h

@@ -4,6 +4,7 @@
 #pragma once
 
 #include <react/components/rnwcore/Props.h>
+#include <react/renderer/attributedstring/conversions.h>
 #include <react/renderer/components/text/BaseTextProps.h>
 #include <react/renderer/core/propsConversions.h>
 
@@ -96,6 +97,7 @@ class WindowsTextInputProps final : public ViewProps, public BaseTextProps {
   setProp(const PropsParserContext &context, RawPropsPropNameHash hash, const char *propName, RawValue const &value);
 
   bool allowFontScaling{true};
+  bool autoCorrect{true};
   bool clearTextOnFocus{false};
   bool editable{true};
   int maxLength{0};
@@ -107,7 +109,7 @@ class WindowsTextInputProps final : public ViewProps, public BaseTextProps {
   CompWindowsTextInputSelectionStruct selection{};
   SharedColor selectionColor{};
   bool selectTextOnFocus{false};
-  bool spellCheck{false};
+  bool spellCheck{true};
   std::string text{};
   int mostRecentEventCount{0};
   bool secureTextEntry{false};
@@ -118,6 +120,7 @@ class WindowsTextInputProps final : public ViewProps, public BaseTextProps {
   bool clearTextOnSubmit{false};
   std::vector<CompWindowsTextInputSubmitKeyEventsStruct> submitKeyEvents{};
   bool autoFocus{false};
+  facebook::react::TextAlignment textAlign{};
 };
 
 } // namespace facebook::react

package/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputShadowNode.cpp

@@ -3,7 +3,7 @@
 
 #include "WindowsTextInputShadowNode.h"
 
-#include <react/debug/react_native_assert.h>
+#include <react/featureflags/ReactNativeFeatureFlags.h>
 #include <react/renderer/attributedstring/AttributedStringBox.h>
 #include <react/renderer/attributedstring/TextAttributes.h>
 #include <react/renderer/components/text/BaseTextShadowNode.h>
@@ -12,38 +12,33 @@
 #include <react/renderer/core/conversions.h>
 #include <react/renderer/textlayoutmanager/TextLayoutContext.h>
 
-#include <utility>
-
 namespace facebook::react {
 
 extern const char WindowsTextInputComponentName[] = "WindowsTextInput";
 
-void WindowsTextInputShadowNode::setContextContainer(ContextContainer *contextContainer) {
+void WindowsTextInputShadowNode::setTextLayoutManager(std::shared_ptr<const TextLayoutManager> textLayoutManager) {
   ensureUnsealed();
-  m_contextContainer = contextContainer;
+  textLayoutManager_ = std::move(textLayoutManager);
 }
 
-AttributedString WindowsTextInputShadowNode::getAttributedString(const LayoutContext &layoutContext) const {
-  // Use BaseTextShadowNode to get attributed string from children
-
-  auto childTextAttributes = TextAttributes::defaultTextAttributes();
-  childTextAttributes.fontSizeMultiplier = layoutContext.fontSizeMultiplier;
-
-  childTextAttributes.apply(getConcreteProps().textAttributes);
-  // Don't propagate the background color of the TextInput onto the attributed
-  // string. Android tries to render shadow of the background alongside the
-  // shadow of the text which results in weird artifacts.
-  childTextAttributes.backgroundColor = HostPlatformColor::UndefinedColor;
+Size WindowsTextInputShadowNode::measureContent(
+    const LayoutContext &layoutContext,
+    const LayoutConstraints &layoutConstraints) const {
+  // Layout is called right after measure.
+  // Measure is marked as `const`, and `layout` is not; so State can be updated
+  // during layout, but not during `measure`. If State is out-of-date in layout,
+  // it's too late: measure will have already operated on old State. Thus, we
+  // use the same value here that we *will* use in layout to update the state.
+  AttributedString attributedString = getMostRecentAttributedString(layoutContext);
 
-  auto attributedString = AttributedString{};
-  auto attachments = BaseTextShadowNode::Attachments{};
-  BaseTextShadowNode::buildAttributedString(childTextAttributes, *this, attributedString, attachments);
+  if (attributedString.isEmpty()) {
+    attributedString = getPlaceholderAttributedString(layoutContext);
+  }
 
   // BaseTextShadowNode only gets children. We must detect and prepend text
   // value attributes manually.
   if (!getConcreteProps().text.empty()) {
     auto textAttributes = TextAttributes::defaultTextAttributes();
-    textAttributes.fontSizeMultiplier = layoutContext.fontSizeMultiplier;
     textAttributes.apply(getConcreteProps().textAttributes);
     auto fragment = AttributedString::Fragment{};
     fragment.string = getConcreteProps().text;
@@ -53,59 +48,42 @@ AttributedString WindowsTextInputShadowNode::getAttributedString(const LayoutCon
     // that effect.
     fragment.textAttributes.backgroundColor = clearColor();
     fragment.parentShadowView = ShadowView(*this);
-    attributedString.prependFragment(fragment);
+    attributedString.prependFragment(std::move(fragment));
   }
 
-  return attributedString;
-}
-
-// For measurement purposes, we want to make sure that there's at least a
-// single character in the string so that the measured height is greater
-// than zero. Otherwise, empty TextInputs with no placeholder don't
-// display at all.
-// TODO T67606511: We will redefine the measurement of empty strings as part
-// of T67606511
-AttributedString WindowsTextInputShadowNode::getPlaceholderAttributedString(const LayoutContext &layoutContext) const {
-  // Return placeholder text, since text and children are empty.
-  auto textAttributedString = AttributedString{};
-  auto fragment = AttributedString::Fragment{};
-  fragment.string = getConcreteProps().placeholder;
-
-  if (fragment.string.empty()) {
-    fragment.string = BaseTextShadowNode::getEmptyPlaceholder();
-  }
-
-  auto textAttributes = TextAttributes::defaultTextAttributes();
-  textAttributes.fontSizeMultiplier = layoutContext.fontSizeMultiplier;
-  textAttributes.apply(getConcreteProps().textAttributes);
-
-  // If there's no text, it's possible that this Fragment isn't actually
-  // appended to the AttributedString (see implementation of appendFragment)
-  fragment.textAttributes = textAttributes;
-  fragment.parentShadowView = ShadowView(*this);
-  textAttributedString.appendFragment(fragment);
+  TextLayoutContext textLayoutContext;
+  textLayoutContext.pointScaleFactor = layoutContext.pointScaleFactor;
 
-  return textAttributedString;
+  facebook::react::ParagraphAttributes paragraphAttributes{};
+  paragraphAttributes.maximumNumberOfLines = getConcreteProps().multiline ? 0 : 1;
+  return textLayoutManager_
+      ->measure(AttributedStringBox{attributedString}, paragraphAttributes, textLayoutContext, layoutConstraints)
+      .size;
 }
 
-void WindowsTextInputShadowNode::setTextLayoutManager(SharedTextLayoutManager textLayoutManager) {
-  ensureUnsealed();
-  m_textLayoutManager = std::move(textLayoutManager);
+void WindowsTextInputShadowNode::layout(LayoutContext layoutContext) {
+  updateStateIfNeeded(layoutContext);
+  ConcreteViewShadowNode::layout(layoutContext);
 }
 
-AttributedString WindowsTextInputShadowNode::getMostRecentAttributedString(const LayoutContext &layoutContext) const {
-  const auto &state = getStateData();
-
-  auto reactTreeAttributedString = getAttributedString(layoutContext);
-
-  // Sometimes the treeAttributedString will only differ from the state
-  // not by inherent properties (string or prop attributes), but by the frame of
-  // the parent which has changed Thus, we can't directly compare the entire
-  // AttributedString
-  bool treeAttributedStringChanged =
-      !state.reactTreeAttributedString.compareTextAttributesWithoutFrame(reactTreeAttributedString);
-
-  return (!treeAttributedStringChanged ? state.attributedString : reactTreeAttributedString);
+LayoutConstraints WindowsTextInputShadowNode::getTextConstraints(const LayoutConstraints &layoutConstraints) const {
+  if (getConcreteProps().multiline) {
+    return layoutConstraints;
+  } else {
+    // A single line TextInput acts as a horizontal scroller of infinitely
+    // expandable text, so we want to measure the text as if it is allowed to
+    // infinitely expand horizontally, and later clamp to the constraints of the
+    // input.
+    return LayoutConstraints{
+        .minimumSize = layoutConstraints.minimumSize,
+        .maximumSize =
+            Size{
+                .width = std::numeric_limits<Float>::infinity(),
+                .height = layoutConstraints.maximumSize.height,
+            },
+        .layoutDirection = layoutConstraints.layoutDirection,
+    };
+  }
 }
 
 void WindowsTextInputShadowNode::updateStateIfNeeded(const LayoutContext &layoutContext) {
@@ -146,59 +124,99 @@ void WindowsTextInputShadowNode::updateStateIfNeeded(const LayoutContext &layout
   // so no changes are applied There's no way to prevent a state update from
   // flowing to Java, so we just ensure it's a noop in those cases.
   setStateData(facebook::react::WindowsTextInputState{
-      newEventCount,
-      newAttributedString,
-      reactTreeAttributedString,
-      {},
-      state.defaultThemePaddingStart,
-      state.defaultThemePaddingEnd,
-      state.defaultThemePaddingTop,
-      state.defaultThemePaddingBottom});
+      AttributedStringBox(newAttributedString), reactTreeAttributedString, {}, newEventCount});
 }
 
-#pragma mark - LayoutableShadowNode
+AttributedString WindowsTextInputShadowNode::getAttributedString(const LayoutContext &layoutContext) const {
+  // Use BaseTextShadowNode to get attributed string from children
 
-Size WindowsTextInputShadowNode::measureContent(
-    const LayoutContext &layoutContext,
-    const LayoutConstraints &layoutConstraints) const {
-  if (getStateData().cachedAttributedStringId != 0) {
-    return m_textLayoutManager
-        ->measureCachedSpannableById(
-            getStateData().cachedAttributedStringId,
-            {}, // TODO getConcreteProps().paragraphAttributes
-            layoutConstraints)
-        .size;
-  }
+  auto childTextAttributes = TextAttributes::defaultTextAttributes();
+  childTextAttributes.fontSizeMultiplier = layoutContext.fontSizeMultiplier;
 
-  // Layout is called right after measure.
-  // Measure is marked as `const`, and `layout` is not; so State can be updated
-  // during layout, but not during `measure`. If State is out-of-date in layout,
-  // it's too late: measure will have already operated on old State. Thus, we
-  // use the same value here that we *will* use in layout to update the state.
-  AttributedString attributedString = getMostRecentAttributedString(layoutContext);
+  childTextAttributes.apply(getConcreteProps().textAttributes);
+  // Don't propagate the background color of the TextInput onto the attributed
+  // string. Android tries to render shadow of the background alongside the
+  // shadow of the text which results in weird artifacts.
+  childTextAttributes.backgroundColor = HostPlatformColor::UndefinedColor;
 
-  if (attributedString.isEmpty()) {
-    attributedString = getPlaceholderAttributedString(layoutContext);
-  }
+  auto attributedString = AttributedString{};
+  auto attachments = BaseTextShadowNode::Attachments{};
+  BaseTextShadowNode::buildAttributedString(childTextAttributes, *this, attributedString, attachments);
 
-  if (attributedString.isEmpty() && getStateData().mostRecentEventCount != 0) {
-    return {0, 0};
+  // BaseTextShadowNode only gets children. We must detect and prepend text
+  // value attributes manually.
+  if (!getConcreteProps().text.empty()) {
+    auto textAttributes = TextAttributes::defaultTextAttributes();
+    textAttributes.fontSizeMultiplier = layoutContext.fontSizeMultiplier;
+    textAttributes.apply(getConcreteProps().textAttributes);
+    auto fragment = AttributedString::Fragment{};
+    fragment.string = getConcreteProps().text;
+    fragment.textAttributes = textAttributes;
+    // If the TextInput opacity is 0 < n < 1, the opacity of the TextInput and
+    // text value's background will stack. This is a hack/workaround to prevent
+    // that effect.
+    fragment.textAttributes.backgroundColor = clearColor();
+    fragment.parentShadowView = ShadowView(*this);
+    attributedString.prependFragment(std::move(fragment));
   }
 
-  TextLayoutContext textLayoutContext;
-  textLayoutContext.pointScaleFactor = layoutContext.pointScaleFactor;
-  return m_textLayoutManager
-      ->measure(
-          AttributedStringBox{attributedString},
-          {}, // TODO getConcreteProps().paragraphAttributes,
-          textLayoutContext,
-          layoutConstraints)
-      .size;
+  return attributedString;
 }
 
-void WindowsTextInputShadowNode::layout(LayoutContext layoutContext) {
-  updateStateIfNeeded(layoutContext);
-  ConcreteViewShadowNode::layout(layoutContext);
+AttributedString WindowsTextInputShadowNode::getMostRecentAttributedString(const LayoutContext &layoutContext) const {
+  const auto &state = getStateData();
+
+  auto reactTreeAttributedString = getAttributedString(layoutContext);
+
+  // Sometimes the treeAttributedString will only differ from the state
+  // not by inherent properties (string or prop attributes), but by the frame of
+  // the parent which has changed Thus, we can't directly compare the entire
+  // AttributedString
+  bool treeAttributedStringChanged =
+      !state.reactTreeAttributedString.compareTextAttributesWithoutFrame(reactTreeAttributedString);
+
+  return (!treeAttributedStringChanged ? state.attributedStringBox.getValue() : reactTreeAttributedString);
 }
 
+// For measurement purposes, we want to make sure that there's at least a
+// single character in the string so that the measured height is greater
+// than zero. Otherwise, empty TextInputs with no placeholder don't
+// display at all.
+// TODO T67606511: We will redefine the measurement of empty strings as part
+// of T67606511
+AttributedString WindowsTextInputShadowNode::getPlaceholderAttributedString(const LayoutContext &layoutContext) const {
+  // Return placeholder text, since text and children are empty.
+  auto textAttributedString = AttributedString{};
+  auto fragment = AttributedString::Fragment{};
+  fragment.string = getConcreteProps().placeholder;
+
+  if (fragment.string.empty()) {
+    fragment.string = BaseTextShadowNode::getEmptyPlaceholder();
+  }
+
+  auto textAttributes = TextAttributes::defaultTextAttributes();
+  textAttributes.fontSizeMultiplier = layoutContext.fontSizeMultiplier;
+  textAttributes.apply(getConcreteProps().textAttributes);
+
+  // If there's no text, it's possible that this Fragment isn't actually
+  // appended to the AttributedString (see implementation of appendFragment)
+  fragment.textAttributes = textAttributes;
+  fragment.parentShadowView = ShadowView(*this);
+  textAttributedString.appendFragment(std::move(fragment));
+
+  return textAttributedString;
+  // TextLayoutContext textLayoutContext;
+  // textLayoutContext.pointScaleFactor = layoutContext.pointScaleFactor;
+  // auto textSize = textLayoutManager_
+  //                     ->measure(
+  //                         AttributedStringBox{attributedString},
+  //                         getConcreteProps().paragraphAttributes,
+  //                         textLayoutContext,
+  //                         textConstraints)
+  //                     .size;
+  // return layoutConstraints.clamp(textSize);
+}
+
+#pragma mark - LayoutableShadowNode
+
 } // namespace facebook::react

package/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputShadowNode.h

@@ -9,10 +9,10 @@
 #include "WindowsTextInputProps.h"
 #include "WindowsTextInputState.h"
 
+#include <react/renderer/attributedstring/AttributedString.h>
 #include <react/renderer/components/view/ConcreteViewShadowNode.h>
 #include <react/utils/ContextContainer.h>
 
-#include <react/renderer/attributedstring/AttributedString.h>
 #include <react/renderer/textlayoutmanager/TextLayoutManager.h>
 
 namespace facebook::react {
@@ -28,56 +28,59 @@ class WindowsTextInputShadowNode final : public ConcreteViewShadowNode<
                                              WindowsTextInputEventEmitter,
                                              WindowsTextInputState> {
  public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
   static ShadowNodeTraits BaseTraits() {
     auto traits = ConcreteViewShadowNode::BaseTraits();
     traits.set(ShadowNodeTraits::Trait::LeafYogaNode);
+    traits.set(ShadowNodeTraits::Trait::MeasurableYogaNode);
     traits.set(ShadowNodeTraits::Trait::BaselineYogaNode);
     return traits;
   }
 
-  using ConcreteViewShadowNode::ConcreteViewShadowNode;
-
-  void setContextContainer(ContextContainer *contextContainer);
-
-  /*
-   * Returns a `AttributedString` which represents text content of the node.
-   */
-  AttributedString getAttributedString(const LayoutContext &layoutContext) const;
-  AttributedString getPlaceholderAttributedString(const LayoutContext &layoutContext) const;
-
   /*
    * Associates a shared TextLayoutManager with the node.
-   * `ParagraphShadowNode` uses the manager to measure text content
-   * and construct `ParagraphState` objects.
+   * `TextInputShadowNode` uses the manager to measure text content
+   * and construct `TextInputState` objects.
    */
-  void setTextLayoutManager(SharedTextLayoutManager textLayoutManager);
+  void setTextLayoutManager(std::shared_ptr<const TextLayoutManager> textLayoutManager);
 
 #pragma mark - LayoutableShadowNode
-
+ protected:
   Size measureContent(const LayoutContext &layoutContext, const LayoutConstraints &layoutConstraints) const override;
+
   void layout(LayoutContext layoutContext) override;
 
- private:
-  ContextContainer *m_contextContainer{};
+  Float baseline(const LayoutContext &layoutContext, Size size) const override {
+    // Calculate baseline as 80% of the text height
+    return size.height * 0.8f;
+  }
 
-  /**
-   * Get the most up-to-date attributed string for measurement and State.
+  std::shared_ptr<const TextLayoutManager> textLayoutManager_;
+
+  /*
+   * Determines the constraints to use while measure the underlying text
    */
-  AttributedString getMostRecentAttributedString(const LayoutContext &layoutContext) const;
+  LayoutConstraints getTextConstraints(const LayoutConstraints &layoutConstraints) const;
 
+ private:
   /*
    * Creates a `State` object (with `AttributedText` and
    * `TextLayoutManager`) if needed.
    */
   void updateStateIfNeeded(const LayoutContext &layoutContext);
 
-  SharedTextLayoutManager m_textLayoutManager;
-
   /*
-   * Cached attributed string that represents the content of the subtree started
-   * from the node.
+   * Returns a `AttributedString` which represents text content of the node.
    */
-  mutable std::optional<AttributedString> m_cachedAttributedString{};
+  AttributedString getAttributedString(const LayoutContext &layoutContext) const;
+
+  /**
+   * Get the most up-to-date attributed string for measurement and State.
+   */
+  AttributedString getMostRecentAttributedString(const LayoutContext &layoutContext) const;
+
+  AttributedString getPlaceholderAttributedString(const LayoutContext &layoutContext) const;
 };
 
 } // namespace facebook::react

package/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputState.cpp

@@ -4,31 +4,21 @@
 
 #include "WindowsTextInputState.h"
 
-#include <react/renderer/components/text/conversions.h>
-#include <react/renderer/debug/debugStringConvertibleUtils.h>
-#include <react/renderer/mapbuffer/MapBuffer.h>
-#include <react/renderer/mapbuffer/MapBufferBuilder.h>
-
-#include <utility>
+#ifdef ANDROID
+#include <react/renderer/attributedstring/conversions.h>
+#include <react/renderer/components/text/ParagraphState.h>
+#endif
 
 namespace facebook::react {
 
 WindowsTextInputState::WindowsTextInputState(
-    int64_t mostRecentEventCount,
-    AttributedString attributedString,
+    AttributedStringBox attributedStringBox,
     AttributedString reactTreeAttributedString,
     ParagraphAttributes paragraphAttributes,
-    double defaultThemePaddingStart,
-    double defaultThemePaddingEnd,
-    double defaultThemePaddingTop,
-    double defaultThemePaddingBottom)
-    : mostRecentEventCount(mostRecentEventCount),
-      attributedString(std::move(attributedString)),
+    int64_t mostRecentEventCount)
+    : attributedStringBox(std::move(attributedStringBox)),
       reactTreeAttributedString(std::move(reactTreeAttributedString)),
       paragraphAttributes(std::move(paragraphAttributes)),
-      defaultThemePaddingStart(defaultThemePaddingStart),
-      defaultThemePaddingEnd(defaultThemePaddingEnd),
-      defaultThemePaddingTop(defaultThemePaddingTop),
-      defaultThemePaddingBottom(defaultThemePaddingBottom) {}
+      mostRecentEventCount(mostRecentEventCount) {}
 
 } // namespace facebook::react

package/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputState.h

@@ -3,33 +3,29 @@
 
 #pragma once
 
-#include <folly/dynamic.h>
-#include <react/renderer/attributedstring/AttributedString.h>
+#include <react/renderer/attributedstring/AttributedStringBox.h>
 #include <react/renderer/attributedstring/ParagraphAttributes.h>
-#include <react/renderer/mapbuffer/MapBuffer.h>
-#include <react/renderer/mapbuffer/MapBufferBuilder.h>
 #include <react/renderer/textlayoutmanager/TextLayoutManager.h>
 
 namespace facebook::react {
 
 /*
- * State for <WindowsTextInput> component.
+ * State for <TextInput> component.
  */
 class WindowsTextInputState final {
  public:
-  int64_t mostRecentEventCount{0};
+  WindowsTextInputState() = default;
 
-  /**
-   * Stores an opaque cache ID used on the Java side to refer to a specific
-   * AttributedString for measurement purposes only.
-   */
-  int64_t cachedAttributedStringId{0};
+  WindowsTextInputState(
+      AttributedStringBox attributedStringBox,
+      AttributedString reactTreeAttributedString,
+      ParagraphAttributes paragraphAttributes,
+      int64_t mostRecentEventCount);
 
   /*
-   * All content of <TextInput> component represented as an `AttributedString`.
-   * Only set if changed from the React tree's perspective.
+   * All content of <TextInput> component.
    */
-  AttributedString attributedString{};
+  AttributedStringBox attributedStringBox;
 
   /*
    * All content of <TextInput> component represented as an `AttributedString`.
@@ -44,28 +40,9 @@ class WindowsTextInputState final {
    * Represents all visual attributes of a paragraph of text represented as
    * a ParagraphAttributes.
    */
-  ParagraphAttributes paragraphAttributes{};
+  ParagraphAttributes paragraphAttributes;
 
-  /**
-   * Communicates Android theme padding back to the ShadowNode / Component
-   * Descriptor for layout.
-   */
-  double defaultThemePaddingStart{NAN};
-  double defaultThemePaddingEnd{NAN};
-  double defaultThemePaddingTop{NAN};
-  double defaultThemePaddingBottom{NAN};
-
-  WindowsTextInputState(
-      int64_t mostRecentEventCount,
-      AttributedString attributedString,
-      AttributedString reactTreeAttributedString,
-      ParagraphAttributes paragraphAttributes,
-      double defaultThemePaddingStart,
-      double defaultThemePaddingEnd,
-      double defaultThemePaddingTop,
-      double defaultThemePaddingBottom);
-
-  WindowsTextInputState() = default;
+  int64_t mostRecentEventCount{0};
 };
 
 } // namespace facebook::react

package/Microsoft.ReactNative/Fabric/FabricUIManagerModule.cpp

@@ -115,7 +115,6 @@ void FabricUIManager::installFabricUIManager() noexcept {
 
   m_scheduler = std::make_shared<facebook::react::Scheduler>(
       toolbox, (/*animationDriver_ ? animationDriver_.get() :*/ nullptr), this);
-  m_surfaceManager = std::make_shared<facebook::react::SurfaceManager>(*m_scheduler);
 }
 
 const IComponentViewRegistry &FabricUIManager::GetViewRegistry() const noexcept {
@@ -143,17 +142,38 @@ void FabricUIManager::startSurface(
   layoutContext.pointScaleFactor = rootView.ScaleFactor();
   layoutContext.fontSizeMultiplier = rootView.FontSizeMultiplier();
 
-  m_surfaceManager->startSurface(
-      surfaceId,
-      moduleName,
-      initialProps,
-      layoutConstraints,
-      layoutContext // layout context
-  );
+  {
+    std::unique_lock lock(m_handlerMutex);
+    auto surfaceHandler = facebook::react::SurfaceHandler{moduleName, surfaceId};
+    surfaceHandler.setContextContainer(m_scheduler->getContextContainer());
+    m_handlerRegistry.emplace(surfaceId, std::move(surfaceHandler));
+  }
+
+  visit(surfaceId, [&](const facebook::react::SurfaceHandler &surfaceHandler) {
+    surfaceHandler.setProps(initialProps);
+    surfaceHandler.constraintLayout(layoutConstraints, layoutContext);
+    m_scheduler->registerSurface(surfaceHandler);
+    surfaceHandler.start();
+  });
+}
+
+void FabricUIManager::setProps(facebook::react::SurfaceId surfaceId, const folly::dynamic &props) const noexcept {
+  visit(surfaceId, [=](const facebook::react::SurfaceHandler &surfaceHandler) { surfaceHandler.setProps(props); });
 }
 
 void FabricUIManager::stopSurface(facebook::react::SurfaceId surfaceId) noexcept {
-  m_surfaceManager->stopSurface(surfaceId);
+  visit(surfaceId, [&](const facebook::react::SurfaceHandler &surfaceHandler) {
+    surfaceHandler.stop();
+    m_scheduler->unregisterSurface(surfaceHandler);
+  });
+
+  {
+    std::unique_lock lock(m_handlerMutex);
+
+    auto iterator = m_handlerRegistry.find(surfaceId);
+    m_handlerRegistry.erase(iterator);
+  }
+
   auto &rootDescriptor = m_registry.componentViewDescriptorWithTag(surfaceId);
   rootDescriptor.view.as<winrt::Microsoft::ReactNative::Composition::implementation::RootComponentView>()->stop();
   m_registry.enqueueComponentViewWithComponentHandle(
@@ -164,14 +184,36 @@ facebook::react::Size FabricUIManager::measureSurface(
     facebook::react::SurfaceId surfaceId,
     const facebook::react::LayoutConstraints &layoutConstraints,
     const facebook::react::LayoutContext &layoutContext) const noexcept {
-  return m_surfaceManager->measureSurface(surfaceId, layoutConstraints, layoutContext);
+  auto size = facebook::react::Size{};
+
+  visit(surfaceId, [&](const facebook::react::SurfaceHandler &surfaceHandler) {
+    size = surfaceHandler.measure(layoutConstraints, layoutContext);
+  });
+
+  return size;
 }
 
 void FabricUIManager::constraintSurfaceLayout(
     facebook::react::SurfaceId surfaceId,
     const facebook::react::LayoutConstraints &layoutConstraints,
     const facebook::react::LayoutContext &layoutContext) const noexcept {
-  m_surfaceManager->constraintSurfaceLayout(surfaceId, layoutConstraints, layoutContext);
+  visit(surfaceId, [=](const facebook::react::SurfaceHandler &surfaceHandler) {
+    surfaceHandler.constraintLayout(layoutConstraints, layoutContext);
+  });
+}
+
+void FabricUIManager::visit(
+    facebook::react::SurfaceId surfaceId,
+    const std::function<void(const facebook::react::SurfaceHandler &surfaceHandler)> &callback) const noexcept {
+  std::shared_lock lock(m_handlerMutex);
+
+  auto iterator = m_handlerRegistry.find(surfaceId);
+
+  if (iterator == m_handlerRegistry.end()) {
+    return;
+  }
+
+  callback(iterator->second);
 }
 
 winrt::Microsoft::ReactNative::ReactNotificationId<facebook::react::SurfaceId>