@hawk-ui/file-upload

import FileUpload from '@hawk-ui/file-upload';

<FileUpload
  btnTitle="Browse"
  accept="images/*"
  isMultiple
  onUpload={(file) => {
    console.log('query file', file);
  }}
/>

import FileUpload from '@hawk-ui/file-upload';

<FileUpload
  btnIcon="fas fa-upload"
  onUpload={(file) => {
    console.log('query file', file);
  }}
/>

import FileUpload from '@hawk-ui/file-upload';

<FileUpload
  btnTitle="Browse"
  label="File Upload"
  description="Supported file types: (*.png, *.jpg, *.jpeg). View format instructions."
  placeholder="Please select a file to Upload"
  variant="input"
  onUpload={(file) => {
    console.log('query file', file);
  }}
/>

import FileUpload from '@hawk-ui/file-upload';

initialState = {
  fileNames: [],
};

<FileUpload
  content={(
    <>
      <div style={{ fontSize: '16px', fontWeight: '500', color: '#425a70' }}>Drag and Drop Image Here</div>
      <div style={{ fontSize: '12px', color: '#66788a', marginTop: '6px' }}>Supported file types: (*.png, *.jpg, *.jpeg). View format instructions.</div>
    </>
  )}
  title=""
  description=""
  variant="draggable"
  isLoading={false}
  onUpload={(files) => {
    console.log('query files', files);
  }}
/>