How to allow resizing when the mouse hovers on the bottom of the image?

Question

I am using Draft.js plugin Resizeable.

I am trying to allow resizing when the mouse hovers on the bottom (if possible, also include bottom right corner) of the image.

In the document Usage section, it says:

Hover with the mouse on the right side of the block and drag it to resize. At which edge resize is possible is configurable.

However, Configuration Parameters section is empty.

How can I use parameters in this function?

const resizeablePlugin = createResizeablePlugin();

Answer 1

Unfortunately, this configuration is not specified in the documentation. But we can research the source code and we can notice that createResizablePlugin function receives this default configuration object:

{
  horizontal: 'relative',
  vertical: false,
  resizeSteps: 1
}

So we should override vertical property this way:

const resizeablePlugin = createResizeablePlugin({
  vertical: 'absolute', // <== ! override default value
});

After that we can resize by dragging bottom edge and bottom right corner.