Sha256: b73841258c368b09dabe396b3b78019f665bb1e3335514c63d4e66c6cbfa2e32
Contents?: true
Size: 1.27 KB
Versions: 7
Compression:
Stored size: 1.27 KB
Contents
/* @flow */ import React, { useCallback } from 'react' import { useDropzone } from 'react-dropzone' import { buildCss, noop } from '../utilities/props' import classnames from 'classnames' import { globalProps } from '../utilities/globalProps.js' import type { Callback } from '../types.js' import { Body, Card } from '..' type FileUploadProps = { accept?: Array<String>, className?: String, onFilesAccepted: Callback, } const FileUpload = (props: FileUploadProps) => { const { accept = ['image/png', 'image/jpg', 'image/jpeg', 'image/svg+xml'], className, onFilesAccepted = noop, } = props const onDrop = useCallback((files) => { onFilesAccepted(files) }) const { getRootProps, getInputProps, isDragActive } = useDropzone({ accept, onDrop, }) return ( <div className={classnames(buildCss('pb_file_upload_kit', className), globalProps(props))} {...getRootProps()} > <Card> <input {...getInputProps()} /> <Body color="light"> <If condition={isDragActive}> <p>{'Drop the files here ...'}</p> <Else /> <p>{'Drag & drop some files here, or click to select files'}</p> </If> </Body> </Card> </div> ) } export default FileUpload
Version data entries
7 entries across 7 versions & 1 rubygems