refactoring

docs/src/demos/Nodes/Mention/index.vue

@@ -46,7 +46,7 @@ export default {
                 })
 
                 popup = tippy('body', {
-                  getReferenceClientRect: () => props.virtualNode.getBoundingClientRect(),
+                  getReferenceClientRect: () => props.clientRect,
                   appendTo: () => document.body,
                   content: component.element,
                   showOnCreate: true,
@@ -59,7 +59,7 @@ export default {
                 component.updateProps(props)
 
                 popup[0].setProps({
-                  getReferenceClientRect: () => props.virtualNode.getBoundingClientRect(),
+                  getReferenceClientRect: () => props.clientRect,
                 })
               },
               onKeyDown(props) {

packages/suggestion/src/getVirtualNode.ts

@@ -1,15 +0,0 @@
-export interface VirtualNode {
-  getBoundingClientRect: () => DOMRect,
-  clientWidth: number,
-  clientHeight: number,
-}
-
-export function getVirtualNode(node: Element): VirtualNode {
-  return {
-    getBoundingClientRect() {
-      return node.getBoundingClientRect()
-    },
-    clientWidth: node.clientWidth,
-    clientHeight: node.clientHeight,
-  }
-}

packages/suggestion/src/index.ts

@@ -1,7 +1,6 @@
 import { Suggestion } from './suggestion'
 
 export * from './findSuggestionMatch'
-export * from './getVirtualNode'
 export * from './suggestion'
 
 export default Suggestion

packages/suggestion/src/suggestion.ts

@@ -2,7 +2,6 @@ import { Editor, Range, AnyObject } from '@tiptap/core'
 import { Plugin, PluginKey } from 'prosemirror-state'
 import { Decoration, DecorationSet, EditorView } from 'prosemirror-view'
 import { findSuggestionMatch } from './findSuggestionMatch'
-import { getVirtualNode, VirtualNode } from './getVirtualNode'
 
 export interface SuggestionOptions {
   editor: Editor,
@@ -28,7 +27,7 @@ export interface SuggestionProps {
   items: any[],
   command: (attributes: AnyObject) => void,
   decorationNode: Element | null,
-  virtualNode: VirtualNode | null,
+  clientRect: DOMRect | null,
 }
 
 export interface SuggestionKeyDownProps {
@@ -87,11 +86,9 @@ export function Suggestion({
               command({ range: state.range, attributes })
             },
             decorationNode,
-            // build a virtual node for popper.js or tippy.js
+            // virtual node for popper.js or tippy.js
             // this can be used for building popups without a DOM node
-            virtualNode: decorationNode
-              ? getVirtualNode(decorationNode)
-              : null,
+            clientRect: decorationNode?.getBoundingClientRect() || null,
           }
 
           if (handleStart) {