Fabric : Implements selectable prop for <Text> (#15473)

* visual studio 2026 strict check fix

* Implement text selection with drag highlight for selectable prop

* implemented copy to clipboard

* CTRL + A to select all text

* Double-click on a word in selectable text selects the word

* right click on selected text provides context menu

* fixes unselect after CTRL + A selection

* implements I-beam cursor for selectable text

* default selection color cleanup

* yarn lint:fix and format

* Change files

* nit

* nit

* review comments ( double click , theme ( use of system api) , Capture pointer )

* removed weak_ref of ComponentView rather take ReactTaggedView

* yarn format

* review comments

* nit

* review comments : nit

* invalid/null tag returns -1 for ReactTaggedView

* support CJK selcetion using icu.h

* update Desktop.DLL  with icu.lib

* CJK word boundary using dictionary

* review comments

* yarn lint:fix and format

* Add IcuUtils.cpp to project files for CJK support

* remove ICUUtils from  Microsoft.ReactNative.vcxproj already added to shared

Author: iamAbhi-916

change/react-native-windows-fdfd881c-5b04-4c05-ace6-fcca42dbd230.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Implements selectable for <Text>",
+  "packageName": "react-native-windows",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

packages/playground/Samples/text.tsx

@@ -20,6 +20,23 @@ export default class Bootstrap extends React.Component {
           selectable={true}>
           Click here : This is a text with a tooltip.
         </Text>
+
+        <View style={styles.selectionTestContainer}>
+          <Text style={styles.sectionTitle}>Text Selection Test</Text>
+          <Text selectable={true} style={styles.selectableText}>
+            This text is SELECTABLE. Try clicking and dragging to select it.
+          </Text>
+          <Text selectable={true} style={styles.selectableText}>
+            Hello 世界世界 World - Double-click to test CJK word selection!
+          </Text>
+          <Text selectable={false} style={styles.nonSelectableText}>
+            This text is NOT selectable (selectable=false).
+          </Text>
+          <Text style={styles.defaultText}>
+            This text has no selectable prop (default behavior).
+          </Text>
+        </View>
+
         <View
           style={styles.container2}
           accessible={true}
@@ -64,6 +81,38 @@ const styles = StyleSheet.create({
     textAlign: 'center',
     margin: 10,
   },
+  selectionTestContainer: {
+    backgroundColor: '#f0f0f0',
+    padding: 15,
+    marginVertical: 10,
+    borderRadius: 8,
+    width: 400,
+  },
+  sectionTitle: {
+    fontSize: 18,
+    fontWeight: 'bold',
+    marginBottom: 10,
+    color: '#333',
+  },
+  selectableText: {
+    fontSize: 16,
+    color: '#007ACC',
+    marginBottom: 8,
+    padding: 8,
+    backgroundColor: '#e8f4fc',
+  },
+  nonSelectableText: {
+    fontSize: 16,
+    color: '#666',
+    marginBottom: 8,
+    padding: 8,
+    backgroundColor: '#f5f5f5',
+  },
+  defaultText: {
+    fontSize: 16,
+    color: '#999',
+    padding: 8,
+  },
 });
 
 AppRegistry.registerComponent('Bootstrap', () => Bootstrap);

vnext/Desktop.DLL/React.Windows.Desktop.DLL.vcxproj

@@ -110,6 +110,7 @@
         windowscodecs.lib;
         WindowsApp_downlevel.lib;
         dxguid.lib;
+        icu.lib;
         %(AdditionalDependencies)
       </AdditionalDependencies>
       <AdditionalDependencies Condition="'$(Platform)' == 'ARM64EC'">

vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.cpp

@@ -15,6 +15,7 @@
 #include <winrt/Windows.UI.Input.h>
 #include "Composition.Input.h"
 #include "CompositionViewComponentView.h"
+#include "ParagraphComponentView.h"
 #include "ReactNativeIsland.h"
 #include "RootComponentView.h"
 
@@ -1095,6 +1096,13 @@ void CompositionEventHandler::onPointerExited(
 void CompositionEventHandler::onPointerPressed(
     const winrt::Microsoft::ReactNative::Composition::Input::PointerPoint &pointerPoint,
     winrt::Windows::System::VirtualKeyModifiers keyModifiers) noexcept {
+  namespace Composition = winrt::Microsoft::ReactNative::Composition;
+
+  // Clears any active text selection when left pointer is pressed
+  if (pointerPoint.Properties().PointerUpdateKind() != Composition::Input::PointerUpdateKind::RightButtonPressed) {
+    RootComponentView().ClearCurrentTextSelection();
+  }
+
   PointerId pointerId = pointerPoint.PointerId();
 
   auto staleTouch = std::find_if(m_activeTouches.begin(), m_activeTouches.end(), [pointerId](const auto &pair) {