@mcpc-tech/unplugin-dev-inspector-mcp 0.1.3 → 0.1.4

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.
Files changed (2) hide show
  1. package/README.md +11 -10
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -1,8 +1,4 @@
1
- <p align="center">
2
- <img src="./assets/logo.svg" alt="DevInspector Logo" width="50" height="50" />
3
- </p>
4
-
5
- # @mcpc-tech/unplugin-dev-inspector-mcp
1
+ # dev-inspector-mcp
6
2
 
7
3
  [![npm version](https://img.shields.io/npm/v/@mcpc-tech/unplugin-dev-inspector-mcp.svg)](https://www.npmjs.com/package/@mcpc-tech/unplugin-dev-inspector-mcp)
8
4
  [![npm downloads](https://img.shields.io/npm/dm/@mcpc-tech/unplugin-dev-inspector-mcp.svg)](https://www.npmjs.com/package/@mcpc-tech/unplugin-dev-inspector-mcp)
@@ -46,17 +42,22 @@ Works with any MCP-compatible AI client. Supports ACP agents: **Claude Code**, *
46
42
 
47
43
  ## Key Features
48
44
 
49
- ### 🎯 Visual Context
45
+ ### 🎯 Visual Context & Region Selection
46
+
47
+ Click any element to inspect it, or **drag to select a region**. AI gets the full context: source code location, computed styles, component hierarchy, IDs, classes, text content, and **automatically captures screenshots** for pixel-perfect visual understanding.
48
+
49
+
50
+ ### 🛠️ Universal DevTools Access
50
51
 
51
- Click any element to instantly send its source code location, computed styles, and DOM hierarchy to AI. No more explaining "it's the blue button in the header".
52
+ AI can access Network and Console logs from **any browser** (via client-side interception) or full Chrome DevTools (via chrome devtools mcp). It sees what you see, regardless of your environment.
52
53
 
53
- ### 🛠️ Full DevTools Access
54
+ ### Smart Select
54
55
 
55
- AI can access Chrome DevTools to analyze network requests, console logs, and performance metrics. It sees what you see.
56
+ Let AI do the heavy lifting. "Smart Select" automatically analyzes recent console errors and failed network requests to construct the perfect context for your debugging session.
56
57
 
57
58
  ### 🤖 Multi-Agent Workflow
58
59
 
59
- Switch between agents (Claude Code, Goose) and track their debugging progress visually with step-by-step status updates.
60
+ Switch between agents (Claude Code, Codex, Gemini, Opencode...) and track their debugging progress visually with a **floating status bar**.
60
61
 
61
62
  ## Quick Start
62
63
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mcpc-tech/unplugin-dev-inspector-mcp",
3
- "version": "0.1.3",
3
+ "version": "0.1.4",
4
4
  "description": "Universal dev inspector plugin for React/Vue - inspect component sources and API calls in any bundler",
5
5
  "type": "module",
6
6
  "license": "MIT",