@dazzadev/vue-sheet-mapper

Your users upload a spreadsheet and say which column is which.
You get the data in the shape your app expects.

Give it your field list and it handles the upload, the column preview,
the auto-matching, the validation and the output.

Live demo →  ·  Changelog

Features

• Excel & CSV — reads .xlsx, .xls and .csv, detecting the text encoding
• Auto-match — maps columns to fields by key, label or aliases, accent-insensitive
• Reactive schemas — pass a ref, computed or getter; fields may arrive from your API after the file is picked
• Two output modes — the mapped rows, or the raw file plus a mapping dictionary for server-side imports
• Bring your own validation — one hook hands you every row; zod, yup, your own function or your backend
• i18n — 5 built-in locales (en, es, fr, pt, nl) with per-key overrides
• Themeable — every visual property is a CSS custom property; icons and strings are replaceable
• Headless — useSheetMapper carries the whole flow with no markup
• TypeScript — full type declarations included

Installation

npm install @dazzadev/vue-sheet-mapper xlsx

xlsx is a peer dependency. Read Security before choosing a version — the copy published on npm is stale and carries unfixed advisories.

Quick start

<script setup lang="ts">
import { SheetMapper } from "@dazzadev/vue-sheet-mapper";
import "@dazzadev/vue-sheet-mapper/style.css";
import type { MappedResult, SchemaField } from "@dazzadev/vue-sheet-mapper";

const fields: SchemaField[] = [
  { key: "name", label: "Name", requireColumn: true },
  { key: "email", label: "Email", requireColumn: true },
];

function onMapped(results: MappedResult[]) {
  // one entry per assigned column
}
</script>

<template>
  <SheetMapper
    :fields="fields"
    @mapped="(results) => onMapped(results as MappedResult[])"
  />
</template>

Documentation

Everything else lives in the docs:

Contributing

pnpm install
pnpm dev          # the demo, with hot reload
pnpm docs:dev     # the documentation site
pnpm test         # the suite
pnpm build        # typecheck + library build

License

MIT