Allow an option to resize a modal

• I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

Allow the user to resize his modal can help having the perfect size the user wants. If you have a complex modal, having a certain calculated width and height helps, but in some case, the user doesn’t have a good UX because the height or width can be too big (creating scrollbars) or too small, making the modal unusable.

What does the proposed API look like?

I know that the modalRender option where you can customize the render method. Inside you can put a Draggable element to make the modal draggable. I don’t know if it could make sense to create a Resizable element to allow the user to resize as well. Same concept as the Draggable. But combining both Draggable and Resizable could be a bad design. It could be an option in the modal: resize and the values could be horizontal, vertical and both.

Example from Boostrap

API

var $modal = $('#myModal');
$modal.find('.modal-content')
  .css({
    width: 625,
    height: 175,
  })
  .resizable({
    minWidth: 625,
    minHeight: 175,
    handles: 'n, e, s, w, ne, sw, se, nw',
  })
  .draggable({
    handle: '.modal-header'
  });

[chkaos]

See smple demo https://codesandbox.io/s/antd-dragable-resizeable-modal-demo-sz2pu3?file=/ResizeableDialog.tsx Using react-resizable and react-draggable

[abenhamdine]

see also https://github.com/DylanVann/ant-design-draggable-modal
it implements resizability