react-native-enriched 0.5.0 → 0.5.2

package/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputView.kt

@@ -65,6 +65,7 @@ import com.swmansion.enriched.textinput.utils.EnrichedSpanState
 import com.swmansion.enriched.textinput.utils.RichContentReceiver
 import com.swmansion.enriched.textinput.utils.mergeSpannables
 import com.swmansion.enriched.textinput.utils.setCheckboxClickListener
+import com.swmansion.enriched.textinput.utils.zwsCountBefore
 import com.swmansion.enriched.textinput.watchers.EnrichedSpanWatcher
 import com.swmansion.enriched.textinput.watchers.EnrichedTextWatcher
 import java.util.regex.Pattern
@@ -623,13 +624,26 @@ class EnrichedTextInputView : AppCompatEditText {
     val start = selection?.start ?: return
     val end = selection.end
     val styleState = spanState?.getStyleStatePayload() ?: return
-    val selectedText = text?.subSequence(start, end)?.toString() ?: ""
+    val currentText = text ?: return
+    val selectedText = currentText.subSequence(start, end).toString().replace(EnrichedConstants.ZWS_STRING, "")
+
+    val visibleStart = start - currentText.zwsCountBefore(start)
+    val visibleEnd = end - currentText.zwsCountBefore(end)
 
     val reactContext = context as ReactContext
     val surfaceId = UIManagerHelper.getSurfaceId(reactContext)
     val dispatcher = UIManagerHelper.getEventDispatcherForReactTag(reactContext, id)
     dispatcher?.dispatchEvent(
-      OnContextMenuItemPressEvent(surfaceId, id, itemText, selectedText, start, end, styleState, experimentalSynchronousEvents),
+      OnContextMenuItemPressEvent(
+        surfaceId,
+        id,
+        itemText,
+        selectedText,
+        visibleStart,
+        visibleEnd,
+        styleState,
+        experimentalSynchronousEvents,
+      ),
     )
   }
 
@@ -819,14 +833,14 @@ class EnrichedTextInputView : AppCompatEditText {
     val isValid = verifyStyle(EnrichedSpans.LINK)
     if (!isValid) return
 
-    parametrizedStyles?.setLinkSpan(start, end, text, url)
+    parametrizedStyles?.setLinkSpan(getActualIndex(start), getActualIndex(end), text, url)
   }
 
   fun removeLink(
     start: Int,
     end: Int,
   ) {
-    parametrizedStyles?.removeLinkSpans(start, end)
+    parametrizedStyles?.removeLinkSpans(getActualIndex(start), getActualIndex(end))
   }
 
   fun addImage(
@@ -980,7 +994,8 @@ class EnrichedTextInputView : AppCompatEditText {
     super.onAttachedToWindow()
 
     // https://github.com/facebook/react-native/blob/36df97f500aa0aa8031098caf7526db358b6ddc1/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactEditText.kt#L946
-    super.setTextIsSelectable(true)
+    // setTextIsSelectable internally calls setText(), which fires afterTextChanged that should be marked as a transaction to avoid unwanted side effects
+    runAsATransaction { super.setTextIsSelectable(true) }
 
     if (autoFocus && !didAttachToWindow) {
       requestFocusProgrammatically()

package/android/src/main/java/com/swmansion/enriched/textinput/utils/EnrichedSelection.kt

@@ -233,14 +233,16 @@ class EnrichedSelection(
     val surfaceId = UIManagerHelper.getSurfaceId(context)
     val dispatcher = UIManagerHelper.getEventDispatcherForReactTag(context, view.id)
 
-    val text = editable.substring(start, end)
+    val visibleStart = start - editable.zwsCountBefore(start)
+    val visibleEnd = end - editable.zwsCountBefore(end)
+    val text = editable.substring(start, end).replace(EnrichedConstants.ZWS_STRING, "")
     dispatcher?.dispatchEvent(
       OnChangeSelectionEvent(
         surfaceId,
         view.id,
         text,
-        start,
-        end,
+        visibleStart,
+        visibleEnd,
         view.experimentalSynchronousEvents,
       ),
     )
@@ -252,7 +254,7 @@ class EnrichedSelection(
     start: Int,
     end: Int,
   ) {
-    val text = spannable.substring(start, end)
+    val text = spannable.substring(start, end).replace(EnrichedConstants.ZWS_STRING, "")
     val url = span?.getUrl() ?: ""
 
     // Prevents emitting unnecessary events
@@ -261,6 +263,9 @@ class EnrichedSelection(
     previousLinkDetectedEvent.put("text", text)
     previousLinkDetectedEvent.put("url", url)
 
+    val visibleStart = start - spannable.zwsCountBefore(start)
+    val visibleEnd = end - spannable.zwsCountBefore(end)
+
     val context = view.context as ReactContext
     val surfaceId = UIManagerHelper.getSurfaceId(context)
     val dispatcher = UIManagerHelper.getEventDispatcherForReactTag(context, view.id)
@@ -270,8 +275,8 @@ class EnrichedSelection(
         view.id,
         text,
         url,
-        start,
-        end,
+        visibleStart,
+        visibleEnd,
         view.experimentalSynchronousEvents,
       ),
     )

package/android/src/main/java/com/swmansion/enriched/textinput/utils/EnrichedSpannableStringBuilder.kt

@@ -3,6 +3,14 @@ package com.swmansion.enriched.textinput.utils
 import android.text.SpannableStringBuilder
 import com.swmansion.enriched.common.EnrichedConstants
 
+fun CharSequence.zwsCountBefore(index: Int): Int {
+  var count = 0
+  for (i in 0 until index) {
+    if (this[i] == EnrichedConstants.ZWS) count++
+  }
+  return count
+}
+
 // Removes zero-width spaces from the given range in the SpannableStringBuilder without affecting spans
 fun SpannableStringBuilder.removeZWS(
   start: Int,

package/ios/EnrichedTextInputView.h

@@ -40,6 +40,7 @@ NS_ASSUME_NONNULL_BEGIN
 - (void)emitOnMentionEvent:(NSString *)indicator text:(nullable NSString *)text;
 - (void)emitOnPasteImagesEvent:(NSArray<NSDictionary *> *)images;
 - (void)anyTextMayHaveBeenModified;
+- (void)scheduleRelayoutIfNeeded;
 - (BOOL)handleStyleBlocksAndConflicts:(StyleType)type range:(NSRange)range;
 - (NSArray<NSNumber *> *)getPresentStyleTypesFrom:(NSArray<NSNumber *> *)types
                                             range:(NSRange)range;

package/ios/EnrichedTextInputView.mm

@@ -717,18 +717,6 @@ Class<RCTComponentViewProtocol> EnrichedTextInputViewCls(void) {
     // now set the new config
     config = newConfig;
 
-    // no emitting during styles reload
-    blockEmitting = YES;
-
-    // make sure everything is sound in the html
-    NSString *initiallyProcessedHtml =
-        [parser initiallyProcessHtml:currentHtml];
-    if (initiallyProcessedHtml != nullptr) {
-      [parser replaceWholeFromHtml:initiallyProcessedHtml];
-    }
-
-    blockEmitting = NO;
-
     // fill the typing attributes with style props
     defaultTypingAttributes[NSForegroundColorAttributeName] =
         [config primaryColor];
@@ -742,6 +730,18 @@ Class<RCTComponentViewProtocol> EnrichedTextInputViewCls(void) {
     defaultPStyle.minimumLineHeight = [config scaledPrimaryLineHeight];
     defaultTypingAttributes[NSParagraphStyleAttributeName] = defaultPStyle;
 
+    // no emitting during styles reload
+    blockEmitting = YES;
+
+    // make sure everything is sound in the html
+    NSString *initiallyProcessedHtml =
+        [parser initiallyProcessHtml:currentHtml];
+    if (initiallyProcessedHtml != nullptr) {
+      [parser replaceWholeFromHtml:initiallyProcessedHtml];
+    }
+
+    blockEmitting = NO;
+
     textView.typingAttributes = defaultTypingAttributes;
     textView.selectedRange = prevSelectedRange;
 

package/ios/inputTextView/InputTextView.mm

@@ -6,6 +6,17 @@
 
 @implementation InputTextView
 
+- (void)layoutSubviews {
+  [super layoutSubviews];
+  // UITextView resets contentSize during its own layout pass (triggered when
+  // the frame is set on first mount). Re-schedule a relayout so our explicit
+  // contentSize is applied after UITextView finishes its internal layout.
+  EnrichedTextInputView *input = (EnrichedTextInputView *)_input;
+  if (input != nil) {
+    [input scheduleRelayoutIfNeeded];
+  }
+}
+
 - (void)copy:(id)sender {
   EnrichedTextInputView *typedInput = (EnrichedTextInputView *)_input;
   if (typedInput == nullptr) {
@@ -74,12 +85,12 @@
       NSString *type = item.allKeys[j];
       if ([type isEqual:UTTypeJPEG.identifier] ||
           [type isEqual:UTTypePNG.identifier] ||
-          [type isEqual:UTTypeWebP.identifier] ||
           [type isEqual:UTTypeHEIC.identifier] ||
           [type isEqual:UTTypeTIFF.identifier]) {
         imageData = [self getDataForImageItem:item[type] type:type];
-      } else if ([type isEqual:UTTypeGIF.identifier]) {
-        // gifs
+      } else if ([type isEqual:UTTypeWebP.identifier] ||
+                 [type isEqual:UTTypeGIF.identifier]) {
+        // webp and gifs: read raw bytes directly — no re-encoding needed
         imageData = [pasteboard dataForPasteboardType:type];
       }
       if (!imageData) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-enriched",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "description": "Rich Text Editor component for React Native",
   "source": "./src/index.tsx",
   "main": "./lib/module/index.js",
@@ -49,7 +49,10 @@
     "prepare": "bob build",
     "release": "release-it",
     "android-studio": "open -a 'Android Studio' apps/example/android",
-    "xcode": "open -a 'Xcode' apps/example/ios/EnrichedTextInputExample.xcworkspace"
+    "xcode": "open -a 'Xcode' apps/example/ios/EnrichedTextInputExample.xcworkspace",
+    "test:e2e": ".maestro/scripts/run-tests-all.sh",
+    "test:e2e:android": ".maestro/scripts/run-tests.sh --platform android",
+    "test:e2e:ios": ".maestro/scripts/run-tests.sh --platform ios"
   },
   "keywords": [
     "react-native",