alighasami/vue-flow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(flow): Promisify updateNodePosition

Browse Source 
* helps with selected nodes dragging performance
This commit is contained in:
Braks
2022-04-11 11:30:10 +02:00
parent 3be164b20e
commit bf2c77fb59
2 changed files with 20 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package/src/composables/useVueFlow.ts
+4 -2
View File
@@ -61,7 +61,9 @@ export class Storage {
id, id,
store, store,
} }
this.set(id, flow) this.set(id, flow)
return flow return flow
} }
@@ -80,7 +82,7 @@ export default <NodeData = ElementData, EdgeData = ElementData>(
const scope = getCurrentScope() as Scope const scope = getCurrentScope() as Scope
const vueFlowId = scope?.vueFlowId || options?.id const vueFlowId = scope?.vueFlowId || options?.id
let vueFlow: Injection<any, any> let vueFlow: Injection
if (scope) { if (scope) {
const injection = inject(VueFlow, null) const injection = inject(VueFlow, null)
@@ -108,7 +110,7 @@ export default <NodeData = ElementData, EdgeData = ElementData>(
if (options) vueFlow.setState(options) if (options) vueFlow.setState(options)
} }
if (!vueFlow) throw new Error('vue flow store instance not found.') if (!vueFlow) throw new Error('[vueflow]: store instance not found.')
if (scope) provide(VueFlow, vueFlow) if (scope) provide(VueFlow, vueFlow)
package/src/store/actions.ts
+16 -10
View File
@@ -117,21 +117,27 @@ const createGraphNodes = (nodes: Node[], getNode: Getters['getNode'], currGraphN
export default (state: State, getters: ComputedGetters): Actions => { export default (state: State, getters: ComputedGetters): Actions => {
const updateNodePosition: Actions['updateNodePosition'] = ({ id, diff = { x: 0, y: 0 }, dragging }) => { const updateNodePosition: Actions['updateNodePosition'] = ({ id, diff = { x: 0, y: 0 }, dragging }) => {
const changes: NodePositionChange[] = [] const nodePosPromise = new Promise<NodePositionChange[]>((resolve) => {
const changes: NodePositionChange[] = []
state.nodes.forEach((node) => { state.nodes.forEach((node) => {
if (node.selected) { if (node.selected) {
if (!node.parentNode) { if (!node.parentNode) {
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes)) changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes))
} else if (!isParentSelected(node, getters.getNode.value)) { } else if (!isParentSelected(node, getters.getNode.value)) {
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes))
}
} else if (node.id === id) {
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes)) changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes))
} }
} else if (node.id === id) { })
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes))
} if (changes.length) resolve(changes)
}) })
if (changes.length) state.hooks.nodesChange.trigger(changes) nodePosPromise.then((changes) => {
state.hooks.nodesChange.trigger(changes)
})
} }
const updateNodeDimensions: Actions['updateNodeDimensions'] = (updates) => { const updateNodeDimensions: Actions['updateNodeDimensions'] = (updates) => {