1
import type { Editor, Range } from "@tiptap/core";
2
import { mountEditorRenderer } from "../menu/renderer";
3
import { EmojiInsertPopover, type EmojiInsertPopoverProps } from "./insert-popover";
4
 
5
function showEmojiInsertPanel(editor: Editor, opts: { range: Range; pos: number }) {
6
  // Keep launcher exports separate from the React component module so Vite Fast
7
  // Refresh can treat the popover as a component boundary without falling back
8
  // to a full invalidation on every edit.
9
  function cleanup() {
10
    renderer.destroy();
11
  }
12
 
13
  const renderer = mountEditorRenderer<unknown, EmojiInsertPopoverProps>(editor, EmojiInsertPopover, {
14
    editor,
15
    range: opts.range,
16
    pos: opts.pos,
17
    onClose: cleanup,
18
  });
19
}
20
 
21
export function launchEmojiPicker(editor: Editor, range: Range) {
22
  if (!editor.isEditable) return;
23
 
24
  editor.chain().focus(null, { scrollIntoView: false }).deleteRange(range).run();
25
  const pos = editor.state.selection.from;
26
 
27
  queueMicrotask(() => {
28
    if (editor.isDestroyed) return;
29
    showEmojiInsertPanel(editor, {
30
      range: { from: pos, to: pos },
31
      pos,
32
    });
33
  });
34
}