feat(core): make loopback edges appear nicely

[atyshka]

🚀 What's changed?

• Loopback edges (same source and destination) now render nicely
  Original:

New:

🐛 Fixes

• Loopback edges previously were invisible as they rendered behind the node. This routes the edge around the left side.

🪴 To-Dos

• This currently only works for default handle positions. I don't know if you're willing to merge this without generic support for all nodes, but IMO it's better than the current default behavior.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 6c03349

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
vue-flow-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 23, 2023 5:22pm
vue-flow-typedoc	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 23, 2023 5:22pm

[vercel]

Someone is attempting to deploy a commit to a Personal Account owned by @bcakmakoglu on Vercel.

@bcakmakoglu first needs to authorize it.

[bcakmakoglu]

Hey, thanks for the PR.
As you mentioned, I'd rather have a "fix" for this that applies to all edge types instead of just smoothstep edges.
I'll give it a look though and if possible add it to one of the next minor releases :)

[atyshka]

Ok, adding regular step edges is trivial, and I could probably figure out something for bezier

[atyshka]

Ok, I just updated my PR. Bezier edges and horizontal handles now work correctly.

FYI - In my testing, edge type "simple-bezier" was rendering as regular bezier. I used vue devtools and it seems that the type passed to EdgeWrapper was false, and then EdgeWrapper selects the default edge type. You may want to look into that

[bcakmakoglu]

I might have to reject this PR, solely on the basis that all edge utils will be removed from this repo in favor of @xyflow/system (the base pkg on which React Flow is going to be built, in "beta" currently but a PR for integrating the pkg exists #1017)