Antd-img-crop-royaltymine NPM

antd-img-crop

An custom royaltymine image cropper for Ant Design Upload.

Demo

Install

yarn add antd-img-crop

Usage

import ImgCrop from 'antd-img-crop';
import { Upload } from 'antd';

const Demo = () => (
  <ImgCrop>
    <Upload>+ Add image</Upload>
  </ImgCrop>
);

Props

Name	Type	Default	Description
width	`number`	`100`	Width of cropped image in `px`.
height	`number`	`100`	Height of cropped image in `px`.
contain	`boolean`	`false`	Consistent with `background-size: contain`, crop area will fill the width or height.
~~useRatio~~	-	-	Deprecated, please use `contain`.
resize	`boolean`	`true`	If crop area can resize.
resizeAndDrag	`boolean`	`true`	If crop area can resize and drag.
modalTitle	`string`	`"Edit image"`	Title of modal.
modalWidth	`number`	`520`	Width of modal in `px`.
beforeCrop	`function`	-	Execute before crop, modal will not open if return `false` (Not support `Promise`). `beforeUpload` prop of Upload will execute after crop, before upload.