@iamdangavin/claude-skill-vitepress-docs 2.1.0 → 3.0.1

package/{skill/SKILL.md → commands/vitedocs/init.md}

@@ -1,7 +1,7 @@
 ---
-name: vitepress:docs
-description: VitePress documentation suite — setup GitHub Pages deployment, generate docs from a codebase, capture screenshots of any running app, and sync docs as code changes.
-argument-hint: [mode: setup|generate|screenshot|sync] or omit to be prompted
+name: vitedocs:init
+description: VitePress documentation suite — prompts for which mode to run and proceeds directly.
+argument-hint: [setup|generate|screenshot|sync|brand|update] or omit to be prompted
 allowed-tools:
   - Read
   - Write
@@ -12,11 +12,11 @@ allowed-tools:
   - AskUserQuestion
 ---
 
-# Skill: vitepress:docs
+# vitedocs:init
 
-Four modes for full VitePress documentation lifecycle. If no mode is given as an argument, use AskUserQuestion to prompt for one:
+If a mode was passed as an argument, proceed directly to that mode's instructions below. Otherwise use AskUserQuestion:
 
-- header: "vitepress:docs"
+- header: "vitedocs"
 - question: "Which mode do you need?"
 - options:
   - "setup — Wire up VitePress + GitHub Actions for Pages deployment"
@@ -24,7 +24,9 @@ Four modes for full VitePress documentation lifecycle. If no mode is given as an
   - "screenshot — Capture real screenshots and replace placeholders"
   - "sync — Detect code drift and update docs that are out of date"
   - "brand — Configure colors, fonts, logo, and visual identity"
-  - "update — Retrofit an existing docs setup with the latest components and dependencies"
+  - "update — Retrofit an existing docs setup with the latest components"
+
+Once a mode is selected, execute that mode's full instructions inline — do not ask the user to run a different command. The complete instructions for every mode follow below.
 
 ---
 
@@ -161,7 +163,7 @@ Present the relevant checklist as plain text, then use AskUserQuestion to confir
   - "Not yet — I need more time"
   - "I have a question"
 
-If "Not yet": tell the user to run `/vitepress:docs setup` again when ready and exit.
+If "Not yet": tell the user to run `/vitedocs:setup` again when ready and exit.
 If "I have a question": answer it, then re-ask this question.
 
 The checklist to present (tailor to their answers):
@@ -673,7 +675,6 @@ const currentSample = computed(() => {
   return ''
 })
 
-// Map tab names to highlight.js language identifiers
 const tabLang = {
   'Fetch': 'javascript',
   'Axios': 'javascript',
@@ -792,7 +793,7 @@ Add `docs-manifest.json` to `.vitepress/` entry in `.gitignore`.
 
 ```
 Generated X pages (Y user-facing, Z developer).
-Created N placeholder screenshots — run /vitepress:docs screenshot when ready to capture real images.
+Created N placeholder screenshots — run /vitedocs:screenshot when ready to capture real images.
 Filled M of P gaps — X remaining gap comments left in files for manual review.
 ```
 
@@ -824,8 +825,8 @@ const OUTPUT = 'FILL_IN_OUTPUT_PATH';
 const scanlines = [];
 for (let y = 0; y < H; y++) {
   const row = Buffer.alloc(1 + W * 3);
-  row[0] = 0;        // filter type: None
-  row.fill(0x88, 1); // grey RGB pixels
+  row[0] = 0;
+  row.fill(0x88, 1);
   scanlines.push(row);
 }
 const raw = Buffer.concat(scanlines);
@@ -852,7 +853,7 @@ function makeChunk(type, data) {
 const sig = Buffer.from([137,80,78,71,13,10,26,10]);
 const ihdr = Buffer.alloc(13);
 ihdr.writeUInt32BE(W, 0); ihdr.writeUInt32BE(H, 4);
-ihdr[8] = 8; ihdr[9] = 2; // 8-bit RGB
+ihdr[8] = 8; ihdr[9] = 2;
 
 mkdirSync(dirname(OUTPUT), { recursive: true });
 writeFileSync(OUTPUT, Buffer.concat([
@@ -935,7 +936,7 @@ import { chromium } from '/opt/homebrew/lib/node_modules/playwright/index.mjs';
 
 **⛔ Credential rule — NEVER write credentials to any file.** Do not write them to a script file, `.env`, the manifest, or anywhere on disk. All Playwright scripts run as inline bash heredocs — credentials are passed directly as inline values to `page.fill()` calls within the heredoc and exist only in memory for the duration of the command. If Playwright needs credentials in a reusable way, use a saved storage state file — but prompt the user for credentials fresh each time rather than caching them.
 
-**For pages requiring auth:** if credentials were provided, drive a login flow before navigating to the target URL. If no credentials were given, skip auth-gated pages and list them in the final summary so the user can run screenshot mode again with credentials.
+**For pages requiring auth:** if credentials were provided, drive a login flow before navigating to the target URL. If no credentials were given, skip auth-gated pages and list them in the final summary so the user can run `/vitedocs:screenshot` again with credentials.
 
 **Standard capture script template:**
 
@@ -955,9 +956,7 @@ SCRIPT
 
 Adjust `SETTLE_MS` based on stack type: WordPress/non-SPA → `500`, Next.js/SPA → `2000`–`4000`.
 
-Never write the script to a file — always use the heredoc form above. This applies to auth flows too: inline all credential usage directly in the heredoc, never in a file.
-
-After each capture, display the image inline with the Read tool so the user can verify it before moving on.
+Never write the script to a file — always use the heredoc form above.
 
 ### Step 4 — Rewrite prose around captured images
 
@@ -977,7 +976,7 @@ Captured X of Y screenshots.
 
 Rewrote prose in X doc pages.
 
-Run /vitepress:docs sync after future code changes to keep docs current.
+Run /vitedocs:sync after future code changes to keep docs current.
 ```
 
 ---
@@ -1060,7 +1059,7 @@ Update `lastSynced` and `syncHash` for all updated pages. Update the top-level `
 ```
 Updated X of N drifted pages.
   X gap comments added for manual review.
-  Y screenshots flagged for recapture — run /vitepress:docs screenshot when ready.
+  Y screenshots flagged for recapture — run /vitedocs:screenshot when ready.
 ```
 
 ---
@@ -1215,17 +1214,17 @@ Run the local dev server to preview: npm run dev
 
 ## Mode: update
 
-Retrofits an existing VitePress docs setup with the latest components, dependencies, and theme wiring from this skill. Does not re-run setup or regenerate pages.
+Retrofits an existing VitePress docs setup with the latest components, dependencies, and theme wiring. Does not re-run setup or regenerate pages.
 
 ### Step 1 — Locate docs paths
 
-Scan the current working directory and any known focus paths for `.vitepress/config.mjs` (or `.ts`) files. List what was found and ask the user to confirm which paths to upgrade.
+Scan the current working directory and any known focus paths for `.vitepress/config.mjs` (or `.ts`) files. List what was found and ask the user to confirm which paths to update.
 
 ### Step 2 — Inventory current state
 
 For each confirmed docs path, check what is already present:
 
-- `.vitepress/components/ApiEndpoint.vue` — exists? version detectable?
+- `.vitepress/components/ApiEndpoint.vue` — exists?
 - `.vitepress/theme/index.js` — exists? includes `medium-zoom`? includes `ApiEndpoint`?
 - `.vitepress/theme/index.css` — exists? includes `.medium-zoom-overlay` z-index rules?
 - `package.json` — are `medium-zoom` and `highlight.js` listed in dependencies?
@@ -1267,7 +1266,7 @@ If `ApiEndpoint.vue` is being written or updated and no existing `apiBase` is in
 
 Skip U-Q1 and U-Q2 if `apiBase` already exists in `.vitepress/config.mjs` `themeConfig` — infer `apiBase` and existing tabs from the config and the current `ApiEndpoint.vue`.
 
-### Step 4 — Apply upgrades
+### Step 4 — Apply updates
 
 Apply only the items selected (or all missing/outdated items if "Everything" was chosen). Always read existing files before editing — never overwrite unrelated content.
 
@@ -1295,7 +1294,7 @@ Do not remove or overwrite existing entries.
 - If `ApiEndpoint` registration is absent (and `apiBase` is configured), add the import and `app.component()` call
 - Never remove existing registrations or setup logic
 
-Use this as the reference template for the full correct state of `index.js`:
+Reference template for the full correct state:
 ```js
 import DefaultTheme from 'vitepress/theme'
 import { onMounted, watch, nextTick } from 'vue'
@@ -1318,27 +1317,18 @@ export default {
 }
 ```
 
-**`.vitepress/config.mjs`** — if `apiBase` was collected and is not already in `themeConfig`, add it:
-```js
-themeConfig: {
-  apiBase: 'API_BASE_URL',
-  // ...existing themeConfig
-}
-```
+**`.vitepress/config.mjs`** — if `apiBase` was collected and is not already in `themeConfig`, add it.
 
 ### Step 5 — Summary
 
 ```
-Upgraded X of Y docs path(s).
+Updated X of Y docs path(s).
 
 Changes applied:
-  PATH/.vitepress/components/ApiEndpoint.vue  — written (tabs: Fetch, cURL, PHP)
+  PATH/.vitepress/components/ApiEndpoint.vue  — written
   PATH/.vitepress/theme/index.js              — merged medium-zoom + ApiEndpoint
   PATH/.vitepress/theme/index.css             — added z-index rules
   PATH/package.json                           — installed medium-zoom, highlight.js
-
-No changes needed:
-  PATH/.vitepress/config.mjs                  — apiBase already present
 ```
 
 ---

package/install.js

@@ -1,17 +1,30 @@
 #!/usr/bin/env node
-import { mkdirSync, copyFileSync } from 'fs';
+import { mkdirSync, copyFileSync, readdirSync, rmSync, existsSync } from 'fs';
 import { join, dirname } from 'path';
 import { homedir } from 'os';
 import { fileURLToPath } from 'url';
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
+const home = homedir();
 
-const skillName = 'vitepress-docs';
-const dest = join(homedir(), '.claude', 'skills', skillName);
+// Remove old skill location if it exists
+const oldSkill = join(home, '.claude', 'skills', 'vitepress-docs');
+if (existsSync(oldSkill)) {
+  rmSync(oldSkill, { recursive: true });
+  console.log(`  ✓ Removed old skill at ${oldSkill}`);
+}
+
+// Install new commands
+const src = join(__dirname, 'commands', 'vitedocs');
+const dest = join(home, '.claude', 'commands', 'vitedocs');
 
 mkdirSync(dest, { recursive: true });
-copyFileSync(join(__dirname, 'skill', 'SKILL.md'), join(dest, 'SKILL.md'));
+
+const files = readdirSync(src).filter(f => f.endsWith('.md'));
+for (const file of files) {
+  copyFileSync(join(src, file), join(dest, file));
+}
 
 console.log(`✓ Installed @iamdangavin/claude-skill-vitepress-docs`);
-console.log(`  → ${dest}/SKILL.md`);
-console.log(`  Invoke with: /vitepress-docs in Claude Code`);
+console.log(`  → ${dest}/`);
+console.log(`  Invoke with: /vitedocs:init in Claude Code`);

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@iamdangavin/claude-skill-vitepress-docs",
-  "version": "2.1.0",
-  "description": "Installs the vitepress:docs Claude Code skill — VitePress docs setup, generation, screenshots, and sync.",
+  "version": "3.0.1",
+  "description": "Installs the vitedocs: Claude Code skill suite — VitePress docs setup, generate, screenshot, sync, brand, and update.",
   "type": "module",
   "bin": {
     "claude-skill-vitepress-docs": "./install.js"
   },
   "files": [
     "install.js",
-    "skill/"
+    "commands/"
   ],
   "keywords": [
     "claude",