fix(core): use center position of handle as snapping point for connection lines (#1625)

* fix(core): calculate handle positions correctly Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * fix(core): remove handleId check Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * chore(core): cleanup Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * chore(core): cleanup click connect handlers Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * fix(core): add flow id to handle ids Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * tests: correct updateEdge test Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * fix(core): use center position of handle Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * chore(examples): cleanup easy connect example Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * refactor(tests): run actions on chrome Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * chore(workflows): correctly hash lock file Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> --------- Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
2025-01-04 16:56:00 +01:00
parent 041fd871a1
commit b33da47a3a
16 changed files with 385 additions and 312 deletions
@@ -0,0 +1,27 @@
+<script lang="ts" setup>
+import type { ConnectionLineProps } from '@vue-flow/core'
+import { BaseEdge, getStraightPath } from '@vue-flow/core'
+import { computed } from 'vue'
+
+const props = defineProps<ConnectionLineProps>()
+
+const edgePath = computed(() =>
+  getStraightPath({
+    ...props,
+    sourceX: props.sourceX - props.sourceNode.dimensions.width / 2,
+  }),
+)
+</script>
+
+<template>
+  <g>
+    <BaseEdge
+      :style="{
+        strokeWidth: 3,
+        stroke: 'black',
+      }"
+      :path="edgePath[0]"
+    />
+    <circle :cx="targetX" :cy="targetY" fill="black" :r="3" stroke="black" :stroke-width="1.5" />
+  </g>
+</template>