@expensify/react-native-live-markdown 0.1.189 → 0.1.191

package/android/src/main/java/com/expensify/livemarkdown/MarkdownRange.java

@@ -0,0 +1,31 @@
+package com.expensify.livemarkdown;
+
+public class MarkdownRange {
+  private final String mType;
+  private final int mStart;
+  private final int mLength;
+  private final int mDepth;
+
+  public MarkdownRange(String type, int start, int length, int depth) {
+    mType = type;
+    mStart = start;
+    mLength = length;
+    mDepth = depth;
+  }
+
+  public String getType() {
+    return mType;
+  }
+
+  public int getStart() {
+    return mStart;
+  }
+
+  public int getLength() {
+    return mLength;
+  }
+
+  public int getDepth() {
+    return mDepth;
+  }
+}

package/android/src/main/java/com/expensify/livemarkdown/MarkdownUtils.java

@@ -16,6 +16,8 @@ import org.json.JSONArray;
 import org.json.JSONException;
 import org.json.JSONObject;
 
+import java.util.LinkedList;
+import java.util.List;
 import java.util.Objects;
 
 public class MarkdownUtils {
@@ -68,6 +70,7 @@ public class MarkdownUtils {
       mPrevParserId = mParserId;
     }
 
+    List<MarkdownRange> markdownRanges = new LinkedList<>();
     try {
       JSONArray ranges = new JSONArray(output);
       for (int i = 0; i < ranges.length(); i++) {
@@ -80,14 +83,21 @@ public class MarkdownUtils {
         if (length == 0 || end > input.length()) {
           continue;
         }
-        applyRange(ssb, type, start, end, depth);
+        markdownRanges.add(new MarkdownRange(type, start, length, depth));
       }
     } catch (JSONException e) {
       RNLog.w(mReactContext, "[react-native-live-markdown] Incorrect schema of worklet parser output: " + e.getMessage());
     }
+
+    for (MarkdownRange markdownRange : markdownRanges) {
+      applyRange(ssb, markdownRange);
+    }
   }
 
-  private void applyRange(SpannableStringBuilder ssb, String type, int start, int end, int depth) {
+  private void applyRange(SpannableStringBuilder ssb, MarkdownRange markdownRange) {
+    String type = markdownRange.getType();
+    int start = markdownRange.getStart();
+    int end = start + markdownRange.getLength();
     switch (type) {
       case "bold":
         setSpan(ssb, new MarkdownBoldSpan(), start, end);
@@ -149,7 +159,7 @@ public class MarkdownUtils {
           mMarkdownStyle.getBlockquoteBorderWidth(),
           mMarkdownStyle.getBlockquoteMarginLeft(),
           mMarkdownStyle.getBlockquotePaddingLeft(),
-          depth);
+          markdownRange.getDepth());
         setSpan(ssb, span, start, end);
         break;
     }

package/apple/MarkdownRange.h

@@ -0,0 +1,15 @@
+#import <Foundation/Foundation.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface MarkdownRange : NSObject
+
+@property (nonatomic, strong) NSString *type;
+@property (nonatomic) NSRange range;
+@property (nonatomic) NSUInteger depth;
+
+- (instancetype)initWithType:(NSString *)type range:(NSRange)range depth:(NSUInteger)depth;
+
+NS_ASSUME_NONNULL_END
+
+@end

package/apple/MarkdownRange.mm

@@ -0,0 +1,15 @@
+#import "MarkdownRange.h"
+
+@implementation MarkdownRange
+
+- (instancetype)initWithType:(NSString *)type range:(NSRange)range depth:(NSUInteger)depth {
+    self = [super init];
+    if (self) {
+        _type = type;
+        _range = range;
+        _depth = depth;
+    }
+    return self;
+}
+
+@end

package/apple/RCTMarkdownUtils.mm

@@ -1,5 +1,6 @@
 #import <RNLiveMarkdown/RCTMarkdownUtils.h>
 #import <RNLiveMarkdown/MarkdownGlobal.h>
+#import <RNLiveMarkdown/MarkdownRange.h>
 #import "react_native_assert.h"
 #import <React/RCTAssert.h>
 #import <React/RCTFont.h>
@@ -32,22 +33,14 @@
         jsi::Runtime &rt = markdownRuntime->getJSIRuntime();
 
         auto markdownWorklet = expensify::livemarkdown::getMarkdownWorklet([_parserId intValue]);
+        
+        NSMutableArray *markdownRanges = [[NSMutableArray alloc] init];
 
         try {
             const auto &text = jsi::String::createFromUtf8(rt, [inputString UTF8String]);
             const auto &output = markdownRuntime->runGuarded(markdownWorklet, text);
             const auto &ranges = output.asObject(rt).asArray(rt);
 
-            NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:inputString attributes:attributes];
-            [attributedString beginEditing];
-
-            // If the attributed string ends with underlined text, blurring the single-line input imprints the underline style across the whole string.
-            // It looks like a bug in iOS, as there is no underline style to be found in the attributed string, especially after formatting.
-            // This is a workaround that applies the NSUnderlineStyleNone to the string before iterating over ranges which resolves this problem.
-            [attributedString addAttribute:NSUnderlineStyleAttributeName value:[NSNumber numberWithInteger:NSUnderlineStyleNone] range:NSMakeRange(0, attributedString.length)];
-
-            _blockquoteRangesAndLevels = [NSMutableArray new];
-
             for (size_t i = 0, n = ranges.size(rt); i < n; ++i) {
                 const auto &item = ranges.getValueAtIndex(rt, i).asObject(rt);
                 const auto &type = item.getProperty(rt, "type").asString(rt).utf8(rt);
@@ -55,20 +48,10 @@
                 const auto &length = static_cast<int>(item.getProperty(rt, "length").asNumber());
                 const auto &depth = item.hasProperty(rt, "depth") ? static_cast<int>(item.getProperty(rt, "depth").asNumber()) : 1;
 
-                [self applyRangeToAttributedString:attributedString type:type start:start length:length depth:depth];
+                NSRange range = NSMakeRange(start, length);
+                MarkdownRange *markdownRange = [[MarkdownRange alloc] initWithType:@(type.c_str()) range:range depth:depth];
+                [markdownRanges addObject:markdownRange];
             }
-
-            RCTApplyBaselineOffset(attributedString);
-
-            [attributedString endEditing];
-
-            _prevInputString = inputString;
-            _prevAttributedString = attributedString;
-            _prevTextAttributes = attributes;
-            _prevMarkdownStyle = _markdownStyle;
-            _prevParserId = _parserId;
-
-            return attributedString;
         } catch (const jsi::JSError &error) {
             RCTLogWarn(@"[react-native-live-markdown] Incorrect schema of worklet parser output: %s", error.getMessage().c_str());
             NSAttributedString *attributedString = [[NSAttributedString alloc] initWithString:inputString attributes:attributes];
@@ -79,18 +62,45 @@
             _prevParserId = _parserId;
             return attributedString;
         }
+    
+        NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:inputString attributes:attributes];
+        [attributedString beginEditing];
+
+        // If the attributed string ends with underlined text, blurring the single-line input imprints the underline style across the whole string.
+        // It looks like a bug in iOS, as there is no underline style to be found in the attributed string, especially after formatting.
+        // This is a workaround that applies the NSUnderlineStyleNone to the string before iterating over ranges which resolves this problem.
+        [attributedString addAttribute:NSUnderlineStyleAttributeName value:[NSNumber numberWithInteger:NSUnderlineStyleNone] range:NSMakeRange(0, attributedString.length)];
+
+        _blockquoteRangesAndLevels = [NSMutableArray new];
+
+        for (MarkdownRange *markdownRange in markdownRanges) {
+            [self applyRangeToAttributedString:attributedString
+                                          type:std::string([markdownRange.type UTF8String])
+                                         range:markdownRange.range
+                                         depth:markdownRange.depth];
+        }
+
+        RCTApplyBaselineOffset(attributedString);
+
+        [attributedString endEditing];
+
+        _prevInputString = inputString;
+        _prevAttributedString = attributedString;
+        _prevTextAttributes = attributes;
+        _prevMarkdownStyle = _markdownStyle;
+        _prevParserId = _parserId;
+
+        return attributedString;
     }
 }
 
-- (void)applyRangeToAttributedString:(NSMutableAttributedString *)attributedString type:(const std::string)type start:(const int)start length:(const int)length depth:(const int)depth {
-    if (length == 0 || start + length > attributedString.length) {
+- (void)applyRangeToAttributedString:(NSMutableAttributedString *)attributedString type:(const std::string)type range:(NSRange)range depth:(const int)depth {
+    if (range.length == 0 || range.location + range.length > attributedString.length) {
         return;
     }
 
-    NSRange range = NSMakeRange(start, length);
-
     if (type == "bold" || type == "italic" || type == "code" || type == "pre" || type == "h1" || type == "emoji") {
-        UIFont *font = [attributedString attribute:NSFontAttributeName atIndex:start effectiveRange:NULL];
+        UIFont *font = [attributedString attribute:NSFontAttributeName atIndex:range.location effectiveRange:NULL];
         if (type == "bold") {
             font = [RCTFont updateFont:font withWeight:@"bold"];
         } else if (type == "italic") {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@expensify/react-native-live-markdown",
-  "version": "0.1.189",
+  "version": "0.1.191",
   "description": "Drop-in replacement for React Native's TextInput component with Markdown formatting.",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",