{"_id":"@amulet-digital/vscodemock","_rev":"2-33c914579883ebbb669bfab384bb5cc6","name":"@amulet-digital/vscodemock","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.1":{"name":"@amulet-digital/vscodemock","version":"1.0.1","keywords":["vscode","ide","ui","components","vue","vue3"],"author":{"name":"Amulet Digital"},"license":"MIT","_id":"@amulet-digital/vscodemock@1.0.1","maintainers":[{"name":"sndhl","email":"sndhl@pm.me"}],"homepage":"https://github.com/Amulet-Digital/vscodemock","bugs":{"url":"https://github.com/Amulet-Digital/vscodemock/issues"},"dist":{"shasum":"df80197c34b9c91170b16eaf901b77c3a5035646","tarball":"https://registry.npmjs.org/@amulet-digital/vscodemock/-/vscodemock-1.0.1.tgz","fileCount":19,"integrity":"sha512-yvuof0oo0T4ca69uyK0QnjW6YpljKWJsxNeGefWy+N90EeKhfa37bu3DXtHcy9IuNW3f+DgLvX0kN48xsa7pHA==","signatures":[{"sig":"MEUCIQDXgS0RZBBajgV5dROHGGT3Ol7VIGX0hKJyOFs6NXw/dQIga0LAPtKceN3NWZ+P7DRjXbS7jRau8jNowlOuZaRY7e0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":83957},"main":"./dist/index.umd.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.es.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.es.js","require":"./dist/index.umd.js"},"./css":"./dist/style.css"},"gitHead":"be18bf7b8cad3e4feb324badf7dd45019e5a03a7","scripts":{"dev":"vite","lint":"eslint src --ext .ts,.vue","test":"vitest","build":"tsc --noEmit && vite build","format":"prettier --write \"src/**/*.{ts,vue,css}\"","preview":"vite preview","test:ui":"vitest --ui","lint:fix":"eslint src --ext .ts,.vue --fix","type-check":"tsc --noEmit","test:coverage":"vitest --coverage","prepublishOnly":"npm run lint && npm run type-check && npm run build"},"_npmUser":{"name":"sndhl","email":"sndhl@pm.me"},"repository":{"url":"git+https://github.com/Amulet-Digital/vscodemock.git","type":"git"},"_npmVersion":"11.6.2","description":"Reusable VSCode IDE component library. Barebones shell for building IDE-like interfaces.","directories":{},"_nodeVersion":"24.13.0","dependencies":{"vue":"^3.4.0","iconify-icon":"^3.0.2"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.8","jsdom":"^28.1.0","eslint":"^8.56.0","terser":"^5.46.0","vitest":"^1.0.4","vue-tsc":"^1.8.24","prettier":"^3.1.1","@eslint/js":"^8.0.0","@vitest/ui":"^1.0.4","typescript":"^5.3.3","tailwindcss":"^3.4.1","@vue/test-utils":"^2.4.1","vite-plugin-dts":"^4.0.0","eslint-plugin-vue":"^9.0.0","typescript-eslint":"^7.0.0","@vitejs/plugin-vue":"^5.0.0","@vitest/coverage-v8":"^1.0.4"},"_npmOperationalInternal":{"tmp":"tmp/vscodemock_1.0.1_1771483155186_0.8072951979719079","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@amulet-digital/vscodemock","version":"1.0.2","description":"Reusable VSCode IDE component library. Barebones shell for building IDE-like interfaces.","type":"module","repository":{"type":"git","url":"git+https://github.com/Amulet-Digital/vscodemock.git"},"homepage":"https://github.com/Amulet-Digital/vscodemock","bugs":{"url":"https://github.com/Amulet-Digital/vscodemock/issues"},"keywords":["vscode","ide","ui","components","vue","vue3"],"author":{"name":"Amulet Digital"},"license":"MIT","main":"./dist/index.umd.js","module":"./dist/index.es.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.es.js","require":"./dist/index.umd.js"},"./css":"./dist/style.css"},"publishConfig":{"access":"public"},"scripts":{"dev":"vite","build":"tsc --noEmit && vite build","preview":"vite preview","type-check":"tsc --noEmit","lint":"eslint src --ext .ts,.vue","lint:fix":"eslint src --ext .ts,.vue --fix","format":"prettier --write \"src/**/*.{ts,vue,css}\"","test":"vitest","test:ui":"vitest --ui","test:coverage":"vitest --coverage","prepublishOnly":"npm run lint && npm run type-check && npm run build"},"dependencies":{"iconify-icon":"^3.0.2","vue":"^3.4.0"},"devDependencies":{"@eslint/js":"^8.0.0","@vitejs/plugin-vue":"^5.0.0","@vitest/coverage-v8":"^1.0.4","@vitest/ui":"^1.0.4","@vue/test-utils":"^2.4.1","eslint":"^8.56.0","eslint-plugin-vue":"^9.0.0","jsdom":"^28.1.0","prettier":"^3.1.1","tailwindcss":"^3.4.1","terser":"^5.46.0","typescript":"^5.3.3","typescript-eslint":"^7.0.0","vite":"^5.0.8","vite-plugin-dts":"^4.0.0","vitest":"^1.0.4","vue-tsc":"^1.8.24"},"gitHead":"9eda296c8e2a270ca70e7df8b8a43fa704b60d36","_id":"@amulet-digital/vscodemock@1.0.2","_nodeVersion":"24.13.0","_npmVersion":"11.6.2","dist":{"integrity":"sha512-viX58d2CWbMB6mzifZUg/N7fY7Ge3RHCD2/N1dRqpYXws+4nc2y2rbv93zpSesCfmlL8WBMounhiycX/aI5kzQ==","shasum":"a2d18b432a0051d36e160371f22e566ef9486b79","tarball":"https://registry.npmjs.org/@amulet-digital/vscodemock/-/vscodemock-1.0.2.tgz","fileCount":19,"unpackedSize":83775,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCICGWzPAE4tbys7Dye7hUjPS+qWmElbd0Piz7bWHbdIjpAiBvvcUdJr3zNxJIdzXBCTXuUzU0MeO5KPOoQgEBmaq1PA=="}]},"_npmUser":{"name":"sndhl","email":"sndhl@pm.me"},"directories":{},"maintainers":[{"name":"sndhl","email":"sndhl@pm.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/vscodemock_1.0.2_1771483769791_0.8422560324371624"},"_hasShrinkwrap":false}},"time":{"created":"2026-02-19T06:39:15.065Z","modified":"2026-02-19T06:49:30.079Z","1.0.1":"2026-02-19T06:39:15.347Z","1.0.2":"2026-02-19T06:49:29.959Z"},"bugs":{"url":"https://github.com/Amulet-Digital/vscodemock/issues"},"author":{"name":"Amulet Digital"},"license":"MIT","homepage":"https://github.com/Amulet-Digital/vscodemock","keywords":["vscode","ide","ui","components","vue","vue3"],"repository":{"type":"git","url":"git+https://github.com/Amulet-Digital/vscodemock.git"},"description":"Reusable VSCode IDE component library. Barebones shell for building IDE-like interfaces.","maintainers":[{"name":"sndhl","email":"sndhl@pm.me"}],"readme":"# @amulet-digital/vscodemock\n\nA production-ready Vue 3 component library for building VSCode-like IDE interfaces. **WCAG AAA accessible**, fully typed, extensively tested.\n\n## ⭐ Features\n\n- **WCAG AAA Compliant** — Every component is fully keyboard accessible and screen-reader ready\n- **Composable Components** — Sidebar, TabBar, Editor, Terminal, StatusBar—all built with slots\n- **Type Safe** — 100% TypeScript, zero `any` types, strict mode enabled\n- **Fully Tested** — 80%+ line coverage, accessibility testing included\n- **No State Management** — Presentation-only; parent controls all state and logic\n- **Tailwind Ready** — Base styles easily themed and customized\n- **Vue 3 Composition API** — Modern, lightweight, tree-shakable\n\n## 📦 Installation\n\n```bash\nnpm install @amulet-digital/vscodemock\n```\n\n## 🚀 Quick Start\n\n### Full Shell\n\n```vue\n<template>\n  <VSCodeShell>\n    <template #sidebar>\n      <VSCodeSidebar :files=\"files\" @file-select=\"handleFileSelect\" />\n    </template>\n    \n    <template #editor>\n      <VSCodeTabBar :tabs=\"openTabs\" @close=\"handleCloseTab\" />\n      <VSCodeEditor :content=\"currentFileContent\" />\n    </template>\n    \n    <template #status-bar>\n      <VSCodeStatusBar :file-path=\"currentFilePath\" />\n    </template>\n  </VSCodeShell>\n</template>\n\n<script setup lang=\"ts\">\nimport { VSCodeShell, VSCodeSidebar, VSCodeTabBar, VSCodeEditor, VSCodeStatusBar } from '@amulet-digital/vscodemock'\nimport '@amulet-digital/vscodemock/css'\n</script>\n```\n\n### Individual Components\n\nEach component is independently composable:\n\n```vue\n<template>\n  <VSCodeSidebar :files=\"files\" @select=\"handleSelect\" />\n</template>\n\n<script setup lang=\"ts\">\nimport { VSCodeSidebar } from '@amulet-digital/vscodemock'\n</script>\n```\n\n## 📚 Components\n\n| Component | Purpose |\n|-----------|---------|\n| **VSCodeShell** | Root container with slots for sidebar, editor, status bar |\n| **VSCodeSidebar** | File explorer with tree navigation and selection |\n| **VSCodeTabBar** | Tab bar for managing open files |\n| **VSCodeEditor** | Editor viewport for displaying content |\n| **VSCodeTerminal** | Terminal emulator stub (ready for integration) |\n| **VSCodeStatusBar** | Bottom bar showing cursor position, language, metadata |\n\nAll components are:\n- ♿ Fully keyboard accessible\n- 🔊 Screen reader compatible\n- 🎨 Themeable with Tailwind CSS\n- 📝 Fully documented with TypeScript\n\n## 🎨 Styling & Theming\n\nComponents use Tailwind CSS. Customize by:\n\n1. **Override CSS variables** in your app\n2. **Extend Tailwind config** with custom colors/fonts\n3. **Pass class props** for per-instance overrides\n\n```vue\n<script setup lang=\"ts\">\nimport { VSCodeShell } from '@amulet-digital/vscodemock'\nimport '@amulet-digital/vscodemock/css'\n</script>\n\n<style>\n/* Override VSCode colors */\n:root {\n  --vscode-bg: #1e1e1e;\n  --vscode-fg: #d4d4d4;\n}\n</style>\n```\n\n## ♿ Accessibility\n\nComponents are **WCAG 2.1 Level AAA** compliant:\n\n- ✅ Keyboard navigation (Tab, Arrow keys, Enter, Escape)\n- ✅ Screen reader labels and live regions\n- ✅ 7:1 color contrast ratio\n- ✅ Focus management and indicators\n- ✅ Respects `prefers-reduced-motion`\n\nSee [ACCESSIBILITY.md](./ACCESSIBILITY.md) for detailed standards and testing guide.\n\n## 🧪 Testing\n\n```bash\n# Run all tests\nnpm run test\n\n# Watch mode\nnpm run test -- --watch\n\n# Coverage report\nnpm run test:coverage\n\n# Lint code\nnpm run lint\n\n# Format code\nnpm run format\n```\n\nSee [TESTING.md](./TESTING.md) for detailed testing guide.\n\n## 📖 Development\n\n```bash\n# Install dependencies\nnpm install\n\n# Dev server (hot reload)\nnpm run dev\n\n# Build library (generates types)\nnpm run build\n\n# Type check\nnpm run type-check\n\n# Preview built output\nnpm run preview\n\n# Run full pre-publish checks\nnpm run prepublishOnly\n```\n\n## 📦 Distribution\n\nPublished on npm with **dual builds**:\n\n- **ESM** — `dist/index.es.js` (recommended for modern bundlers)\n- **UMD** — `dist/index.umd.js` (for legacy environments)\n- **Types** — `dist/index.d.ts` (full TypeScript support)\n- **CSS** — `dist/style.css` (base styles)\n\n## 🔒 Security\n\nWe take security seriously. See [SECURITY.md](./SECURITY.md) for:\n\n- Reporting vulnerabilities\n- Dependency management\n- Security best practices\n\n## 🤝 Contributing\n\nWe welcome contributions! See [CONTRIBUTING.md](./CONTRIBUTING.md) for:\n\n- Code of conduct\n- Development setup\n- Pull request process\n- Style guide\n\n## 📝 License\n\nMIT © 2026 Amulet Digital\n\n---\n\n**Made with ♿ accessibility and 🔒 security in mind.**\n\nAmulet Digital — Signal integrity maintained • Archive Protocol\n","readmeFilename":"README.md"}