Profile photo uploader with a circular crop mask. Users drag to reposition, zoom in and out, then apply a circular crop before upload.
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | — | Cropped preview URL after apply. |
onChange | (previewUrl) => void | — | Called with the cropped preview URL. |
onCrop | ({ file, previewUrl }) => void | — | Called with the cropped File and preview URL. |
viewportSize | number | 240 | Circular editor diameter in pixels. |
outputSize | number | 256 | Exported crop size in pixels. |
minZoom / maxZoom | number | 1 / 3 | Zoom range. |
uploadLabel | string | "Browse image" | Browse action label. |
cropButtonLabel | string | "Apply crop" | Confirm crop label. |
changeButtonLabel | string | "Change photo" | Replace photo label. |
FieldShell.