ItemResizeHandles
The Item Resize Handles component displays click handlers for a resize interactions. It stretches to the size of its parent element.
This component exports several constants, which can be used for the handles
prop:
oneDimensionalHandles
intercardinalHandles
cardinalHandles
allHandles
The handles
prop is optional and is set to intercardinalHandles
by default.
name | type | required | comment |
---|---|---|---|
height | number | yes | Height of the item, in pixels. |
onChange | (sizeDelta: Dimensions, positionDelta: Coordinates) => void | yes | |
onEnd | (sizeDelta: Dimensions, positionDelta: Coordinates) => void | yes | |
rotation | number | yes | Rotation of the item, in degrees. |
width | number | yes | Width of the item, in pixels. |
ariaLabel | string | no | |
aspectRatioBehavior | AspectRatioBehavior | no | Configuration for aspect ratio. |
className | string | no | |
draggableSides | boolean | no | Boolean flag for controlling whether orthagonal handles will include an invisible draggable border (for resizing items by their sides in addition to the handle) Default value: true |
handles | Handle[] | no | Array indicating which handles to show. |
minHeight | number | no | Minimum height allowed for user resizing. Default value: 2 |
minWidth | number | no | Minimum width allowed for user resizing. Default value: 2 |
onStart | () => void | no | |
role | AriaRole | no | |
style | CSSProperties | no |
Result
Loading...
Live Editor