# CSVJetty component props

> CSVJetty exports a default React component. The importer key loads saved configuration; optional props control runtime behavior and callbacks.

Canonical HTML: https://www.csvjetty.com/docs/reference/component

## Basic component

```jsx
import CSVJetty from "csvjetty";

<CSVJetty importerKey="YOUR_IMPORTER_KEY">
  Import CSV
</CSVJetty>
```

## Props

| Prop | Type | Purpose |
| --- | --- | --- |
| `importerKey` | string | Required public importer key. |
| `columns` | array | Optional column definitions that replace dashboard columns for this import session. |
| `onData` | function | Receives import batches in callback delivery mode. |
| `onComplete` | function | Receives `{ importId, accepted, rejected }` when the import completes. |
| `onClose` | function | Runs when the importer closes. |
| `baseUrl` | string | CSVJetty origin. Defaults to `https://www.csvjetty.com`. |
| `accentColor` | string | Launch-button accent color. |
| `children` | React node | Launch-button content. Defaults to `Import CSV`. |

Callback delivery requires `onData`. Webhook delivery does not because CSVJetty sends records to the endpoint configured on the importer.

## Column overrides

```jsx
<CSVJetty
  importerKey="YOUR_IMPORTER_KEY"
  columns={[
    {
      name: "email",
      label: "Email address",
      type: "email",
      required: true,
      aliases: ["customer_email"],
    },
  ]}
  onData={async ({ rows }) => {
    console.log(rows);
  }}
>
  Import contacts
</CSVJetty>
```

Passing `columns` uses those field definitions for the current import session instead of saved dashboard columns.

## Lifecycle callbacks

- `onData` receives import batches and may return row-level errors.
- `onComplete` runs after import completion with accepted and rejected counts.
- `onClose` runs when the importer closes.

## baseUrl

CSVJetty uses `https://www.csvjetty.com` by default. Set `baseUrl` only when intentionally connecting to another CSVJetty origin, such as local development.

```jsx
<CSVJetty
  importerKey="YOUR_IMPORTER_KEY"
  baseUrl="http://localhost:3001"
/>
```
