{"repo":"dominictobias/react-image-crop","free":true,"listed":false,"github":"https://github.com/dominictobias/react-image-crop","clone":"git clone https://github.com/dominictobias/react-image-crop.git","description":"A responsive image cropping tool for React","language":"TypeScript","stars":4104,"topics":["react","crop-image","responsive","javascript"],"license":"ISC","category":"media-processing","readme_excerpt":"React Image Crop An image cropping tool for React with no dependencies. CodeSandbox Demo Table of Contents 1. Features 2. Installation 3. Usage 4. Example 5. CDN 6. Props 7. FAQ 1. How can I generate a crop preview in the browser? 2. How to correct image EXIF orientation/rotation? 3. How to filter, rotate and annotate? 4. How can I center the crop? 8. Contributing / Developing Features - Responsive (you can use pixels or percentages). - Touch enabled. - Free-form or fixed aspect crops. - Fully keyboard accessible (a11y). - No dependencies/small footprint ( tag access the component with ReactCrop.Component . Props onChange: (crop: PixelCrop, percentCrop: PercentCrop) = void A callback which happens for every change of the crop (i.e. many times as you are dragging/resizing). Passes the current crop state object. Note you must implement this callback and update your crop state, otherwise nothing will change! crop and percentCrop are interchangeable. crop uses pixels and percentCrop uses percentages to position and size itself. Percent crops are resistant to image/media resizing. crop?: Crop Starting with no crop: Starting with a preselected crop: ⚠️ You must ensure the crop is in bounds and correct to the aspect ratio if manually setting. Aspect ratios can be tricky when using %. You can make use of centerCrop and makeAspectCrop helpers. See How can I center the crop? or the CodeSanbox Demo for examples. aspect?: number The aspect ratio of the crop, e.g. 1 for a square or 16 / 9","default_branch":null,"files":null,"tree":[],"storefront":"/r/dominictobias","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/dominictobias/react-image-crop/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}