design-clone 2.1.0 → 2.3.0
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/README.md +13 -34
- package/SKILL.md +69 -45
- package/bin/cli.js +22 -4
- package/bin/commands/clone-site.js +31 -171
- package/bin/commands/help.js +19 -6
- package/bin/commands/init.js +9 -86
- package/bin/commands/uninstall.js +105 -0
- package/bin/commands/update.js +70 -0
- package/bin/commands/verify.js +7 -14
- package/bin/utils/paths.js +28 -0
- package/bin/utils/validate.js +2 -22
- package/bin/utils/version.js +23 -0
- package/docs/code-standards.md +789 -0
- package/docs/codebase-summary.md +533 -286
- package/docs/index.md +74 -0
- package/docs/project-overview-pdr.md +797 -0
- package/docs/system-architecture.md +718 -0
- package/package.json +14 -17
- package/src/ai/prompts/design-tokens/basic.md +80 -0
- package/src/ai/prompts/design-tokens/section-with-css.md +41 -0
- package/src/ai/prompts/design-tokens/section.md +48 -0
- package/src/ai/prompts/design-tokens/with-css.md +87 -0
- package/src/ai/prompts/structure-analysis/basic.md +55 -0
- package/src/ai/prompts/structure-analysis/with-context.md +59 -0
- package/src/ai/prompts/structure-analysis/with-dimensions.md +63 -0
- package/src/ai/prompts/structure-analysis/with-hierarchy.md +73 -0
- package/src/ai/prompts/ux-audit/aggregation.md +42 -0
- package/src/ai/prompts/ux-audit/desktop.md +92 -0
- package/src/ai/prompts/ux-audit/mobile.md +93 -0
- package/src/ai/prompts/ux-audit/tablet.md +92 -0
- package/src/core/animation/animation-extractor-ast.js +183 -0
- package/src/core/animation/animation-extractor-output.js +152 -0
- package/src/core/animation/animation-extractor.js +178 -0
- package/src/core/animation/state-capture-detection.js +200 -0
- package/src/core/animation/state-capture.js +193 -0
- package/src/core/capture/browser-context-pool.js +96 -0
- package/src/core/capture/multi-page-screenshot-page.js +110 -0
- package/src/core/capture/multi-page-screenshot.js +208 -0
- package/src/core/capture/screenshot-extraction.js +186 -0
- package/src/core/capture/screenshot-helpers.js +175 -0
- package/src/core/capture/screenshot-orchestrator.js +174 -0
- package/src/core/capture/screenshot-viewport.js +93 -0
- package/src/core/capture/screenshot.js +192 -0
- package/src/core/content/content-counter-dom.js +191 -0
- package/src/core/content/content-counter.js +76 -0
- package/src/core/css/breakpoint-detector.js +66 -0
- package/src/core/css/chromium-defaults.json +23 -0
- package/src/core/css/computed-style-extractor.js +102 -0
- package/src/core/css/css-chunker.js +103 -0
- package/src/core/css/filter-css-dead-code.js +120 -0
- package/src/core/css/filter-css-html-analyzer.js +110 -0
- package/src/core/css/filter-css-selector-matcher.js +172 -0
- package/src/core/css/filter-css.js +206 -0
- package/src/core/css/merge-css-atrule-processor.js +158 -0
- package/src/core/css/merge-css-file-io.js +68 -0
- package/src/core/css/merge-css.js +148 -0
- package/src/core/detection/framework-detector-routing.js +68 -0
- package/src/core/detection/framework-detector-signals.js +65 -0
- package/src/core/detection/framework-detector.js +198 -0
- package/src/core/dimension/dimension-extractor-card-detector.js +82 -0
- package/src/core/dimension/dimension-extractor.js +317 -0
- package/src/core/dimension/dimension-output-ai-summary.js +111 -0
- package/src/core/dimension/dimension-output.js +173 -0
- package/src/core/dimension/dom-tree-analyzer-tree-builders.js +95 -0
- package/src/core/dimension/dom-tree-analyzer.js +191 -0
- package/src/core/discovery/app-state-snapshot-capture.js +195 -0
- package/src/core/discovery/app-state-snapshot-utils.js +178 -0
- package/src/core/discovery/app-state-snapshot.js +131 -0
- package/src/core/discovery/discover-pages-routes.js +84 -0
- package/src/core/discovery/discover-pages-utils.js +177 -0
- package/src/core/discovery/discover-pages.js +191 -0
- package/src/core/html/html-extractor-inline-styler.js +70 -0
- package/src/core/html/html-extractor.js +147 -0
- package/src/core/html/semantic-enhancer-mappings.js +200 -0
- package/src/core/html/semantic-enhancer-page.js +148 -0
- package/src/core/html/semantic-enhancer.js +135 -0
- package/src/core/links/rewrite-links-css-rewriter.js +53 -0
- package/src/core/links/rewrite-links.js +173 -0
- package/src/core/media/asset-validator.js +118 -0
- package/src/core/media/extract-assets-downloader.js +187 -0
- package/src/core/media/extract-assets-page-scraper.js +115 -0
- package/src/core/media/extract-assets.js +159 -0
- package/src/core/media/video-capture-convert.js +200 -0
- package/src/core/media/video-capture.js +201 -0
- package/src/core/{lazy-loader.js → page-prep/lazy-loader.js} +37 -39
- package/src/core/section/section-cropper-helpers.js +43 -0
- package/src/core/{section-cropper.js → section/section-cropper.js} +11 -88
- package/src/core/section/section-detector-strategies.js +139 -0
- package/src/core/section/section-detector-utils.js +100 -0
- package/src/core/section/section-detector.js +88 -0
- package/src/core/tests/test-section-cropper.js +2 -2
- package/src/core/tests/test-section-detector.js +2 -2
- package/src/post-process/enhance-assets.js +29 -4
- package/src/post-process/fetch-images-unsplash-client.js +123 -0
- package/src/post-process/fetch-images.js +60 -263
- package/src/post-process/inject-gosnap.js +88 -0
- package/src/post-process/inject-icons-svg-replacer.js +76 -0
- package/src/post-process/inject-icons.js +47 -200
- package/src/route-discoverers/base-discoverer-utils.js +137 -0
- package/src/route-discoverers/base-discoverer.js +29 -118
- package/src/route-discoverers/index.js +1 -1
- package/src/shared/config.js +38 -0
- package/src/shared/error-codes.js +31 -0
- package/src/shared/viewports.js +46 -0
- package/src/utils/browser.js +0 -7
- package/src/utils/helpers.js +4 -0
- package/src/utils/log.js +12 -0
- package/src/utils/playwright-loader.js +76 -0
- package/src/utils/playwright.js +3 -69
- package/src/utils/progress.js +32 -0
- package/src/verification/generate-audit-report-css-fixes.js +52 -0
- package/src/verification/generate-audit-report-sections.js +158 -0
- package/src/verification/generate-audit-report.js +5 -281
- package/src/verification/quality-scorer.js +92 -0
- package/src/verification/verify-footer-checks.js +103 -0
- package/src/verification/verify-footer-helpers.js +178 -0
- package/src/verification/verify-footer.js +23 -381
- package/src/verification/verify-header-checks.js +104 -0
- package/src/verification/verify-header-helpers.js +156 -0
- package/src/verification/verify-header.js +23 -365
- package/src/verification/verify-layout-report.js +101 -0
- package/src/verification/verify-layout.js +13 -259
- package/src/verification/verify-menu-checks.js +104 -0
- package/src/verification/verify-menu-helpers.js +112 -0
- package/src/verification/verify-menu.js +17 -285
- package/src/verification/verify-slider-checks.js +115 -0
- package/src/verification/verify-slider-constants.js +65 -0
- package/src/verification/verify-slider-helpers.js +164 -0
- package/src/verification/verify-slider.js +23 -414
- package/.env.example +0 -14
- package/docs/basic-clone.md +0 -63
- package/docs/cli-reference.md +0 -316
- package/docs/design-clone-architecture.md +0 -492
- package/docs/pixel-perfect.md +0 -117
- package/docs/project-roadmap.md +0 -382
- package/docs/troubleshooting.md +0 -170
- package/requirements.txt +0 -5
- package/src/ai/__pycache__/analyze-structure.cpython-313.pyc +0 -0
- package/src/ai/__pycache__/extract-design-tokens.cpython-313.pyc +0 -0
- package/src/ai/analyze-structure.py +0 -375
- package/src/ai/extract-design-tokens.py +0 -782
- package/src/ai/prompts/__init__.py +0 -2
- package/src/ai/prompts/__pycache__/__init__.cpython-313.pyc +0 -0
- package/src/ai/prompts/__pycache__/design_tokens.cpython-313.pyc +0 -0
- package/src/ai/prompts/__pycache__/structure_analysis.cpython-313.pyc +0 -0
- package/src/ai/prompts/__pycache__/ux_audit.cpython-313.pyc +0 -0
- package/src/ai/prompts/design_tokens.py +0 -316
- package/src/ai/prompts/structure_analysis.py +0 -592
- package/src/ai/prompts/ux_audit.py +0 -198
- package/src/ai/ux-audit.js +0 -596
- package/src/core/animation-extractor.js +0 -526
- package/src/core/app-state-snapshot.js +0 -511
- package/src/core/content-counter.js +0 -342
- package/src/core/design-tokens.js +0 -103
- package/src/core/dimension-extractor.js +0 -438
- package/src/core/dimension-output.js +0 -305
- package/src/core/discover-pages.js +0 -542
- package/src/core/dom-tree-analyzer.js +0 -298
- package/src/core/extract-assets.js +0 -468
- package/src/core/filter-css.js +0 -499
- package/src/core/framework-detector.js +0 -538
- package/src/core/html-extractor.js +0 -212
- package/src/core/merge-css.js +0 -407
- package/src/core/multi-page-screenshot.js +0 -380
- package/src/core/rewrite-links.js +0 -226
- package/src/core/screenshot.js +0 -701
- package/src/core/section-detector.js +0 -386
- package/src/core/semantic-enhancer.js +0 -492
- package/src/core/state-capture.js +0 -598
- package/src/core/video-capture.js +0 -546
- package/src/utils/__init__.py +0 -16
- package/src/utils/__pycache__/__init__.cpython-313.pyc +0 -0
- package/src/utils/__pycache__/env.cpython-313.pyc +0 -0
- package/src/utils/env.py +0 -134
- /package/src/core/{css-extractor.js → css/css-extractor.js} +0 -0
- /package/src/core/{cookie-handler.js → page-prep/cookie-handler.js} +0 -0
- /package/src/core/{page-readiness.js → page-prep/page-readiness.js} +0 -0
package/bin/commands/verify.js
CHANGED
|
@@ -2,18 +2,16 @@
|
|
|
2
2
|
* Verify command - check installation status
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
import fs from 'fs/promises';
|
|
6
5
|
import path from 'path';
|
|
7
6
|
import { exists } from '../utils/copy.js';
|
|
8
7
|
import { runAllChecks } from '../utils/validate.js';
|
|
9
|
-
|
|
10
|
-
const getSkillDir = () => path.join(process.env.HOME || process.env.USERPROFILE || '', '.claude/skills/design-clone');
|
|
8
|
+
import { getSkillDest } from '../utils/paths.js';
|
|
11
9
|
|
|
12
10
|
/**
|
|
13
11
|
* Verify skill installation
|
|
14
12
|
*/
|
|
15
13
|
export async function verify() {
|
|
16
|
-
const SKILL_DIR =
|
|
14
|
+
const SKILL_DIR = getSkillDest();
|
|
17
15
|
let allOk = true;
|
|
18
16
|
|
|
19
17
|
console.log('design-clone skill verification\n');
|
|
@@ -30,13 +28,10 @@ export async function verify() {
|
|
|
30
28
|
// Check required files
|
|
31
29
|
const requiredFiles = [
|
|
32
30
|
'SKILL.md',
|
|
33
|
-
'src/core/screenshot.js',
|
|
34
|
-
'src/core/filter-css.js',
|
|
35
|
-
'src/ai/analyze-structure.py',
|
|
31
|
+
'src/core/capture/screenshot.js',
|
|
32
|
+
'src/core/css/filter-css.js',
|
|
36
33
|
'src/utils/browser.js',
|
|
37
|
-
'src/utils/env.js'
|
|
38
|
-
'src/utils/env.py',
|
|
39
|
-
'requirements.txt'
|
|
34
|
+
'src/utils/env.js'
|
|
40
35
|
];
|
|
41
36
|
|
|
42
37
|
let filesOk = true;
|
|
@@ -64,17 +59,15 @@ export async function verify() {
|
|
|
64
59
|
const checks = await runAllChecks();
|
|
65
60
|
|
|
66
61
|
console.log(` Node.js: ${checks.node.ok ? '✓' : '✗'} ${checks.node.message}`);
|
|
67
|
-
console.log(` Python: ${checks.python.ok ? '✓' : '✗'} ${checks.python.message}`);
|
|
68
62
|
console.log(` Playwright: ${checks.playwright.ok ? '✓' : '✗'} ${checks.playwright.message}`);
|
|
69
63
|
console.log(` Chrome: ${checks.chrome.ok ? '✓' : '○'} ${checks.chrome.message}${checks.playwright.ok ? ' (optional with Playwright)' : ''}`);
|
|
70
64
|
|
|
71
65
|
if (!checks.node.ok) allOk = false;
|
|
72
66
|
if (!checks.playwright.ok && !checks.chrome.ok) allOk = false;
|
|
73
67
|
|
|
74
|
-
// Check
|
|
68
|
+
// Check optional features
|
|
75
69
|
console.log('\nOptional:');
|
|
76
|
-
|
|
77
|
-
console.log(` GEMINI_API_KEY: ${geminiKey ? '✓ set' : '○ not set (AI analysis disabled)'}`);
|
|
70
|
+
console.log(` AI analysis: ✓ built-in (Claude Code vision)`);
|
|
78
71
|
|
|
79
72
|
// Check .env files
|
|
80
73
|
const envLocations = [
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Shared path helpers for CLI commands
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
import path from 'path';
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* Get user home directory or exit if not available
|
|
9
|
+
* @returns {string} Home directory path
|
|
10
|
+
*/
|
|
11
|
+
export function getHomeDir() {
|
|
12
|
+
const home = process.env.HOME || process.env.USERPROFILE;
|
|
13
|
+
if (!home) {
|
|
14
|
+
console.error('Error: HOME environment variable is not set.');
|
|
15
|
+
process.exit(1);
|
|
16
|
+
}
|
|
17
|
+
return home;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
/** Skill installation directory: ~/.claude/skills/design-clone */
|
|
21
|
+
export function getSkillDest() {
|
|
22
|
+
return path.join(getHomeDir(), '.claude/skills/design-clone');
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
/** Slash commands directory: ~/.claude/commands/design */
|
|
26
|
+
export function getCommandsDest() {
|
|
27
|
+
return path.join(getHomeDir(), '.claude/commands/design');
|
|
28
|
+
}
|
package/bin/utils/validate.js
CHANGED
|
@@ -26,25 +26,6 @@ export async function checkNode() {
|
|
|
26
26
|
}
|
|
27
27
|
}
|
|
28
28
|
|
|
29
|
-
/**
|
|
30
|
-
* Check Python version
|
|
31
|
-
* @returns {Promise<{ok: boolean, version: string, message: string}>}
|
|
32
|
-
*/
|
|
33
|
-
export async function checkPython() {
|
|
34
|
-
try {
|
|
35
|
-
const { stdout } = await exec('python3 --version');
|
|
36
|
-
const version = stdout.trim().replace('Python ', '');
|
|
37
|
-
const [major, minor] = version.split('.').map(Number);
|
|
38
|
-
|
|
39
|
-
if (major >= 3 && minor >= 9) {
|
|
40
|
-
return { ok: true, version, message: `Python ${version}` };
|
|
41
|
-
}
|
|
42
|
-
return { ok: false, version, message: `Python ${version} (requires >=3.9)` };
|
|
43
|
-
} catch {
|
|
44
|
-
return { ok: false, version: 'unknown', message: 'Python 3 not found' };
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
|
|
48
29
|
/**
|
|
49
30
|
* Check Chrome/Chromium
|
|
50
31
|
* @returns {Promise<{ok: boolean, path: string, message: string}>}
|
|
@@ -127,12 +108,11 @@ export async function checkPlaywright() {
|
|
|
127
108
|
* @returns {Promise<Object>}
|
|
128
109
|
*/
|
|
129
110
|
export async function runAllChecks() {
|
|
130
|
-
const [node,
|
|
111
|
+
const [node, chrome, playwright] = await Promise.all([
|
|
131
112
|
checkNode(),
|
|
132
|
-
checkPython(),
|
|
133
113
|
checkChrome(),
|
|
134
114
|
checkPlaywright()
|
|
135
115
|
]);
|
|
136
116
|
|
|
137
|
-
return { node,
|
|
117
|
+
return { node, chrome, playwright };
|
|
138
118
|
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Version utility - reads version from package.json
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
import { readFileSync } from 'fs';
|
|
6
|
+
import { resolve, dirname } from 'path';
|
|
7
|
+
import { fileURLToPath } from 'url';
|
|
8
|
+
|
|
9
|
+
const __dirname = dirname(fileURLToPath(import.meta.url));
|
|
10
|
+
|
|
11
|
+
/**
|
|
12
|
+
* Get package version from package.json
|
|
13
|
+
* @returns {string} Version string (e.g., "2.1.0")
|
|
14
|
+
*/
|
|
15
|
+
export function getVersion() {
|
|
16
|
+
try {
|
|
17
|
+
const pkgPath = resolve(__dirname, '../../package.json');
|
|
18
|
+
const pkg = JSON.parse(readFileSync(pkgPath, 'utf-8'));
|
|
19
|
+
return pkg.version;
|
|
20
|
+
} catch {
|
|
21
|
+
return 'unknown';
|
|
22
|
+
}
|
|
23
|
+
}
|