@lminii/material-react-table 4.0.0 → 4.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 +234 -234
- package/locales/ja/index.d.mts +0 -3
- package/locales/ja/index.d.ts +0 -3
- package/locales/ja/package.json +0 -6
- package/package.json +147 -147
- package/skills/README.md +81 -81
- package/skills/composable-components/SKILL.md +189 -189
- package/skills/customization/SKILL.md +190 -190
- package/skills/drag-and-drop-ordering/SKILL.md +227 -227
- package/skills/editing/SKILL.md +243 -243
- package/skills/filtering/SKILL.md +213 -213
- package/skills/getting-started/SKILL.md +213 -213
- package/skills/localization/SKILL.md +182 -182
- package/skills/migrate-v3-to-v4/SKILL.md +161 -161
- package/skills/state-and-server-data/SKILL.md +200 -200
- package/skills/virtualization/SKILL.md +203 -203
package/package.json
CHANGED
|
@@ -1,147 +1,147 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": "4.0.
|
|
3
|
-
"license": "MIT",
|
|
4
|
-
"name": "@lminii/material-react-table",
|
|
5
|
-
"description": "
|
|
6
|
-
"author": "Tyler Lee",
|
|
7
|
-
"contributors": [
|
|
8
|
-
"Kevin Vandy (https://github.com/KevinVandy)"
|
|
9
|
-
],
|
|
10
|
-
"keywords": [
|
|
11
|
-
"react-table",
|
|
12
|
-
"material-ui",
|
|
13
|
-
"material-table",
|
|
14
|
-
"tanstack table",
|
|
15
|
-
"data table",
|
|
16
|
-
"tanstack-intent"
|
|
17
|
-
],
|
|
18
|
-
"repository": {
|
|
19
|
-
"type": "git",
|
|
20
|
-
"url": "git+https://github.com/lminii/material-react-table.git"
|
|
21
|
-
},
|
|
22
|
-
"homepage": "https://github.com/lminii/material-react-table",
|
|
23
|
-
"bugs": {
|
|
24
|
-
"url": "https://github.com/lminii/material-react-table/issues"
|
|
25
|
-
},
|
|
26
|
-
"sideEffects": false,
|
|
27
|
-
"main": "dist/index.js",
|
|
28
|
-
"module": "dist/index.mjs",
|
|
29
|
-
"typings": "dist/index.d.ts",
|
|
30
|
-
"exports": {
|
|
31
|
-
".": {
|
|
32
|
-
"import": {
|
|
33
|
-
"types": "./dist/index.d.mts",
|
|
34
|
-
"default": "./dist/index.mjs"
|
|
35
|
-
},
|
|
36
|
-
"require": {
|
|
37
|
-
"types": "./dist/index.d.ts",
|
|
38
|
-
"default": "./dist/index.js"
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
"./locales/*": {
|
|
42
|
-
"import": {
|
|
43
|
-
"types": "./locales/*/index.d.mts",
|
|
44
|
-
"default": "./locales/*/index.mjs"
|
|
45
|
-
},
|
|
46
|
-
"require": {
|
|
47
|
-
"types": "./locales/*/index.d.ts",
|
|
48
|
-
"default": "./locales/*/index.js"
|
|
49
|
-
}
|
|
50
|
-
},
|
|
51
|
-
"./package.json": "./package.json"
|
|
52
|
-
},
|
|
53
|
-
"files": [
|
|
54
|
-
"dist",
|
|
55
|
-
"locales",
|
|
56
|
-
"src",
|
|
57
|
-
"skills"
|
|
58
|
-
],
|
|
59
|
-
"size-limit": [
|
|
60
|
-
{
|
|
61
|
-
"path": "dist/index.js",
|
|
62
|
-
"limit": "75 KB"
|
|
63
|
-
},
|
|
64
|
-
{
|
|
65
|
-
"path": "dist/index.mjs",
|
|
66
|
-
"limit": "65 KB"
|
|
67
|
-
}
|
|
68
|
-
],
|
|
69
|
-
"engines": {
|
|
70
|
-
"node": ">=22.12"
|
|
71
|
-
},
|
|
72
|
-
"scripts": {
|
|
73
|
-
"build": "pnpm lib:build",
|
|
74
|
-
"build-locales": "pnpm lib:build-locales",
|
|
75
|
-
"build-lib": "pnpm lib:build-lib",
|
|
76
|
-
"dev": "pnpm lib:dev",
|
|
77
|
-
"lib:build": "pnpm build-lib && pnpm build-locales",
|
|
78
|
-
"lib:build-locales": "node build-locales.mjs",
|
|
79
|
-
"lib:build-lib": "rm -rf dist && rollup -c rollup.config.mjs && size-limit",
|
|
80
|
-
"lib:dev": "rollup -c rollup.config.mjs --watch",
|
|
81
|
-
"lint": "eslint .",
|
|
82
|
-
"size": "size-limit",
|
|
83
|
-
"storybook": "storybook dev -p 6006",
|
|
84
|
-
"storybook:build": "storybook build",
|
|
85
|
-
"storybook:dev": "storybook dev -p 6006",
|
|
86
|
-
"build-storybook": "storybook build"
|
|
87
|
-
},
|
|
88
|
-
"devDependencies": {
|
|
89
|
-
"@emotion/react": "^11.14.0",
|
|
90
|
-
"@emotion/styled": "^11.14.0",
|
|
91
|
-
"@faker-js/faker": "^9.3.0",
|
|
92
|
-
"@mui/icons-material": "9.4.0",
|
|
93
|
-
"@mui/material": "9.4.0",
|
|
94
|
-
"@mui/x-date-pickers": "9.13.0",
|
|
95
|
-
"@rollup/plugin-typescript": "^11.1.6",
|
|
96
|
-
"@size-limit/preset-small-lib": "^11.1.6",
|
|
97
|
-
"@storybook/addon-a11y": "^8.4.7",
|
|
98
|
-
"@storybook/addon-essentials": "^8.4.7",
|
|
99
|
-
"@storybook/addon-links": "^8.4.7",
|
|
100
|
-
"@storybook/addon-storysource": "^8.4.7",
|
|
101
|
-
"@storybook/blocks": "^8.4.7",
|
|
102
|
-
"@storybook/preview-api": "^8.4.7",
|
|
103
|
-
"@storybook/react": "^8.4.7",
|
|
104
|
-
"@storybook/react-vite": "^8.4.7",
|
|
105
|
-
"@tanstack/intent": "^0.4.0",
|
|
106
|
-
"@types/node": "^22.10.2",
|
|
107
|
-
"@types/react": "^19.0.2",
|
|
108
|
-
"@types/react-dom": "^19.0.2",
|
|
109
|
-
"@typescript-eslint/eslint-plugin": "8.18.1",
|
|
110
|
-
"@typescript-eslint/parser": "8.18.1",
|
|
111
|
-
"@vitejs/plugin-react": "^4.3.4",
|
|
112
|
-
"eslint": "^9.17.0",
|
|
113
|
-
"eslint-plugin-mui-path-imports": "^0.0.15",
|
|
114
|
-
"eslint-plugin-perfectionist": "^4.4.0",
|
|
115
|
-
"eslint-plugin-storybook": "^0.11.1",
|
|
116
|
-
"react": "^19.0.0",
|
|
117
|
-
"react-dom": "^19.0.0",
|
|
118
|
-
"react-is": "^19.0.0",
|
|
119
|
-
"rollup": "^2.79.1",
|
|
120
|
-
"rollup-plugin-copy": "^3.5.0",
|
|
121
|
-
"rollup-plugin-delete": "^2.1.0",
|
|
122
|
-
"rollup-plugin-dts": "^6.1.1",
|
|
123
|
-
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
124
|
-
"size-limit": "^11.1.6",
|
|
125
|
-
"storybook": "^8.4.7",
|
|
126
|
-
"storybook-dark-mode": "^4.0.2",
|
|
127
|
-
"tslib": "^2.8.1",
|
|
128
|
-
"typescript": "5.7.2",
|
|
129
|
-
"typescript-eslint": "8.18.1",
|
|
130
|
-
"vite": "^6.0.5"
|
|
131
|
-
},
|
|
132
|
-
"peerDependencies": {
|
|
133
|
-
"@emotion/react": ">=11.13",
|
|
134
|
-
"@emotion/styled": ">=11.13",
|
|
135
|
-
"@mui/icons-material": ">=9.0",
|
|
136
|
-
"@mui/material": ">=9.0",
|
|
137
|
-
"@mui/x-date-pickers": ">=9.0",
|
|
138
|
-
"react": ">=18.0",
|
|
139
|
-
"react-dom": ">=18.0"
|
|
140
|
-
},
|
|
141
|
-
"dependencies": {
|
|
142
|
-
"@tanstack/match-sorter-utils": "9.1.2",
|
|
143
|
-
"@tanstack/react-table": "9.2.4",
|
|
144
|
-
"@tanstack/react-virtual": "3.14.10",
|
|
145
|
-
"highlight-words": "2.0.0"
|
|
146
|
-
}
|
|
147
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"version": "4.0.1",
|
|
3
|
+
"license": "MIT",
|
|
4
|
+
"name": "@lminii/material-react-table",
|
|
5
|
+
"description": "Fork of material-react-table upgraded to Material UI V9 and TanStack React Table V9",
|
|
6
|
+
"author": "Tyler Lee",
|
|
7
|
+
"contributors": [
|
|
8
|
+
"Kevin Vandy (https://github.com/KevinVandy)"
|
|
9
|
+
],
|
|
10
|
+
"keywords": [
|
|
11
|
+
"react-table",
|
|
12
|
+
"material-ui",
|
|
13
|
+
"material-table",
|
|
14
|
+
"tanstack table",
|
|
15
|
+
"data table",
|
|
16
|
+
"tanstack-intent"
|
|
17
|
+
],
|
|
18
|
+
"repository": {
|
|
19
|
+
"type": "git",
|
|
20
|
+
"url": "git+https://github.com/lminii/material-react-table.git"
|
|
21
|
+
},
|
|
22
|
+
"homepage": "https://github.com/lminii/material-react-table",
|
|
23
|
+
"bugs": {
|
|
24
|
+
"url": "https://github.com/lminii/material-react-table/issues"
|
|
25
|
+
},
|
|
26
|
+
"sideEffects": false,
|
|
27
|
+
"main": "dist/index.js",
|
|
28
|
+
"module": "dist/index.mjs",
|
|
29
|
+
"typings": "dist/index.d.ts",
|
|
30
|
+
"exports": {
|
|
31
|
+
".": {
|
|
32
|
+
"import": {
|
|
33
|
+
"types": "./dist/index.d.mts",
|
|
34
|
+
"default": "./dist/index.mjs"
|
|
35
|
+
},
|
|
36
|
+
"require": {
|
|
37
|
+
"types": "./dist/index.d.ts",
|
|
38
|
+
"default": "./dist/index.js"
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
"./locales/*": {
|
|
42
|
+
"import": {
|
|
43
|
+
"types": "./locales/*/index.d.mts",
|
|
44
|
+
"default": "./locales/*/index.mjs"
|
|
45
|
+
},
|
|
46
|
+
"require": {
|
|
47
|
+
"types": "./locales/*/index.d.ts",
|
|
48
|
+
"default": "./locales/*/index.js"
|
|
49
|
+
}
|
|
50
|
+
},
|
|
51
|
+
"./package.json": "./package.json"
|
|
52
|
+
},
|
|
53
|
+
"files": [
|
|
54
|
+
"dist",
|
|
55
|
+
"locales",
|
|
56
|
+
"src",
|
|
57
|
+
"skills"
|
|
58
|
+
],
|
|
59
|
+
"size-limit": [
|
|
60
|
+
{
|
|
61
|
+
"path": "dist/index.js",
|
|
62
|
+
"limit": "75 KB"
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
"path": "dist/index.mjs",
|
|
66
|
+
"limit": "65 KB"
|
|
67
|
+
}
|
|
68
|
+
],
|
|
69
|
+
"engines": {
|
|
70
|
+
"node": ">=22.12"
|
|
71
|
+
},
|
|
72
|
+
"scripts": {
|
|
73
|
+
"build": "pnpm lib:build",
|
|
74
|
+
"build-locales": "pnpm lib:build-locales",
|
|
75
|
+
"build-lib": "pnpm lib:build-lib",
|
|
76
|
+
"dev": "pnpm lib:dev",
|
|
77
|
+
"lib:build": "pnpm build-lib && pnpm build-locales",
|
|
78
|
+
"lib:build-locales": "node build-locales.mjs",
|
|
79
|
+
"lib:build-lib": "rm -rf dist && rollup -c rollup.config.mjs && size-limit",
|
|
80
|
+
"lib:dev": "rollup -c rollup.config.mjs --watch",
|
|
81
|
+
"lint": "eslint .",
|
|
82
|
+
"size": "size-limit",
|
|
83
|
+
"storybook": "storybook dev -p 6006",
|
|
84
|
+
"storybook:build": "storybook build",
|
|
85
|
+
"storybook:dev": "storybook dev -p 6006",
|
|
86
|
+
"build-storybook": "storybook build"
|
|
87
|
+
},
|
|
88
|
+
"devDependencies": {
|
|
89
|
+
"@emotion/react": "^11.14.0",
|
|
90
|
+
"@emotion/styled": "^11.14.0",
|
|
91
|
+
"@faker-js/faker": "^9.3.0",
|
|
92
|
+
"@mui/icons-material": "9.4.0",
|
|
93
|
+
"@mui/material": "9.4.0",
|
|
94
|
+
"@mui/x-date-pickers": "9.13.0",
|
|
95
|
+
"@rollup/plugin-typescript": "^11.1.6",
|
|
96
|
+
"@size-limit/preset-small-lib": "^11.1.6",
|
|
97
|
+
"@storybook/addon-a11y": "^8.4.7",
|
|
98
|
+
"@storybook/addon-essentials": "^8.4.7",
|
|
99
|
+
"@storybook/addon-links": "^8.4.7",
|
|
100
|
+
"@storybook/addon-storysource": "^8.4.7",
|
|
101
|
+
"@storybook/blocks": "^8.4.7",
|
|
102
|
+
"@storybook/preview-api": "^8.4.7",
|
|
103
|
+
"@storybook/react": "^8.4.7",
|
|
104
|
+
"@storybook/react-vite": "^8.4.7",
|
|
105
|
+
"@tanstack/intent": "^0.4.0",
|
|
106
|
+
"@types/node": "^22.10.2",
|
|
107
|
+
"@types/react": "^19.0.2",
|
|
108
|
+
"@types/react-dom": "^19.0.2",
|
|
109
|
+
"@typescript-eslint/eslint-plugin": "8.18.1",
|
|
110
|
+
"@typescript-eslint/parser": "8.18.1",
|
|
111
|
+
"@vitejs/plugin-react": "^4.3.4",
|
|
112
|
+
"eslint": "^9.17.0",
|
|
113
|
+
"eslint-plugin-mui-path-imports": "^0.0.15",
|
|
114
|
+
"eslint-plugin-perfectionist": "^4.4.0",
|
|
115
|
+
"eslint-plugin-storybook": "^0.11.1",
|
|
116
|
+
"react": "^19.0.0",
|
|
117
|
+
"react-dom": "^19.0.0",
|
|
118
|
+
"react-is": "^19.0.0",
|
|
119
|
+
"rollup": "^2.79.1",
|
|
120
|
+
"rollup-plugin-copy": "^3.5.0",
|
|
121
|
+
"rollup-plugin-delete": "^2.1.0",
|
|
122
|
+
"rollup-plugin-dts": "^6.1.1",
|
|
123
|
+
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
124
|
+
"size-limit": "^11.1.6",
|
|
125
|
+
"storybook": "^8.4.7",
|
|
126
|
+
"storybook-dark-mode": "^4.0.2",
|
|
127
|
+
"tslib": "^2.8.1",
|
|
128
|
+
"typescript": "5.7.2",
|
|
129
|
+
"typescript-eslint": "8.18.1",
|
|
130
|
+
"vite": "^6.0.5"
|
|
131
|
+
},
|
|
132
|
+
"peerDependencies": {
|
|
133
|
+
"@emotion/react": ">=11.13",
|
|
134
|
+
"@emotion/styled": ">=11.13",
|
|
135
|
+
"@mui/icons-material": ">=9.0",
|
|
136
|
+
"@mui/material": ">=9.0",
|
|
137
|
+
"@mui/x-date-pickers": ">=9.0",
|
|
138
|
+
"react": ">=18.0",
|
|
139
|
+
"react-dom": ">=18.0"
|
|
140
|
+
},
|
|
141
|
+
"dependencies": {
|
|
142
|
+
"@tanstack/match-sorter-utils": "9.1.2",
|
|
143
|
+
"@tanstack/react-table": "9.2.4",
|
|
144
|
+
"@tanstack/react-virtual": "3.14.10",
|
|
145
|
+
"highlight-words": "2.0.0"
|
|
146
|
+
}
|
|
147
|
+
}
|
package/skills/README.md
CHANGED
|
@@ -1,81 +1,81 @@
|
|
|
1
|
-
# Material React Table Agent Skills
|
|
2
|
-
|
|
3
|
-
These folders are [Agent Skills](https://agentskills.io) for AI coding assistants such as Claude Code, Cursor, Codex, and Copilot.
|
|
4
|
-
Each folder holds one `SKILL.md` that teaches an agent a slice of the Material React Table V4 API and the patterns the documentation recommends.
|
|
5
|
-
The skills ship inside the `@lminii/material-react-table` npm package, so every install of the library carries them.
|
|
6
|
-
|
|
7
|
-
Full documentation for AI agents, including the MCP server, lives on the [AI Agents](https://material-react-table.minii.dev/docs/getting-started/ai-agents) docs page.
|
|
8
|
-
|
|
9
|
-
## Skills
|
|
10
|
-
|
|
11
|
-
| Skill | Load it for |
|
|
12
|
-
| --- | --- |
|
|
13
|
-
| `getting-started` | Installing V4, defining columns, the `useMaterialReactTable` plus `table` prop pattern, and the sub-component exports. |
|
|
14
|
-
| `customization` | `mui*Props`, `render*` overrides, display columns, icons, and Material UI theming. |
|
|
15
|
-
| `composable-components` | Building a custom layout from the exported `MRT_*` components. |
|
|
16
|
-
| `state-and-server-data` | Controlled state, `on*Change` callbacks, `manual*` options, `rowCount`, and TanStack Query integration. |
|
|
17
|
-
| `editing` | The five edit display modes, create rows, validation, and saving to a server. |
|
|
18
|
-
| `filtering` | Column filter variants and modes, global filtering, faceted values, and custom filter functions. |
|
|
19
|
-
| `virtualization` | Row and column virtualization, virtualizer options, and scroll-to-index. |
|
|
20
|
-
| `localization` | The bundled locales and custom localization strings. |
|
|
21
|
-
| `drag-and-drop-ordering` | Column and row drag and drop ordering. |
|
|
22
|
-
| `migrate-v3-to-v4` | Moving an app from `material-react-table` V3 to `@lminii/material-react-table` V4. |
|
|
23
|
-
|
|
24
|
-
## How Agents Use Them
|
|
25
|
-
|
|
26
|
-
There are three ways to get a skill in front of an agent.
|
|
27
|
-
|
|
28
|
-
### TanStack Intent
|
|
29
|
-
|
|
30
|
-
[TanStack Intent](https://www.npmjs.com/package/@tanstack/intent) discovers skills from the packages installed in a project.
|
|
31
|
-
In a project with `@lminii/material-react-table` installed, an agent (or you) can list and load them:
|
|
32
|
-
|
|
33
|
-
```bash
|
|
34
|
-
npx @tanstack/intent@latest list
|
|
35
|
-
npx @tanstack/intent@latest load @lminii/material-react-table#getting-started
|
|
36
|
-
```
|
|
37
|
-
|
|
38
|
-
Run `npx @tanstack/intent@latest install` once to add the discovery instructions to your `AGENTS.md` or `CLAUDE.md`.
|
|
39
|
-
After that the agent runs the `list` and `load` commands on its own before editing table code.
|
|
40
|
-
The TanStack Table V9 packages ship skills the same way, and the `requires` field in each `SKILL.md` points at the TanStack skills a feature builds on.
|
|
41
|
-
|
|
42
|
-
### Skills CLI
|
|
43
|
-
|
|
44
|
-
Any harness that reads `SKILL.md` files can install this folder straight from GitHub with the [skills CLI](https://github.com/vercel-labs/skills).
|
|
45
|
-
Pick the command for your agent.
|
|
46
|
-
|
|
47
|
-
| Agent | Command |
|
|
48
|
-
| --- | --- |
|
|
49
|
-
| Claude Code | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a claude-code` |
|
|
50
|
-
| Cursor | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a cursor` |
|
|
51
|
-
| Codex | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a codex` |
|
|
52
|
-
| GitHub Copilot | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a github-copilot` |
|
|
53
|
-
| Gemini CLI | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a gemini-cli` |
|
|
54
|
-
| Windsurf | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a windsurf` |
|
|
55
|
-
| OpenCode | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a opencode` |
|
|
56
|
-
| Cline | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a cline` |
|
|
57
|
-
| Several agents | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a claude-code -a cursor` |
|
|
58
|
-
| Every detected agent | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills --all` |
|
|
59
|
-
|
|
60
|
-
The CLI supports many more agents, including Amp, Antigravity, Augment, Continue, Devin, Droid, Goose, Junie, Kilo Code, Kiro, OpenHands, Qwen Code, Roo Code, Trae, and Zed.
|
|
61
|
-
The full list of `-a` values is in the [Supported Agents](https://github.com/vercel-labs/skills#supported-agents) table.
|
|
62
|
-
|
|
63
|
-
### MCP Server
|
|
64
|
-
|
|
65
|
-
The [`@lminii/material-react-table-mcp`](https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table-mcp) server bundles a copy of these skills.
|
|
66
|
-
Its `get_mrt_skill` tool lists them or returns one by name, and `search_mrt_docs` searches them alongside the guides and examples.
|
|
67
|
-
|
|
68
|
-
```bash
|
|
69
|
-
claude mcp add material-react-table -- npx -y @lminii/material-react-table-mcp
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
## File Format
|
|
73
|
-
|
|
74
|
-
Each `SKILL.md` starts with YAML frontmatter.
|
|
75
|
-
|
|
76
|
-
- `name` and `description` are what Intent and the skills CLI show when listing, so the description says both what the skill covers and when to load it.
|
|
77
|
-
- `metadata` records the library and version the skill was written against.
|
|
78
|
-
- `requires` lists TanStack skills (for example `@tanstack/table-core#core`) that should be loaded alongside it.
|
|
79
|
-
- `sources` lists the docs pages in this repository the skill was distilled from, so a change to those pages is a cue to update the skill.
|
|
80
|
-
|
|
81
|
-
The body is plain Markdown that an agent reads in full, so it stays focused on the API, the recommended patterns, and the mistakes to avoid.
|
|
1
|
+
# Material React Table Agent Skills
|
|
2
|
+
|
|
3
|
+
These folders are [Agent Skills](https://agentskills.io) for AI coding assistants such as Claude Code, Cursor, Codex, and Copilot.
|
|
4
|
+
Each folder holds one `SKILL.md` that teaches an agent a slice of the Material React Table V4 API and the patterns the documentation recommends.
|
|
5
|
+
The skills ship inside the `@lminii/material-react-table` npm package, so every install of the library carries them.
|
|
6
|
+
|
|
7
|
+
Full documentation for AI agents, including the MCP server, lives on the [AI Agents](https://material-react-table.minii.dev/docs/getting-started/ai-agents) docs page.
|
|
8
|
+
|
|
9
|
+
## Skills
|
|
10
|
+
|
|
11
|
+
| Skill | Load it for |
|
|
12
|
+
| --- | --- |
|
|
13
|
+
| `getting-started` | Installing V4, defining columns, the `useMaterialReactTable` plus `table` prop pattern, and the sub-component exports. |
|
|
14
|
+
| `customization` | `mui*Props`, `render*` overrides, display columns, icons, and Material UI theming. |
|
|
15
|
+
| `composable-components` | Building a custom layout from the exported `MRT_*` components. |
|
|
16
|
+
| `state-and-server-data` | Controlled state, `on*Change` callbacks, `manual*` options, `rowCount`, and TanStack Query integration. |
|
|
17
|
+
| `editing` | The five edit display modes, create rows, validation, and saving to a server. |
|
|
18
|
+
| `filtering` | Column filter variants and modes, global filtering, faceted values, and custom filter functions. |
|
|
19
|
+
| `virtualization` | Row and column virtualization, virtualizer options, and scroll-to-index. |
|
|
20
|
+
| `localization` | The bundled locales and custom localization strings. |
|
|
21
|
+
| `drag-and-drop-ordering` | Column and row drag and drop ordering. |
|
|
22
|
+
| `migrate-v3-to-v4` | Moving an app from `material-react-table` V3 to `@lminii/material-react-table` V4. |
|
|
23
|
+
|
|
24
|
+
## How Agents Use Them
|
|
25
|
+
|
|
26
|
+
There are three ways to get a skill in front of an agent.
|
|
27
|
+
|
|
28
|
+
### TanStack Intent
|
|
29
|
+
|
|
30
|
+
[TanStack Intent](https://www.npmjs.com/package/@tanstack/intent) discovers skills from the packages installed in a project.
|
|
31
|
+
In a project with `@lminii/material-react-table` installed, an agent (or you) can list and load them:
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
npx @tanstack/intent@latest list
|
|
35
|
+
npx @tanstack/intent@latest load @lminii/material-react-table#getting-started
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
Run `npx @tanstack/intent@latest install` once to add the discovery instructions to your `AGENTS.md` or `CLAUDE.md`.
|
|
39
|
+
After that the agent runs the `list` and `load` commands on its own before editing table code.
|
|
40
|
+
The TanStack Table V9 packages ship skills the same way, and the `requires` field in each `SKILL.md` points at the TanStack skills a feature builds on.
|
|
41
|
+
|
|
42
|
+
### Skills CLI
|
|
43
|
+
|
|
44
|
+
Any harness that reads `SKILL.md` files can install this folder straight from GitHub with the [skills CLI](https://github.com/vercel-labs/skills).
|
|
45
|
+
Pick the command for your agent.
|
|
46
|
+
|
|
47
|
+
| Agent | Command |
|
|
48
|
+
| --- | --- |
|
|
49
|
+
| Claude Code | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a claude-code` |
|
|
50
|
+
| Cursor | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a cursor` |
|
|
51
|
+
| Codex | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a codex` |
|
|
52
|
+
| GitHub Copilot | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a github-copilot` |
|
|
53
|
+
| Gemini CLI | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a gemini-cli` |
|
|
54
|
+
| Windsurf | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a windsurf` |
|
|
55
|
+
| OpenCode | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a opencode` |
|
|
56
|
+
| Cline | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a cline` |
|
|
57
|
+
| Several agents | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills -a claude-code -a cursor` |
|
|
58
|
+
| Every detected agent | `npx skills add https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table/skills --all` |
|
|
59
|
+
|
|
60
|
+
The CLI supports many more agents, including Amp, Antigravity, Augment, Continue, Devin, Droid, Goose, Junie, Kilo Code, Kiro, OpenHands, Qwen Code, Roo Code, Trae, and Zed.
|
|
61
|
+
The full list of `-a` values is in the [Supported Agents](https://github.com/vercel-labs/skills#supported-agents) table.
|
|
62
|
+
|
|
63
|
+
### MCP Server
|
|
64
|
+
|
|
65
|
+
The [`@lminii/material-react-table-mcp`](https://github.com/lminii/material-react-table/tree/v4/packages/material-react-table-mcp) server bundles a copy of these skills.
|
|
66
|
+
Its `get_mrt_skill` tool lists them or returns one by name, and `search_mrt_docs` searches them alongside the guides and examples.
|
|
67
|
+
|
|
68
|
+
```bash
|
|
69
|
+
claude mcp add material-react-table -- npx -y @lminii/material-react-table-mcp
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
## File Format
|
|
73
|
+
|
|
74
|
+
Each `SKILL.md` starts with YAML frontmatter.
|
|
75
|
+
|
|
76
|
+
- `name` and `description` are what Intent and the skills CLI show when listing, so the description says both what the skill covers and when to load it.
|
|
77
|
+
- `metadata` records the library and version the skill was written against.
|
|
78
|
+
- `requires` lists TanStack skills (for example `@tanstack/table-core#core`) that should be loaded alongside it.
|
|
79
|
+
- `sources` lists the docs pages in this repository the skill was distilled from, so a change to those pages is a cue to update the skill.
|
|
80
|
+
|
|
81
|
+
The body is plain Markdown that an agent reads in full, so it stays focused on the API, the recommended patterns, and the mistakes to avoid.
|