Skip to content

czhu12/react-importer

Repository files navigation

react-importer

TODOS

  • Notify progress & notify errors on import
  • React - we can use this in connect

NPM JavaScript Style Guide Build Status License

Demo

Contents

Why?

Every single project I've worked on needed some hacked together CSV importer. React Importer tries to fix this by implementing a modern CSV import flow for React projects!

Demo

Visit here to see what React Importer looks like in action!

Installation

npm install --save react-importer

Usage

import Importer from 'react-importer'

<Importer
  fields={[
    {
      label: "Name",
      key: "name",
      validators: [
        { validate: "required" },
      ],
      transformers: [
        { transform: "lower_case" },
      ]
    },
    {
      label: "Email", key: "email", validators: [
        { validate: "required" },
        { validate: "unique", error: "This email is not unique" },
      ]
    },
    { label: "State", key: "state" },
  ]}
  onComplete={(data) => {
    console.log(data)
  }}
/>

Documentation

(TODO)

Roadmap

  • Make readme and documentation better
  • Support existing data
  • Add support for callbacks
  • Add support for themeing
  • Animated progress bar

License

MIT © czhu12