1
import type { Editor } from "@tiptap/react";
2
import { NodeSelection } from "@tiptap/pm/state";
3
 
4
export type FormattingToolbarEditor = Pick<Editor, "state" | "isActive"> & {
5
  view: Pick<Editor["view"], "dragging">;
6
};
7
 
8
interface ShouldShowFormattingToolbarArgs {
9
  editor: FormattingToolbarEditor;
10
  from: number;
11
  to: number;
12
}
13
 
14
function selectionTouchesDetailsSummary(editor: FormattingToolbarEditor, from: number, to: number) {
15
  let touchesDetailsSummary = false;
16
 
17
  editor.state.doc.nodesBetween(from, to, (node) => {
18
    if (node.type.name !== "detailsSummary") {
19
      return !touchesDetailsSummary;
20
    }
21
 
22
    touchesDetailsSummary = true;
23
    return false;
24
  });
25
 
26
  return touchesDetailsSummary;
27
}
28
 
29
export function shouldShowFormattingToolbar({ editor, from, to }: ShouldShowFormattingToolbarArgs) {
30
  if (from === to || editor.view.dragging) return false;
31
  if (editor.state.selection instanceof NodeSelection) return false;
32
  if (editor.isActive("codeBlock")) return false;
33
  if (selectionTouchesDetailsSummary(editor, from, to)) return false;
34
  return true;
35
}