diff --git a/src/components/mention-input.tsx b/src/components/mention-input.tsx index 5be83d4..86c50eb 100644 --- a/src/components/mention-input.tsx +++ b/src/components/mention-input.tsx @@ -30,6 +30,8 @@ const MentionInput: FC = ( onSelectionChange, + deleteFullMentioned, + ...textInputProps }, ) => { @@ -54,7 +56,7 @@ const MentionInput: FC = ( * @param changedText */ const onChangeInput = (changedText: string) => { - onChange(generateValueFromPartsAndChangedText(parts, plainText, changedText)); + onChange(generateValueFromPartsAndChangedText(parts, plainText, changedText, deleteFullMentioned)); }; /** diff --git a/src/types/types.ts b/src/types/types.ts index 5ec7d99..fbd8f34 100644 --- a/src/types/types.ts +++ b/src/types/types.ts @@ -100,6 +100,8 @@ type MentionInputProps = Omit & { inputRef?: Ref; containerStyle?: StyleProp; + + deleteFullMentioned?: boolean; }; export type { diff --git a/src/utils/utils.ts b/src/utils/utils.ts index d38db13..7d62eb9 100644 --- a/src/utils/utils.ts +++ b/src/utils/utils.ts @@ -51,7 +51,7 @@ const getPartIndexByCursor = (parts: Part[], cursor: number, isIncludeEnd?: bool * @param cursor current cursor position * @param count count of characters that didn't change */ -const getPartsInterval = (parts: Part[], cursor: number, count: number): Part[] => { +const getPartsInterval = (parts: Part[], cursor: number, count: number, deleteFullMentioned: boolean): Part[] => { const newCursor = cursor + count; const currentPartIndex = getPartIndexByCursor(parts, cursor); @@ -69,6 +69,12 @@ const getPartsInterval = (parts: Part[], cursor: number, count: number): Part[] // Push whole first affected part or sub-part of the first affected part if (currentPart.position.start === cursor && currentPart.position.end <= newCursor) { partsInterval.push(currentPart); + } else if (deleteFullMentioned && currentPart.data?.trigger === "@") { + partsInterval.push( + generatePlainTextPart( + currentPart.text.substring(0, -(cursor - currentPart.position.start)) + ) + ); } else { partsInterval.push(generatePlainTextPart(currentPart.text.substr(cursor - currentPart.position.start, count))); } @@ -80,6 +86,12 @@ const getPartsInterval = (parts: Part[], cursor: number, count: number): Part[] // Push whole last affected part or sub-part of the last affected part if (newPart.position.end === newCursor && newPart.position.start >= cursor) { partsInterval.push(newPart); + } else if (deleteFullMentioned && newPart.data?.trigger === "@") { + partsInterval.push( + generatePlainTextPart( + newPart.text.substring(0, -(newCursor - newPart.position.start)) + ) + ); } else { partsInterval.push(generatePlainTextPart(newPart.text.substr(0, newCursor - newPart.position.start))); } @@ -185,7 +197,7 @@ const getMentionPartSuggestionKeywords = ( * @param originalText original plain text * @param changedText changed plain text */ -const generateValueFromPartsAndChangedText = (parts: Part[], originalText: string, changedText: string) => { +const generateValueFromPartsAndChangedText = (parts: Part[], originalText: string, changedText: string, deleteFullMentioned = false) => { const changes = diffChars(originalText, changedText) as CharactersDiffChange[]; let newParts: Part[] = []; @@ -221,8 +233,8 @@ const generateValueFromPartsAndChangedText = (parts: Part[], originalText: strin */ default: { if (change.count !== 0) { - newParts = newParts.concat(getPartsInterval(parts, cursor, change.count)); - + newParts = newParts.concat(getPartsInterval(parts, cursor, change.count, deleteFullMentioned)); + cursor += change.count; }