{"_id":"@agent-wasm/vscode","name":"@agent-wasm/vscode","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@agent-wasm/vscode","version":"0.1.0","description":"VS Code-shaped shell and React integration APIs for agent-wasm workspaces.","private":false,"type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs","default":"./dist/index.js"}},"dependencies":{"react":"^19.2.4","react-dom":"^19.2.4","@agent-wasm/sdk":"0.1.0"},"devDependencies":{"@types/node":"^25.0.10","@types/react":"^19.2.2","@types/react-dom":"^19.2.2","typescript":"^5.9.3","vitest":"4.0.18","tsup":"^8.5.0"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/BLamy/agent-wasm.git"},"sideEffects":false,"publishConfig":{"access":"public"},"scripts":{"build":"tsup src/index.ts --tsconfig tsconfig.build.json --format esm,cjs --dts --clean --external @agent-wasm/sdk --external @agent-wasm/sdk/plugins --external react --external react-dom","test":"vitest run","type-check":"tsc --project tsconfig.json --noEmit"},"_id":"@agent-wasm/vscode@0.1.0","bugs":{"url":"https://github.com/BLamy/agent-wasm/issues"},"homepage":"https://github.com/BLamy/agent-wasm#readme","_integrity":"sha512-mpJOyGouZAcZGcA7MYXlKeo377H3vTK5VfLyyl+hukgMXGxc/kvpLXsdHEVM7HB7NDCTituMg6twjRtubvGiww==","_resolved":"/private/var/folders/xj/jvddkcmd6y9_f79xzk2z_rd00000gn/T/5c9070ce6fb415f9fb684c12bfbf753c/agent-wasm-vscode-0.1.0.tgz","_from":"file:agent-wasm-vscode-0.1.0.tgz","_nodeVersion":"23.11.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-mpJOyGouZAcZGcA7MYXlKeo377H3vTK5VfLyyl+hukgMXGxc/kvpLXsdHEVM7HB7NDCTituMg6twjRtubvGiww==","shasum":"7e4cc7e27d321422f355a18491f210cbb214f8e4","tarball":"https://registry.npmjs.org/@agent-wasm/vscode/-/vscode-0.1.0.tgz","fileCount":7,"unpackedSize":61674,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIAPCEkgZRsaC4IKv1lqhuk76CTIAaitztxbk3skU7RWeAiBAo4UdQWO9EG6SzFUbUzO9cb5+5/idrt9GtLB4TzW2mA=="}]},"_npmUser":{"name":"bel423","email":"bel423@gmail.com"},"directories":{},"maintainers":[{"name":"bel423","email":"bel423@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/vscode_0.1.0_1784961629898_0.3299274965036467"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-25T06:40:29.724Z","0.1.0":"2026-07-25T06:40:30.032Z","modified":"2026-07-25T06:40:30.277Z"},"maintainers":[{"name":"bel423","email":"bel423@gmail.com"}],"description":"VS Code-shaped shell and React integration APIs for agent-wasm workspaces.","homepage":"https://github.com/BLamy/agent-wasm#readme","repository":{"type":"git","url":"git+https://github.com/BLamy/agent-wasm.git"},"bugs":{"url":"https://github.com/BLamy/agent-wasm/issues"},"license":"MIT","readme":"# @agent-wasm/vscode\n\nReusable VS Code-shaped shell primitives for agent-wasm harnesses.\n\nUse this package when a host wants the same workspace VFS, command registry,\nruntime panels, custom editors, and plugin contributions across Web IDE,\ndesktop, mobile, docs demos, or custom product shells.\n\n```tsx\nimport { createWorkspace } from \"@agent-wasm/sdk\";\nimport { PluginRegistry } from \"@agent-wasm/sdk/plugins\";\nimport {\n  VSCode,\n  defineVSCodeCustomEditor,\n  defineVSCodePanel,\n} from \"@agent-wasm/vscode\";\n\nconst workspace = createWorkspace();\nawait workspace.ready;\nconst plugins = PluginRegistry.fromManifests([\n  {\n    id: \"docs\",\n    vscode: {\n      panels: {\n        outline: { title: \"Outline\", location: \"sidebar\" },\n      },\n      customEditors: {\n        markdownPreview: {\n          displayName: \"Markdown Preview\",\n          filePatterns: [\"**/*.md\"],\n        },\n      },\n    },\n  },\n]);\n\nexport function App() {\n  return (\n    <VSCode\n      workspace={workspace}\n      plugins={plugins}\n      panels={[\n        defineVSCodePanel({\n          id: \"outline\",\n          title: \"Outline\",\n          location: \"sidebar\",\n          render({ container }) {\n            container.textContent = \"Plugin outline\";\n          },\n        }),\n      ]}\n      customEditors={[\n        defineVSCodeCustomEditor({\n          id: \"markdownPreview\",\n          displayName: \"Markdown Preview\",\n          filePatterns: [\"**/*.md\"],\n          render({ container, resource, workspace }) {\n            container.textContent = workspace.readFile(resource);\n          },\n        }),\n      ]}\n    />\n  );\n}\n```\n\nThe non-React `createVSCodeShell()` API owns the shared registry, command\nregistry, VFS file provider, file-pattern routing, and Playwright target\nmetadata for mounted custom editors.\n\n## Public APIs\n\n- **`<VSCode workspace plugins panels customEditors />`** — React wrapper that\n  renders registered panels plus either a matching custom editor or the\n  VFS-backed text fallback.\n- **`createVSCodeShell()`** — non-React shell for harnesses that mount their own\n  UI but still want contribution registration, command routing, file-pattern\n  matching, and Playwright metadata.\n- **`defineVSCodePanel()`** — helper for runtime panel definitions. Panels map\n  to `sidebar`, `panel`, or `auxiliarybar`.\n- **`defineVSCodeCustomEditor()`** — helper for file-pattern based editor\n  definitions. Custom editors write through the same workspace VFS as agents.\n- **`useVSCodeShell()`** — React hook for code rendered inside the wrapper.\n\n## Plugin contributions\n\n`@agent-wasm/vscode` consumes `PluginRegistry` from `@agent-wasm/sdk/plugins`.\nPlugin manifests can contribute UI under:\n\n```json\n{\n  \"vscode\": {\n    \"panels\": {\n      \"designInspector\": {\n        \"title\": \"Design Inspector\",\n        \"location\": \"sidebar\",\n        \"module\": \"./panels/design-inspector.tsx\"\n      }\n    },\n    \"customEditors\": {\n      \"schemaEditor\": {\n        \"displayName\": \"Schema Editor\",\n        \"filePatterns\": [\"**/*.schema.json\"],\n        \"module\": \"./editors/schema-editor.tsx\"\n      }\n    }\n  }\n}\n```\n\nThe shell registers plugin panels and custom editors first, then host-provided\nruntime definitions can override by id.\n\n## Playwright targets\n\nEvery mounted custom editor root gets stable metadata:\n\n- `data-agent-wasm-plugin-id`\n- `data-agent-wasm-vscode-editor-id`\n- `data-agent-wasm-resource`\n- `data-testid`\n\nHarnesses can expose that root to an agent with raw Playwright:\n\n```ts\nconst shell = createVSCodeShell({ workspace, plugins });\nconst opened = shell.openResource(\"/project/schema.graph.json\");\n\nif (opened.kind === \"customEditor\") {\n  const target = shell.getPlaywrightTarget({\n    editorId: opened.customEditor.id,\n    resource: opened.resource,\n  });\n\n  await page.locator(target!.selector).getByRole(\"button\", { name: \"Add\" }).click();\n}\n```\n\nThis keeps the first AI/UI bridge simple: agents can operate against the real\ncustom editor DOM. A higher-level action DSL can be added later if raw\nPlaywright proves too brittle.\n","readmeFilename":"README.md","_rev":"1-d7e594877ac2f8039b53cd55999e340c"}