@payfit/unity-components 2.46.12 → 2.46.14
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/package.json +12 -7
- package/skills/unity-data-table/SKILL.md +0 -19
package/package.json
CHANGED
|
@@ -1,12 +1,17 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@payfit/unity-components",
|
|
3
|
-
"version": "2.46.
|
|
3
|
+
"version": "2.46.14",
|
|
4
4
|
"module": "./dist/esm/index.js",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": false,
|
|
7
7
|
"storybook": {
|
|
8
8
|
"url": "https://unity-components.payfit.io/"
|
|
9
9
|
},
|
|
10
|
+
"intent": {
|
|
11
|
+
"version": 1,
|
|
12
|
+
"repo": "PayFit/hr-apps",
|
|
13
|
+
"docs": "../../../../apps/shared/docsite/src/content/docs"
|
|
14
|
+
},
|
|
10
15
|
"exports": {
|
|
11
16
|
".": {
|
|
12
17
|
"import": {
|
|
@@ -87,7 +92,7 @@
|
|
|
87
92
|
"tailwind-variants": "3.2.2",
|
|
88
93
|
"usehooks-ts": "3.1.1",
|
|
89
94
|
"zod": "4.4.3",
|
|
90
|
-
"@payfit/unity-illustrations": "2.46.
|
|
95
|
+
"@payfit/unity-illustrations": "2.46.14"
|
|
91
96
|
},
|
|
92
97
|
"peerDependencies": {
|
|
93
98
|
"@hookform/devtools": "^4",
|
|
@@ -99,8 +104,8 @@
|
|
|
99
104
|
"react-hook-form": "^7",
|
|
100
105
|
"react-router-dom": "^5",
|
|
101
106
|
"zod": "^3 || ^4",
|
|
102
|
-
"@payfit/unity-icons": "2.46.
|
|
103
|
-
"@payfit/unity-themes": "2.46.
|
|
107
|
+
"@payfit/unity-icons": "2.46.14",
|
|
108
|
+
"@payfit/unity-themes": "2.46.14"
|
|
104
109
|
},
|
|
105
110
|
"devDependencies": {
|
|
106
111
|
"@figma/code-connect": "1.4.3",
|
|
@@ -149,9 +154,9 @@
|
|
|
149
154
|
"@payfit/hr-apps-tsconfigs": "0.0.0-use.local",
|
|
150
155
|
"@payfit/storybook-addon-console-errors": "0.0.0-use.local",
|
|
151
156
|
"@payfit/storybook-config": "0.0.0-use.local",
|
|
152
|
-
"@payfit/unity-icons": "2.46.
|
|
153
|
-
"@payfit/unity-illustrations": "2.46.
|
|
154
|
-
"@payfit/unity-themes": "2.46.
|
|
157
|
+
"@payfit/unity-icons": "2.46.14",
|
|
158
|
+
"@payfit/unity-illustrations": "2.46.14",
|
|
159
|
+
"@payfit/unity-themes": "2.46.14",
|
|
155
160
|
"@payfit/vite-configs": "0.0.0-use.local"
|
|
156
161
|
},
|
|
157
162
|
"peerDependenciesMeta": {
|
|
@@ -370,8 +370,6 @@ function MyTable() {
|
|
|
370
370
|
|
|
371
371
|
A new columns array each render makes Tanstack Table re-run the whole pipeline; rows re-render even when data is unchanged.
|
|
372
372
|
|
|
373
|
-
Source: DataTable.stories.tsx:656-657; mocks/employee-columns.tsx:14-61
|
|
374
|
-
|
|
375
373
|
### HIGH Return string from cell function instead of JSX
|
|
376
374
|
|
|
377
375
|
Wrong:
|
|
@@ -391,8 +389,6 @@ Correct:
|
|
|
391
389
|
|
|
392
390
|
flexRender expects ReactNode. A raw string renders unstyled and may overflow. Cell layout is the maintainer-flagged hotspot for table questions.
|
|
393
391
|
|
|
394
|
-
Source: DataTable.stories.tsx:123-159 (cell function patterns); maintainer interview
|
|
395
|
-
|
|
396
392
|
### HIGH Use the primitive Table when DataTable + Tanstack would do
|
|
397
393
|
|
|
398
394
|
Wrong:
|
|
@@ -420,8 +416,6 @@ const table = useReactTable({ data, columns, getCoreRowModel(),
|
|
|
420
416
|
|
|
421
417
|
Primitive Table has no state; agent hand-rolls pagination/sorting/selection that DataTable provides out of the box.
|
|
422
418
|
|
|
423
|
-
Source: DataTable.tsx (composite) vs Table.tsx (primitives)
|
|
424
|
-
|
|
425
419
|
### HIGH Manage filter state separately from FilterToolbar
|
|
426
420
|
|
|
427
421
|
Wrong:
|
|
@@ -445,8 +439,6 @@ const table = useReactTable({ /* … */ state: { columnFilters, globalFilter },
|
|
|
445
439
|
|
|
446
440
|
FilterToolbar.onChange emits AppliedFilter[]. Agent stores them locally without mapping to table.setGlobalFilter / setColumnFilters, so rows do not actually filter.
|
|
447
441
|
|
|
448
|
-
Source: FilterToolbar.tsx; DataTable.stories.tsx:1141-1209
|
|
449
|
-
|
|
450
442
|
### CRITICAL Server-side pagination without slicing data
|
|
451
443
|
|
|
452
444
|
Wrong:
|
|
@@ -477,8 +469,6 @@ useReactTable({
|
|
|
477
469
|
|
|
478
470
|
manualPagination: true tells Tanstack not to slice. Agents pass the full dataset and expect TanStack to paginate anyway.
|
|
479
471
|
|
|
480
|
-
Source: DataTable.stories.tsx:146-178 (manual pagination)
|
|
481
|
-
|
|
482
472
|
### MEDIUM Render large datasets without enableVirtualization
|
|
483
473
|
|
|
484
474
|
Wrong:
|
|
@@ -501,12 +491,3 @@ Correct:
|
|
|
501
491
|
```
|
|
502
492
|
|
|
503
493
|
Without virtualization, 500+ rows mount in the DOM. Keyboard nav context clones cells; reconciliation is O(n) per render.
|
|
504
|
-
|
|
505
|
-
Source: DataTable.tsx:278-280; Table.tsx import of @tanstack/react-virtual
|
|
506
|
-
|
|
507
|
-
## See also
|
|
508
|
-
|
|
509
|
-
- `unity-layout-and-styling` — `uy:` cell content classes, `headerClassName`
|
|
510
|
-
width helpers, `layout="fixed"` rules.
|
|
511
|
-
- `unity-find-component` — picking between primitive Table and composite
|
|
512
|
-
DataTable when you are not sure which fits.
|