skillui 1.1.2 → 1.1.4

package/dist/extractors/tokens/tailwind.d.ts

@@ -1,3 +0,0 @@
-import { RawTokens } from '../../types';
-export declare function extractTailwindTokens(projectDir: string): RawTokens;
-//# sourceMappingURL=tailwind.d.ts.map

package/dist/extractors/tokens/tailwind.js

@@ -1,353 +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.extractTailwindTokens = extractTailwindTokens;
-const fs = __importStar(require("fs"));
-const path = __importStar(require("path"));
-const TAILWIND_CONFIG_FILES = [
-    'tailwind.config.js',
-    'tailwind.config.ts',
-    'tailwind.config.mjs',
-    'tailwind.config.cjs',
-];
-// Tailwind v3 default spacing scale (in rem, converted to px at 16px base)
-const TAILWIND_DEFAULT_SPACING_PX = [
-    0, 1, 2, 4, 5, 6, 7, 8, 10, 11, 12, 14, 16, 20, 24, 28, 32, 36, 40, 44, 48, 52, 56, 60, 64, 72, 80, 96,
-];
-function extractTailwindTokens(projectDir) {
-    const tokens = {
-        colors: [],
-        fonts: [],
-        spacingValues: [],
-        shadows: [],
-        cssVariables: [],
-        breakpoints: [],
-        borderRadii: [],
-        gradients: [],
-        fontVarMap: {},
-        animations: [],
-        darkModeVars: [],
-        zIndexValues: [],
-        containerMaxWidth: null,
-        fontSources: [],
-        pageSections: [],
-        transitionDurations: [],
-        transitionEasings: [],
-    };
-    const configPath = findTailwindConfig(projectDir);
-    if (!configPath)
-        return tokens;
-    let config;
-    try {
-        const jiti = require('jiti')(__filename, { interopDefault: true });
-        config = jiti(configPath);
-        if (config.default)
-            config = config.default;
-    }
-    catch {
-        try {
-            config = parseConfigFallback(configPath);
-        }
-        catch {
-            // Config failed to load — still add Tailwind defaults since config exists
-            config = null;
-        }
-    }
-    // If config exists but failed to parse, still add sensible defaults
-    if (!config) {
-        tokens.spacingValues.push(...TAILWIND_DEFAULT_SPACING_PX.filter(v => v > 0));
-        tokens.breakpoints = [
-            { name: 'sm', value: '640px', source: 'tailwind' },
-            { name: 'md', value: '768px', source: 'tailwind' },
-            { name: 'lg', value: '1024px', source: 'tailwind' },
-            { name: 'xl', value: '1280px', source: 'tailwind' },
-            { name: '2xl', value: '1536px', source: 'tailwind' },
-        ];
-        // Try to extract font names from config file text as fallback
-        extractFontsFromConfigText(configPath, tokens);
-        return tokens;
-    }
-    const theme = config.theme || {};
-    const extend = theme.extend || {};
-    // Extract colors
-    const colorSources = mergeDeep(theme.colors || {}, extend.colors || {});
-    flattenColors(colorSources, '', tokens.colors);
-    // Extract fonts and build var→name map
-    const fontFamilies = mergeDeep(theme.fontFamily || {}, extend.fontFamily || {});
-    for (const [name, value] of Object.entries(fontFamilies)) {
-        const familyList = Array.isArray(value) ? value : [String(value)];
-        const primaryFamily = familyList[0];
-        // Resolve CSS var references in font values
-        const resolved = resolveFontName(primaryFamily, name);
-        // Only add as a font if the config key maps to a real font name
-        if (!isGenericConfigKey(name)) {
-            tokens.fonts.push({ family: resolved, source: 'tailwind' });
-        }
-        // Always build the var map for resolving references later
-        tokens.fontVarMap[`var(--font-${name})`] = resolved;
-        tokens.fontVarMap[name] = resolved;
-    }
-    // Extract spacing — prefer explicit config, fall back to Tailwind defaults
-    const spacing = mergeDeep(theme.spacing || {}, extend.spacing || {});
-    const spacingEntries = Object.entries(spacing);
-    if (spacingEntries.length > 0) {
-        for (const [, value] of spacingEntries) {
-            const num = parseFloat(String(value));
-            if (!isNaN(num) && num > 0) {
-                const px = String(value).includes('rem') ? num * 16 : num;
-                tokens.spacingValues.push(Math.round(px));
-            }
-        }
-    }
-    // Always include Tailwind defaults as a baseline
-    tokens.spacingValues.push(...TAILWIND_DEFAULT_SPACING_PX.filter(v => v > 0));
-    // Extract border-radius
-    const borderRadius = mergeDeep(theme.borderRadius || {}, extend.borderRadius || {});
-    for (const [name, value] of Object.entries(borderRadius)) {
-        if (typeof value === 'string') {
-            tokens.borderRadii.push(value);
-        }
-    }
-    // Extract shadows
-    const boxShadow = mergeDeep(theme.boxShadow || {}, extend.boxShadow || {});
-    for (const [name, value] of Object.entries(boxShadow)) {
-        if (typeof value === 'string') {
-            tokens.shadows.push({ value, name });
-        }
-    }
-    // Extract breakpoints
-    const screens = mergeDeep(theme.screens || {}, extend.screens || {});
-    for (const [name, value] of Object.entries(screens)) {
-        const bp = {
-            name,
-            value: typeof value === 'string' ? value : typeof value === 'object' && value !== null && 'min' in value ? value.min : String(value),
-            source: 'tailwind',
-        };
-        tokens.breakpoints.push(bp);
-    }
-    if (tokens.breakpoints.length === 0) {
-        tokens.breakpoints = [
-            { name: 'sm', value: '640px', source: 'tailwind' },
-            { name: 'md', value: '768px', source: 'tailwind' },
-            { name: 'lg', value: '1024px', source: 'tailwind' },
-            { name: 'xl', value: '1280px', source: 'tailwind' },
-            { name: '2xl', value: '1536px', source: 'tailwind' },
-        ];
-    }
-    return tokens;
-}
-/**
- * Resolve a CSS variable font name to a human-readable name.
- * e.g. "var(--font-exo2)" → "Exo 2", or just use the config key.
- */
-function resolveFontName(primaryFamily, configKey) {
-    // If it's already a real font name, return it
-    if (!primaryFamily.startsWith('var(') && !primaryFamily.startsWith('--')) {
-        return primaryFamily.replace(/["']/g, '').trim();
-    }
-    // Try to derive from config key: "exo2" → "Exo 2", "jetbrains" → "JetBrains Mono"
-    return configKeyToFontName(configKey);
-}
-function configKeyToFontName(key) {
-    // Common font name mappings from Tailwind config keys
-    const known = {
-        sans: 'Sans-serif',
-        serif: 'Serif',
-        mono: 'Monospace',
-        display: 'Display',
-        body: 'Body',
-        exo2: 'Exo 2',
-        exo: 'Exo',
-        inter: 'Inter',
-        roboto: 'Roboto',
-        poppins: 'Poppins',
-        montserrat: 'Montserrat',
-        lato: 'Lato',
-        nunito: 'Nunito',
-        jetbrains: 'JetBrains Mono',
-        'fira-code': 'Fira Code',
-        'source-code': 'Source Code Pro',
-        'space-grotesk': 'Space Grotesk',
-        'space-mono': 'Space Mono',
-        doto: 'Doto',
-        geist: 'Geist',
-        'geist-mono': 'Geist Mono',
-        outfit: 'Outfit',
-        manrope: 'Manrope',
-        'dm-sans': 'DM Sans',
-        'dm-mono': 'DM Mono',
-        sora: 'Sora',
-        'ibm-plex': 'IBM Plex Sans',
-        'ibm-plex-mono': 'IBM Plex Mono',
-        raleway: 'Raleway',
-        'open-sans': 'Open Sans',
-        'source-sans': 'Source Sans Pro',
-        ubuntu: 'Ubuntu',
-        'ubuntu-mono': 'Ubuntu Mono',
-        barlow: 'Barlow',
-        overpass: 'Overpass',
-        rubik: 'Rubik',
-        karla: 'Karla',
-        cabin: 'Cabin',
-        mulish: 'Mulish',
-    };
-    const lowerKey = key.toLowerCase().replace(/_/g, '-');
-    if (known[lowerKey])
-        return known[lowerKey];
-    // Fallback: capitalize and add spaces before digits
-    return key
-        .replace(/[-_]/g, ' ')
-        .replace(/([a-z])(\d)/g, '$1 $2')
-        .replace(/(\d)([a-z])/g, '$1 $2')
-        .split(' ')
-        .map(w => w.charAt(0).toUpperCase() + w.slice(1))
-        .join(' ');
-}
-/**
- * Check if a fontFamily config key is a generic/functional name
- * (e.g., "sans", "heading", "body", "display") rather than an actual font name.
- * These resolve to CSS vars whose target font we can't determine statically.
- */
-function isGenericConfigKey(key) {
-    return /^(sans|serif|mono|heading|body|display|code|ui)$/i.test(key);
-}
-function findTailwindConfig(dir) {
-    for (const file of TAILWIND_CONFIG_FILES) {
-        const p = path.join(dir, file);
-        if (fs.existsSync(p))
-            return p;
-    }
-    return null;
-}
-function flattenColors(obj, prefix, out) {
-    for (const [key, value] of Object.entries(obj)) {
-        const name = prefix ? `${prefix}-${key}` : key;
-        if (typeof value === 'string') {
-            if (isColorValue(value)) {
-                out.push({ value: normalizeHex(value), frequency: 1, source: 'tailwind', name });
-            }
-        }
-        else if (typeof value === 'object' && value !== null) {
-            flattenColors(value, name, out);
-        }
-    }
-}
-function isColorValue(v) {
-    return /^#([0-9a-fA-F]{3,8})$/.test(v) ||
-        /^rgb/i.test(v) ||
-        /^hsl/i.test(v);
-}
-function normalizeHex(v) {
-    const match = v.match(/^#([0-9a-fA-F]{3})$/);
-    if (match) {
-        const [r, g, b] = match[1].split('');
-        return `#${r}${r}${g}${g}${b}${b}`.toLowerCase();
-    }
-    return v.toLowerCase();
-}
-function mergeDeep(a, b) {
-    const result = { ...a };
-    for (const key of Object.keys(b)) {
-        if (typeof b[key] === 'object' && b[key] !== null && !Array.isArray(b[key]) &&
-            typeof a[key] === 'object' && a[key] !== null && !Array.isArray(a[key])) {
-            result[key] = mergeDeep(a[key], b[key]);
-        }
-        else {
-            result[key] = b[key];
-        }
-    }
-    return result;
-}
-/**
- * When jiti fails, try to extract font family names from the raw config text.
- * Only looks within fontFamily blocks to avoid false positives from content arrays etc.
- */
-function extractFontsFromConfigText(configPath, tokens) {
-    try {
-        const content = fs.readFileSync(configPath, 'utf-8');
-        // Find the fontFamily block specifically
-        const fontFamilyBlock = content.match(/fontFamily\s*:\s*\{([^}]+)\}/s);
-        if (!fontFamilyBlock)
-            return;
-        const block = fontFamilyBlock[1];
-        // Match entries like: sans: [var(--font-inter), ...] or mono: ["JetBrains Mono", ...]
-        const entries = block.matchAll(/(\w[\w-]*)\s*:\s*\[([^\]]+)\]/g);
-        for (const entry of entries) {
-            const key = entry[1];
-            const valueList = entry[2];
-            // Check for var(--font-xxx) reference
-            const varMatch = valueList.match(/var\(--font-(\w[\w-]*)\)/);
-            if (varMatch) {
-                const varName = varMatch[1];
-                const resolved = configKeyToFontName(varName);
-                // Skip generic config key names like "heading", "body", "sans", "display"
-                // These are Tailwind key names, not font names
-                if (!isGenericConfigKey(key)) {
-                    tokens.fonts.push({ family: resolved, source: 'tailwind' });
-                }
-                tokens.fontVarMap[`var(--font-${varName})`] = resolved;
-                tokens.fontVarMap[key] = resolved;
-                continue;
-            }
-            // Check for direct font name
-            const nameMatch = valueList.match(/["']([^"']+)["']/);
-            if (nameMatch) {
-                const fontName = nameMatch[1];
-                // Filter out generic CSS families
-                if (!/^(sans-serif|serif|monospace|system-ui|ui-|inherit)/.test(fontName)) {
-                    tokens.fonts.push({ family: fontName, source: 'tailwind' });
-                    tokens.fontVarMap[key] = fontName;
-                }
-            }
-        }
-    }
-    catch {
-        // Ignore read errors
-    }
-}
-function parseConfigFallback(configPath) {
-    const content = fs.readFileSync(configPath, 'utf-8');
-    const match = content.match(/module\.exports\s*=\s*(\{[\s\S]*\})/);
-    if (match) {
-        try {
-            return Function(`"use strict"; return (${match[1]})`)();
-        }
-        catch {
-            return null;
-        }
-    }
-    return null;
-}
-//# sourceMappingURL=tailwind.js.map

package/dist/extractors/tokens/tokens-file.d.ts

@@ -1,3 +0,0 @@
-import { RawTokens } from '../../types';
-export declare function extractTokensFile(projectDir: string): RawTokens;
-//# sourceMappingURL=tokens-file.d.ts.map

package/dist/extractors/tokens/tokens-file.js

@@ -1,229 +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.extractTokensFile = extractTokensFile;
-const fs = __importStar(require("fs"));
-const path = __importStar(require("path"));
-const TOKEN_FILE_NAMES = [
-    'tokens.json',
-    'design-tokens.json',
-    'theme.json',
-    'theme.ts',
-    'theme.js',
-    'tokens.ts',
-    'tokens.js',
-    'design-tokens.ts',
-    'design-tokens.js',
-];
-const TOKEN_DIRS = ['', 'src', 'src/styles', 'src/theme', 'styles', 'theme', 'config'];
-function extractTokensFile(projectDir) {
-    const tokens = {
-        colors: [],
-        fonts: [],
-        spacingValues: [],
-        shadows: [],
-        cssVariables: [],
-        breakpoints: [],
-        borderRadii: [],
-        gradients: [],
-        fontVarMap: {},
-        animations: [],
-        darkModeVars: [],
-        zIndexValues: [],
-        containerMaxWidth: null,
-        fontSources: [],
-        pageSections: [],
-        transitionDurations: [],
-        transitionEasings: [],
-    };
-    for (const dir of TOKEN_DIRS) {
-        for (const fileName of TOKEN_FILE_NAMES) {
-            const filePath = path.join(projectDir, dir, fileName);
-            if (fs.existsSync(filePath)) {
-                try {
-                    extractFromFile(filePath, tokens);
-                }
-                catch {
-                    // Skip unreadable files
-                }
-            }
-        }
-    }
-    return tokens;
-}
-function extractFromFile(filePath, tokens) {
-    const ext = path.extname(filePath);
-    let data;
-    if (ext === '.json') {
-        data = JSON.parse(fs.readFileSync(filePath, 'utf-8'));
-    }
-    else {
-        // Try jiti for JS/TS
-        try {
-            const jiti = require('jiti')(__filename, { interopDefault: true });
-            data = jiti(filePath);
-            if (data.default)
-                data = data.default;
-        }
-        catch {
-            // Fallback: try regex extraction
-            const content = fs.readFileSync(filePath, 'utf-8');
-            extractWithRegex(content, tokens);
-            return;
-        }
-    }
-    if (!data || typeof data !== 'object')
-        return;
-    // Recursively extract tokens from the object
-    walkTokenObject(data, '', tokens);
-}
-function walkTokenObject(obj, prefix, tokens) {
-    for (const [key, value] of Object.entries(obj)) {
-        const fullKey = prefix ? `${prefix}.${key}` : key;
-        if (typeof value === 'string') {
-            classifyValue(fullKey, value, tokens);
-        }
-        else if (typeof value === 'number') {
-            // Could be spacing
-            if (value > 0 && value <= 200) {
-                tokens.spacingValues.push(value);
-            }
-        }
-        else if (typeof value === 'object' && value !== null && !Array.isArray(value)) {
-            // Design Tokens Community Group format: { value: "...", type: "..." }
-            if ('value' in value && typeof value.value === 'string') {
-                const tokenValue = value.value;
-                const tokenType = value.type || '';
-                classifyTokenValue(fullKey, tokenValue, tokenType, tokens);
-            }
-            else {
-                walkTokenObject(value, fullKey, tokens);
-            }
-        }
-        else if (Array.isArray(value)) {
-            // Font family arrays
-            if (key.toLowerCase().includes('font') && value.every(v => typeof v === 'string')) {
-                tokens.fonts.push({ family: value[0], source: 'tokens-file' });
-            }
-        }
-    }
-}
-function classifyValue(key, value, tokens) {
-    const keyLower = key.toLowerCase();
-    // Color
-    if (isColorValue(value)) {
-        const name = key.split('.').pop() || key;
-        tokens.colors.push({
-            value: normalizeHex(value),
-            frequency: 1,
-            source: 'tokens-file',
-            name,
-        });
-        return;
-    }
-    // Font
-    if (keyLower.includes('font') || keyLower.includes('family') || keyLower.includes('typeface')) {
-        tokens.fonts.push({ family: value, source: 'tokens-file' });
-        return;
-    }
-    // Shadow
-    if (keyLower.includes('shadow') || keyLower.includes('elevation')) {
-        tokens.shadows.push({ value, name: key.split('.').pop() });
-        return;
-    }
-    // Spacing
-    const pxMatch = value.match(/^(\d+(?:\.\d+)?)\s*(px|rem|em)?$/);
-    if (pxMatch && (keyLower.includes('spacing') || keyLower.includes('space') || keyLower.includes('gap') || keyLower.includes('size'))) {
-        let px = parseFloat(pxMatch[1]);
-        if (pxMatch[2] === 'rem' || pxMatch[2] === 'em')
-            px *= 16;
-        if (px > 0 && px <= 200) {
-            tokens.spacingValues.push(Math.round(px));
-        }
-    }
-}
-function classifyTokenValue(key, value, type, tokens) {
-    const typeLower = type.toLowerCase();
-    if (typeLower === 'color' || isColorValue(value)) {
-        const name = key.split('.').pop() || key;
-        tokens.colors.push({
-            value: normalizeHex(value),
-            frequency: 1,
-            source: 'tokens-file',
-            name,
-        });
-    }
-    else if (typeLower === 'fontfamily' || typeLower === 'fontfamilies') {
-        tokens.fonts.push({ family: value, source: 'tokens-file' });
-    }
-    else if (typeLower === 'fontsize' || typeLower === 'fontsizes') {
-        tokens.fonts.push({ family: '', size: value, source: 'tokens-file' });
-    }
-    else if (typeLower === 'spacing') {
-        const px = parseFloat(value);
-        if (!isNaN(px) && px > 0)
-            tokens.spacingValues.push(px);
-    }
-    else if (typeLower === 'boxshadow' || typeLower === 'shadow') {
-        tokens.shadows.push({ value, name: key.split('.').pop() });
-    }
-    else {
-        // Generic classify
-        classifyValue(key, value, tokens);
-    }
-}
-function extractWithRegex(content, tokens) {
-    // Extract hex colors
-    const hexMatches = content.matchAll(/#([0-9a-fA-F]{3,8})\b/g);
-    for (const m of hexMatches) {
-        tokens.colors.push({ value: normalizeHex(m[0]), frequency: 1, source: 'tokens-file' });
-    }
-    // Extract font strings
-    const fontMatches = content.matchAll(/['"]?(Inter|Roboto|Helvetica|Arial|Poppins|Montserrat|Open Sans|Lato|Nunito|Source Sans|JetBrains Mono|Fira Code|SF Mono|Menlo|Consolas)['"]?/gi);
-    for (const m of fontMatches) {
-        tokens.fonts.push({ family: m[1], source: 'tokens-file' });
-    }
-}
-function isColorValue(v) {
-    return /^#([0-9a-fA-F]{3,8})$/.test(v) || /^rgb/i.test(v) || /^hsl/i.test(v);
-}
-function normalizeHex(v) {
-    if (/^#([0-9a-fA-F]{3})$/.test(v)) {
-        const [r, g, b] = v.slice(1).split('');
-        return `#${r}${r}${g}${g}${b}${b}`.toLowerCase();
-    }
-    return v.toLowerCase().slice(0, 7);
-}
-//# sourceMappingURL=tokens-file.js.map

package/dist/extractors/ultra/animations.d.ts

@@ -1,21 +0,0 @@
-import { FullAnimationResult } from '../../types-ultra';
-/**
- * Ultra mode — Full Animation Extractor
- *
- * Extracts EVERYTHING animation-related from a live website:
- *
- * 1. CSS @keyframes — complete with property values, selectors that use them,
- *    duration/easing/delay/iteration metadata
- * 2. Scroll journey screenshots — 7 frames at 0/17/33/50/67/83/100% scroll depth,
- *    showing the cinematic state at every point of the page
- * 3. Animation library detection — GSAP, ScrollTrigger, Lottie, Framer Motion,
- *    AOS, Anime.js, Three.js, Canvas, WebGL, etc.
- * 4. Video backgrounds — src, poster, autoplay/loop/muted, first-frame capture
- * 5. Scroll-triggered patterns — data-aos, data-scroll, IntersectionObserver-driven,
- *    GSAP ScrollTrigger elements
- * 6. CSS animation variables — --duration-*, --ease-*, --delay-*, etc.
- *
- * Requires Playwright (optional peer dependency).
- */
-export declare function captureAnimations(url: string, skillDir: string): Promise<FullAnimationResult>;
-//# sourceMappingURL=animations.d.ts.map