diff --git a/ui-ux-pro-max/.github/workflows/tests.yml b/ui-ux-pro-max/.github/workflows/tests.yml index a6bdd0fd..69e0ed1c 100644 --- a/ui-ux-pro-max/.github/workflows/tests.yml +++ b/ui-ux-pro-max/.github/workflows/tests.yml @@ -5,6 +5,10 @@ on: paths: - '.claude/skills/**' - 'cli/assets/skills/**' + - 'cli/assets/templates/**' + - 'cli/src/**' + - 'cli/tests/**' + - 'src/ui-ux-pro-max/templates/**' - '.github/workflows/tests.yml' push: branches: [main] diff --git a/ui-ux-pro-max/README.md b/ui-ux-pro-max/README.md index 3fb27ad4..f8e66c08 100755 --- a/ui-ux-pro-max/README.md +++ b/ui-ux-pro-max/README.md @@ -585,6 +585,23 @@ rm -rf .windsurf/skills/ui-ux-pro-max # Windsurf rm -rf .agents/skills/ui-ux-pro-max # Antigravity / Codex ``` +### Claude.ai's "Upload a skill" dialog says "Zip contains too many files (maximum 200)" + +Do not upload the full GitHub repository ZIP. It is a development checkout that includes source code, CLI assets, documentation, previews, and multiple bundled skills, so it exceeds Claude's 200-file upload limit. It is not a Claude skill upload artifact, and this project does not currently publish a separate manual-upload ZIP for Claude.ai. + +For Claude Code, install through the Marketplace: + +```bash +/plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill +/plugin install ui-ux-pro-max@ui-ux-pro-max-skill +``` + +Or use the CLI installer: + +```bash +npx ui-ux-pro-max-cli init --ai claude +``` + ### Claude Marketplace install fails with "Zip file contains a symbolic link" This is a known issue with versions prior to v2.5.1. The repository used symlinks internally which some installation tools can't handle. **Fix:** use the CLI installer instead: diff --git a/ui-ux-pro-max/README.zh.md b/ui-ux-pro-max/README.zh.md index 6da831aa..b8ef9ac0 100644 --- a/ui-ux-pro-max/README.zh.md +++ b/ui-ux-pro-max/README.zh.md @@ -578,6 +578,23 @@ rm -rf .windsurf/skills/ui-ux-pro-max # Windsurf rm -rf .agents/skills/ui-ux-pro-max # Antigravity / Codex ``` +### Claude.ai 的“上传技能”对话框提示 "Zip contains too many files (maximum 200)" + +请勿上传完整的 GitHub 仓库 ZIP。该 ZIP 是开发用的代码仓库，包含源代码、CLI 资源、文档、预览以及多个打包的技能，因此会超出 Claude 的 200 个文件上传限制。它不是用于上传到 Claude 的技能安装包，并且本项目目前不提供用于手动上传到 Claude.ai 的单独 ZIP。 + +对于 Claude Code，请通过 Marketplace 安装： + +```bash +/plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill +/plugin install ui-ux-pro-max@ui-ux-pro-max-skill +``` + +也可以使用 CLI 安装器： + +```bash +npx ui-ux-pro-max-cli init --ai claude +``` + ### Claude Marketplace 安装失败，提示 "Zip file contains a symbolic link" 这是 v2.5.1 之前版本的已知问题。仓库内部使用了符号链接，某些安装工具无法处理。**解决办法：** 改用 CLI 安装器： diff --git a/ui-ux-pro-max/SOURCE.md b/ui-ux-pro-max/SOURCE.md index 812ce954..237865c2 100644 --- a/ui-ux-pro-max/SOURCE.md +++ b/ui-ux-pro-max/SOURCE.md @@ -1,8 +1,8 @@ # Source - Repo: https://github.com/nextlevelbuilder/ui-ux-pro-max-skill -- Ref: abb7f2fd5a083fa1ff55c326a963ff0d95c33f99 +- Ref: 97eb2a20032f0833e3d317162208a60385b0f96e - Remove-Paths: -- Snapshot: 2026-08-12 +- Snapshot: 2026-08-13 - Sync-Mode: render_skill - Notes: vendored into playbook branch thirdparty/skill diff --git a/ui-ux-pro-max/cli/assets/templates/base/skill-content.md b/ui-ux-pro-max/cli/assets/templates/base/skill-content.md index 55812a14..5c5735f4 100644 --- a/ui-ux-pro-max/cli/assets/templates/base/skill-content.md +++ b/ui-ux-pro-max/cli/assets/templates/base/skill-content.md @@ -54,7 +54,7 @@ Extract key information from user request: **Always start with `--design-system`** to get comprehensive recommendations with reasoning: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py " " --design-system [-p "Project Name"] +python3 {{SCRIPT_PATH}} " " --design-system [-p "Project Name"] ``` This command: @@ -65,7 +65,7 @@ This command: **Example:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "beauty spa wellness service" --design-system -p "Serenity Spa" +python3 {{SCRIPT_PATH}} "beauty spa wellness service" --design-system -p "Serenity Spa" ``` ### Step 2b: Persist Design System (Master + Overrides Pattern) @@ -73,7 +73,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "beauty spa wellness service" --d To save the design system for **hierarchical retrieval across sessions**, add `--persist`: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --persist -p "Project Name" +python3 {{SCRIPT_PATH}} "" --design-system --persist -p "Project Name" ``` This creates: @@ -82,7 +82,7 @@ This creates: **With page-specific override:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --persist -p "Project Name" --page "dashboard" +python3 {{SCRIPT_PATH}} "" --design-system --persist -p "Project Name" --page "dashboard" ``` This also creates: @@ -107,7 +107,7 @@ Now, generate the code... Three optional 1-10 sliders that tune `--design-system` output without changing your query. Add any combination of them to the same command: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --variance <1-10> --motion <1-10> --density <1-10> +python3 {{SCRIPT_PATH}} "" --design-system --variance <1-10> --motion <1-10> --density <1-10> ``` | Dial | Low (1-3) | Mid (4-7) | High (8-10) | @@ -122,7 +122,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --varia **Example:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "internal analytics dashboard" --design-system --variance 8 --motion 7 --density 8 -p "Ops Console" +python3 {{SCRIPT_PATH}} "internal analytics dashboard" --design-system --variance 8 --motion 7 --density 8 -p "Ops Console" ``` ### Step 3: Supplement with Detailed Searches (as needed) @@ -130,7 +130,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "internal analytics dashboard" -- After getting the design system, use domain searches to get additional details: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --domain [-n ] +python3 {{SCRIPT_PATH}} "" --domain [-n ] ``` **When to use detailed searches:** @@ -155,7 +155,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "" --domain [-n Get implementation-specific best practices for the user's stack: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --stack +python3 {{SCRIPT_PATH}} "" --stack ``` --- @@ -186,8 +186,8 @@ python3 skills/ui-ux-pro-max/scripts/search.py "" --stack **JavaFX enterprise examples:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "atlantafx primer enterprise theme" --stack javafx -python3 skills/ui-ux-pro-max/scripts/search.py "enterprise tableview density permission" --stack javafx +python3 {{SCRIPT_PATH}} "atlantafx primer enterprise theme" --stack javafx +python3 {{SCRIPT_PATH}} "enterprise tableview density permission" --stack javafx ``` --- @@ -205,7 +205,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "enterprise tableview density per ### Step 2: Generate Design System (REQUIRED) ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "AI search tool modern minimal" --design-system -p "AI Search" +python3 {{SCRIPT_PATH}} "AI search tool modern minimal" --design-system -p "AI Search" ``` **Output:** Complete design system with pattern, style, colors, typography, effects, and anti-patterns. @@ -214,16 +214,16 @@ python3 skills/ui-ux-pro-max/scripts/search.py "AI search tool modern minimal" - ```bash # Get style options for a modern tool product -python3 skills/ui-ux-pro-max/scripts/search.py "minimalism dark mode" --domain style +python3 {{SCRIPT_PATH}} "minimalism dark mode" --domain style # Get UX best practices for search interaction and loading -python3 skills/ui-ux-pro-max/scripts/search.py "search loading animation" --domain ux +python3 {{SCRIPT_PATH}} "search loading animation" --domain ux ``` ### Step 4: Stack Guidelines ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "list performance navigation" --stack react-native +python3 {{SCRIPT_PATH}} "list performance navigation" --stack react-native ``` **Then:** Synthesize design system + detailed searches and implement the design. @@ -236,10 +236,10 @@ The `--design-system` flag supports two output formats: ```bash # ASCII box (default) - best for terminal display -python3 skills/ui-ux-pro-max/scripts/search.py "fintech crypto" --design-system +python3 {{SCRIPT_PATH}} "fintech crypto" --design-system # Markdown - best for documentation -python3 skills/ui-ux-pro-max/scripts/search.py "fintech crypto" --design-system -f markdown +python3 {{SCRIPT_PATH}} "fintech crypto" --design-system -f markdown ``` --- diff --git a/ui-ux-pro-max/cli/src/utils/template.ts b/ui-ux-pro-max/cli/src/utils/template.ts index 67c29a2c..c6de4b38 100755 --- a/ui-ux-pro-max/cli/src/utils/template.ts +++ b/ui-ux-pro-max/cli/src/utils/template.ts @@ -139,6 +139,13 @@ export async function renderSkillFile(config: PlatformConfig, isGlobal = false): quickReferenceContent = await loadTemplate('base/quick-reference.md'); } + // scriptPath is relative to the platform root. Generated commands run from + // the user's project root, so local installs need the platform root prefix; + // global installs need the same path anchored at the user's home directory. + const rootedScriptPath = `${config.folderStructure.root}/${config.scriptPath}` + .replace(/\/{2,}/g, '/'); + const commandScriptPath = isGlobal ? `~/${rootedScriptPath}` : rootedScriptPath; + // Build the final content const frontmatter = renderFrontmatter(config.frontmatter); @@ -149,29 +156,10 @@ export async function renderSkillFile(config: PlatformConfig, isGlobal = false): content = content .replace(/\{\{TITLE\}\}/g, config.title) .replace(/\{\{DESCRIPTION\}\}/g, config.description) - .replace(/\{\{SCRIPT_PATH\}\}/g, config.scriptPath) + .replace(/\{\{SCRIPT_PATH\}\}/g, commandScriptPath) .replace(/\{\{SKILL_OR_WORKFLOW\}\}/g, config.skillOrWorkflow) .replace(/\{\{QUICK_REFERENCE\}\}/g, quickRefWithNewline); - // Rewrite the hardcoded default script path to the platform-specific path - const defaultScriptPath = 'skills/ui-ux-pro-max/scripts/search.py'; - if (config.scriptPath !== defaultScriptPath) { - content = content.replace( - new RegExp(defaultScriptPath.replace(/\//g, '\\/'), 'g'), - config.scriptPath - ); - } - - // For global install, rewrite relative script paths to absolute ~/root/ paths - if (isGlobal) { - const globalPrefix = `~/${config.folderStructure.root}/`; - // Match any platform's script path pattern (skills/, prompts/, steering/, etc.) - content = content.replace( - new RegExp(`python3 ${config.scriptPath.replace(/\//g, '\\/')}`, 'g'), - `python3 ${globalPrefix}${config.scriptPath}` - ); - } - return frontmatter + content; } diff --git a/ui-ux-pro-max/cli/tests/e2e/template-script-paths.spec.ts b/ui-ux-pro-max/cli/tests/e2e/template-script-paths.spec.ts new file mode 100644 index 00000000..c3a5cef9 --- /dev/null +++ b/ui-ux-pro-max/cli/tests/e2e/template-script-paths.spec.ts @@ -0,0 +1,32 @@ +import { expect, test } from '@playwright/test'; +import { loadPlatformConfig, renderSkillFile } from '../../src/utils/template.js'; + +const cases = [ + ['claude', '.claude/skills/ui-ux-pro-max/scripts/search.py'], + ['codex', '.agents/skills/ui-ux-pro-max/scripts/search.py'], + ['copilot', '.github/prompts/ui-ux-pro-max/scripts/search.py'], + ['kiro', '.kiro/steering/ui-ux-pro-max/scripts/search.py'], +] as const; +const SEARCH_COMMAND_COUNT = 16; + +function extractSearchScriptPaths(content: string): string[] { + return [...content.matchAll(/^python3\s+(\S*search\.py)\b/gm)].map(match => match[1]); +} + +for (const [platform, localPath] of cases) { + test(`${platform} renders project-root and global script paths`, async () => { + const config = await loadPlatformConfig(platform); + + const localContent = await renderSkillFile(config); + const localPaths = extractSearchScriptPaths(localContent); + expect(localPaths).toHaveLength(SEARCH_COMMAND_COUNT); + expect(new Set(localPaths)).toEqual(new Set([localPath])); + expect(localContent).not.toContain('{{SCRIPT_PATH}}'); + + const globalContent = await renderSkillFile(config, true); + const globalPaths = extractSearchScriptPaths(globalContent); + expect(globalPaths).toHaveLength(SEARCH_COMMAND_COUNT); + expect(new Set(globalPaths)).toEqual(new Set([`~/${localPath}`])); + expect(globalContent).not.toContain('{{SCRIPT_PATH}}'); + }); +} diff --git a/ui-ux-pro-max/docs/三个 data-scripts-templates 的区别.md b/ui-ux-pro-max/docs/三个 data-scripts-templates 的区别.md index fc849991..3cb36df1 100644 --- a/ui-ux-pro-max/docs/三个 data-scripts-templates 的区别.md +++ b/ui-ux-pro-max/docs/三个 data-scripts-templates 的区别.md @@ -5,26 +5,27 @@ | 位置 | 作用 | 能删吗 | |------|------|--------| | **src/ui-ux-pro-max/** | **唯一源码**。所有 CSV、脚本、模板都在这里改，是“唯一真相来源”。 | ❌ 不能删，这是你要维护的那一份。 | -| **.claude/skills/ui-ux-pro-max/** | 给 **Cursor / Claude Code** 用的 Skill。AI 从这里读 SKILL.md 和运行 `scripts/search.py`。设计上这里的 data、scripts 应是**指向 src 的符号链接**，这样不用维护两份。 | ❌ 不能删（否则 Skill 不工作）；但可以改成只链到 src，不保留副本。 | -| **cli/assets/** | 给 **npm 包 ui-ux-pro-max-cli** 打包用。用户执行 `npm i -g ui-ux-pro-max-cli` 再 `uipro init` 时，安装的是这里打包进去的 data/scripts/templates。 | ❌ 不能删；发布前用脚本从 src 同步过来即可。 | +| **.claude/skills/ui-ux-pro-max/** | 给 **Claude Code** 使用的 Skill。`SKILL.md` 手工维护；`data/` 和 `scripts/` 是从 `src` 同步的真实文件副本。 | ❌ 不能删，也不要改成符号链接；符号链接会在 Windows 的 Git 检出中失效。 | +| **cli/assets/** | 给 **npm 包 ui-ux-pro-max-cli** 打包用。用户执行 `npm i -g ui-ux-pro-max-cli` 再 `uipro init` 时，安装的是这里打包的 data/scripts/templates 和子 Skill。 | ❌ 不能删；发布前用脚本同步。 | ## 可以只保留一个吗？ - **不能**只保留一个“物理目录”：三处**用途不同**，都要存在。 -- **可以**只维护**一份内容**： - - 所有修改只在 **src/ui-ux-pro-max/** 里做。 - - .claude 里用**符号链接**指向 src → 不用在 .claude 里再维护 data/scripts。 - - 发布 CLI 前执行一次同步：把 src 拷到 cli/assets。 +- **只手工维护一份内容**：在 **src/ui-ux-pro-max/** 修改 data、scripts 和 templates，再用 `cli/scripts/sync-assets.mjs` 将它们复制到 `cli/assets/`，并将 data、scripts 复制到本地 Claude Skill 目录。 +- `.claude/skills/ui-ux-pro-max/SKILL.md` 是例外：它不由模板生成，需要直接维护。 -这样你日常只改 src，其它两处自动或按需跟上。 +这样 data、scripts 和 templates 只在 `src` 维护，镜像目录由同步脚本更新。 ## 推荐工作流 1. 只改 **src/ui-ux-pro-max/data/**、**scripts/**、**templates/**。 -2. .claude/skills 下的 data、scripts 用 symlink 指回 src（见下方「恢复符号链接」）。 -3. 发布 npm 前执行： +2. 不要直接修改 `cli/assets/data/`、`cli/assets/scripts/` 或 `.claude/skills/ui-ux-pro-max/{data,scripts}/`。 +3. 提交或发布 npm 前执行： + ```bash cd cli npm run sync:assets npm run check:assets ``` + + `check:assets` 也由 “Check asset sync” CI 工作流执行。 diff --git a/ui-ux-pro-max/src/ui-ux-pro-max/templates/base/skill-content.md b/ui-ux-pro-max/src/ui-ux-pro-max/templates/base/skill-content.md index 55812a14..5c5735f4 100644 --- a/ui-ux-pro-max/src/ui-ux-pro-max/templates/base/skill-content.md +++ b/ui-ux-pro-max/src/ui-ux-pro-max/templates/base/skill-content.md @@ -54,7 +54,7 @@ Extract key information from user request: **Always start with `--design-system`** to get comprehensive recommendations with reasoning: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py " " --design-system [-p "Project Name"] +python3 {{SCRIPT_PATH}} " " --design-system [-p "Project Name"] ``` This command: @@ -65,7 +65,7 @@ This command: **Example:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "beauty spa wellness service" --design-system -p "Serenity Spa" +python3 {{SCRIPT_PATH}} "beauty spa wellness service" --design-system -p "Serenity Spa" ``` ### Step 2b: Persist Design System (Master + Overrides Pattern) @@ -73,7 +73,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "beauty spa wellness service" --d To save the design system for **hierarchical retrieval across sessions**, add `--persist`: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --persist -p "Project Name" +python3 {{SCRIPT_PATH}} "" --design-system --persist -p "Project Name" ``` This creates: @@ -82,7 +82,7 @@ This creates: **With page-specific override:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --persist -p "Project Name" --page "dashboard" +python3 {{SCRIPT_PATH}} "" --design-system --persist -p "Project Name" --page "dashboard" ``` This also creates: @@ -107,7 +107,7 @@ Now, generate the code... Three optional 1-10 sliders that tune `--design-system` output without changing your query. Add any combination of them to the same command: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --variance <1-10> --motion <1-10> --density <1-10> +python3 {{SCRIPT_PATH}} "" --design-system --variance <1-10> --motion <1-10> --density <1-10> ``` | Dial | Low (1-3) | Mid (4-7) | High (8-10) | @@ -122,7 +122,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "" --design-system --varia **Example:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "internal analytics dashboard" --design-system --variance 8 --motion 7 --density 8 -p "Ops Console" +python3 {{SCRIPT_PATH}} "internal analytics dashboard" --design-system --variance 8 --motion 7 --density 8 -p "Ops Console" ``` ### Step 3: Supplement with Detailed Searches (as needed) @@ -130,7 +130,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "internal analytics dashboard" -- After getting the design system, use domain searches to get additional details: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --domain [-n ] +python3 {{SCRIPT_PATH}} "" --domain [-n ] ``` **When to use detailed searches:** @@ -155,7 +155,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "" --domain [-n Get implementation-specific best practices for the user's stack: ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "" --stack +python3 {{SCRIPT_PATH}} "" --stack ``` --- @@ -186,8 +186,8 @@ python3 skills/ui-ux-pro-max/scripts/search.py "" --stack **JavaFX enterprise examples:** ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "atlantafx primer enterprise theme" --stack javafx -python3 skills/ui-ux-pro-max/scripts/search.py "enterprise tableview density permission" --stack javafx +python3 {{SCRIPT_PATH}} "atlantafx primer enterprise theme" --stack javafx +python3 {{SCRIPT_PATH}} "enterprise tableview density permission" --stack javafx ``` --- @@ -205,7 +205,7 @@ python3 skills/ui-ux-pro-max/scripts/search.py "enterprise tableview density per ### Step 2: Generate Design System (REQUIRED) ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "AI search tool modern minimal" --design-system -p "AI Search" +python3 {{SCRIPT_PATH}} "AI search tool modern minimal" --design-system -p "AI Search" ``` **Output:** Complete design system with pattern, style, colors, typography, effects, and anti-patterns. @@ -214,16 +214,16 @@ python3 skills/ui-ux-pro-max/scripts/search.py "AI search tool modern minimal" - ```bash # Get style options for a modern tool product -python3 skills/ui-ux-pro-max/scripts/search.py "minimalism dark mode" --domain style +python3 {{SCRIPT_PATH}} "minimalism dark mode" --domain style # Get UX best practices for search interaction and loading -python3 skills/ui-ux-pro-max/scripts/search.py "search loading animation" --domain ux +python3 {{SCRIPT_PATH}} "search loading animation" --domain ux ``` ### Step 4: Stack Guidelines ```bash -python3 skills/ui-ux-pro-max/scripts/search.py "list performance navigation" --stack react-native +python3 {{SCRIPT_PATH}} "list performance navigation" --stack react-native ``` **Then:** Synthesize design system + detailed searches and implement the design. @@ -236,10 +236,10 @@ The `--design-system` flag supports two output formats: ```bash # ASCII box (default) - best for terminal display -python3 skills/ui-ux-pro-max/scripts/search.py "fintech crypto" --design-system +python3 {{SCRIPT_PATH}} "fintech crypto" --design-system # Markdown - best for documentation -python3 skills/ui-ux-pro-max/scripts/search.py "fintech crypto" --design-system -f markdown +python3 {{SCRIPT_PATH}} "fintech crypto" --design-system -f markdown ``` ---