feat: add setText native command

Author: IvanIhnatsiuk

apps/example/src/components/TextInput/index.tsx

@@ -14,7 +14,7 @@ import Button from "../Button";
 
 import styles from "./styles";
 
-import type { TextInput as RNTextInput } from "react-native";
+import type { MaskedTextInputRef } from "package/src/types";
 
 type Props = MaskedTextInputProps & {
   controlled?: boolean;
@@ -33,7 +33,7 @@ const TextInput: FC<Props> = (props) => {
     ...rest
   } = props;
 
-  const inputRef = React.useRef<RNTextInput>(null);
+  const inputRef = React.useRef<MaskedTextInputRef>(null);
 
   const [textState, setTextState] = React.useState({
     extracted: initialValue || defaultValue,
@@ -73,6 +73,10 @@ const TextInput: FC<Props> = (props) => {
     setTextState({ extracted: "", formatted: "" });
   }, [controlled]);
 
+  const handleSetText = React.useCallback(() => {
+    inputRef.current?.setText("999999", false);
+  }, []);
+
   const handleFocusButtonPress = React.useCallback(() => {
     inputRef.current?.focus();
   }, []);
@@ -103,6 +107,11 @@ const TextInput: FC<Props> = (props) => {
         title="Focus text input"
         onPress={handleFocusButtonPress}
       />
+      <Button
+        style={styles.button}
+        title={"Set text"}
+        onPress={handleSetText}
+      />
     </>
   );
 };

e2e/.maestro/clear-text.yaml

@@ -0,0 +1,15 @@
+appId: "com.maskedtextinputexample"
+---
+- launchApp
+- tapOn:
+    id: "phone-input"
+- tapOn: "+1 (000) 000-0000"
+- inputText: 1
+- assertVisible: "formatted value +1 ("
+- tapOn:
+    point: "50%,37%"
+- tapOn: "Clear text"
+- assertVisible: "+1 (000) 000-0000"
+- tapOn: "+1 (000) 000-0000"
+- inputText: 1
+- assertVisible: "formatted value +1 ("

e2e/.maestro/set-text.yaml

@@ -0,0 +1,9 @@
+appId: "com.maskedtextinputexample"
+---
+- launchApp
+- tapOn:
+    id: "phone-input"
+- tapOn: "+1 (000) 000-0000"
+- tapOn: "Set text"
+- assertVisible: "+1 (999) 999"
+- assertVisible: "formatted value +1 (999) 999"

package/android/src/main/java/com/maskedtextinput/managers/AdvancedTextInputMaskDecoratorViewManager.kt

@@ -18,6 +18,16 @@ class AdvancedTextInputMaskDecoratorViewManager(
 ) : AdvancedTextInputMaskDecoratorViewManagerSpec<AdvancedTextInputMaskDecoratorView>() {
   override fun getName() = NAME
 
+  override fun setText(
+    view: AdvancedTextInputMaskDecoratorView,
+    text: String?,
+    autocomplete: Boolean,
+  ) {
+    if (text != null) {
+      view.setText(text, autocomplete)
+    }
+  }
+
   override fun createViewInstance(context: ThemedReactContext) = AdvancedTextInputMaskDecoratorView(context)
 
   @ReactProp(name = "primaryMaskFormat")

package/android/src/main/java/com/maskedtextinput/views/AdvancedTextInputMaskDecoratorView.kt

@@ -194,4 +194,16 @@ class AdvancedTextInputMaskDecoratorView(
     maskedTextChangeListener?.allowedKeys = allowedKeys
     maybeUpdateText()
   }
+
+  fun setText(
+    text: String,
+    autocomplete: Boolean = false,
+  ) {
+    maskedTextChangeListener?.let {
+      val prevAutocomplete = it.autocomplete
+      it.autocomplete = autocomplete
+      it.setText(text, autocomplete)
+      it.autocomplete = prevAutocomplete
+    }
+  }
 }

package/android/src/oldarch/java/com/maskedtextinput/AdvancedTextInputMaskDecoratorViewManagerSpec.kt

@@ -75,4 +75,31 @@ abstract class AdvancedTextInputMaskDecoratorViewManagerSpec<T : View> : SimpleV
     view: T,
     validationRegex: String?,
   )
+
+  abstract fun setText(
+    view: T,
+    text: String?,
+    autocomplete: Boolean,
+  )
+
+  override fun receiveCommand(
+    root: T,
+    commandId: String?,
+    args: ReadableArray?,
+  ) {
+    super.receiveCommand(root, commandId, args)
+    when (commandId) {
+      SET_TEXT -> {
+        val text = args?.getString(0)
+        val autocomplete = args?.getBoolean(1)
+        if (text != null && autocomplete != null) {
+          this.setText(root, text, autocomplete)
+        }
+      }
+    }
+  }
+
+  companion object {
+    const val SET_TEXT = "setText"
+  }
 }

package/ios/AdvancedTextInputMaskDecoratorView.swift

@@ -39,6 +39,8 @@ class AdvancedTextInputMaskDecoratorView: UIView {
       if result.formattedText.string == nextText { return }
 
       let attributedText = NSAttributedString(string: result.formattedText.string)
+
+      setText(textField: textField, text: attributedText)
     }
   }
 
@@ -166,12 +168,12 @@ class AdvancedTextInputMaskDecoratorView: UIView {
     #endif
   }
 
-  private func getMaskResultForText(text: String) -> Mask.Result? {
+  private func getMaskResultForText(text: String, autocomplete: Bool = false) -> Mask.Result? {
     guard let primaryMask = maskInputListener?.primaryMask else { return nil }
     let caretString = CaretString(
       string: text,
       caretPosition: text.endIndex,
-      caretGravity: CaretString.CaretGravity.forward(autocomplete: false)
+      caretGravity: CaretString.CaretGravity.forward(autocomplete: autocomplete)
     )
     return primaryMask.apply(toText: caretString)
   }
@@ -190,19 +192,14 @@ class AdvancedTextInputMaskDecoratorView: UIView {
     setText(textField: textField, text: attributedText)
   }
 
-  @objc private func maybeUpdateText(text: String) {
-    guard let primaryMask = maskInputListener?.primaryMask else { return }
+  @objc func maybeUpdateText(text: String, autocomplete _: Bool = false) {
+    guard (maskInputListener?.primaryMask) != nil else { return }
     guard let textField = textField else { return }
 
     if text == textField.attributedText?.string {
       return
     }
 
-    let caretString = CaretString(
-      string: text,
-      caretPosition: text.endIndex,
-      caretGravity: CaretString.CaretGravity.forward(autocomplete: false)
-    )
     guard let result = getMaskResultForText(text: text) else { return }
 
     if text == result.formattedText.string {
@@ -266,6 +263,17 @@ class AdvancedTextInputMaskDecoratorView: UIView {
     textFieldDelegate = nil
   }
 
+  @objc(setMaskedText:autocomplete:)
+  func setMaskedText(text: NSString, autocomplete: Bool) {
+    guard let result = getMaskResultForText(text: text as String, autocomplete: autocomplete) else { return }
+
+    let attributedText = NSAttributedString(string: result.formattedText.string)
+    guard let textField = textField else { return }
+
+    setText(textField: textField, text: attributedText)
+    maskInputListener?.notifyOnMaskedTextChangedListeners(forTextInput: textField, result: result)
+  }
+
   // MARK: - View Lifecycle
 
   override func didMoveToWindow() {

package/ios/AdvancedTextInputMaskDecoratorViewManager.swift

@@ -6,6 +6,7 @@
 //
 
 import Foundation
+import UIKit
 
 @objc(AdvancedTextInputMaskDecoratorViewManager)
 class AdvancedTextInputMaskDecoratorViewManager: RCTViewManager {
@@ -14,6 +15,20 @@ class AdvancedTextInputMaskDecoratorViewManager: RCTViewManager {
   }
 
   override public static func requiresMainQueueSetup() -> Bool {
-    false
+    true
+  }
+
+  @objc(setText:text:autocomplete:)
+  public func setText(_ reactTag: NSNumber, text: NSString, autocomplete: Bool) {
+    bridge.uiManager.addUIBlock { _, viewRegistry in
+      guard let view = viewRegistry?[reactTag] as? AdvancedTextInputMaskDecoratorView else {
+        if RCT_DEBUG == 1 {
+          print("Invalid view returned from registry, expecting ContainerView")
+        }
+        return
+      }
+
+      view.setMaskedText(text: text, autocomplete: autocomplete)
+    }
   }
 }

package/ios/AdvancedTextInputViewContainer.h

@@ -32,4 +32,5 @@
 - (void)setAffinityCalculationStrategy:(NSInteger)affinityCalculationStrategy;
 - (void)setValidationRegex:(NSString *)validationRegex;
 - (void)cleanup;
+- (void)setMaskedText:(NSString *_Nonnull)text autocomplete:(BOOL)autocomplete;
 @end

package/ios/AdvancedtextInputMaskDecoratorView.mm

@@ -150,6 +150,16 @@ - (void)onAdvancedMaskTextChangeWithEventData:(NSDictionary *)eventData
       ->onAdvancedMaskTextChange(event);
 }
 
+- (void)handleCommand:(const NSString *)commandName args:(const NSArray *)args
+{
+  RCTAdvancedTextInputMaskDecoratorViewHandleCommand(self, commandName, args);
+}
+
+- (void)setText:(NSString *)text autocomplete:(BOOL)autocomplete
+{
+  [_view setMaskedText:text autocomplete:autocomplete];
+}
+
 @end
 
 Class<RCTComponentViewProtocol> AdvancedTextInputMaskDecoratorViewCls(void)