react-mention-input
Version:
A React component for input with @mention functionality.
39 lines (38 loc) • 1.16 kB
TypeScript
import React, { ReactNode } from "react";
import "./MentionInput.css";
interface User {
id: number;
name: string;
}
interface MentionInputProps {
users: User[];
placeholder?: string;
containerClassName?: string;
inputContainerClassName?: string;
inputClassName?: string;
sendBtnClassName?: string;
suggestionListClassName?: string;
suggestionItemClassName?: string;
attachedImageContainerClassName?: string;
attachedImageContainerStyle?: React.CSSProperties;
imgClassName?: string;
imgStyle?: React.CSSProperties;
sendButtonIcon?: ReactNode;
attachmentButtonIcon?: ReactNode;
onSendMessage?: (obj: {
messageText: string;
messageHTML: string;
userSelectListWithIds: {
id: number;
name: string;
}[];
userSelectListName: string[];
tags: string[];
images?: File[];
imageUrl?: string | null;
}) => void;
suggestionPosition?: 'top' | 'bottom' | 'left' | 'right';
onImageUpload?: (file: File) => Promise<string>;
}
declare const MentionInput: React.FC<MentionInputProps>;
export default MentionInput;