Include existing attributes in newly typed text (#47018)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/47018

This change makes it so that newly typed text in a TextInput will include the existing attributes present based on cursor position. E.g. if you type after an inner fragment with blue text, the next character will be blue (or, an event emitter specific to an inner fragment will also be expanded). This is a behavior change for the (admittedly rare) case of uncontrolled TextInput with initially present children AttributedText, but more often effect controlled components, before state update (we are after, less likely to need to reset AttributedString because of mismatch).

Originally included this in D64121570, but it's not needed to fix the common case since we include paragraph-level event emitter as part of default attributes, and has some of its own risk, so I decided it is better separate.

Changelog:
[iOS][Changed] - Include existing attributes in newly typed text

Reviewed By: cipolleschi

Differential Revision: D64352310

fbshipit-source-id: 90ef8c49f50186eadf777e81cf6af57e1aada207
This commit is contained in:
Nick Gerleman
2024-11-12 18:58:46 +00:00
committed by Blake Friedman
parent a09df751eb
commit 3ce4b80e6f
@@ -418,6 +418,7 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
- (void)textInputDidChangeSelection
{
[self _updateTypingAttributes];
if (_comingFromJS) {
return;
}
@@ -674,9 +675,26 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
[_backedTextInputView scrollRangeToVisible:NSMakeRange(offsetStart, 0)];
}
[self _restoreTextSelection];
[self _updateTypingAttributes];
_lastStringStateWasUpdatedWith = attributedString;
}
// Ensure that newly typed text will inherit any custom attributes. We follow the logic of RN Android, where attributes
// to the left of the cursor are copied into new text, unless we are at the start of the field, in which case we will
// copy the attributes from text to the right. This allows consistency between backed input and new AttributedText
// https://github.com/facebook/react-native/blob/3102a58df38d96f3dacef0530e4dbb399037fcd2/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/internal/span/SetSpanOperation.kt#L30
- (void)_updateTypingAttributes
{
if (_backedTextInputView.attributedText.length > 0) {
NSUInteger offsetStart = [_backedTextInputView offsetFromPosition:_backedTextInputView.beginningOfDocument
toPosition:_backedTextInputView.selectedTextRange.start];
NSUInteger samplePoint = offsetStart == 0 ? 0 : offsetStart - 1;
_backedTextInputView.typingAttributes = [_backedTextInputView.attributedText attributesAtIndex:samplePoint
effectiveRange:NULL];
}
}
- (void)_setMultiline:(BOOL)multiline
{
[_backedTextInputView removeFromSuperview];