skillui 1.1.2 → 1.1.4

package/dist/modes/dir.js

@@ -1,213 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.runDirMode = runDirMode;
-const framework_1 = require("../extractors/framework");
-const tailwind_1 = require("../extractors/tokens/tailwind");
-const css_1 = require("../extractors/tokens/css");
-const tokens_file_1 = require("../extractors/tokens/tokens-file");
-const components_1 = require("../extractors/components");
-const normalizer_1 = require("../normalizer");
-/**
- * DIR mode: scan a local project directory and extract design tokens.
- */
-async function runDirMode(projectDir, nameOverride) {
-    // Step 1: Detect frameworks
-    const frameworks = (0, framework_1.detectFrameworks)(projectDir);
-    const projectName = (0, framework_1.getProjectName)(projectDir, nameOverride);
-    // Step 2: Detect project libraries (icons, state, animations)
-    const libraries = (0, components_1.detectProjectLibraries)(projectDir);
-    // Step 3: Extract raw tokens from all sources (priority order)
-    const tailwindTokens = (0, tailwind_1.extractTailwindTokens)(projectDir);
-    const tokensFileTokens = (0, tokens_file_1.extractTokensFile)(projectDir);
-    const cssTokens = (0, css_1.extractCSSTokens)(projectDir);
-    // Merge all raw tokens
-    const merged = mergeRawTokens([tailwindTokens, tokensFileTokens, cssTokens]);
-    // Step 4: Extract components
-    const components = (0, components_1.extractComponents)(projectDir);
-    // Step 5: Scan component files for additional color/font tokens
-    for (const comp of components) {
-        extractComponentTokens(comp, merged);
-    }
-    // Step 6: Collect animation tokens from components
-    for (const comp of components) {
-        if (comp.hasAnimation) {
-            for (const detail of comp.animationDetails) {
-                if (detail.startsWith('framer-motion')) {
-                    merged.animations.push({
-                        name: 'framer-motion',
-                        type: 'framer-motion',
-                        value: detail,
-                        source: comp.filePath,
-                    });
-                }
-                else if (detail.startsWith('spring:')) {
-                    merged.animations.push({
-                        name: 'spring-config',
-                        type: 'spring',
-                        value: detail.replace('spring: ', ''),
-                        source: comp.filePath,
-                    });
-                }
-                else if (detail.startsWith('tw-animate-')) {
-                    merged.animations.push({
-                        name: detail.replace('tw-', ''),
-                        type: 'css-keyframe',
-                        value: detail,
-                        source: comp.filePath,
-                    });
-                }
-            }
-        }
-    }
-    // Step 7: Normalize into clean DesignProfile
-    return (0, normalizer_1.normalize)(projectName, frameworks, merged, components, libraries);
-}
-function mergeRawTokens(sources) {
-    const merged = {
-        colors: [],
-        fonts: [],
-        spacingValues: [],
-        shadows: [],
-        cssVariables: [],
-        breakpoints: [],
-        borderRadii: [],
-        gradients: [],
-        fontVarMap: {},
-        animations: [],
-        darkModeVars: [],
-        zIndexValues: [],
-        containerMaxWidth: null,
-        fontSources: [],
-        pageSections: [],
-        transitionDurations: [],
-        transitionEasings: [],
-    };
-    for (const src of sources) {
-        // Merge colors, deduplicating by hex value
-        for (const color of src.colors) {
-            const existing = merged.colors.find(c => c.value === color.value);
-            if (existing) {
-                existing.frequency += color.frequency;
-                if (color.name && !existing.name)
-                    existing.name = color.name;
-            }
-            else {
-                merged.colors.push({ ...color });
-            }
-        }
-        // Merge fonts
-        for (const font of src.fonts) {
-            if (font.family && !merged.fonts.find(f => f.family === font.family && f.size === font.size)) {
-                merged.fonts.push({ ...font });
-            }
-        }
-        // Merge spacing
-        merged.spacingValues.push(...src.spacingValues);
-        // Merge shadows
-        for (const shadow of src.shadows) {
-            if (!merged.shadows.find(s => s.value === shadow.value)) {
-                merged.shadows.push({ ...shadow });
-            }
-        }
-        // Merge CSS variables
-        for (const v of src.cssVariables) {
-            if (!merged.cssVariables.find(cv => cv.name === v.name)) {
-                merged.cssVariables.push({ ...v });
-            }
-        }
-        // Merge breakpoints (prefer tailwind over css)
-        for (const bp of src.breakpoints) {
-            if (!merged.breakpoints.find(b => b.value === bp.value)) {
-                merged.breakpoints.push({ ...bp });
-            }
-        }
-        // Merge border radii
-        if (src.borderRadii) {
-            for (const r of src.borderRadii) {
-                if (!merged.borderRadii.includes(r))
-                    merged.borderRadii.push(r);
-            }
-        }
-        // Merge gradients
-        if (src.gradients) {
-            merged.gradients.push(...src.gradients);
-        }
-        // Merge font var map
-        if (src.fontVarMap) {
-            Object.assign(merged.fontVarMap, src.fontVarMap);
-        }
-        // Merge animations
-        if (src.animations) {
-            merged.animations.push(...src.animations);
-        }
-        // Merge dark mode vars
-        if (src.darkModeVars) {
-            for (const dmv of src.darkModeVars) {
-                if (!merged.darkModeVars.find(d => d.variable === dmv.variable)) {
-                    merged.darkModeVars.push(dmv);
-                }
-            }
-        }
-        // Merge z-index values
-        if (src.zIndexValues) {
-            for (const z of src.zIndexValues) {
-                if (!merged.zIndexValues.includes(z))
-                    merged.zIndexValues.push(z);
-            }
-        }
-        // Container max-width: prefer explicit
-        if (src.containerMaxWidth && !merged.containerMaxWidth) {
-            merged.containerMaxWidth = src.containerMaxWidth;
-        }
-        // Merge font sources
-        if (src.fontSources) {
-            for (const fs of src.fontSources) {
-                if (!merged.fontSources.find(f => f.family === fs.family && f.src === fs.src)) {
-                    merged.fontSources.push(fs);
-                }
-            }
-        }
-        // Merge page sections
-        if (src.pageSections) {
-            for (const ps of src.pageSections) {
-                if (!merged.pageSections.find(p => p.type === ps.type)) {
-                    merged.pageSections.push(ps);
-                }
-            }
-        }
-        // Merge transition durations/easings
-        if (src.transitionDurations) {
-            for (const d of src.transitionDurations) {
-                if (!merged.transitionDurations.includes(d))
-                    merged.transitionDurations.push(d);
-            }
-        }
-        if (src.transitionEasings) {
-            for (const e of src.transitionEasings) {
-                if (!merged.transitionEasings.includes(e))
-                    merged.transitionEasings.push(e);
-            }
-        }
-    }
-    return merged;
-}
-function extractComponentTokens(comp, tokens) {
-    if (comp.jsxSnippet) {
-        const hexMatches = comp.jsxSnippet.matchAll(/#([0-9a-fA-F]{3,6})\b/g);
-        for (const m of hexMatches) {
-            let hex = m[0].toLowerCase();
-            if (hex.length === 4) {
-                const [, r, g, b] = hex.split('');
-                hex = `#${r}${r}${g}${g}${b}${b}`;
-            }
-            const existing = tokens.colors.find(c => c.value === hex);
-            if (existing) {
-                existing.frequency++;
-            }
-            else {
-                tokens.colors.push({ value: hex, frequency: 1, source: 'component' });
-            }
-        }
-    }
-}
-//# sourceMappingURL=dir.js.map

package/dist/modes/repo.d.ts

@@ -1,6 +0,0 @@
-import { DesignProfile } from '../types';
-/**
- * REPO mode: clone a git repo into a temp directory, then run dir mode.
- */
-export declare function runRepoMode(repoUrl: string, nameOverride?: string): Promise<DesignProfile>;
-//# sourceMappingURL=repo.d.ts.map

package/dist/modes/repo.js

@@ -1,76 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.runRepoMode = runRepoMode;
-const tmp = __importStar(require("tmp"));
-const dir_1 = require("./dir");
-/**
- * REPO mode: clone a git repo into a temp directory, then run dir mode.
- */
-async function runRepoMode(repoUrl, nameOverride) {
-    // Import simple-git
-    const { simpleGit } = await Promise.resolve().then(() => __importStar(require('simple-git')));
-    const git = simpleGit();
-    // Create temp directory
-    const tmpDir = tmp.dirSync({ unsafeCleanup: true, prefix: 'skillui-' });
-    const cloneDir = tmpDir.name;
-    try {
-        process.stdout.write('  Cloning...');
-        await git.clone(repoUrl, cloneDir, ['--depth', '1', '--single-branch']);
-        console.log(' \u2713');
-        // Derive project name from repo URL if not overridden
-        const derivedName = nameOverride || deriveRepoName(repoUrl);
-        // Run dir mode on the cloned repo
-        const profile = await (0, dir_1.runDirMode)(cloneDir, derivedName);
-        return profile;
-    }
-    finally {
-        // Cleanup temp directory
-        try {
-            tmpDir.removeCallback();
-        }
-        catch {
-            // Best effort cleanup
-        }
-    }
-}
-function deriveRepoName(url) {
-    // Handle GitHub URLs: https://github.com/org/repo or git@github.com:org/repo.git
-    const match = url.match(/\/([^\/]+?)(?:\.git)?$/);
-    if (match)
-        return match[1];
-    return 'project';
-}
-//# sourceMappingURL=repo.js.map

package/dist/modes/ultra.d.ts

@@ -1,22 +0,0 @@
-import { DesignProfile } from '../types';
-import { UltraOptions, UltraResult } from '../types-ultra';
-/**
- * Ultra mode orchestrator.
- *
- * Runs AFTER the normal url mode pipeline. Adds:
- * - screens/pages/      — full-page screenshots per crawled page
- * - screens/sections/   — clipped section screenshots per page
- * - screens/states/     — hover/focus state screenshots per interactive element
- * - screens/scroll/     — 7 scroll-journey screenshots + video first frames
- * - references/LAYOUT.md
- * - references/INTERACTIONS.md
- * - references/COMPONENTS.md
- * - references/ANIMATIONS.md  ← NEW: cinematic animation documentation
- * - tokens/colors.json
- * - tokens/spacing.json
- * - tokens/typography.json
- *
- * All existing outputs remain untouched.
- */
-export declare function runUltraMode(url: string, profile: DesignProfile, skillDir: string, opts: UltraOptions): Promise<UltraResult>;
-//# sourceMappingURL=ultra.d.ts.map

package/dist/modes/ultra.js

@@ -1,281 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.runUltraMode = runUltraMode;
-const fs = __importStar(require("fs"));
-const path = __importStar(require("path"));
-const pages_1 = require("../extractors/ultra/pages");
-const interactions_1 = require("../extractors/ultra/interactions");
-const layout_1 = require("../extractors/ultra/layout");
-const components_dom_1 = require("../extractors/ultra/components-dom");
-const animations_1 = require("../extractors/ultra/animations");
-const layout_md_1 = require("../writers/layout-md");
-const interactions_md_1 = require("../writers/interactions-md");
-const components_md_1 = require("../writers/components-md");
-const animations_md_1 = require("../writers/animations-md");
-const tokens_json_1 = require("../writers/tokens-json");
-const playwright_loader_1 = require("../playwright-loader");
-/**
- * Ultra mode orchestrator.
- *
- * Runs AFTER the normal url mode pipeline. Adds:
- * - screens/pages/      — full-page screenshots per crawled page
- * - screens/sections/   — clipped section screenshots per page
- * - screens/states/     — hover/focus state screenshots per interactive element
- * - screens/scroll/     — 7 scroll-journey screenshots + video first frames
- * - references/LAYOUT.md
- * - references/INTERACTIONS.md
- * - references/COMPONENTS.md
- * - references/ANIMATIONS.md  ← NEW: cinematic animation documentation
- * - tokens/colors.json
- * - tokens/spacing.json
- * - tokens/typography.json
- *
- * All existing outputs remain untouched.
- */
-async function runUltraMode(url, profile, skillDir, opts) {
-    // Ensure all output directories exist
-    fs.mkdirSync(path.join(skillDir, 'screens', 'pages'), { recursive: true });
-    fs.mkdirSync(path.join(skillDir, 'screens', 'sections'), { recursive: true });
-    fs.mkdirSync(path.join(skillDir, 'screens', 'states'), { recursive: true });
-    fs.mkdirSync(path.join(skillDir, 'screens', 'scroll'), { recursive: true });
-    fs.mkdirSync(path.join(skillDir, 'references'), { recursive: true });
-    fs.mkdirSync(path.join(skillDir, 'tokens'), { recursive: true });
-    const hasPlaywright = (0, playwright_loader_1.loadPlaywright)() !== null;
-    if (!hasPlaywright) {
-        process.stdout.write('\n  ⚠  Playwright not found — ultra visual features skipped\n');
-        process.stdout.write('     Fix: npm install -g playwright && npx playwright install chromium\n\n');
-        (0, tokens_json_1.writeTokensJson)(profile, skillDir);
-        writeStubs(skillDir);
-        const emptyAnim = emptyAnimResult();
-        return { pageScreenshots: [], sectionScreenshots: [], interactions: [], layouts: [], domComponents: [], animations: emptyAnim };
-    }
-    // ── Step 1: Animation extraction (scroll journey + keyframes + libraries) ──
-    process.stdout.write('  Extracting animations & scroll journey...');
-    const animations = await (0, animations_1.captureAnimations)(url, skillDir);
-    console.log(` ✓ (${animations.keyframes.length} keyframes · ${animations.scrollFrames.length} scroll frames · ${animations.libraries.length} libs)`);
-    // ── Step 2: Multi-page screenshots + section clips ─────────────────────
-    process.stdout.write(`  Crawling ${opts.screens} pages...`);
-    const { pages, sections } = await (0, pages_1.capturePageScreenshots)(url, skillDir, opts.screens);
-    console.log(` ✓ (${pages.length} pages · ${sections.length} sections)`);
-    // ── Step 3: Micro-interactions ────────────────────────────────────────
-    process.stdout.write('  Capturing interactions...');
-    const interactions = await (0, interactions_1.captureInteractions)(url, skillDir);
-    console.log(` ✓ (${interactions.length} components)`);
-    // ── Step 4: Layout extraction ──────────────────────────────────────────
-    process.stdout.write('  Extracting layout...');
-    const layouts = await (0, layout_1.extractLayouts)(url);
-    console.log(` ✓ (${layouts.length} containers)`);
-    // ── Step 5: DOM component detection ───────────────────────────────────
-    process.stdout.write('  Detecting DOM components...');
-    const domComponents = await (0, components_dom_1.detectDOMComponents)(url);
-    console.log(` ✓ (${domComponents.length} patterns)`);
-    // ── Step 6: Write all reference files ─────────────────────────────────
-    process.stdout.write('  Writing extended outputs...');
-    const refsDir = path.join(skillDir, 'references');
-    // ANIMATIONS.md — cinematic motion documentation
-    const animMd = (0, animations_md_1.generateAnimationsMd)(animations, profile);
-    fs.writeFileSync(path.join(refsDir, 'ANIMATIONS.md'), animMd, 'utf-8');
-    // LAYOUT.md
-    const layoutMd = (0, layout_md_1.generateLayoutMd)(layouts, profile);
-    fs.writeFileSync(path.join(refsDir, 'LAYOUT.md'), layoutMd, 'utf-8');
-    // INTERACTIONS.md
-    const interactionsMd = (0, interactions_md_1.generateInteractionsMd)(interactions, profile);
-    fs.writeFileSync(path.join(refsDir, 'INTERACTIONS.md'), interactionsMd, 'utf-8');
-    // COMPONENTS.md
-    const componentsMd = (0, components_md_1.generateComponentsMd)(domComponents, profile);
-    fs.writeFileSync(path.join(refsDir, 'COMPONENTS.md'), componentsMd, 'utf-8');
-    // Token JSON files
-    (0, tokens_json_1.writeTokensJson)(profile, skillDir);
-    // VISUAL_GUIDE.md — master visual reference embedding all screenshots
-    const visualGuideMd = generateVisualGuideMd(profile, pages, sections, animations);
-    fs.writeFileSync(path.join(refsDir, 'VISUAL_GUIDE.md'), visualGuideMd, 'utf-8');
-    // Ultra screenshot index
-    writeScreensIndex(pages, sections, animations, skillDir);
-    console.log(' ✓');
-    // ── Print ultra summary ────────────────────────────────────────────────
-    printUltraSummary(animations);
-    return { pageScreenshots: pages, sectionScreenshots: sections, interactions, layouts, domComponents, animations };
-}
-// ── Visual Guide Generator ────────────────────────────────────────────
-function generateVisualGuideMd(profile, pages, sections, anim) {
-    let md = `# ${profile.projectName} — Visual Guide\n\n`;
-    md += `> Master visual reference. Study every screenshot carefully before implementing any UI.\n`;
-    md += `> Match colors, layout, typography, spacing, and motion states exactly.\n\n`;
-    // Animation stack summary
-    if (anim.libraries.length > 0) {
-        const libs = anim.libraries.map(l => `**${l.name}**`).join(', ');
-        md += `**Motion Stack:** ${libs}\n\n`;
-    }
-    if (anim.webglDetected) {
-        md += `**WebGL/3D:** Detected (${anim.canvasCount} canvas elements) — replicate with Three.js or CSS 3D transforms\n\n`;
-    }
-    // Scroll journey — most important section
-    if (anim.scrollFrames.length > 0) {
-        md += `## Scroll Journey\n\n`;
-        md += `The page has cinematic scroll animations. Each screenshot below shows the exact visual state at that scroll depth.\n`;
-        md += `**Replicate these transitions precisely** — the design changes dramatically as you scroll.\n\n`;
-        for (const frame of anim.scrollFrames) {
-            const relPath = `../screens/scroll/${path.basename(frame.filePath)}`;
-            const label = frame.scrollPercent === 0 ? 'Hero — Above the fold'
-                : frame.scrollPercent === 100 ? 'Footer — End of page'
-                    : `${frame.scrollPercent}% scroll depth`;
-            md += `### ${label}\n\n`;
-            md += `*Scroll position: ${frame.scrollY}px of ${frame.pageHeight}px total*\n\n`;
-            md += `![${label}](${relPath})\n\n`;
-        }
-    }
-    // Video backgrounds
-    if (anim.videos.some(v => v.firstFramePath)) {
-        md += `## Video Backgrounds\n\n`;
-        md += `These videos play as background elements. Use first-frame as poster image while video loads.\n\n`;
-        for (const v of anim.videos.filter(vv => vv.firstFramePath)) {
-            const relPath = `../screens/scroll/${path.basename(v.firstFramePath)}`;
-            md += `### Video ${v.index} (${v.role})\n\n`;
-            if (v.src)
-                md += `*Source: \`${v.src.slice(0, 80)}...\`*\n\n`;
-            md += `![Video ${v.index} first frame](${relPath})\n\n`;
-        }
-    }
-    // Page screenshots
-    if (pages.length > 0) {
-        md += `## Full Page Screenshots\n\n`;
-        for (const p of pages) {
-            const relPath = `../screens/pages/${path.basename(p.filePath)}`;
-            md += `### ${p.title}\n\n`;
-            md += `*URL: \`${p.url}\`*\n\n`;
-            md += `![${p.title}](${relPath})\n\n`;
-        }
-    }
-    // Section clips
-    if (sections.length > 0) {
-        md += `## Section Screenshots\n\n`;
-        md += `Clipped sections showing individual components in context.\n\n`;
-        for (const s of sections) {
-            const relPath = `../screens/sections/${path.basename(s.filePath)}`;
-            md += `### Section ${s.index} — \`${s.selector}\`\n\n`;
-            md += `*${s.width}×${s.height}px*\n\n`;
-            md += `![Section ${s.index}](${relPath})\n\n`;
-        }
-    }
-    return md;
-}
-// ── Helpers ───────────────────────────────────────────────────────────
-function printUltraSummary(anim) {
-    const libs = anim.libraries.map(l => l.name).join(', ') || 'none';
-    console.log('');
-    console.log(`  Animation Stack: ${libs}`);
-    if (anim.webglDetected)
-        console.log(`  WebGL/3D: detected (${anim.canvasCount} canvas elements)`);
-    if (anim.videos.length > 0) {
-        const bg = anim.videos.filter(v => v.role === 'background').length;
-        console.log(`  Video: ${anim.videos.length} elements (${bg} background)`);
-    }
-    if (anim.lottieCount > 0)
-        console.log(`  Lottie: ${anim.lottieCount} players`);
-    if (anim.keyframes.length > 0)
-        console.log(`  Keyframes: ${anim.keyframes.length} extracted`);
-    if (anim.scrollPatterns.length > 0)
-        console.log(`  Scroll patterns: ${anim.scrollPatterns.length} types`);
-}
-function writeScreensIndex(pages, sections, anim, skillDir) {
-    let md = `# Screenshot Index\n\n`;
-    // Scroll journey (most important for animation sites)
-    if (anim.scrollFrames.length > 0) {
-        md += `## Scroll Journey\n\n`;
-        md += `> Shows the cinematic state at each point of the page\n\n`;
-        md += `| Scroll | Y Position | File |\n`;
-        md += `|--------|-----------|------|\n`;
-        for (const f of anim.scrollFrames) {
-            md += `| ${f.scrollPercent}% | ${f.scrollY}px | \`${f.filePath}\` |\n`;
-        }
-        md += `\n`;
-    }
-    // Video frames
-    if (anim.videos.some(v => v.firstFramePath)) {
-        md += `## Video First Frames\n\n`;
-        for (const v of anim.videos) {
-            if (v.firstFramePath) {
-                md += `- Video ${v.index} (${v.role}): \`${v.firstFramePath}\`\n`;
-            }
-        }
-        md += `\n`;
-    }
-    if (pages.length > 0) {
-        md += `## Pages\n\n`;
-        md += `| Page | URL | File |\n`;
-        md += `|------|-----|------|\n`;
-        for (const p of pages) {
-            md += `| ${p.title} | \`${p.url}\` | \`${p.filePath}\` |\n`;
-        }
-        md += `\n`;
-    }
-    if (sections.length > 0) {
-        md += `## Sections\n\n`;
-        md += `| Page | Section | File |\n`;
-        md += `|------|---------|------|\n`;
-        for (const s of sections) {
-            md += `| ${s.page} | #${s.index} (${s.selector}) | \`${s.filePath}\` |\n`;
-        }
-        md += `\n`;
-    }
-    fs.writeFileSync(path.join(skillDir, 'screens', 'INDEX.md'), md, 'utf-8');
-}
-function writeStubs(skillDir) {
-    const refsDir = path.join(skillDir, 'references');
-    const note = '> Install Playwright to enable: `npm install playwright && npx playwright install chromium`\n\nRun `skillui --url <url> --mode ultra` after installing.\n';
-    for (const file of ['ANIMATIONS.md', 'LAYOUT.md', 'INTERACTIONS.md', 'COMPONENTS.md']) {
-        const filePath = path.join(refsDir, file);
-        if (!fs.existsSync(filePath)) {
-            const title = file.replace('.md', '').replace(/-/g, ' ');
-            fs.writeFileSync(filePath, `# ${title} Reference\n\n${note}`, 'utf-8');
-        }
-    }
-}
-function emptyAnimResult() {
-    return {
-        keyframes: [],
-        scrollFrames: [],
-        libraries: [],
-        videos: [],
-        scrollPatterns: [],
-        animationVars: [],
-        globalTransitions: [],
-        canvasCount: 0,
-        webglDetected: false,
-        lottieCount: 0,
-    };
-}
-//# sourceMappingURL=ultra.js.map

package/dist/modes/url.d.ts

@@ -1,14 +0,0 @@
-import { DesignProfile } from '../types';
-/**
- * URL mode: crawl a live website and extract design tokens.
- *
- * Strategy:
- * 1. ALWAYS fetch HTML + linked CSS via HTTP (no Playwright needed)
- * 2. If Playwright is available, ALSO extract computed styles from live DOM
- * 3. Merge both token sets for maximum coverage
- */
-export declare function runUrlMode(url: string, nameOverride?: string, skillDir?: string): Promise<{
-    profile: DesignProfile;
-    screenshotPath: string | null;
-}>;
-//# sourceMappingURL=url.d.ts.map