Lets a user insert an emoji by typing :query or from the editor's button.
It keeps the state of TextEditor's emoji picker, and TextEditor renders
the picker and handles its keys.
Returns the picker's state and the functions that drive it. A pick goes
through replace, TextEditor's function that puts the text over
[start, end) of the textarea's value, followed by a space when word is
set.
Returned by useEmojiTrigger to TextEditor.
- closeEmoji: () => void
- emojiMode: EmojiMode
- emojiQuery: string
-
openEmojiBrowser: () => voidstart: number,end: number
Opens a
browsepicker, whose pick will replace[start, end). -
selectEmoji: (native: string) => void
Inserts the emoji
nativethroughreplaceand closes the picker. -
setEmojiQuery: (query: string) => void
Sets the query of the picker's search, in either mode.
-
syncEmojiTrigger: () => voidvalue: string,cursor: number,open: boolean
Follows an inline
:queryand closes the picker once the caret leaves it. The caller calls it on every change withopenset, and on every caret move without, since only typing may open the picker. It leaves abrowsepicker alone.
Returned by useEmojiTrigger to TextEditor, which keys its focus and
key handling on it. An inline picker was opened by a typed :query: focus
stays in the textarea and a pick replaces the query. A browse picker was
opened from the button: focus goes to its search and a pick lands at the
caret.
Usage
import * as mod from "src/hooks/editor/useEmojiTrigger.ts";