Modal should support draggable

[ykant]

Mantine is an awesome UI component library. Recently our team ready to start using Mantine to be our base components, but I found that it doesn't support draggable.
Then i try to make it work out like this

<Draggable disabled={!innerDraggable} handle=".modal-header"> <Modal.Content> <Modal.Header className={classNames({ [styles.modalHeader]: innerDraggable, 'modal-header': innerDraggable, })} > <Modal.Title>{title}</Modal.Title> {withCloseButton && <Modal.CloseButton />} </Modal.Header> <Modal.Body>{children}</Modal.Body> </Modal.Content> </Draggable>
It's great, but it's not work when I add a prop bounds="parent" to Draggable.
So I want to get help to make it better to use, any suggestion? Thanks for the suggestion.

[rtivital]

Why do you think that it is an issue with Mantine and not with react-draggable? Last time I've checked it, bounds="parent" did not work correctly in react-draggable.

[ykant]

Because the layout structure of Modal.Content

1. mantine-Modal-inner element is fixed position and full of the window
2. mantine-Modal-content element is the flex item
3. Draggable effects on the mantine-Modal-inner, so it's not work correctly
   In fact I want to Draggable dragging the mantine-Modal-content, not the mantine-Modal-inner, but Modal.Content boxes them in a components that I can't insert Draggable between them.