Add `Transforms.moveChildren` method

Problem There are use cases where we want to move the children from one node to another node. It should also safely take the cursor with it.

The problem with using Transforms.moveNodes is that there is no easy way to move a specific set of children nodes to another parent. When we use the range to select at the edges of the sibling nodes, it takes the parent with it too. This is unpredictable and often not what we want.

I’ve on more than one occasion went looking for this method and feeling like it exists but never finding it.

Solution Have an explicit method named Transforms.moveChildren.

It’s really short and looks like this.

function moveChildren(editor: Editor, { from, to }: { from: Path; to: Path }) {
  const reverseChildEntries = Node.children(editor, from, { reverse: true })
  for (const [child, childPath] of reverseChildEntries) {
    Transforms.moveNodes(editor, { at: childPath, to })
  }
}

Before adding it, I want to get an okay from @ianstormtaylor since it affects the API.

Alternatives I ended up having to do a number of tests with Transforms.moveNodes until I found out that it doesn’t work. The option is everybody writes their own version of this method but it feels like it’s useful enough and yet small enough to include in core.

Context I am using this myself now but feels like it should be in core.

[thesunny]

OMG! This is so awesome! I like how you described from a technical perspective what was happening. I didn’t know until right now how it worked.

[ianstormtaylor]

@thesunny glad to hear it 😄 I should have added it a long time ago then!