Bluesky app fork with some witchin' additions 💫
1import {type DialogControlProps} from '../Dialog'
2import {type TriggerProps as MenuTriggerProps} from '../Menu/types'
3
4/**
5 * Represents an emoji selected from the picker. Sourced from the `emoji-mart`
6 * library's selection data.
7 */
8export type Emoji = {
9 aliases?: string[]
10 emoticons: string[]
11 id: string
12 keywords: string[]
13 name: string
14 /** The native unicode character for the emoji, e.g. "😀" */
15 native: string
16 shortcodes?: string
17 /** The unicode codepoint, e.g. "1f600" */
18 unified: string
19 /** Skin tone variant (1–6), if applicable */
20 skin?: number
21}
22
23type FocusableElement = {focus: () => void}
24
25export interface RootProps {
26 children: React.ReactNode
27 control?: DialogControlProps
28 /**
29 * Called when the user selects an emoji. On web this fires in addition to
30 * the `textInputWebEmitter` event, so callers that only need the text
31 * insertion can omit this.
32 */
33 onEmojiSelect?: (emoji: Emoji) => void
34 /**
35 * When `true` (default), preloads emoji data as soon as the component
36 * mounts so the picker opens instantly. Set to `false` to defer loading
37 * until the picker is actually opened.
38 */
39 preloadOnMount?: boolean
40 /**
41 * Element to return focus to when the picker closes. Accepts either a ref
42 * or a getter function.
43 */
44 nextFocusRef?:
45 | React.RefObject<FocusableElement | null>
46 | (() => FocusableElement | null | undefined)
47}
48
49/**
50 * Props for the trigger button that opens the emoji picker. Extends
51 * {@link MenuTriggerProps} — accepts the same render-prop children pattern.
52 */
53export interface TriggerProps extends MenuTriggerProps {}
54
55/**
56 * Props for the picker panel itself.
57 */
58export interface PickerProps {
59 /**
60 * When `true`, the picker will remain open after selecting an emoji when the Shift key is held down.
61 *
62 * @default true
63 */
64 keepOpenWhenShiftHeld?: boolean
65}