diff --git a/README.md b/README.md index e23e21d..25b090a 100644 --- a/README.md +++ b/README.md @@ -46,14 +46,22 @@ const users = [ /> const formatMentionNode = (txt, key)=> ( - + {}}> + {txt} - -) + + +); + +const style = { + letterSpacing: 0, + color: '#595959', + paddingTop: 10 +}; - - {displayTextWithMentions(message.text, formatMentionNode)} - + + {displayTextWithMentions(message.text, formatMentionNode, style)} + ``` ## How it works diff --git a/src/Editor/EditorUtils.js b/src/Editor/EditorUtils.js index f50a95e..6184e21 100644 --- a/src/Editor/EditorUtils.js +++ b/src/Editor/EditorUtils.js @@ -1,9 +1,12 @@ +import React from "react"; +import { Text } from 'react-native'; + /** * EditorUtils contains helper * functions for our Editor */ -export const displayTextWithMentions = (inputText, formatMentionNode) => { +export const displayTextWithMentions = (inputText, formatMentionNode, style) => { /** * Use this function to parse mentions markup @[username](id) in the string value. */ @@ -17,7 +20,7 @@ export const displayTextWithMentions = (inputText, formatMentionNode) => { mentions.forEach((men, index) => { const initialStr = retLine.substring(lastIndex, men.start); lastIndex = men.end + 1; - formattedText.push(initialStr); + formattedText.push({initialStr}); const formattedMention = formatMentionNode( `@${men.username}`, `${index}-${men.id}-${rowIndex}` @@ -25,13 +28,13 @@ export const displayTextWithMentions = (inputText, formatMentionNode) => { formattedText.push(formattedMention); if (mentions.length - 1 === index) { const lastStr = retLine.substr(lastIndex); //remaining string - formattedText.push(lastStr); + formattedText.push({lastStr}); } }); } else { - formattedText.push(retLine); + formattedText.push({retLine}); } - formattedText.push("\n"); + formattedText.push({'\n'}); }); return formattedText; };