KQ-854 · EMOJI/RISE

Emoji Rise

A composer that answers a colon. Typing `:` at the start of a word opens a picker in the slot above the field: the slot's measured height glides open on glide while the panel rises from distances.step on snap, and letters after the colon filter a named set whose survivors slide to their new cells on glide because every option is a layout item. Enter, Tab or a click replaces the token with the glyph and a space and pops a last-used tile on recoil; Escape closes the picker and keeps the text, and focus never leaves the textarea.

KQ-854 · EMOJI/RISE

Door 3 is clear from nine, Ines.

Type :sm then Enter.

Picker closed · 0 inserted

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/emoji-rise

Props

value / defaultValue: string; default ""; Controlled or initial draft.
onValueChange: (value: string) => void; default —; Fires from every keystroke, from an insert, and from the clear after a send.
onSend: (text: string) => void; default —; Fires from Enter with the picker closed, or the Send control, with the trimmed draft.
onInsert: (item: EmojiItem) => void; default —; Fires with the item whose glyph was inserted.
onPickerChange: (state: { open: boolean; query: string; matches: number }) => void; default —; Fires from an effect whenever the picker opens, closes, or its match count changes.
items: EmojiItem[]; default DEFAULT_EMOJI; The set to search: glyph, name, and optional keywords. Defaults to the built-in sixteen.
placeholder: string; default "Message"; The textarea's placeholder.
label: string; default —; Names the textarea for assistive technology.

Prop	Type	Default	Description
value / defaultValue	string	""	Controlled or initial draft.
onValueChange	(value: string) => void	—	Fires from every keystroke, from an insert, and from the clear after a send.
onSend	(text: string) => void	—	Fires from Enter with the picker closed, or the Send control, with the trimmed draft.
onInsert	(item: EmojiItem) => void	—	Fires with the item whose glyph was inserted.
onPickerChange	(state: { open: boolean; query: string; matches: number }) => void	—	Fires from an effect whenever the picker opens, closes, or its match count changes.
items	EmojiItem[]	DEFAULT_EMOJI	The set to search: glyph, name, and optional keywords. Defaults to the built-in sixteen.
placeholder	string	"Message"	The textarea's placeholder.
label	string	—	Names the textarea for assistive technology.