Disable selection deleting

[brandonreid]

Hello,

Is there an option to disable deleting of selected nodes?

While digging through the docs and playing around, I see that I could create a read-only flow by disabling some functionality (drag and drop, etc). I hoped to still allow selection for highlighting certain portions and where the edges run, but selections are deletable. The only related option I see is for setting the delete-key-code.

Thanks!

[bcakmakoglu]

There's a couple of ways to prevent elements being deleted.
Here are two simple ways of going about it.

• Set deleteKeyCode to false
  • You can toggle it if you need to, just set it back to Backspace or whatever key you'd like - a cb function is also allowed.
• Set applyDefault to false
  • By setting applyDefault to false you disable the default change handlers, i.e. no more changes are processed
  • Now you can hook yourself into those changes are have control over what changes are valid and which aren't, changes are still emitted to you, just not handled anymore
  • After you're doing validating the changes, i.e. you filter your changes into a new array, you can use applyNodeChanges or applyEdgeChanges to finally apply the changes to your actual elements

Here's a sandbox with these options enabled: https://codesandbox.io/s/keen-hypatia-su4voj?file=/src/App.vue:926-950

[erdesigns-eu]

Is there any way to do this with the options api?

[bcakmakoglu]

There's a basic options API example in the repo right here.

You can use the same state instance returned by @pane-ready to do the same thing you would do with useVueFlow since it's the same thing.

[erdesigns-eu]

Oh thank you!