@beisen/cropping

0.0.1 • Public • Published

rc-cropping


React Cropping Component

NPM version build status Test coverage gemnasium deps node version npm download

Feature

  • Cropping pictures in facebook mode.
  • Cropping result preview.
  • Supports exporting circle and square picture.
  • I18n.
  • [FUTURE] Rotate picture.

Screenshots

Development

npm install
npm start

Example

http://localhost:8001/examples/

online example: http://react-component.github.io/cropping/

install

rc-cropping

Usage

var Cropping = require('rc-cropping');
var React = require('react');

ReactDOM.render(<CropViewer
  getSpinContent={() => <span>loading...</span> }
  renderModal={() => <Dialog />}
  circle={true}
/>, document.getElementById('__react-content'));

API

props

name type default description
className String additional css class of root dom node
getSpinContent Function() => React.Component spin content of Cropper
renderModal Function() => React.Component Modal Render of Component, you can pass any React Component to replace it.
locale 'en-US' | 'zh-CN' i18n locale.
circle boolean false Croppe circle image or not. If true, you'll get a circle picture. Notice: transparent background *ONLY* supported in png file, croppe jpg file will get white background.

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rc-cropping is released under the MIT license.

Dependents (0)

Package Sidebar

Install

npm i @beisen/cropping

Weekly Downloads

3

Version

0.0.1

License

none

Last publish

Collaborators

  • albert-zhang
  • liugenpeng
  • beisencorp
  • lgm
  • neozw