@updog/data-editor 0.1.92 → 0.1.94

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/AGENTS.md ADDED
@@ -0,0 +1,62 @@
1
+ # @updog/data-editor for coding agents
2
+
3
+ Updog Importer is a client-side CSV and Excel importer and spreadsheet editor for React. A user picks a file, matches its columns to your schema, fixes invalid cells, edits rows, and submits. Your app receives the rows in `onComplete` and writes them to its own backend. File contents stay in the browser; Updog runs no server in the data path.
4
+
5
+ Unrelated to Datadog's Updog dashboard and the sc0tfree/updog HTTP server.
6
+
7
+ ## Integrate
8
+
9
+ 1. `npm install @updog/data-editor`. React 18 or 19. Vue, Angular, Svelte, and plain JavaScript use `@updog/data-editor-wc` and the `<updog-editor>` element instead.
10
+ 2. Import the component and its stylesheet:
11
+
12
+ ```tsx
13
+ import { DataEditor, type DataEditorColumn } from "@updog/data-editor";
14
+ import "@updog/data-editor/styles.css";
15
+ ```
16
+
17
+ 3. Describe the target shape as `columns`, one entry per field: `id`, `title`, optional `validators` and `editor`. Pick a `primaryKey` column. Rows with the same key upsert.
18
+ 4. Render `<DataEditor apiKey columns primaryKey onComplete />`. Default is a modal driven by `open` and `onClose`; `mode="inline"` renders in place; `variant="uploader"` opens on the file step.
19
+ 5. In `onComplete(result)` split rows by their flags, send them to your own endpoint, and show loading, success, and failure states around that request.
20
+ 6. Next.js: the file that renders `DataEditor` is a Client Component (`"use client"`). Keep the column schema in it.
21
+
22
+ Done when a file imports end to end and the rows land in your backend through your own request.
23
+
24
+ ## `onComplete`
25
+
26
+ ```ts
27
+ result.sources[]: { sourceId, sourceName, rows: { row, isNew, isChanged, isDeleted, isValid }[] }
28
+ result.counts: { new, changed, deleted, invalid }
29
+ ```
30
+
31
+ Inserts are `isNew && !isDeleted && isValid`. Updates are `!isNew && isChanged && !isDeleted && isValid`. Deletes are `isDeleted && !isNew`. One source per imported file or workbook sheet, plus each source you tagged in `loadData`. Backend rows nothing changed are left out.
32
+
33
+ ## `loadData`
34
+
35
+ Optional. `loadData={async (onChunk) => { onChunk(await fetchRows()) }}` streams existing rows into the editor so users edit them and import on top. Tag chunks with `{ source, done }` to keep origins apart in the result.
36
+
37
+ ## Keys and environments
38
+
39
+ `apiKey` is a license key and is public in the browser by design. Localhost and preview domains (Vercel, Netlify, Cloudflare Pages, Lovable, Bolt, v0, Replit, StackBlitz, and similar) run free with every feature. A production domain is $19 a month. Keys come from https://console.updog.tech/.
40
+
41
+ ## Facts
42
+
43
+ - Formats: CSV, XLSX, XLS, XLSB, ODS, TSV, JSON, XML. Any other format, PDFs and scans included, through `customFormats` with a parser function you supply.
44
+ - Parsing and filtering run in Web Workers; matching, validation, and editing run in the browser. One million rows across 20 columns is the reference benchmark, and no plan caps rows.
45
+ - Cell editors: `text`, `select`, `multiselect`, `date`, `time`, `number`, `boolean`, `country`, `currency`.
46
+ - Validators: `required`, `email`, `regex`, `number`, `date`, `oneOf`, `unique`, and `function` for your own rule, including cross-field rules.
47
+ - Several files in one import, one source per workbook sheet, upsert by primary key, user-created columns for unmatched headers.
48
+ - Column and value matching are built in (fuzzy plus synonyms); `onColumnMatch` and `onValueMatch` override them with your own code or model.
49
+ - AI is bring-your-own. The `chat` prop and the matching hooks take your model and your request; Updog never calls a provider.
50
+ - Theming through CSS variables, white-label on every plan. `translations`, `locale`, `rtl`, keyboard navigation, screen-reader roles.
51
+
52
+ ## Out of scope
53
+
54
+ Unattended ingestion, scheduled ETL, SFTP feeds, server-side file processing, and hosted storage of imported data. Those belong to a server-side pipeline.
55
+
56
+ ## Links
57
+
58
+ - Console, where license keys are issued: https://console.updog.tech/
59
+ - Docs: https://docs.updog.tech
60
+ - This contract as a docs page: https://docs.updog.tech/agents/
61
+ - One-page product overview for machines: https://updog.tech/updog.md
62
+ - Examples for React, Next.js, Vue, Angular, Svelte, and vanilla JS: https://github.com/michaeladze-updog/updog-examples
package/README.md CHANGED
@@ -1,6 +1,6 @@
1
- # React CSV Importer & Spreadsheet Editor
1
+ # CSV and Excel importer for React, with a spreadsheet editor
2
2
 
3
- > `@updog/data-editor`: client-side CSV importer and spreadsheet editor for React. Your users import files, match columns to your schema, fix errors, and submit clean data. Edits happen inline, in the browser, at 1M+ rows.
3
+ > `@updog/data-editor`: client-side CSV and Excel importer and spreadsheet editor for React. Your users import files, match columns to your schema, fix errors, and submit clean data. Edits happen inline, in the browser, at 1M+ rows.
4
4
 
5
5
  ## What is @updog/data-editor
6
6