Uploader3

Uploader3 is a React-based Web3 image upload component that supports multiple image uploads, image cropping, and uploading images to Web3 Storage providers (like IPFS). There are two ways for uploading, by using a backend API or the Uploader3 Connector.

Features

• Supports cropping
• Supports uploading to web3 service providers, such as NFT.storage

Usage

import { Uploader3 } from '@lxdao/uploader3';

Props

| Prop | Type | Description | Default | | ------------ | --------------------------- | -------------------------------------- | ---------------------------------------- | | accept | string | image accept file type | ['.png','.jpeg','.jpg','.gif', '.svg'] | | multiple | boolean | multiple image upload | false | | api | string | endpoint upload api url, post method | '' | | headers | object | http headers to post api | | | connector | object | create by uploader3-connector | | | crop | Crop / boolean | crop config, set false disabled crop | true | | onChange | function | callback when files selected | | | onUpload | function | callback when file uploading | | | onComplete | function | callback when file uploaded | | | onCropEnd | function | callback when crop end | | | onCropCancel | function | callback when crop cancel | |

api and connector are mutually exclusive, if both are provided, api will be used. must be provided one of them.

Types reference

Crop

type Crop = {
  size: { width: number; height: number };
  aspectRatio: number;
};