feat: add mentionTextStyle property

resolves 1 point of #9

Author: dabakovich

src/components/mentions.tsx

@@ -9,6 +9,7 @@ import {
 
 import { MentionsProps, Position, Suggestion } from '../types';
 import {
+  defaultMentionTextStyle,
   getChangedPositions,
   getMentionPart,
   getMentionValue,
@@ -28,10 +29,12 @@ const Mentions: FC<MentionsProps> = (
 
     isInsertSpaceAfterMention = false,
 
-    containerStyle,
-
     inputRef: propInputRef,
 
+    mentionTextStyle = defaultMentionTextStyle,
+
+    containerStyle,
+
     onSelectionChange,
 
     ...textInputProps
@@ -280,7 +283,7 @@ const Mentions: FC<MentionsProps> = (
       >
         <Text>
           {parts.map(({text, data}, index) => data ? (
-            <Text key={`${index}-m`} style={{fontWeight: 'bold', color: '#4f69f3'}}>{text}</Text>
+            <Text key={`${index}-m`} style={mentionTextStyle}>{text}</Text>
           ) : (
             <Text key={index}>{text}</Text>
           ))}

src/types/types.ts

@@ -1,4 +1,4 @@
-import { StyleProp, TextInput, TextInputProps, ViewStyle } from 'react-native';
+import { StyleProp, TextInput, TextInputProps, TextStyle, ViewStyle } from 'react-native';
 import { MutableRefObject, ReactNode } from 'react';
 
 type Suggestion = {
@@ -51,6 +51,8 @@ type MentionsProps = Omit<TextInputProps, 'onChange'> & {
 
   inputRef?: MutableRefObject<TextInput | null>;
 
+  mentionTextStyle?: StyleProp<TextStyle>;
+
   containerStyle?: StyleProp<ViewStyle>;
 };
 

src/utils/utils.ts

@@ -1,10 +1,13 @@
 import { Change, diffChars } from 'diff';
+import { StyleProp, TextStyle } from 'react-native';
 // @ts-ignore the lib do not have TS declarations yet
 import matchAll from 'string.prototype.matchall';
 import { MentionData, Part, Position, RegexMatchResult, Suggestion } from '../types';
 
 const mentionRegEx = /(?<original>@\[(?<name>([^@[]*))]\((?<id>([0-9]*))\))/gi;
 
+const defaultMentionTextStyle: StyleProp<TextStyle> = {fontWeight: 'bold', color: '#4f69f3'};
+
 type CharactersDiffChange = Omit<Change, 'count'> & { count: number };
 
 /**
@@ -167,6 +170,7 @@ const replaceMentionValues = (
 
 export {
   mentionRegEx,
+  defaultMentionTextStyle,
   getChangedPositions,
   getPart,
   getMentionPart,