Idiomatic way to delete selected nodes?

[perezd]

When working with a selected node (or multiple selected nodes with shift click), how does one address the selection to do things like delete them from the root svelvet node? I can think of a few different ways to do this, but wondering what the preferred/idiomatic approach would be. Thanks!

[perezd]

Looking through the code, I devised this solution for others who also might be wondering:

within a child component of <Svelvet> you can request the inner Graph context like so:

import { getContext } from 'svelte';
import type { Graph } from 'svelvet';
const graph = getContext<graph>('graph');

With that in hand, the graph has a groups property which is a writable store of Groups (definition here). Notice the GroupKey (definition here) can be the literal selected.

OK given that infrastructure knowledge. we can read from the store like so:

import { get } from 'svelte/store';
const nodes = get(get(graph.groups).selected.nodes);

Note that those nodes returned are yet another store see the Group type (defined here).

I use this approach to get the node IDs:

const nodeIds = Array.from(nodes).filter((node) => 'id' in node) as unknown as Node[];

Lastly, I can finally delete the nodes from the graph using graph.nodes.delete(nodeId) via the graph instance we captured at the beginning. The nodes property is a store that implements this interface. When you update the store, the UI reflects its state!

That's how it's done. Or at least, that's how I did it. If there's a better solution, I'm all ears!