vue-flow icon indicating copy to clipboard operation
vue-flow copied to clipboard

feat: add support for nesting vue flows

Open simonmysun opened this issue 5 months ago • 3 comments

🚀 What's changed?

This draft pull request introduces support for nesting vue-flow components. Different from what's demonstrated in the nesting nodes example, this allows vue-flow instances to be nested.

  • Added new routes /nesting-flows and /recursive-nesting-flows in examples/vite/router.ts to demonstrate nested flow components.
  • Introduced a new ancestorZoom property in FlowProps to track and manage zoom levels inherited from ancester vue-flow instances.
  • Corrected coordinates calculations with ancestorZoom

图片 图片

🐛 Fixes

Bug fixed $\leqq$ 0

🪴 To-Dos

  • [ ] find a workaround for nopan class
    • Currently I removed the nopan class from nodes. This should be avoided otherwise it is a breaking change.
  • [ ] fix panBy and autopan functionalities
    • Be careful when enabling autopan, it may stuck the browser.
  • [x] fix wheel zoom functionality
  • [x] add example of recursive nesting flows
  • [ ] add tests
  • [ ] investigate possible vite routing issues with nested flows
    • recursive-nesting-flows example does not load when switching routes, it only works when reloading the page.
    • nesting-flows example cannot update automatically when file changes.
  • [ ] fix fitView functionality
    • Some vue issue or browser issue might be related because I have observed different behaviors in different browsers.
  • [ ] performance issues
  • [ ] connection offset when starting a connection
  • [ ] zoom behavior when max / min zoom reached
  • [ ] panning and zooming on minmap
  • [ ] possiblely add changeset

simonmysun avatar Jul 05 '25 01:07 simonmysun

Review or Edit in CodeSandbox

Open the branch in Web EditorVS CodeInsiders
Open Preview

codesandbox[bot] avatar Jul 05 '25 01:07 codesandbox[bot]

⚠️ No Changeset found

Latest commit: 594617b1763d58dfe78ee1a19529f5e250d11878

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

changeset-bot[bot] avatar Jul 05 '25 01:07 changeset-bot[bot]

@simonmysun is attempting to deploy a commit to the Burak Cakmakoglu's projects Team on Vercel.

A member of the Team first needs to authorize it.

vercel[bot] avatar Jul 05 '25 01:07 vercel[bot]