Skip to content

Conversation

RoccoC
Copy link
Contributor

@RoccoC RoccoC commented May 7, 2019

This PR addresses issue #75 and supersedes #76. It adds support for resize handles in each corner, each side, or any combination thereof. Summary of the changes:

  • New property, resizeHandles, which accepts an array of ResizeHandles. Each value corresponds to a resize handle location, e.g. se (Southeast) corresponds to the bottom-right corner (default).
  • Updated the existing handle prop to accept a render function.
  • Added handle to ResizeCallbackData type.
  • Added a couple of examples to TestLayout.

resize-handles

@ceejayvarias
Copy link

+1

@STRML
Copy link
Collaborator

STRML commented May 13, 2019

This looks real clean. Thanks for the contribution.

@STRML STRML merged commit a18a8c6 into react-grid-layout:master May 13, 2019
@t0ngliu
Copy link

t0ngliu commented May 15, 2019

@RoccoC Question regarding your change. If I have a handle on the left ('w') and drag towards the left, the container expands the opposite direction towards the right. This also occurs with southwest and northwest handles. Was this effect intended? To me I would expect the container to expand in the same direction I drag.

Thanks for putting this change in!

@RoccoC
Copy link
Contributor Author

RoccoC commented May 29, 2019

@t0ngliu -- react-resizable only affects the dimensions (height/width) of the element, and not its position. Therefore dragging using a top or left handle will increase the size, but depending upon the layout of the element, this will result in the behavior you described.

In other words, it's expected behavior and would need to be managed by the parent layout itself (e.g. by leveraging the onResize prop to update the element's position in accordance with the size change).

@eheu
Copy link

eheu commented Sep 25, 2019

@STRML Can the NPM package and readme be updated with this feature?

@RoccoC
Copy link
Contributor Author

RoccoC commented Sep 25, 2019

@STRML Can the NPM package and readme be updated with this feature?

Both were updated as part of this PR.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants