skillui 1.1.6 → 1.1.8
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.
- package/dist/cli.js +38 -18
- package/package.json +1 -1
package/dist/cli.js
CHANGED
|
@@ -104559,7 +104559,7 @@ gradient.pastel = pastel;
|
|
|
104559
104559
|
// src/ui.ts
|
|
104560
104560
|
var import_cli_progress = __toESM(require_cli_progress());
|
|
104561
104561
|
var path15 = __toESM(require("path"));
|
|
104562
|
-
var VERSION = "1.1.
|
|
104562
|
+
var VERSION = "1.1.8";
|
|
104563
104563
|
function padAnsi(str, width) {
|
|
104564
104564
|
const raw = stripAnsi(str);
|
|
104565
104565
|
return str + " ".repeat(Math.max(0, width - raw.length));
|
|
@@ -104804,17 +104804,17 @@ function showResults(data) {
|
|
|
104804
104804
|
}));
|
|
104805
104805
|
console.log("");
|
|
104806
104806
|
}
|
|
104807
|
-
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");
|
|
104808
104807
|
const nextSteps = [
|
|
104809
|
-
|
|
104808
|
+
source_default.dim(" Open Claude Code inside the design folder:"),
|
|
104809
|
+
" " + source_default.hex("#38bdf8")("cd " + projectName + "-design && claude"),
|
|
104810
104810
|
"",
|
|
104811
|
-
source_default.dim(" Then ask
|
|
104812
|
-
" " + source_default.dim('"Build me a UI that matches
|
|
104811
|
+
source_default.dim(" Claude will auto-read CLAUDE.md and SKILL.md. Then ask:"),
|
|
104812
|
+
" " + source_default.dim('"Build me a UI that matches this design system"')
|
|
104813
104813
|
].join("\n");
|
|
104814
104814
|
console.log(boxen(nextSteps, {
|
|
104815
104815
|
title: source_default.bold(" Next steps "),
|
|
104816
104816
|
borderStyle: "round",
|
|
104817
|
-
borderColor:
|
|
104817
|
+
borderColor: "green",
|
|
104818
104818
|
width: 76,
|
|
104819
104819
|
padding: { top: 0, bottom: 0, left: 0, right: 1 }
|
|
104820
104820
|
}));
|
|
@@ -104979,6 +104979,7 @@ program2.name("skillui").description("Reverse-engineer design systems from any p
|
|
|
104979
104979
|
skillFilePath = result.skillFile;
|
|
104980
104980
|
succeedSpinner(spSkill, ".skill package", skillFilePath);
|
|
104981
104981
|
skillInstalled = installSkillForClaude(result.skillDir, safeName);
|
|
104982
|
+
writeClaludeMd(result.skillDir, safeName, profile.projectName);
|
|
104982
104983
|
} catch (e) {
|
|
104983
104984
|
failSpinner(spSkill, ".skill package", e.message);
|
|
104984
104985
|
throw e;
|
|
@@ -105000,23 +105001,42 @@ program2.name("skillui").description("Reverse-engineer design systems from any p
|
|
|
105000
105001
|
}
|
|
105001
105002
|
});
|
|
105002
105003
|
program2.parse();
|
|
105004
|
+
function writeClaludeMd(skillDir, safeName, projectName) {
|
|
105005
|
+
try {
|
|
105006
|
+
const claudeMdPath = path16.join(skillDir, "CLAUDE.md");
|
|
105007
|
+
if (fs14.existsSync(claudeMdPath)) return;
|
|
105008
|
+
const content = `# ${projectName} Design System
|
|
105009
|
+
|
|
105010
|
+
This project uses the **${projectName}** design system extracted by skillui.
|
|
105011
|
+
|
|
105012
|
+
## How to use
|
|
105013
|
+
|
|
105014
|
+
Read \`SKILL.md\` in this directory for the full design system reference before writing any UI code.
|
|
105015
|
+
|
|
105016
|
+
Key files:
|
|
105017
|
+
- \`SKILL.md\` \u2014 master design reference (read this first)
|
|
105018
|
+
- \`references/DESIGN.md\` \u2014 extended tokens and component specs
|
|
105019
|
+
- \`references/ANIMATIONS.md\` \u2014 motion and keyframe specs
|
|
105020
|
+
- \`references/LAYOUT.md\` \u2014 grid and layout containers
|
|
105021
|
+
- \`references/COMPONENTS.md\` \u2014 DOM component patterns
|
|
105022
|
+
- \`screens/scroll/\` \u2014 scroll journey screenshots (study before implementing)
|
|
105023
|
+
|
|
105024
|
+
When building any UI, always read SKILL.md first and match colors, fonts, spacing, and motion exactly.
|
|
105025
|
+
`;
|
|
105026
|
+
fs14.writeFileSync(claudeMdPath, content, "utf-8");
|
|
105027
|
+
} catch {
|
|
105028
|
+
}
|
|
105029
|
+
}
|
|
105003
105030
|
function installSkillForClaude(skillDir, safeName) {
|
|
105004
105031
|
try {
|
|
105005
105032
|
const skillMdSrc = path16.join(skillDir, "SKILL.md");
|
|
105006
105033
|
if (!fs14.existsSync(skillMdSrc)) return false;
|
|
105007
|
-
let installed = false;
|
|
105008
105034
|
const homeDir = process.env.USERPROFILE || process.env.HOME || "";
|
|
105009
|
-
if (homeDir)
|
|
105010
|
-
|
|
105011
|
-
|
|
105012
|
-
|
|
105013
|
-
|
|
105014
|
-
}
|
|
105015
|
-
const localDir = path16.join(process.cwd(), ".claude", "skills");
|
|
105016
|
-
fs14.mkdirSync(localDir, { recursive: true });
|
|
105017
|
-
fs14.copyFileSync(skillMdSrc, path16.join(localDir, `${safeName}.md`));
|
|
105018
|
-
installed = true;
|
|
105019
|
-
return installed;
|
|
105035
|
+
if (!homeDir) return false;
|
|
105036
|
+
const destDir = path16.join(homeDir, ".claude", "skills", safeName);
|
|
105037
|
+
fs14.mkdirSync(destDir, { recursive: true });
|
|
105038
|
+
fs14.copyFileSync(skillMdSrc, path16.join(destDir, "SKILL.md"));
|
|
105039
|
+
return true;
|
|
105020
105040
|
} catch {
|
|
105021
105041
|
return false;
|
|
105022
105042
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "skillui",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.8",
|
|
4
4
|
"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.",
|
|
5
5
|
"main": "dist/cli.js",
|
|
6
6
|
"bin": {
|