react-native-controlled-mentions
Version:
Fully controlled React Native mentions component
105 lines (104 loc) • 4.51 kB
TypeScript
import { StyleProp, TextStyle } from 'react-native';
import { MentionData, MentionPartType, Part, PartType, Position, Suggestion } from '../types';
/**
* RegEx grouped results. Example - "@[Full Name](123abc)"
* We have 4 groups here:
* - The whole original string - "@[Full Name](123abc)"
* - Mention trigger - "@"
* - Name - "Full Name"
* - Id - "123abc"
*/
declare const mentionRegEx: RegExp;
declare const defaultMentionTextStyle: StyleProp<TextStyle>;
declare const isMentionPartType: (partType: PartType) => partType is MentionPartType;
/**
* Function for getting object with keyword for each mention part type
*
* If keyword is undefined then we don't tracking mention typing and shouldn't show suggestions.
* If keyword is not undefined (even empty string '') then we are tracking mention typing.
*
* Examples where @name is just plain text yet, not mention:
* '|abc @name dfg' - keyword is undefined
* 'abc @| dfg' - keyword is ''
* 'abc @name| dfg' - keyword is 'name'
* 'abc @na|me dfg' - keyword is 'na'
* 'abc @|name dfg' - keyword is against ''
* 'abc @name |dfg' - keyword is 'name '
* 'abc @name dfg|' - keyword is 'name dfg'
* 'abc @name dfg |' - keyword is undefined (we have more than one space)
* 'abc @name dfg he|' - keyword is undefined (we have more than one space)
*/
declare const getMentionPartSuggestionKeywords: (parts: Part[], plainText: string, selection: Position, partTypes: PartType[]) => {
[trigger: string]: string | undefined;
};
/**
* Generates new value when we changing text.
*
* @param parts full parts list
* @param originalText original plain text
* @param changedText changed plain text
*/
declare const generateValueFromPartsAndChangedText: (parts: Part[], originalText: string, changedText: string) => string;
/**
* Method for adding suggestion to the parts and generating value. We should:
* - Find part with plain text where we were tracking mention typing using selection state
* - Split the part to next parts:
* -* Before new mention
* -* With new mention
* -* After mention with space at the beginning
* - Generate new parts array and convert it to value
*
* @param parts - full part list
* @param mentionType - actually the mention type
* @param plainText - current plain text
* @param selection - current selection
* @param suggestion - suggestion that should be added
*/
declare const generateValueWithAddedSuggestion: (parts: Part[], mentionType: MentionPartType, plainText: string, selection: Position, suggestion: Suggestion) => string | undefined;
/**
* Method for generating part for plain text
*
* @param text - plain text that will be added to the part
* @param positionOffset - position offset from the very beginning of text
*/
declare const generatePlainTextPart: (text: string, positionOffset?: number) => Part;
/**
* Method for generating part for mention
*
* @param mentionPartType
* @param mention - mention data
* @param positionOffset - position offset from the very beginning of text
*/
declare const generateMentionPart: (mentionPartType: MentionPartType, mention: MentionData, positionOffset?: number) => Part;
/**
* Method for generation mention value that accepts mention regex
*
* @param trigger
* @param suggestion
*/
declare const getMentionValue: (trigger: string, suggestion: Suggestion) => string;
/**
* Recursive function for deep parse MentionInput's value and get plainText with parts
*
* @param value - the MentionInput's value
* @param partTypes - All provided part types
* @param positionOffset - offset from the very beginning of plain text
*/
declare const parseValue: (value: string, partTypes: PartType[], positionOffset?: number) => {
plainText: string;
parts: Part[];
};
/**
* Function for generation value from parts array
*
* @param parts
*/
declare const getValueFromParts: (parts: Part[]) => string;
/**
* Replace all mention values in value to some specified format
*
* @param value - value that is generated by MentionInput component
* @param replacer - function that takes mention object as parameter and returns string
*/
declare const replaceMentionValues: (value: string, replacer: (mention: MentionData) => string) => string;
export { mentionRegEx, defaultMentionTextStyle, isMentionPartType, getMentionPartSuggestionKeywords, generateValueFromPartsAndChangedText, generateValueWithAddedSuggestion, generatePlainTextPart, generateMentionPart, getMentionValue, parseValue, getValueFromParts, replaceMentionValues, };