Unable to use DragHandleMenu children prop

[fscs64]

Describe the bug
I want to use the DragHandleMenu component with my own custom subcomponents. It seems that can be done using specific children (

BlockNote/packages/react/src/components/SideMenu/DragHandleMenu/DragHandleMenu.tsx

Line 42 in 8bb9bc6

{props.children || (

), but when you check the parent component

BlockNote/packages/react/src/components/SideMenu/DefaultButtons/DragHandleButton.tsx

Line 48 in 8bb9bc6

<Component block={props.block} />

It seems that no children are given to the component, so I am not able to customize the component.

I tried also to provide my own custom component using the 'dragHandleMenu' prop

BlockNote/packages/react/src/components/SideMenu/DefaultButtons/DragHandleButton.tsx

Line 26 in 8bb9bc6

const Component = props.dragHandleMenu || DragHandleMenu;

but you have to provide a component class not an instance with my custom component

To Reproduce
Try to configure a custom SideMenu, and provide custom components to be used on
https://github.com/TypeCellOS/BlockNote/blob/main/packages/react/src/components/SideMenu/DragHandleMenu/DragHandleMenu.tsx#L42
You are not going to able to use you custom components unless you create own custom components

[nperez0111]

I don't understand what the problem is here:

but you have to provide a component class not an instance with my custom component

shouldn't it be something like this:

const MyDragHandleMenu = () => {
  return (<DragHandleMenu><button>my button</buton></DragHandleMenu>)
}

<DragHandleButton dragHandleMenu={MyDragHandleMenu} /*other props*/></DragHandleButton>

Maybe you want it to be more like this?

<DragHandleButton dragHandleMenu={MyDragHandleMenu}><button>my button</button></DragHandleButton>

[nperez0111]

Opened a PR for the latter option as that sort of makes more sense to me to expose easier.

[fscs64]

I guess that it's more clear with this new option. Thanks for the support.