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

refactor(core): hide edges when we have no dimensions

Browse Source 
Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
This commit is contained in:
braks
2023-02-27 23:18:40 +01:00
committed by Braks
parent d30632aadc
commit 50ee96d0c1
1 changed files with 27 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
packages/core/src/container/EdgeRenderer/EdgeRenderer.vue
View File

@@ -18,6 +18,7 @@ const {
getNodesInitialized,
getEdgeTypes,
elevateEdgesOnSelect,
dimensions,
} = $(useVueFlow())
const sourceNode = controlledComputed(
@@ -90,24 +91,31 @@ export default {
</script>
<template>
<svg v-for="group of groups" :key="group.level" class="vue-flow__edges vue-flow__container" :style="`z-index: ${group.level}`">
<MarkerDefinitions v-if="group.isMaxLevel" />
<g>
<EdgeWrapper
v-for="edge of group.edges"
:id="edge.id"
:key="edge.id"
:edge="edge"
:type="getType(edge.type, edge.template)"
:name="edge.type || 'default'"
:selectable="selectable(edge.selectable)"
:updatable="updatable(edge.updatable)"
:focusable="focusable(edge.focusable)"
/>
</g>
</svg>
<template v-if="dimensions.width && dimensions.height">
<svg
v-for="group of groups"
:key="group.level"
class="vue-flow__edges vue-flow__container"
:style="`z-index: ${group.level}`"
>
<MarkerDefinitions v-if="group.isMaxLevel" />
<g>
<EdgeWrapper
v-for="edge of group.edges"
:id="edge.id"
:key="edge.id"
:edge="edge"
:type="getType(edge.type, edge.template)"
:name="edge.type || 'default'"
:selectable="selectable(edge.selectable)"
:updatable="updatable(edge.updatable)"
:focusable="focusable(edge.focusable)"
/>
</g>
</svg>
<svg v-if="connectionLineVisible && !!sourceNode" class="vue-flow__edges vue-flow__connectionline vue-flow__container">
<ConnectionLine :source-node="sourceNode" />
</svg>
<svg v-if="connectionLineVisible && !!sourceNode" class="vue-flow__edges vue-flow__connectionline vue-flow__container">
<ConnectionLine :source-node="sourceNode" />
</svg>
</template>
</template>