react · coado · Sep 14, 2026 · Sep 14, 2026 · Sep 14, 2026 · Sep 14, 2026
diff --git a/packages/react-native/Package.swift b/packages/react-native/Package.swift
@@ -287,21 +287,29 @@ let reactJsErrorHandler = RNTarget(
   dependencies: [.reactNativeDependencies, .jsi, .reactFeatureFlags, .reactDebug, .reactTurboModuleBridging]
 )
 
+/// React-renderercss.podspec
+let reactRendererCss = RNTarget(
+  name: .reactRendererCss,
+  path: "ReactCommon/react/renderer/css",
+  excludedPaths: ["tests"],
+  dependencies: [.reactNativeDependencies, .reactDebug, .reactUtils]
+)
+
 /// React-graphicsApple
 /// This represents the React-graphicsApple BUCK module
 let reactGraphicsApple = RNTarget(
   name: .reactGraphicsApple,
   path: "ReactCommon/react/renderer/graphics/platform/ios",
   linkedFrameworks: ["UIKit", "CoreGraphics"],
-  dependencies: [.reactDebug, .jsi, .reactUtils, .reactNativeDependencies]
+  dependencies: [.reactDebug, .jsi, .reactUtils, .reactNativeDependencies, .reactRendererCss]
 )
 
 /// React-graphics.podspec
 let reactGraphics = RNTarget(
   name: .reactGraphics,
   path: "ReactCommon/react/renderer/graphics",
   excludedPaths: ["platform", "tests"],
-  dependencies: [.reactNativeDependencies, .jsi, .reactJsiExecutor, .reactRendererDebug, .reactUtils, .reactGraphicsApple]
+  dependencies: [.reactNativeDependencies, .jsi, .reactJsiExecutor, .reactRendererDebug, .reactUtils, .reactGraphicsApple, .reactRendererCss]
 )
 
 /// ReactCommon.podspec
@@ -491,7 +499,7 @@ let reactFabric = RNTarget(
     "observers/resize/tests",
     "scheduler/tests",
   ],
-  dependencies: [.reactNativeDependencies, .reactJsiExecutor, .rctTypesafety, .reactTurboModuleCore, .jsi, .logger, .reactDebug, .reactFeatureFlags, .reactUtils, .reactRuntimeScheduler, .reactCxxReact, .reactRendererDebug, .reactGraphics, .yoga, .reactJsInspectorTracing],
+  dependencies: [.reactNativeDependencies, .reactJsiExecutor, .rctTypesafety, .reactTurboModuleCore, .jsi, .logger, .reactDebug, .reactFeatureFlags, .reactUtils, .reactRuntimeScheduler, .reactCxxReact, .reactRendererDebug, .reactGraphics, .reactRendererCss, .yoga, .reactJsInspectorTracing],
   sources: ["animated", "animationbackend", "animations", "attributedstring", "core", "componentregistry", "componentregistry/native", "components/root", "components/view", "components/view/platform/cxx", "components/scrollview", "components/scrollview/platform/cxx", "components/scrollview/platform/ios", "components/legacyviewmanagerinterop", "components/legacyviewmanagerinterop/platform/ios", "dom", "scheduler", "mounting", "observers/events", "observers/intersection", "observers/mutation", "observers/resize", "telemetry", "consistency", "leakchecker", "uimanager", "uimanager/consistency", "viewtransition"]
 )
 
@@ -713,6 +721,7 @@ let targets = [
   reactPerformanceTimeline,
   reactRuntimeScheduler,
   rctTypesafety,
+  reactRendererCss,
   reactGraphics,
   reactGraphicsApple,
   reactImageManager,

diff --git a/packages/react-native/ReactAndroid/build.gradle.kts b/packages/react-native/ReactAndroid/build.gradle.kts
@@ -152,6 +152,7 @@ val preparePrefab by
                       Pair("../ReactCommon/react/renderer/debug/", "react/renderer/debug/"),
                       // react_renderer_graphics
                       Pair("../ReactCommon/react/renderer/graphics/", "react/renderer/graphics/"),
+                      Pair("../ReactCommon/react/renderer/graphics/React/", "React/"),
                       Pair("../ReactCommon/react/renderer/graphics/platform/android/", ""),
                       // react_renderer_imagemanager
                       Pair(

diff --git a/packages/react-native/ReactCommon/React-Fabric.podspec b/packages/react-native/ReactCommon/React-Fabric.podspec
@@ -77,6 +77,7 @@ Pod::Spec.new do |s|
   end
 
   s.subspec "attributedstring" do |ss|
+    ss.dependency           "React-renderercss"
     ss.source_files         = podspec_sources("react/renderer/attributedstring/**/*.{m,mm,cpp,h}", "react/renderer/attributedstring/**/*.{h}")
     ss.exclude_files        = "react/renderer/attributedstring/tests"
     ss.header_dir           = "react/renderer/attributedstring"
@@ -209,6 +210,7 @@ Pod::Spec.new do |s|
     end
 
     ss.subspec "intersection" do |sss|
+      sss.dependency           "React-renderercss"
       sss.source_files         = podspec_sources("react/renderer/observers/intersection/**/*.{m,mm,cpp,h}", "react/renderer/observers/intersection/**/*.h")
       sss.exclude_files        = "react/renderer/observers/intersection/tests"
       sss.header_dir           = "react/renderer/observers/intersection"

diff --git a/packages/react-native/ReactCommon/react/renderer/attributedstring/CMakeLists.txt b/packages/react-native/ReactCommon/react/renderer/attributedstring/CMakeLists.txt
@@ -21,6 +21,7 @@ target_link_libraries(react_renderer_attributedstring
         react_debug
         rrc_view
         react_renderer_core
+        react_renderer_css
         react_renderer_debug
         react_renderer_graphics
         react_renderer_mapbuffer

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundImage.h b/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundImage.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/LinearGradient.h>
 #include <react/renderer/graphics/RadialGradient.h>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundPosition.h b/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundPosition.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/ValueUnit.h>
 #include <optional>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundRepeat.h b/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundRepeat.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 namespace facebook::react {
 
 enum class BackgroundRepeatStyle {

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundSize.h b/packages/react-native/ReactCommon/react/renderer/graphics/BackgroundSize.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/ValueUnit.h>
 #include <variant>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/BlendMode.h b/packages/react-native/ReactCommon/react/renderer/graphics/BlendMode.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <optional>
 #include <string_view>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/BoxShadow.h b/packages/react-native/ReactCommon/react/renderer/graphics/BoxShadow.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/Color.h>
 #include <react/renderer/graphics/Float.h>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/CMakeLists.txt b/packages/react-native/ReactCommon/react/renderer/graphics/CMakeLists.txt
@@ -23,15 +23,21 @@ target_include_directories(react_renderer_graphics
           ${REACT_COMMON_DIR}
           ${platform_DIR}
         )
+target_include_directories(react_renderer_graphics INTERFACE ${REACT_COMMON_DIR}/react/renderer/graphics)
 
 react_native_android_selector(fbjni fbjni "")
 target_link_libraries(react_renderer_graphics
-        glog
-        ${fbjni}
-        folly_runtime
-        react_debug
-        react_renderer_debug
-        react_utils
+        PUBLIC
+          ${fbjni}
+          folly_runtime
+          react_cxxstableapi
+          react_renderer_debug
+          react_utils
+        PRIVATE
+          glog
+          react_debug
+          react_featureflags
+          react_renderer_css
 )
 target_compile_reactnative_options(react_renderer_graphics PRIVATE)
 target_compile_options(react_renderer_graphics PRIVATE -Wpedantic)
diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Color.h b/packages/react-native/ReactCommon/react/renderer/graphics/Color.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/ColorComponents.h>
 #include <react/renderer/graphics/HostPlatformColor.h>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/ColorComponents.h b/packages/react-native/ReactCommon/react/renderer/graphics/ColorComponents.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 namespace facebook::react {
 
 enum class ColorSpace { sRGB, DisplayP3 };

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/ColorStop.h b/packages/react-native/ReactCommon/react/renderer/graphics/ColorStop.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/debug/flags.h>
 #include <react/renderer/graphics/Color.h>
 #include <react/renderer/graphics/Float.h>

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Filter.h b/packages/react-native/ReactCommon/react/renderer/graphics/Filter.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/Color.h>
 #include <react/renderer/graphics/Float.h>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Isolation.h b/packages/react-native/ReactCommon/react/renderer/graphics/Isolation.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <optional>
 #include <string_view>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/LinearGradient.h b/packages/react-native/ReactCommon/react/renderer/graphics/LinearGradient.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/debug/flags.h>
 #include <react/renderer/graphics/ColorStop.h>
 #include <react/renderer/graphics/Float.h>

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Point.h b/packages/react-native/ReactCommon/react/renderer/graphics/Point.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/Float.h>
 #include <react/utils/hash_combine.h>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/RadialGradient.h b/packages/react-native/ReactCommon/react/renderer/graphics/RadialGradient.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/debug/flags.h>
 #include <react/renderer/graphics/ColorStop.h>
 #include <react/renderer/graphics/Float.h>

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/React-graphics.podspec b/packages/react-native/ReactCommon/react/renderer/graphics/React-graphics.podspec
@@ -38,6 +38,12 @@ Pod::Spec.new do |s|
     header_search_paths = header_search_paths + ["\"$(PODS_TARGET_SRCROOT)/platform/ios\""]
   end
 
+  s.subspec "graphicsUmbrella" do |ss|
+    ss.source_files        = "React/*.h"
+    ss.header_dir          = ""
+    ss.header_mappings_dir = "."
+  end
+
   resolve_use_frameworks(s, header_mappings_dir: "../../..", module_name: "React_graphics")
 
   s.pod_target_xcconfig  = { "USE_HEADERMAP" => "NO",
@@ -50,6 +56,8 @@ Pod::Spec.new do |s|
   s.dependency "React-featureflags"
   s.dependency "React-utils"
   s.dependency "React-rendererdebug"
+  s.dependency "React-cxxstableapi"
+  s.dependency "React-renderercss"
 
   depend_on_js_engine(s)
   add_rn_third_party_dependencies(s)

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/React/Graphics.h b/packages/react-native/ReactCommon/react/renderer/graphics/React/Graphics.h
@@ -0,0 +1,62 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+// =============================================================================
+// Umbrella header for the `react/renderer/graphics` module - public entry
+// point.
+//
+//   #include <React/Graphics.h>
+//
+// Re-exports the module's public interface headers. React Native's own code
+// should keep using the fine-grained `<react/renderer/graphics/...>` includes;
+// only outside consumers use this umbrella.
+// =============================================================================
+
+// Marks that the following headers are pulled in through the umbrella, so their
+// shared guard (<react/cxxstableapi/UmbrellaGuard.h>) accepts them. The marker
+// is saved and restored rather than defined and undefined: the scope ends at
+// this block, so later *direct* includes in the same TU are still caught, and
+// it nests inside an enclosing umbrella rather than disarming it.
+#pragma push_macro("RN_UMBRELLA_CONTEXT")
+#undef RN_UMBRELLA_CONTEXT
+#define RN_UMBRELLA_CONTEXT 1
+
+#include <react/renderer/graphics/BackgroundImage.h>
+#include <react/renderer/graphics/BackgroundPosition.h>
+#include <react/renderer/graphics/BackgroundRepeat.h>
+#include <react/renderer/graphics/BackgroundSize.h>
+#include <react/renderer/graphics/BlendMode.h>
+#include <react/renderer/graphics/BoxShadow.h>
+#include <react/renderer/graphics/Color.h>
+#include <react/renderer/graphics/ColorComponents.h>
+#include <react/renderer/graphics/ColorStop.h>
+#include <react/renderer/graphics/Filter.h>
+#include <react/renderer/graphics/Float.h>
+#include <react/renderer/graphics/HostPlatformColor.h>
+#include <react/renderer/graphics/Isolation.h>
+#include <react/renderer/graphics/LinearGradient.h>
+#include <react/renderer/graphics/PlatformColorParser.h>
+#include <react/renderer/graphics/Point.h>
+#include <react/renderer/graphics/RadialGradient.h>
+#include <react/renderer/graphics/Rect.h>
+#include <react/renderer/graphics/RectangleCorners.h>
+#include <react/renderer/graphics/RectangleEdges.h>
+#include <react/renderer/graphics/Size.h>
+#include <react/renderer/graphics/Transform.h>
+#include <react/renderer/graphics/TransformUtils.h>
+#include <react/renderer/graphics/ValueUnit.h>
+#include <react/renderer/graphics/Vector.h>
+#include <react/renderer/graphics/rounding.h>
+
+#if defined(__APPLE__) && defined(__OBJC__)
+#include <react/renderer/graphics/RCTPlatformColorUtils.h>
+#endif
+
+#undef RN_UMBRELLA_CONTEXT
+#pragma pop_macro("RN_UMBRELLA_CONTEXT")
diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Rect.h b/packages/react-native/ReactCommon/react/renderer/graphics/Rect.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <algorithm>
 #include <tuple>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/RectangleCorners.h b/packages/react-native/ReactCommon/react/renderer/graphics/RectangleCorners.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <tuple>
 
 #include <react/renderer/graphics/Float.h>

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/RectangleEdges.h b/packages/react-native/ReactCommon/react/renderer/graphics/RectangleEdges.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <tuple>
 
 #include <react/renderer/graphics/Float.h>

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Size.h b/packages/react-native/ReactCommon/react/renderer/graphics/Size.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <tuple>
 
 #include <react/renderer/graphics/Float.h>

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Transform.h b/packages/react-native/ReactCommon/react/renderer/graphics/Transform.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <array>
 #include <vector>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/TransformUtils.h b/packages/react-native/ReactCommon/react/renderer/graphics/TransformUtils.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <folly/dynamic.h>
 #include <react/renderer/graphics/Transform.h>
 #include <react/renderer/graphics/ValueUnit.h>

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/ValueUnit.h b/packages/react-native/ReactCommon/react/renderer/graphics/ValueUnit.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/debug/flags.h>
 #include <string>
 

diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/Vector.h b/packages/react-native/ReactCommon/react/renderer/graphics/Vector.h
@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <react/cxxstableapi/UmbrellaGuard.h>
+
 #include <react/renderer/graphics/Float.h>
 
 namespace facebook::react {