opinion
ImageCropper
Drag the frame to move it, drag a corner to resize, then press Crop.
Crop a van photoSquare crop
In context
Project coverCrop the cover before saving it
Harbour rebrand coverWide crop for the project card
Crop to preview the new cover.
Props
| Prop | Type | Required | Default |
|---|---|---|---|
src | string | Yes | — |
alt | string | undefined | No | |
width | number | undefined | No | 320 |
height | number | undefined | No | 320 |
aspectRatio | number | undefined | No | — |
onCrop | ((dataUrl: string) => void) | undefined | No | — |
cropLabel | string | undefined | No | Crop |
disabled | boolean | undefined | No | — |
className | string | undefined | No | — |
data-rebar-* attributes
data-rebar-component="image-cropper" on the root; parts: stage, rect, handle (each carrying data-rebar-corner).
Migrating to Ant Design
Not codemod-covered — AntD ships no dedicated image cropper; a migration typically keeps this exact drag/resize approach and re-skins the Crop button.