feat: Add smartInsertDelete prop to TextInput component

Author: fabioh8010

packages/react-native/Libraries/Components/TextInput/RCTTextInputViewConfig.js

@@ -156,6 +156,7 @@ const RCTTextInputViewConfig = {
     showSoftInputOnFocus: true,
     autoFocus: true,
     lineBreakStrategyIOS: true,
+    smartInsertDelete: true,
     ...ConditionallyIgnoredEventHandlers({
       onChange: true,
       onSelectionChange: true,

packages/react-native/Libraries/Components/TextInput/TextInput.d.ts

@@ -291,6 +291,14 @@ export interface TextInputIOSProps {
     | 'hangul-word'
     | 'push-out'
     | undefined;
+
+  /**
+   * If `false`, the iOS system will not insert an extra space after a paste operation
+   * neither delete one or two spaces after a cut or delete operation.
+   *
+   * The default value is `true`.
+   */
+  smartInsertDelete?: boolean | undefined;
 }
 
 /**

packages/react-native/Libraries/Components/TextInput/TextInput.flow.js

@@ -295,6 +295,16 @@ type IOSProps = $ReadOnly<{|
    * @platform ios
    */
   lineBreakStrategyIOS?: ?('none' | 'standard' | 'hangul-word' | 'push-out'),
+
+  /**
+   * If `false`, the iOS system will not insert an extra space after a paste operation
+   * neither delete one or two spaces after a cut or delete operation.
+   *
+   * The default value is `true`.
+   *
+   * @platform ios
+   */
+  smartInsertDelete?: ?boolean,
 |}>;
 
 type AndroidProps = $ReadOnly<{|

packages/react-native/Libraries/Components/TextInput/TextInput.js

@@ -339,6 +339,16 @@ type IOSProps = $ReadOnly<{|
    * @platform ios
    */
   lineBreakStrategyIOS?: ?('none' | 'standard' | 'hangul-word' | 'push-out'),
+
+  /**
+   * If `false`, the iOS system will not insert an extra space after a paste operation
+   * neither delete one or two spaces after a cut or delete operation.
+   *
+   * The default value is `true`.
+   *
+   * @platform ios
+   */
+  smartInsertDelete?: ?boolean,
 |}>;
 
 type AndroidProps = $ReadOnly<{|

packages/react-native/Libraries/Text/RCTConvert+Text.h

@@ -16,6 +16,7 @@ NS_ASSUME_NONNULL_BEGIN
 + (UITextAutocorrectionType)UITextAutocorrectionType:(nullable id)json;
 + (UITextSpellCheckingType)UITextSpellCheckingType:(nullable id)json;
 + (RCTTextTransform)RCTTextTransform:(nullable id)json;
++ (UITextSmartInsertDeleteType)UITextSmartInsertDeleteType:(nullable id)json;
 
 @end
 

packages/react-native/Libraries/Text/RCTConvert+Text.m

@@ -34,4 +34,11 @@ + (UITextSpellCheckingType)UITextSpellCheckingType:(id)json
     RCTTextTransformUndefined,
     integerValue)
 
++ (UITextSmartInsertDeleteType)UITextSmartInsertDeleteType:(id)json
+{
+  return json == nil           ? UITextSmartInsertDeleteTypeDefault
+      : [RCTConvert BOOL:json] ? UITextSmartInsertDeleteTypeYes
+                               : UITextSmartInsertDeleteTypeNo;
+}
+
 @end

packages/react-native/Libraries/Text/TextInput/RCTBaseTextInputViewManager.m

@@ -47,6 +47,7 @@ @implementation RCTBaseTextInputViewManager {
 RCT_REMAP_VIEW_PROPERTY(clearButtonMode, backedTextInputView.clearButtonMode, UITextFieldViewMode)
 RCT_REMAP_VIEW_PROPERTY(scrollEnabled, backedTextInputView.scrollEnabled, BOOL)
 RCT_REMAP_VIEW_PROPERTY(secureTextEntry, backedTextInputView.secureTextEntry, BOOL)
+RCT_REMAP_VIEW_PROPERTY(smartInsertDelete, backedTextInputView.smartInsertDeleteType, UITextSmartInsertDeleteType)
 RCT_EXPORT_VIEW_PROPERTY(autoFocus, BOOL)
 RCT_EXPORT_VIEW_PROPERTY(submitBehavior, NSString)
 RCT_EXPORT_VIEW_PROPERTY(clearTextOnFocus, BOOL)

packages/react-native/React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputComponentView.mm

@@ -181,6 +181,11 @@ - (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &
     _backedTextInputView.passwordRules = RCTUITextInputPasswordRulesFromString(newTextInputProps.traits.passwordRules);
   }
 
+  if (newTextInputProps.traits.smartInsertDelete != oldTextInputProps.traits.smartInsertDelete) {
+    _backedTextInputView.smartInsertDeleteType =
+        RCTUITextSmartInsertDeleteTypeFromOptionalBool(newTextInputProps.traits.smartInsertDelete);
+  }
+
   // Traits `blurOnSubmit`, `clearTextOnFocus`, and `selectTextOnFocus` were omitted intentionally here
   // because they are being checked on-demand.
 

packages/react-native/React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputUtils.h

@@ -39,4 +39,6 @@ UITextContentType RCTUITextContentTypeFromString(std::string const &contentType)
 
 UITextInputPasswordRules *RCTUITextInputPasswordRulesFromString(std::string const &passwordRules);
 
+UITextSmartInsertDeleteType RCTUITextSmartInsertDeleteTypeFromOptionalBool(std::optional<bool> smartInsertDelete);
+
 NS_ASSUME_NONNULL_END

packages/react-native/React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputUtils.mm

@@ -43,6 +43,7 @@ void RCTCopyBackedTextInput(
   toTextInput.secureTextEntry = fromTextInput.secureTextEntry;
   toTextInput.keyboardType = fromTextInput.keyboardType;
   toTextInput.textContentType = fromTextInput.textContentType;
+  toTextInput.smartInsertDeleteType = fromTextInput.smartInsertDeleteType;
 
   toTextInput.passwordRules = fromTextInput.passwordRules;
 
@@ -226,3 +227,9 @@ UITextContentType RCTUITextContentTypeFromString(std::string const &contentType)
 {
   return [UITextInputPasswordRules passwordRulesWithDescriptor:RCTNSStringFromStringNilIfEmpty(passwordRules)];
 }
+
+UITextSmartInsertDeleteType RCTUITextSmartInsertDeleteTypeFromOptionalBool(std::optional<bool> smartInsertDelete)
+{
+  return smartInsertDelete.has_value() ? (*smartInsertDelete ? UITextSmartInsertDeleteTypeYes : UITextSmartInsertDeleteTypeNo)
+                                       : UITextSmartInsertDeleteTypeDefault;
+}