Why Does Node Editing Create an Extra Node Instead of Updating the Existing One?

I notice you're asking about node editing in Three.js, but the specific node editing system you're using isn't clearly identified in the provided context. The screenshots show what appears to be a node-based editor interface, but this isn't part of the core Three.js documentation covered in my training data.

Based on the limited context available, I can offer some general guidance:

1. When working with node-based systems, the behavior you're describing (creating a new node instead of modifying an existing one) is often related to how the editor handles references and modifications.

2. You might want to check if there's a specific "edit mode" or "modify mode" that needs to be activated before making changes to an existing node.

3. Some node systems have different behaviors for cloning vs. editing - make sure you're using the appropriate action for your needs.

4. If you're using a specific Three.js extension or plugin for node editing, you might need to consult its specific documentation, as the behavior might be particular to that tool.

For more specific guidance, you would need to provide information about which node editing system you're using with Three.js (such as a specific library name or if this is part of a particular Three.js extension).

If you're working with controls like DragControls, the documentation shows methods like connect(), disconnect(), dispose(), and update(), but these are for managing the controls themselves rather than node editing specifically.