From ce1b0748911ea7bcc1aa706cc7ce54e358eb2651 Mon Sep 17 00:00:00 2001
From: Nick Lefever <lefever@meta.com>
Date: Thu, 22 Feb 2024 03:11:02 +0100
Subject: [PATCH 1/3] [fabric] Add support for setting a tool tip on View
 component

Summary: This diff adds the macOS `tooltip` property to the View component and assigns the provided text to the native NSView `toolTip` property.

Test Plan:
* Run Zeratul with Fabric enabled
* Hover over buttons and check that a tool tip is displayed.

 https://pxl.cl/4nM7h

Reviewers: shawndempsey, #rn-desktop

Reviewed By: shawndempsey

Differential Revision: https://phabricator.intern.facebook.com/D54045717
---
 .../ComponentViews/View/RCTViewComponentView.mm      | 11 +++++++++++
 .../components/view/HostPlatformViewProps.cpp        | 12 +++++++++++-
 .../renderer/components/view/HostPlatformViewProps.h |  5 +++++
 3 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm b/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm
index 086bfc1e18bdf9..23ab6549b2a89f 100644
--- a/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm
+++ b/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm
@@ -588,6 +588,17 @@ - (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &
     needsInvalidateLayer = YES;
   }
 
+#if TARGET_OS_OSX // [macOS]
+  // `tooltip`
+  if (oldViewProps.tooltip != newViewProps.tooltip) {
+    if (newViewProps.tooltip.has_value()) {
+      self.toolTip = RCTNSStringFromStringNilIfEmpty(newViewProps.tooltip.value());
+    } else {
+      self.toolTip = nil;
+    }
+  }
+#endif // macOS]
+
   _needsInvalidateLayer = _needsInvalidateLayer || needsInvalidateLayer;
 
   _props = std::static_pointer_cast<const ViewProps>(props);
diff --git a/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.cpp b/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.cpp
index 4dc677333b23f9..8b4d4a6bb5097a 100644
--- a/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.cpp
+++ b/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.cpp
@@ -65,7 +65,16 @@ HostPlatformViewProps::HostPlatformViewProps(
                     rawProps,
                     "keyUpEvents",
                     sourceProps.keyUpEvents,
-                    {})) {}
+                    {})),
+      tooltip(
+          ReactNativeFeatureFlags::enableCppPropsIteratorSetter()
+              ? sourceProps.tooltip
+              : convertRawProp(
+                   context,
+                   rawProps,
+                   "tooltip",
+                   sourceProps.tooltip,
+                   {})) {}
 
 #define VIEW_EVENT_CASE_MACOS(eventType)                           \
   case CONSTEXPR_RAW_PROPS_KEY_HASH("on" #eventType): {            \
@@ -102,6 +111,7 @@ void HostPlatformViewProps::setProp(
     RAW_SET_PROP_SWITCH_CASE_BASIC(enableFocusRing);
     RAW_SET_PROP_SWITCH_CASE_BASIC(keyDownEvents);
     RAW_SET_PROP_SWITCH_CASE_BASIC(keyUpEvents);
+    RAW_SET_PROP_SWITCH_CASE_BASIC(tooltip);
   }
 }
 
diff --git a/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.h b/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.h
index f2e4424f8818f4..c2b0c3acf7ddff 100644
--- a/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.h
+++ b/packages/react-native/ReactCommon/react/renderer/components/view/platform/macos/react/renderer/components/view/HostPlatformViewProps.h
@@ -16,6 +16,9 @@
 
 #include <react/renderer/components/view/KeyEvent.h>
 
+#include <optional>
+#include <string>
+
 #include "HostPlatformViewEvents.h"
 
 namespace facebook::react {
@@ -43,5 +46,7 @@ class HostPlatformViewProps : public BaseViewProps {
 
   std::vector<HandledKey> keyDownEvents{};
   std::vector<HandledKey> keyUpEvents{};
+
+  std::optional<std::string> tooltip{};
 };
 } // namespace facebook::react

From 7021cbee189c1a41ddb243a342443eed3804cb27 Mon Sep 17 00:00:00 2001
From: Saad Najmi <sanajmi@microsoft.com>
Date: Fri, 3 Oct 2025 17:11:39 -0700
Subject: [PATCH 2/3] move example

---
 packages/rn-tester/js/examples/Tooltip/TooltipExample.js | 1 +
 packages/rn-tester/js/utils/RNTesterList.ios.js          | 9 +++++----
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/rn-tester/js/examples/Tooltip/TooltipExample.js b/packages/rn-tester/js/examples/Tooltip/TooltipExample.js
index 480a041e97b358..94082633217cad 100644
--- a/packages/rn-tester/js/examples/Tooltip/TooltipExample.js
+++ b/packages/rn-tester/js/examples/Tooltip/TooltipExample.js
@@ -51,6 +51,7 @@ exports.examples = [
   {
     title: 'Button',
     description: ('Simple button to showcase tooltip.': string),
+    category: 'UI',
     render: function (): React.Node {
       return (
         <Button
diff --git a/packages/rn-tester/js/utils/RNTesterList.ios.js b/packages/rn-tester/js/utils/RNTesterList.ios.js
index 6d7ee8ce1d7185..87a92d6de5f18f 100644
--- a/packages/rn-tester/js/utils/RNTesterList.ios.js
+++ b/packages/rn-tester/js/utils/RNTesterList.ios.js
@@ -127,10 +127,6 @@ const Components: Array<RNTesterModuleInfo> = [
     module: require('../examples/TextInput/TextInputExample.ios'),
     category: 'Basic',
   },
-  {
-    key: 'TooltipExample',
-    module: require('../examples/Tooltip/TooltipExample'),
-  },
   {
     key: 'TouchableExample',
     module: require('../examples/Touchable/TouchableExample'),
@@ -186,6 +182,11 @@ const APIs: Array<RNTesterModuleInfo> = ([
     key: 'AccessibilityShowMenu',
     module: require('../examples/AccessibilityShowMenu/AccessibilityShowMenu'),
     category: 'macOS',
+  },
+  {
+    key: 'TooltipExample',
+    module: require('../examples/Tooltip/TooltipExample'),
+    category: 'macOS',
   }, // macOS]
   {
     key: 'AccessibilityExample',

From 03b12af754b04471838c8348b6b2d6c81fc966b3 Mon Sep 17 00:00:00 2001
From: Saad Najmi <sanajmi@microsoft.com>
Date: Fri, 3 Oct 2025 20:43:56 -0700
Subject: [PATCH 3/3] Update TooltipExample.js

---
 packages/rn-tester/js/examples/Tooltip/TooltipExample.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/rn-tester/js/examples/Tooltip/TooltipExample.js b/packages/rn-tester/js/examples/Tooltip/TooltipExample.js
index 94082633217cad..480a041e97b358 100644
--- a/packages/rn-tester/js/examples/Tooltip/TooltipExample.js
+++ b/packages/rn-tester/js/examples/Tooltip/TooltipExample.js
@@ -51,7 +51,6 @@ exports.examples = [
   {
     title: 'Button',
     description: ('Simple button to showcase tooltip.': string),
-    category: 'UI',
     render: function (): React.Node {
       return (
         <Button