diff --git a/src/composables/index.ts b/src/composables/index.ts index 2fdf6964..3b68fd24 100644 --- a/src/composables/index.ts +++ b/src/composables/index.ts @@ -1,6 +1,4 @@ export { default as useHandle } from './useHandle' -export { default as useHooks } from './useHooks' -export * from './useHooks' export { default as useKeyPress } from './useKeyPress' export { default as useZoomPanHelper } from './useZoomPanHelper' export { default as useWindow } from './useWindow' diff --git a/src/composables/useVueFlow.ts b/src/composables/useVueFlow.ts index 2db2d743..cc316a77 100644 --- a/src/composables/useVueFlow.ts +++ b/src/composables/useVueFlow.ts @@ -1,4 +1,3 @@ -import useHooks from './useHooks' import { EdgeChange, EmitFunc, @@ -10,8 +9,9 @@ import { FlowElement, GraphNode, GraphEdge, + SelectionChange, } from '~/types' -import { useStore } from '~/store' +import { useStore, useHooks } from '~/store' import { isGraphNode } from '~/utils' const applyChanges = (changes: NodeChange[] | EdgeChange[], elements: FlowElements): FlowElements => { @@ -64,15 +64,16 @@ export const applyNodeChanges = (changes: NodeChange[], nodes: GraphNode[]): Gra export const applyEdgeChanges = (changes: EdgeChange[], edges: GraphEdge[]): GraphEdge[] => applyChanges(changes, edges) -export const createSelectionChange = (id: string, selected: boolean) => ({ +export const createSelectionChange = (id: string, selected: boolean): SelectionChange => ({ id, type: 'select', selected, }) -export const getSelectionChanges = (items: any[], selectedIds: string[]) => { +export const getSelectionChanges = (items: FlowElements, selectedIds: string[]) => { return items.reduce((res, item) => { - const willBeSelected = selectedIds.includes(item.id) + const willBeSelected = + selectedIds.includes(item.id) || (isGraphNode(item) && item.parentNode && selectedIds.includes(item.parentNode?.id)) if (!item.selected && willBeSelected) { item.selected = true @@ -83,7 +84,7 @@ export const getSelectionChanges = (items: any[], selectedIds: string[]) => { } return res - }, []) + }, [] as SelectionChange[]) } export const initFlow = (emit: EmitFunc, id?: string): FlowStore => { diff --git a/src/composables/useHooks.ts b/src/store/hooks.ts similarity index 97% rename from src/composables/useHooks.ts rename to src/store/hooks.ts index 2410d5e5..2f94f7bf 100644 --- a/src/composables/useHooks.ts +++ b/src/store/hooks.ts @@ -22,7 +22,6 @@ export const createHooks = (): FlowHooks => ({ move: createEventHook(), moveStart: createEventHook(), moveEnd: createEventHook(), - selectionChange: createEventHook(), selectionDragStart: createEventHook(), selectionDrag: createEventHook(), selectionDragStop: createEventHook(), diff --git a/src/store/index.ts b/src/store/index.ts index 40947803..cdf4bb38 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -1,2 +1,3 @@ +export { default as useHooks } from './hooks' export { default as useStore } from './store' export * from './state' diff --git a/src/store/state.ts b/src/store/state.ts index e9724b1a..e8616797 100644 --- a/src/store/state.ts +++ b/src/store/state.ts @@ -1,6 +1,6 @@ +import { createHooks } from './hooks' import { ConnectionMode, FlowState, PanOnScrollMode, DefaultNodeTypes, DefaultEdgeTypes, ConnectionLineType } from '~/types' import { DefaultNode, InputNode, OutputNode, BezierEdge, SmoothStepEdge, StepEdge, StraightEdge } from '~/components' -import { createHooks } from '~/composables' export const defaultNodeTypes: DefaultNodeTypes = { input: InputNode,