skillui 1.1.6 → 1.1.7

package/dist/cli.js

@@ -104559,7 +104559,7 @@ gradient.pastel = pastel;
 // src/ui.ts
 var import_cli_progress = __toESM(require_cli_progress());
 var path15 = __toESM(require("path"));
-var VERSION = "1.1.6";
+var VERSION = "1.1.7";
 function padAnsi(str, width) {
   const raw = stripAnsi(str);
   return str + " ".repeat(Math.max(0, width - raw.length));
@@ -104804,17 +104804,17 @@ function showResults(data) {
     }));
     console.log("");
   }
-  const skillLine = skillInstalled ? source_default.hex("#4ade80")("  \u2713 Skill auto-installed") + source_default.dim(" \u2014 type ") + source_default.hex("#38bdf8")("/skills") + source_default.dim(" in Claude Code to see it") : source_default.dim("  Copy SKILL.md to ") + source_default.hex("#38bdf8")("~/.claude/skills/" + projectName + ".md");
   const nextSteps = [
-    skillLine,
+    source_default.dim("  Open Claude Code inside the design folder:"),
+    "    " + source_default.hex("#38bdf8")("cd " + projectName + "-design && claude"),
     "",
-    source_default.dim("  Then ask Claude:"),
-    "    " + source_default.dim('"Build me a UI that matches the ' + projectName + ' design system"')
+    source_default.dim("  Claude will auto-read CLAUDE.md and SKILL.md. Then ask:"),
+    "    " + source_default.dim('"Build me a UI that matches this design system"')
   ].join("\n");
   console.log(boxen(nextSteps, {
     title: source_default.bold(" Next steps "),
     borderStyle: "round",
-    borderColor: skillInstalled ? "green" : "yellow",
+    borderColor: "green",
     width: 76,
     padding: { top: 0, bottom: 0, left: 0, right: 1 }
   }));
@@ -104979,6 +104979,7 @@ program2.name("skillui").description("Reverse-engineer design systems from any p
         skillFilePath = result.skillFile;
         succeedSpinner(spSkill, ".skill package", skillFilePath);
         skillInstalled = installSkillForClaude(result.skillDir, safeName);
+        writeClaludeMd(result.skillDir, safeName, profile.projectName);
       } catch (e) {
         failSpinner(spSkill, ".skill package", e.message);
         throw e;
@@ -105000,6 +105001,32 @@ program2.name("skillui").description("Reverse-engineer design systems from any p
   }
 });
 program2.parse();
+function writeClaludeMd(skillDir, safeName, projectName) {
+  try {
+    const claudeMdPath = path16.join(skillDir, "CLAUDE.md");
+    if (fs14.existsSync(claudeMdPath)) return;
+    const content = `# ${projectName} Design System
+
+This project uses the **${projectName}** design system extracted by skillui.
+
+## How to use
+
+Read \`SKILL.md\` in this directory for the full design system reference before writing any UI code.
+
+Key files:
+- \`SKILL.md\` \u2014 master design reference (read this first)
+- \`references/DESIGN.md\` \u2014 extended tokens and component specs
+- \`references/ANIMATIONS.md\` \u2014 motion and keyframe specs
+- \`references/LAYOUT.md\` \u2014 grid and layout containers
+- \`references/COMPONENTS.md\` \u2014 DOM component patterns
+- \`screens/scroll/\` \u2014 scroll journey screenshots (study before implementing)
+
+When building any UI, always read SKILL.md first and match colors, fonts, spacing, and motion exactly.
+`;
+    fs14.writeFileSync(claudeMdPath, content, "utf-8");
+  } catch {
+  }
+}
 function installSkillForClaude(skillDir, safeName) {
   try {
     const skillMdSrc = path16.join(skillDir, "SKILL.md");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "skillui",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "description": "Reverse-engineer design systems from any website, repo, or project. Extracts colors, fonts, spacing, animations, and components — packaged as a .skill file for Claude. Pure static analysis, zero AI, zero API keys.",
   "main": "dist/cli.js",
   "bin": {