Installation

Get Spreadsheet Validator set up in your project in minutes.

Prerequisites

  • React 18 or later
  • Node.js 18 or later

Install

npm install spreadsheet-validator zod xlsx

Or with your preferred package manager:

pnpm add spreadsheet-validator zod xlsx
yarn add spreadsheet-validator zod xlsx

Import the Styles

The component ships with its own CSS. Import it in your app entry or layout:

import "spreadsheet-validator/dist/style.css"

Basic Usage

import TableReader from "spreadsheet-validator"
import { z } from "zod"

const schema = z.object({
  name: z.string(),
  email: z.string().email(),
})

function App() {
  const [file, setFile] = useState<File | null>(null)

  return (
    <>
      <input
        type="file"
        accept=".xlsx,.csv"
        onChange={(e) => setFile(e.target.files?.[0] ?? null)}
      />
      {file && <TableReader file={file} schema={schema} />}
    </>
  )
}

TypeScript

Spreadsheet Validator is written in TypeScript and ships with full type definitions. No additional @types packages are needed.

Next Steps

Learn how to define Schema Validation rules for your spreadsheet columns.

PreviousIntroductionNextSchema Validation