Create node directly into a group

[dsbotelho]

Description

Hello

I know that, recently, a new feature was added that allows dragging a node into a group.

I have another request related with associating nodes to a group, but this time during node creation.
Imagine that I'm dragging a new node from a side-menu, and I want to drop the new node on top of an existing group, thus associating the node directly to the group during its creation.

Currently, I don't think the FCreateNodeEvent offers any possibility to do this. Is this possible ?

Let me know if you have any questions. Thanks!

Additional Context

No response

[siarheihuzarevich]

Hello, I think I can do something like this. Two weeks maybe

[dsbotelho]

Great. Thanks for your reply!

[siarheihuzarevich]

Hi!

I looked into your request and realized that what you’re trying to achieve is already possible with the current implementation. The FCreateNodeEvent provides the coordinates (rect) needed for creating a new node.

export class FCreateNodeEvent<TData = any> {
  constructor(
    public rect: IRect,
    public data: TData,
  ) {}
}

You can use the getState method on the Flow component to retrieve the current state, which includes a list of nodes and groups along with their sizes and coordinates.

export interface IFFlowState {

  position: IPoint;

  scale: number;

  nodes: IFFlowStateNode[];

  groups: IFFlowStateNode[];

  connections: IFFlowStateConnection[];
}

By comparing the new node’s coordinates with the groups’ dimensions and positions, you can determine whether to associate the new node with a group during its creation.

If you have any questions or need further clarification, feel free to ask!

Thank you!