Customize Cursor when Dragging

[weston-sankey-mark43]

trafficstars

When dragging a tree node, the cursor is set to the copy value, which doesn't accurately represent the action I'm performing when moving a node from one section to another. I'd like to customize this value and set it to grabbing, but can't find anywhere in the source code where the value is being set to copy.

Overriding the renderDraggingItem prop on ControlledTreeEnvironment seemed to have no effect.

[lukasbach]

The icon is not explicitly defined by RTC, instead, the dataTransfer.dropEffect attribute is set when the user starts dragging, and is set to "move": https://github.com/lukasbach/react-complex-tree/blob/main/packages/core/src/interactionMode/ClickItemToExpandInteractionManager.ts#L56

The cursor that is shown in this case depends on the browser I guess, the docs for the property are here: https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/dropEffect

You can probably overwrite this cursor yourself with CSS, or expand the interaction manager you are using (probably ClickToExpandInteractionManager) with a new default drop effect, see https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/dropEffect on that. There, you can overwrite the "onDragStart" method with something like

onDragStart: e => {
        e.dataTransfer.dropEffect = 'other-dropeffect';
        actions.startDragging();
},