mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
61 lines
1.3 KiB
Vue
61 lines
1.3 KiB
Vue
<script>
|
|
import tippy from 'tippy.js'
|
|
|
|
export default {
|
|
props: {
|
|
content: Object,
|
|
node: Object,
|
|
},
|
|
methods: {
|
|
displayContextMenu(target, content, type) {
|
|
const trigger = type === 'link' ? 'click' : 'mouseenter'
|
|
const showOnInit = type !== 'link'
|
|
|
|
if (this.menu) {
|
|
return
|
|
}
|
|
|
|
this.menu = tippy(target, {
|
|
arrow: true,
|
|
arrowType: 'round',
|
|
content: content,
|
|
duration: [400, 200],
|
|
inertia: true,
|
|
interactive: true,
|
|
placement: 'top-start',
|
|
showOnInit,
|
|
theme: 'dark',
|
|
trigger,
|
|
onMount(instance) {
|
|
instance.popper.querySelector('input').focus({ preventScroll: true })
|
|
},
|
|
})
|
|
|
|
// we have to update tippy whenever the DOM is updated
|
|
if (MutationObserver) {
|
|
this.observer = new MutationObserver(() => {
|
|
this.menu.popperInstance.scheduleUpdate()
|
|
})
|
|
this.observer.observe(content, {
|
|
childList: true,
|
|
subtree: true,
|
|
characterData: true,
|
|
})
|
|
}
|
|
},
|
|
hideContextMenu() {
|
|
if (this.menu) {
|
|
this.menu.destroy()
|
|
this.menu = null
|
|
}
|
|
if (this.observer) {
|
|
this.observer.disconnect()
|
|
}
|
|
},
|
|
},
|
|
render() {
|
|
return null
|
|
},
|
|
}
|
|
</script>
|