Skip to main content

File Upload Input

Installation​

$ yarn add @rexlabs/file-upload-input

Usage​

import {
  FileUploadInput,
  SimpleFileUploadInput,
  PreviewFileUploadInput,
  DropContainer,
  useDropzone,
  FileUploadContext,

  // types
  FileUploadInputProps,
  SimpleFileUploadInputProps,
  PreviewFileUploadInputProps,
} from '@rexlabs/file-upload-input';

Irregularities​

  • we're providing the core data flow and functionality through src/core.js
  • this does not handle any rendering, it just deals with the logic part
  • we can then use it to build common variants of the file upload (e.g. src/simple/index.js and src/preview/index.js)
  • it also allows products to easily build their own visuals without having to re-invent the internal logic of the component, very similar to how forms and select work already 🎉

Data format​

  • right now the input expects a very specific value format
  • we will need to see when using it in real apps if we need to provide more utils to make mapping API responses to this shape easier/more intuitive, we might even need/want to adjust the shape itself still, so treat it as experimental for the time being
const value = {
  file: File // JS file object
  data: { // Object for optional meta information
    name?: String
    [any]?: any
  }
}

Copyright © 2019 Rex Software All Rights Reserved.