Support custom parsing logic (pass worklet as parser prop)

[tomekzaw]

Details

This PR removes separate JS bundle with ExpensiMark logic and allows for customizing MarkdownTextInput formatting logic via parser property. Parser needs to be a function that accepts a plaintext string and returns an array of ranges.

Related Issues

#317

Manual Tests

Linked PRs

[tomekzaw]

Regression: toggling font size doesn't work properly

Screen.Recording.2024-11-06.at.13.53.44.mov

It works correctly if there's a blockquote (NSParagraphStyle) in the middle of the text:

Screen.Recording.2024-11-06.at.14.01.11.mov

[bbaoNg97]

any update on this?

[tomekzaw]

@bbaoNg97 This PR is currently in internal review.

[tomekzaw]

TODO: check in release mode

[os-botify]

🚀 Published to npm in 0.1.188 🎉

[garygcchiu]

Hi, thank you for this fix. Unfortunately I think the patch here is causing install issues for yarn users: #573

[daledah]

Hi @tomekzaw, coming from Expensify/App#54522, we're facing the issue when text and markdown are different then the error will be thrown. If so users can't perform their action. I don't think we should remove try/catch here. Can you please help take a look? Thank you.

[tomekzaw]

It was a deliberate decision to remove try/catch block so we can show a RedBox with the error if something fails.

However, looks like I forgot about the case when Markdown message before and after parsing don't match. I think we should show a warning and return an empty array in such case, like this:

if (text !== markdown) {
  console.warn(
    `[react-native-live-markdown] Parsing error: the processed text does not match the original Markdown input. This may be caused by incorrect parsing functions or invalid input Markdown.\nProcessed input: '${JSON.stringify(
      text,
    )}'\nOriginal input: '${JSON.stringify(markdown)}'`,
  );
  return [];
}