feat: added line break strategy attribute and example

facebook · Mar 30, 2021 · 29dc411 · 29dc411
1 parent 72d45de
commit 29dc411
Show file tree

Hide file tree

Showing 10 changed files with 128 additions and 379 deletions.
diff --git a/Libraries/Text/BaseText/RCTBaseTextViewManager.m b/Libraries/Text/BaseText/RCTBaseTextViewManager.m
@@ -42,6 +42,7 @@ - (RCTShadowView *)shadowView
 RCT_REMAP_SHADOW_PROPERTY(lineHeight, textAttributes.lineHeight, CGFloat)
 RCT_REMAP_SHADOW_PROPERTY(textAlign, textAttributes.alignment, NSTextAlignment)
 RCT_REMAP_SHADOW_PROPERTY(writingDirection, textAttributes.baseWritingDirection, NSWritingDirection)
+RCT_REMAP_SHADOW_PROPERTY(ios_lineBreakStrategy, textAttributes.lineBreakStrategy, NSLineBreakStrategy)
 // Decoration
 RCT_REMAP_SHADOW_PROPERTY(textDecorationColor, textAttributes.textDecorationColor, UIColor)
 RCT_REMAP_SHADOW_PROPERTY(textDecorationStyle, textAttributes.textDecorationStyle, NSUnderlineStyle)

diff --git a/Libraries/Text/RCTTextAttributes.h b/Libraries/Text/RCTTextAttributes.h
@@ -41,6 +41,7 @@ extern NSString *const RCTTextAttributesTagAttributeName;
 @property (nonatomic, assign) CGFloat lineHeight;
 @property (nonatomic, assign) NSTextAlignment alignment;
 @property (nonatomic, assign) NSWritingDirection baseWritingDirection;
+@property (nonatomic, assign) NSLineBreakStrategy lineBreakStrategy;
 // Decoration
 @property (nonatomic, strong, nullable) UIColor *textDecorationColor;
 @property (nonatomic, assign) NSUnderlineStyle textDecorationStyle;

diff --git a/Libraries/Text/RCTTextAttributes.m b/Libraries/Text/RCTTextAttributes.m
@@ -27,6 +27,7 @@ - (instancetype)init
     _maxFontSizeMultiplier = NAN;
     _alignment = NSTextAlignmentNatural;
     _baseWritingDirection = NSWritingDirectionNatural;
+    _lineBreakStrategy = NSLineBreakStrategyNone;
     _textShadowRadius = NAN;
     _opacity = NAN;
     _textTransform = RCTTextTransformUndefined;
@@ -61,6 +62,7 @@ - (void)applyTextAttributes:(RCTTextAttributes *)textAttributes
   _lineHeight = !isnan(textAttributes->_lineHeight) ? textAttributes->_lineHeight : _lineHeight;
   _alignment = textAttributes->_alignment != NSTextAlignmentNatural ? textAttributes->_alignment : _alignment; // *
   _baseWritingDirection = textAttributes->_baseWritingDirection != NSWritingDirectionNatural ? textAttributes->_baseWritingDirection : _baseWritingDirection; // *
+  _lineBreakStrategy = textAttributes->_lineBreakStrategy != NSLineBreakStrategyNone ? textAttributes->_lineBreakStrategy : _lineBreakStrategy;
 
   // Decoration
   _textDecorationColor = textAttributes->_textDecorationColor ?: _textDecorationColor;
@@ -93,27 +95,34 @@ - (NSParagraphStyle *)effectiveParagraphStyle
         alignment = NSTextAlignmentRight;
       }
     }
-    
+
     paragraphStyle.alignment = alignment;
     isParagraphStyleUsed = YES;
   }
-  
+
   if (_baseWritingDirection != NSWritingDirectionNatural) {
     paragraphStyle.baseWritingDirection = _baseWritingDirection;
     isParagraphStyleUsed = YES;
   }
-
+
+  if (_lineBreakStrategy != NSLineBreakStrategyNone) {
+    if (@available(iOS 14.0, *)) {
+      paragraphStyle.lineBreakStrategy = _lineBreakStrategy;
+      isParagraphStyleUsed = YES;
+    }
+  }
+
   if (!isnan(_lineHeight)) {
     CGFloat lineHeight = _lineHeight * self.effectiveFontSizeMultiplier;
     paragraphStyle.minimumLineHeight = lineHeight;
     paragraphStyle.maximumLineHeight = lineHeight;
     isParagraphStyleUsed = YES;
   }
-  
+
   if (isParagraphStyleUsed) {
     return [paragraphStyle copy];
   }
-  
+
   return nil;
 }
 
@@ -294,6 +303,7 @@ - (BOOL)isEqual:(RCTTextAttributes *)textAttributes
     RCTTextAttributesCompareFloats(_lineHeight) &&
     RCTTextAttributesCompareFloats(_alignment) &&
     RCTTextAttributesCompareOthers(_baseWritingDirection) &&
+    RCTTextAttributesCompareOthers(_lineBreakStrategy) &&
     // Decoration
     RCTTextAttributesCompareObjects(_textDecorationColor) &&
     RCTTextAttributesCompareOthers(_textDecorationStyle) &&

diff --git a/Libraries/Text/TextNativeComponent.js b/Libraries/Text/TextNativeComponent.js
@@ -42,6 +42,7 @@ export const NativeText: HostComponent<NativeTextProps> = (createReactNativeComp
       onInlineViewLayout: true,
       dataDetectorType: true,
       android_hyphenationFrequency: true,
+      ios_lineBreakStrategy: true,
     },
     directEventTypes: {
       topTextLayout: {

diff --git a/Libraries/Text/TextProps.js b/Libraries/Text/TextProps.js
@@ -199,4 +199,11 @@ export type TextProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/text.html#supperhighlighting
    */
   suppressHighlighting?: ?boolean,
+
+  /**
+   * Set line break strategy on iOS.
+   *
+   * See https://reactnative.dev/docs/text.html#ios_linebreakstrategy
+   */
+  ios_lineBreakStrategy?: ?('none' | 'standard' | 'hangul-word' | 'push-out'),
 |}>;
diff --git a/React/Base/RCTConvert.h b/React/Base/RCTConvert.h
@@ -64,6 +64,7 @@ typedef NSURL RCTFileURL;
 + (NSTextAlignment)NSTextAlignment:(id)json;
 + (NSUnderlineStyle)NSUnderlineStyle:(id)json;
 + (NSWritingDirection)NSWritingDirection:(id)json;
++ (NSLineBreakStrategy)NSLineBreakStrategy:(id)json;
 + (UITextAutocapitalizationType)UITextAutocapitalizationType:(id)json;
 + (UITextFieldViewMode)UITextFieldViewMode:(id)json;
 + (UIKeyboardType)UIKeyboardType:(id)json;

diff --git a/React/Base/RCTConvert.m b/React/Base/RCTConvert.m
@@ -366,6 +366,38 @@ + (NSLocale *)NSLocale:(id)json
     NSWritingDirectionNatural,
     integerValue)
 
++ (NSLineBreakStrategy)NSLineBreakStrategy:(id)json RCT_DYNAMIC
+{
+  static NSDictionary *mapping;
+  static dispatch_once_t onceToken;
+  dispatch_once(&onceToken, ^{
+    if (@available(iOS 14.0, *)) {
+      mapping = @{
+        @"none" : @(NSLineBreakStrategyNone),
+#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && __IPHONE_OS_VERSION_MAX_ALLOWED >= 140000
+        @"standard" : @(NSLineBreakStrategyStandard),
+        @"hangul-word" : @(NSLineBreakStrategyHangulWordPriority),
+        @"push-out": @(NSLineBreakStrategyPushOut)
+#else
+        @"standard" : @(NSLineBreakStrategyNone),
+        @"hangul-word" : @(NSLineBreakStrategyNone),
+        @"push-out": @(NSLineBreakStrategyNone)
+#endif
+      };
+    } else {
+      mapping = @{
+        @"none" : @(NSLineBreakStrategyNone),
+        @"standard" : @(NSLineBreakStrategyNone),
+        @"hangul-word" : @(NSLineBreakStrategyNone),
+        @"push-out": @(NSLineBreakStrategyNone)
+      };
+    }
+  });
+
+  NSLineBreakStrategy type = RCTConvertEnumValue("NSLineBreakStrategy", mapping, @(NSLineBreakStrategyNone), json).integerValue;
+  return type;
+}
+
 RCT_ENUM_CONVERTER(
     UITextAutocapitalizationType,
     (@{

diff --git a/ReactCommon/react/renderer/attributedstring/conversions.h b/ReactCommon/react/renderer/attributedstring/conversions.h
@@ -746,6 +746,10 @@ inline folly::dynamic toDynamic(const TextAttributes &textAttributes) {
     _textAttributes(
         "baseWritingDirection", toString(*textAttributes.baseWritingDirection));
   }
+  if (textAttributes.lineBreakStrategy.has_value()) {
+    _textAttributes(
+        "lineBreakStrategy", toString(*textAttributes.lineBreakStrategy));
+  }
   // Decoration
   if (textAttributes.textDecorationColor) {
     _textAttributes(