Skip to content

Fixes CSS transform styles applied directly to <Text> components are silently ignored on iOS when using the new architecture #56002

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Adityakk9031 wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Fixes CSS transform styles applied directly to <Text> components are silently ignored on iOS when using the new architecture #56002

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0a73866
Fixes CSS transform styles applied directly to <Text> components are…
Adityakk9031 Mar 9, 2026
2269f4a
Update TextShadowNode.h
Adityakk9031 Mar 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 21 additions & 1 deletion packages/react-native/ReactCommon/react/renderer/components/text/TextProps.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,28 @@

#include "TextProps.h"

#include <react/renderer/core/propsConversions.h>

namespace facebook::react {

TextProps::TextProps(
const PropsParserContext& context,
const TextProps& sourceProps,
const RawProps& rawProps)
: Props(context, sourceProps, rawProps),
BaseTextProps::BaseTextProps(context, sourceProps, rawProps) {};
BaseTextProps::BaseTextProps(context, sourceProps, rawProps),
transform(convertRawProp(
context,
rawProps,
"transform",
sourceProps.transform,
{})),
transformOrigin(convertRawProp(
context,
rawProps,
"transformOrigin",
sourceProps.transformOrigin,
{})) {};

void TextProps::setProp(
const PropsParserContext& context,
Expand All @@ -23,6 +37,12 @@ void TextProps::setProp(
const RawValue& value) {
BaseTextProps::setProp(context, hash, propName, value);
Props::setProp(context, hash, propName, value);

static auto defaults = TextProps{};
switch (hash) {
RAW_SET_PROP_SWITCH_CASE_BASIC(transform);
RAW_SET_PROP_SWITCH_CASE_BASIC(transformOrigin);
}
}

#pragma mark - DebugStringConvertible
Expand Down
5 changes: 5 additions & 0 deletions packages/react-native/ReactCommon/react/renderer/components/text/TextProps.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
#include <react/renderer/core/Props.h>
#include <react/renderer/core/PropsParserContext.h>
#include <react/renderer/graphics/Color.h>
#include <react/renderer/graphics/Transform.h>

namespace facebook::react {

Expand All @@ -23,6 +24,10 @@ class TextProps : public Props, public BaseTextProps {
void
setProp(const PropsParserContext &context, RawPropsPropNameHash hash, const char *propName, const RawValue &value);

// View-level props that affect whether this text node needs a backing view
Transform transform{};
TransformOrigin transformOrigin{};

#pragma mark - DebugStringConvertible

#if RN_DEBUG_STRING_CONVERTIBLE
Expand Down
17 changes: 17 additions & 0 deletions packages/react-native/ReactCommon/react/renderer/components/text/TextShadowNode.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,23 @@ class TextShadowNode : public ConcreteShadowNode<TextComponentName, ShadowNode,
{
orderIndex_ = std::numeric_limits<decltype(orderIndex_)>::max();
}
#else
using BaseShadowNode = ConcreteShadowNode<TextComponentName, ShadowNode, TextProps, TextEventEmitter>;

TextShadowNode(const ShadowNodeFragment &fragment, const ShadowNodeFamily::Shared &family, ShadowNodeTraits traits)
: BaseShadowNode(
fragment,
family,
[&] {
auto textProps = std::static_pointer_cast<const TextProps>(fragment.props);
if (textProps && !textProps->transform.operations.empty()) {
traits.set(ShadowNodeTraits::Trait::FormsView);
}
return traits;
}()),
BaseTextShadowNode()
{
}
#endif
};

Expand Down