@storybook/addon-mcp 0.0.9 → 0.1.0
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 +2 -6
- package/dist/preset.js +5 -13
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -6,9 +6,6 @@ It enables a workflow where for each UI component created, the agent will automa
|
|
|
6
6
|
|
|
7
7
|
The addon provides tools to improve agents' UI development capabilities, retrieve story URLs, and access component documentation.
|
|
8
8
|
|
|
9
|
-
> [!IMPORTANT]
|
|
10
|
-
> This addon currently only supports Vite-based Storybook setups, such as [`@storybook/react-vite`](https://storybook.js.org/docs/get-started/frameworks/react-vite), [`@storybook/nextjs-vite`](https://storybook.js.org/docs/get-started/frameworks/nextjs#with-vite), and [`@storybook/sveltekit`](https://storybook.js.org/docs/get-started/frameworks/sveltekit).
|
|
11
|
-
|
|
12
9
|
<div align="center">
|
|
13
10
|
<img src="https://storybook.js.org/embed/addon-mcp-claude-code-showcase.gif" alt="Storybook MCP Addon Demo" />
|
|
14
11
|
</div>
|
|
@@ -18,7 +15,7 @@ The addon provides tools to improve agents' UI development capabilities, retriev
|
|
|
18
15
|
### Installation and Setup
|
|
19
16
|
|
|
20
17
|
> [!NOTE]
|
|
21
|
-
> This addon requires Storybook
|
|
18
|
+
> This addon requires Storybook 10.1 or higher, currently only available as the canary version `0.0.0-pr-32810-sha-6e759c7e`.
|
|
22
19
|
|
|
23
20
|
Use Storybook's CLI to automatically install and configure the addon:
|
|
24
21
|
|
|
@@ -128,8 +125,7 @@ These additional tools are available when the **experimental** component manifes
|
|
|
128
125
|
|
|
129
126
|
**Requirements:**
|
|
130
127
|
|
|
131
|
-
-
|
|
132
|
-
- React-based framework (`react-vite`, `nextjs-vite`)
|
|
128
|
+
- React-based framework (`react-vite`, `nextjs-vite`, `nextjs`, `react-webpack5`)
|
|
133
129
|
- Feature flag `features.experimentalComponentsManifest` set to `true` in `.storybook/main.js`
|
|
134
130
|
|
|
135
131
|
**To enable:**
|
package/dist/preset.js
CHANGED
|
@@ -11,7 +11,7 @@ import { buffer } from "node:stream/consumers";
|
|
|
11
11
|
|
|
12
12
|
//#region package.json
|
|
13
13
|
var name = "@storybook/addon-mcp";
|
|
14
|
-
var version = "0.0
|
|
14
|
+
var version = "0.1.0";
|
|
15
15
|
var description = "Help agents automatically write and test stories for your UI components";
|
|
16
16
|
|
|
17
17
|
//#endregion
|
|
@@ -281,18 +281,10 @@ async function webResponseToServerResponse(webResponse, nodeResponse) {
|
|
|
281
281
|
|
|
282
282
|
//#endregion
|
|
283
283
|
//#region src/preset.ts
|
|
284
|
-
const
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
configureServer(server) {
|
|
288
|
-
server.middlewares.use("/mcp", (req, res, next) => mcpServerHandler(req, res, next, options));
|
|
289
|
-
}
|
|
290
|
-
};
|
|
291
|
-
return {
|
|
292
|
-
...config,
|
|
293
|
-
plugins: config.plugins.concat(mcpHandlerPlugin)
|
|
294
|
-
};
|
|
284
|
+
const experimental_devServer = (app, options) => {
|
|
285
|
+
app.use("/mcp", (req, res, next) => mcpServerHandler(req, res, next, options));
|
|
286
|
+
return app;
|
|
295
287
|
};
|
|
296
288
|
|
|
297
289
|
//#endregion
|
|
298
|
-
export {
|
|
290
|
+
export { experimental_devServer };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/addon-mcp",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0",
|
|
4
4
|
"description": "Help agents automatically write and test stories for your UI components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"storybook-addon",
|
|
@@ -30,12 +30,12 @@
|
|
|
30
30
|
"@tmcp/transport-http": "^0.7.0",
|
|
31
31
|
"tmcp": "^1.15.2",
|
|
32
32
|
"valibot": "^1.1.0",
|
|
33
|
-
"@storybook/mcp": "0.0.
|
|
33
|
+
"@storybook/mcp": "0.0.4"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
36
|
"@types/node": "20.19.0",
|
|
37
37
|
"@vitest/coverage-v8": "3.2.4",
|
|
38
|
-
"storybook": "
|
|
38
|
+
"storybook": "0.0.0-pr-32810-sha-6e759c7e",
|
|
39
39
|
"ts-dedent": "^2.2.0",
|
|
40
40
|
"tsdown": "^0.15.9",
|
|
41
41
|
"typescript": "^5.9.3",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"vitest": "^3.2.4"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|
|
46
|
-
"storybook": "
|
|
46
|
+
"storybook": "0.0.0-pr-32810-sha-6e759c7e"
|
|
47
47
|
},
|
|
48
48
|
"publishConfig": {
|
|
49
49
|
"access": "public"
|