Contents

import React, { useState } from 'react'
import {
  FileUpload,
  List,
  ListItem,
} from 'playbook-ui'

const AcceptedFilesList = ({ files }) => (
  <List>
    {files.map((file) => (
      <ListItem key={file.name}>{file.name}</ListItem>
    ))}
  </List>
)

const FileUploadDefault = (props) => {
  const [filesToUpload, setFilesToUpload] = useState([])

  const handleOnFilesAccepted = (files) => {
    setFilesToUpload([...filesToUpload, ...files])
  }

  return (
    <div>
      <AcceptedFilesList
          files={filesToUpload}
          {...props}
      />
      <FileUpload
          onFilesAccepted={handleOnFilesAccepted}
          {...props}
      />
    </div>
  )
}

export default FileUploadDefault

Version data entries

944 entries across 944 versions & 2 rubygems

Version	Path
playbook_ui_docs-13.32.0.pre.alpha.PLAY14143264	app/pb_kits/playbook/pb_file_upload/docs/_file_upload_default.jsx
playbook_ui-13.32.0.pre.alpha.PLAY14143264	app/pb_kits/playbook/pb_file_upload/docs/_file_upload_default.jsx
playbook_ui_docs-13.32.0.pre.alpha.PLAY14143260	app/pb_kits/playbook/pb_file_upload/docs/_file_upload_default.jsx
playbook_ui-13.32.0.pre.alpha.PLAY14143260	app/pb_kits/playbook/pb_file_upload/docs/_file_upload_default.jsx