@rizkisunaryo/react-image-select-resize v1.0.3

This is a library to select and resize image.

Example

import React, { useState } from 'react'
import ImageSelectResize from 'react-image-select-resize'

const Example = () => {
  const [originalImageUrl, setOriginalImageUrl] = useState(null)
  const [resizedImageUrl, setResizedImageUrl] = useState(null)
  return (
    <div style={{padding: 10}}>
      <ImageSelectResize
        maxWidth={200}
        onImageSelectedUrl={setOriginalImageUrl}
        onImageResizedUrl={setResizedImageUrl}
      >
        <div
          style={{
            border: 'black 1px solid',
            borderRadius: 5,
            padding: 5,
            display: 'table',
            cursor: 'pointer'
          }}
        >
          Select image
        </div>
      </ImageSelectResize>
      <div style={{marginTop: 10}}>Original image:</div>
      {originalImageUrl && <img src={originalImageUrl} style={{maxWidth: '100%'}} />}
      <div style={{marginTop: 10}}>Resized image:</div>
      {resizedImageUrl && <img src={resizedImageUrl} />}
    </div>
  )
}

export default Example

Props