syncfusion-react-image-editor

Install the @syncfusion/ej2-react-image-editor package, import the ImageEditorComponent, and render it with width and height props. Use the created event to call the open method with a URL, base64 string, or blob to load an initial image.

Call the select method with a selection type like 'custom', 'square', 'circle', or an aspect ratio such as '16:9', then call the crop method. You can pass start coordinates and dimensions to control the selection area precisely.

The editor opens PNG, JPEG, JPG, SVG, WEBP, and BMP files from local files, URLs, base64 strings, or blobs. Exporting is supported as PNG, JPEG, SVG, and WEBP via the export method with an optional quality parameter.

Yes, use drawText for text with font, size, bold, italic, and color options, and drawRectangle, drawEllipse, drawLine, drawArrow, or drawPath for shapes. Annotations can be updated, deleted, cloned, and reordered with z-order methods like bringToFront.

Use the drawRedact method with RedactType.Blur or RedactType.Pixelate, specifying position, dimensions, and intensity. Redactions can be selected, updated, listed with getRedacts, or removed with deleteRedact by their ID.

Yes, it provides undo and redo methods with a 16-step history plus keyboard shortcuts Ctrl+Z and Ctrl+Y. Localization supports over 120 locales through the locale property and L10n.load for custom translation strings, including RTL languages.