Files
vue-flow/packages/core/src/composables/useNodeHooks.ts
T

75 lines
1.9 KiB
TypeScript

import type { GraphNode, NodeEventsEmit, NodeEventsOn, VueFlowStore } from '../types'
import { createExtendedEventHook } from '../utils'
function createNodeHooks() {
return {
doubleClick: createExtendedEventHook(),
click: createExtendedEventHook(),
mouseEnter: createExtendedEventHook(),
mouseMove: createExtendedEventHook(),
mouseLeave: createExtendedEventHook(),
contextMenu: createExtendedEventHook(),
dragStart: createExtendedEventHook(),
drag: createExtendedEventHook(),
dragStop: createExtendedEventHook(),
}
}
export function useNodeHooks(node: GraphNode, emits: VueFlowStore['emits']): { emit: NodeEventsEmit; on: NodeEventsOn } {
const nodeHooks = createNodeHooks()
nodeHooks.doubleClick.on((event) => {
emits.nodeDoubleClick(event)
node.events?.doubleClick?.(event)
})
nodeHooks.click.on((event) => {
emits.nodeClick(event)
node.events?.click?.(event)
})
nodeHooks.mouseEnter.on((event) => {
emits.nodeMouseEnter(event)
node.events?.mouseEnter?.(event)
})
nodeHooks.mouseMove.on((event) => {
emits.nodeMouseMove(event)
node.events?.mouseMove?.(event)
})
nodeHooks.mouseLeave.on((event) => {
emits.nodeMouseLeave(event)
node.events?.mouseLeave?.(event)
})
nodeHooks.contextMenu.on((event) => {
emits.nodeContextMenu(event)
node.events?.contextMenu?.(event)
})
nodeHooks.dragStart.on((event) => {
emits.nodeDragStart(event)
node.events?.dragStart?.(event)
})
nodeHooks.drag.on((event) => {
emits.nodeDrag(event)
node.events?.drag?.(event)
})
nodeHooks.dragStop.on((event) => {
emits.nodeDragStop(event)
node.events?.dragStop?.(event)
})
return Object.entries(nodeHooks).reduce(
(hooks, [key, value]) => {
hooks.emit[key as keyof NodeEventsEmit] = value.trigger
hooks.on[key as keyof NodeEventsOn] = value.on
return hooks
},
{ emit: {} as NodeEventsEmit, on: {} as NodeEventsOn },
)
}