Wire native CSS color parsing#55679
Closed
NickGerleman wants to merge 5 commits intofacebook:mainfrom
Closed
Conversation
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 23, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
142f724 to
2aab9c0
Compare
|
@NickGerleman has exported this pull request. If you are a Meta employee, you can view the originating Diff in D94052731. |
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 23, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
2aab9c0 to
3fed545
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 23, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
3fed545 to
038ea62
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 23, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
c25557f to
96adb02
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 23, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
Summary: Gate `processTransformOrigin` behind `enableNativeCSSParsing()`. When the flag is on, CSS transform-origin strings like `"top left"` or `"10px 50%"` are parsed natively using the existing CSS transform-origin parser instead of being preprocessed in JS. Changelog: [Internal] Differential Revision: D94052730
Summary: Gate `processAspectRatio` behind `enableNativeCSSParsing()`. When the flag is on, CSS ratio strings like `"16/9"` and number strings are parsed natively using the existing CSS ratio parser instead of being preprocessed in JS. The parsing is done in `fromRawValue(... FloatOptional &)` — string values are only sent for aspectRatio; other FloatOptional yoga props never receive strings from JS. Changelog: [Internal] Differential Revision: D94052732
Summary: Gate `processFontVariant` behind `enableNativeCSSParsing()`. When the flag is on, CSS font-variant strings like `"small-caps oldstyle-nums"` are parsed natively using the `CSSFontVariant` / `CSSFontVariantList` types instead of being preprocessed in JS. - Add `fontVariantFromCSSFontVariant()` to map `CSSFontVariant` enum values to `FontVariant` bitmask flags - Add `parseProcessedFontVariant()`, `parseUnprocessedFontVariantString()`, and gated `fromRawValue(... FontVariant &)` in `attributedstring/conversions.h` - Remove `react_native_expect(false)` hard error on unknown font variant values, replacing with graceful skip - Export `fontVariantAttribute` from `ReactNativeStyleAttributes.js` Changelog: [Internal] Differential Revision: D94052733
Summary: Add missing `default` labels to `switch` statements in CSS parser headers (`CSSTokenizer.h`, `CSSSyntaxParser.h`, `CSSKeyword.h`) and move away from switch/case in `CSSColor.h` to fix `-Werror` build failures when fbobjc targets import CSS headers. Changelog: [Internal] Differential Revision: D94074704
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 24, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
96adb02 to
19f0dc9
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 24, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
19f0dc9 to
3c003ea
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 24, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
3c003ea to
e1e19c9
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 24, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
e1e19c9 to
17d71f4
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 24, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
17d71f4 to
a701cb1
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 24, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Differential Revision: D94052731
3d4a2f6 to
58c960f
Compare
NickGerleman
added a commit
to NickGerleman/react-native
that referenced
this pull request
Feb 25, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps Changelog: [Internal] Reviewed By: javache Differential Revision: D94052731
58c960f to
ca19305
Compare
Summary:
When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS.
Native changes:
- `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag
- `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps
JS changes:
- Export `colorAttribute` from `ReactNativeStyleAttributes.js`
- Update all ViewConfig files to import and use `colorAttribute` instead of inlining `{process: processColor}`
Changelog: [Internal]
Reviewed By: javache
Differential Revision: D94052731
ca19305 to
fb509ec
Compare
|
This pull request has been merged in 36b7158. |
zoontek
pushed a commit
to zoontek/react-native
that referenced
this pull request
Mar 9, 2026
Summary: Pull Request resolved: facebook#55679 When `enableNativeCSSParsing()` is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers by `processColor` in JS. Native changes: - `fromRawValueShared.h`: Wire CSS color string parsing at the top of `fromRawValueShared()`, gated behind the flag - `graphics/BUCK`: Add `react/renderer/css:css` and `react/featureflags:featureflags` deps JS changes: - Export `colorAttribute` from `ReactNativeStyleAttributes.js` - Update all ViewConfig files to import and use `colorAttribute` instead of inlining `{process: processColor}` Changelog: [Internal] Reviewed By: javache Differential Revision: D94052731 fbshipit-source-id: 8d03cfa378f76c480b2429afe4083871b208a236
This was referenced Apr 24, 2026
meta-codesync Bot
pushed a commit
that referenced
this pull request
Apr 24, 2026
…e_frameworks! (#56591) Summary: `React/CoreModules/RCTRedBox.mm` imports `<react/featureflags/ReactNativeFeatureFlags.h>` (added in #56574). Under `use_frameworks!` this fails to build: RCTRedBox.mm:19:9: 'react/featureflags/ReactNativeFeatureFlags.h' file not found Did not find header 'featureflags/ReactNativeFeatureFlags.h' in framework 'react' `React-CoreModules.podspec` uses plain `s.dependency "React-featureflags"`, which does not add the framework's Headers dir to `HEADER_SEARCH_PATHS`. Switching to `add_dependency(s, "React-featureflags")` preserves the same pod dependency and also adds the dependency header path, matching every neighboring dep (`React-debug`, `React-runtimeexecutor`, `React-jsinspector*`, etc.) in the same file. On `main`, this missing podspec-level header path is currently likely masked by the global `update_search_paths` entry added in #55679, which injects `React_featureflags.framework/Headers` into inherited header search paths for `use_frameworks!` builds. `0.83-stable` does not have that global entry, so the same podspec issue surfaces as a build regression in 0.83.7. This change fixes the dependency at the target that directly imports the header, so `React-CoreModules` no longer relies on a broad inherited header path. A cherry-pick to `0.83-stable` would fix the regression in 0.83.7. ## Changelog: [IOS] [FIXED] - Fix React-CoreModules failing to compile with `use_frameworks!` due to missing React-featureflags header path Pull Request resolved: #56591 Test Plan: RN 0.83.7 consumer app with `use_frameworks! :linkage => :static`, `RCT_USE_RN_DEP=1`: fails before this change. After the fix, `pod install` regenerates `React-CoreModules.debug.xcconfig` so `HEADER_SEARCH_PATHS` includes: ${PODS_CONFIGURATION_BUILD_DIR}/React-featureflags/React_featureflags.framework/Headers Verified locally that the `React-CoreModules` pod target builds after the fix: xcodebuild -project ios/Pods/Pods.xcodeproj \ -scheme React-CoreModules \ -configuration Debug \ -sdk iphonesimulator \ -derivedDataPath /tmp/rncoremodules-test \ CODE_SIGNING_ALLOWED=NO build Reviewed By: javache Differential Revision: D102328650 Pulled By: cipolleschi fbshipit-source-id: c25a7f5f733637e1d1604929665881b659fd3af3
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary:
When
enableNativeCSSParsing()is on, CSS color strings (named colors, hex, rgb/rgba, hsl/hsla, hwb) are parsed natively using the existing CSS color parser instead of being preprocessed to integers byprocessColorin JS.fromRawValueShared.h: Wire CSS color string parsing at the top offromRawValueShared(), gated behind the flaggraphics/BUCK: Addreact/renderer/css:cssandreact/featureflags:featureflagsdepsChangelog: [Internal]
Differential Revision: D94052731