@cristianmpx/react-import-sheet-headless 1.0.7 → 2.0.1
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/README.md +10 -47
- package/dist/index.js +50 -67
- package/dist/index.js.map +1 -1
- package/package.json +5 -9
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @cristianmpx/react-import-sheet-headless
|
|
2
2
|
|
|
3
|
-
Headless **React** library for **importing** and validating **Excel**/CSV sheet data. No built-in table UI—you bring your own components; the library provides the logic
|
|
3
|
+
Headless **React** library for **importing** and validating **Excel**/CSV sheet data. No built-in table UI—you bring your own components; the library provides the logic and bulk validation.
|
|
4
4
|
|
|
5
5
|
[](https://www.npmjs.com/package/@cristianm/react-import-sheet-headless) [](https://opensource.org/licenses/MIT)
|
|
6
6
|
|
|
@@ -14,65 +14,28 @@ npm install @cristianmpx/react-import-sheet-headless
|
|
|
14
14
|
|
|
15
15
|
### ⚙️ Framework Setup
|
|
16
16
|
|
|
17
|
-
**Good news:** As of version
|
|
18
|
-
|
|
19
|
-
**⚠️ Important for Vite/Storybook users:** If you encounter the error `"t.load is not a function"` or `"PARSER_FAILED"`, you need to **exclude this library from Vite's dependency optimization**. Add this to your `vite.config.ts`:
|
|
20
|
-
|
|
21
|
-
```typescript
|
|
22
|
-
export default defineConfig({
|
|
23
|
-
optimizeDeps: {
|
|
24
|
-
exclude: ['@cristianmpx/react-import-sheet-headless']
|
|
25
|
-
}
|
|
26
|
-
});
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
For Storybook, add this to `.storybook/main.ts`:
|
|
30
|
-
|
|
31
|
-
```typescript
|
|
32
|
-
async viteFinal(config) {
|
|
33
|
-
return {
|
|
34
|
-
...config,
|
|
35
|
-
optimizeDeps: {
|
|
36
|
-
...config.optimizeDeps,
|
|
37
|
-
exclude: [
|
|
38
|
-
...(config.optimizeDeps?.exclude || []),
|
|
39
|
-
'@cristianmpx/react-import-sheet-headless'
|
|
40
|
-
]
|
|
41
|
-
}
|
|
42
|
-
};
|
|
43
|
-
}
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
After adding this configuration, delete the Vite cache (`rm -rf node_modules/.vite .vite`) and restart your dev server.
|
|
47
|
-
|
|
48
|
-
**For Next.js:** Use `dynamic` import with `ssr: false` to avoid server-side rendering issues:
|
|
49
|
-
|
|
50
|
-
```typescript
|
|
51
|
-
const Importer = dynamic(() => import('./Importer'), { ssr: false });
|
|
52
|
-
```
|
|
53
|
-
|
|
54
|
-
**Previous versions (1.0.4 and earlier):** If you're using an older version, you may need bundler-specific configuration. See [FRAMEWORK-SETUP.md](./FRAMEWORK-SETUP.md) for details, or upgrade to 1.0.5+ for automatic compatibility.
|
|
17
|
+
**Good news:** As of version 2.0.0, **no special configuration is required!** The library runs entirely on the main thread, so it works out-of-the-box with all bundlers (Vite, Webpack, Rollup, etc.) and frameworks (Next.js, Remix, etc.).
|
|
55
18
|
|
|
56
19
|
## Why Headless
|
|
57
20
|
|
|
58
|
-
Bring your own components; we provide the logic
|
|
21
|
+
Bring your own components; we provide the logic and bulk validation. No prebuilt `<Table />`—you own the UI and the UX.
|
|
59
22
|
|
|
60
23
|
## Pipeline
|
|
61
24
|
|
|
62
|
-
Data flows through a single pipeline
|
|
25
|
+
Data flows through a single pipeline on the main thread.
|
|
63
26
|
|
|
64
27
|
```mermaid
|
|
65
28
|
flowchart LR
|
|
66
|
-
A[Input File] --> B[Parser
|
|
29
|
+
A[Input File] --> B[Parser]
|
|
67
30
|
B --> C[Convert]
|
|
68
|
-
C --> D[Sanitizer
|
|
69
|
-
D --> E[Validator
|
|
70
|
-
E --> F[Transform
|
|
31
|
+
C --> D[Sanitizer]
|
|
32
|
+
D --> E[Validator]
|
|
33
|
+
E --> F[Transform]
|
|
71
34
|
F --> G[Sheet + Errors]
|
|
72
35
|
G -.-> H[Edit optional]
|
|
73
36
|
```
|
|
74
37
|
|
|
75
|
-
**Order:** Input File → Parser
|
|
38
|
+
**Order:** Input File → Parser → Convert → Sanitizer → Validator → Transform → Result (sheet) + Errors. Optional: cell-level edit on the result.
|
|
76
39
|
|
|
77
40
|
## Quick Start
|
|
78
41
|
|
|
@@ -155,7 +118,7 @@ function VirtualizedTable() {
|
|
|
155
118
|
|
|
156
119
|
## Error Handling
|
|
157
120
|
|
|
158
|
-
The library exposes errors through `useSheetData().errors`. Errors include both **global errors** (parser failures
|
|
121
|
+
The library exposes errors through `useSheetData().errors`. Errors include both **global errors** (parser failures) and **validation errors** (cell/row/sheet level).
|
|
159
122
|
|
|
160
123
|
```typescript
|
|
161
124
|
const { errors, sheet } = useSheetData();
|