@mtg-rio/mui-mentions
Version:
@mention people in a MUI TextField
25 lines (24 loc) • 1.14 kB
TypeScript
import React, { ReactNode } from 'react';
import { BaseSuggestionData, SuggestionDataSource } from './types';
interface HighlighterProps<T extends BaseSuggestionData> {
/** Ref applied to the main container of the highlighter. */
highlighterRef: React.RefObject<HTMLDivElement>;
/** Ref applied to the element which keeps track of the cursor position. */
cursorRef: React.RefObject<HTMLSpanElement>;
/** Ref of the input field. */
inputRef: HTMLInputElement | HTMLTextAreaElement | null;
/** The start of the selected text range in the plain text value. */
selectionStart: number | null;
/** The end of the selected text range in the plain text value. */
selectionEnd: number | null;
/** The markup value string. */
value: string;
/** The suggestion data sources used in the makup string. */
dataSources: SuggestionDataSource<T>[];
/** Whether the input is multiline. */
multiline?: boolean;
/** The color of the highlight. */
color?: string;
}
declare function Highlighter<T extends BaseSuggestionData>(props: HighlighterProps<T>): ReactNode;
export default Highlighter;