designmaxxing 0.1.0

package/dist/utils/dedup.js

@@ -0,0 +1,44 @@
+export function deduplicateValues(values) {
+    const counts = new Map();
+    for (const v of values) {
+        counts.set(v, (counts.get(v) || 0) + 1);
+    }
+    return Array.from(counts.entries())
+        .map(([value, count]) => ({ value, count }))
+        .sort((a, b) => b.count - a.count);
+}
+export function detectScale(values) {
+    if (values.length < 3)
+        return null;
+    const sorted = [...new Set(values)].sort((a, b) => a - b).filter(v => v > 0);
+    if (sorted.length < 3)
+        return null;
+    // Try common bases: 2, 4, 8
+    for (const base of [4, 8, 2]) {
+        const multipliers = sorted.map(v => v / base);
+        const allIntegers = multipliers.every(m => Math.abs(m - Math.round(m)) < 0.01);
+        if (allIntegers) {
+            return { base, multipliers: multipliers.map(m => Math.round(m)) };
+        }
+    }
+    // Try using the smallest value as base
+    const base = sorted[0];
+    const multipliers = sorted.map(v => v / base);
+    const allClean = multipliers.every(m => Math.abs(m - Math.round(m * 2) / 2) < 0.01);
+    if (allClean) {
+        return { base, multipliers: multipliers.map(m => Math.round(m * 2) / 2) };
+    }
+    return null;
+}
+export function suggestTokenName(value, scale) {
+    const index = scale.indexOf(value);
+    if (index === -1)
+        return value;
+    // Use t-shirt sizing for small scales, numeric for larger
+    if (scale.length <= 7) {
+        const names = ['xs', 'sm', 'md', 'lg', 'xl', '2xl', '3xl'];
+        return names[index] || `${index + 1}`;
+    }
+    return `${index + 1}`;
+}
+//# sourceMappingURL=dedup.js.map

package/dist/utils/dedup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dedup.js","sourceRoot":"","sources":["../../src/utils/dedup.ts"],"names":[],"mappings":"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"}

package/dist/utils/fs.d.ts

@@ -0,0 +1,6 @@
+import type { ExtractionConfig } from '../types/config.js';
+export declare function ensureDir(dir: string): Promise<void>;
+export declare function writeJson(path: string, data: unknown): Promise<void>;
+export declare function readJson<T>(path: string): Promise<T>;
+export declare function resolveOutputPath(config: ExtractionConfig, filename: string): string;
+//# sourceMappingURL=fs.d.ts.map

package/dist/utils/fs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fs.d.ts","sourceRoot":"","sources":["../../src/utils/fs.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE1D,wBAAsB,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAE1D;AAED,wBAAsB,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAG1E;AAED,wBAAsB,QAAQ,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC,CAAC,CAG1D;AAED,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEpF"}

package/dist/utils/fs.js

@@ -0,0 +1,17 @@
+import { mkdir, writeFile, readFile } from 'node:fs/promises';
+import { join, dirname } from 'node:path';
+export async function ensureDir(dir) {
+    await mkdir(dir, { recursive: true });
+}
+export async function writeJson(path, data) {
+    await ensureDir(dirname(path));
+    await writeFile(path, JSON.stringify(data, null, 2) + '\n', 'utf-8');
+}
+export async function readJson(path) {
+    const content = await readFile(path, 'utf-8');
+    return JSON.parse(content);
+}
+export function resolveOutputPath(config, filename) {
+    return join(config.output, filename);
+}
+//# sourceMappingURL=fs.js.map

package/dist/utils/fs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fs.js","sourceRoot":"","sources":["../../src/utils/fs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAC7D,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAGzC,MAAM,CAAC,KAAK,UAAU,SAAS,CAAC,GAAW;IACzC,MAAM,KAAK,CAAC,GAAG,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAA;AACvC,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,SAAS,CAAC,IAAY,EAAE,IAAa;IACzD,MAAM,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAA;IAC9B,MAAM,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,GAAG,IAAI,EAAE,OAAO,CAAC,CAAA;AACtE,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,QAAQ,CAAI,IAAY;IAC5C,MAAM,OAAO,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC,CAAA;IAC7C,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAM,CAAA;AACjC,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,MAAwB,EAAE,QAAgB;IAC1E,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;AACtC,CAAC"}

package/dist/utils/screenshot-diff.d.ts

@@ -0,0 +1,7 @@
+export interface DiffResult {
+    readonly diffPixels: number;
+    readonly totalPixels: number;
+    readonly diffPercent: number;
+}
+export declare function compareScreenshots(img1Path: string, img2Path: string, diffPath: string, threshold: number): Promise<DiffResult>;
+//# sourceMappingURL=screenshot-diff.d.ts.map

package/dist/utils/screenshot-diff.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"screenshot-diff.d.ts","sourceRoot":"","sources":["../../src/utils/screenshot-diff.ts"],"names":[],"mappings":"AAoBA,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;CAC7B;AAED,wBAAsB,kBAAkB,CACtC,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,MAAM,GAChB,OAAO,CAAC,UAAU,CAAC,CA8BrB"}

package/dist/utils/screenshot-diff.js

@@ -0,0 +1,43 @@
+import { readFile, writeFile } from 'node:fs/promises';
+import pixelmatch from 'pixelmatch';
+import { PNG } from 'pngjs';
+/**
+ * Crops raw RGBA pixel data from srcWidth-wide image to a width×height region.
+ * Needed because pixelmatch requires buffers of exactly width*height*4 bytes.
+ */
+function cropImageData(src, srcWidth, width, height) {
+    if (srcWidth === width) {
+        // No cropping needed in width — just slice the required rows
+        return src.subarray(0, width * height * 4);
+    }
+    const dest = Buffer.alloc(width * height * 4);
+    for (let y = 0; y < height; y++) {
+        src.copy(dest, y * width * 4, y * srcWidth * 4, y * srcWidth * 4 + width * 4);
+    }
+    return dest;
+}
+export async function compareScreenshots(img1Path, img2Path, diffPath, threshold) {
+    const [buf1, buf2] = await Promise.all([readFile(img1Path), readFile(img2Path)]);
+    const img1 = PNG.sync.read(buf1);
+    const img2 = PNG.sync.read(buf2);
+    // Handle size mismatches — crop pixel data to min dimensions
+    const width = Math.min(img1.width, img2.width);
+    const height = Math.min(img1.height, img2.height);
+    const diff = new PNG({ width, height });
+    // pixelmatch requires buffers of exactly width*height*4 bytes.
+    // If images differ in size, crop each buffer to the target region.
+    const data1 = cropImageData(img1.data, img1.width, width, height);
+    const data2 = cropImageData(img2.data, img2.width, width, height);
+    const diffPixels = pixelmatch(data1, data2, diff.data, width, height, {
+        threshold,
+        includeAA: false,
+    });
+    await writeFile(diffPath, PNG.sync.write(diff));
+    const totalPixels = width * height;
+    return {
+        diffPixels,
+        totalPixels,
+        diffPercent: diffPixels / totalPixels,
+    };
+}
+//# sourceMappingURL=screenshot-diff.js.map

package/dist/utils/screenshot-diff.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"screenshot-diff.js","sourceRoot":"","sources":["../../src/utils/screenshot-diff.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AACtD,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAE3B;;;GAGG;AACH,SAAS,aAAa,CAAC,GAAW,EAAE,QAAgB,EAAE,KAAa,EAAE,MAAc;IACjF,IAAI,QAAQ,KAAK,KAAK,EAAE,CAAC;QACvB,6DAA6D;QAC7D,OAAO,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,CAAC,CAAC,CAAA;IAC5C,CAAC;IACD,MAAM,IAAI,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,GAAG,CAAC,CAAC,CAAA;IAC7C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QAChC,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC,CAAA;IAC/E,CAAC;IACD,OAAO,IAAI,CAAA;AACb,CAAC;AAQD,MAAM,CAAC,KAAK,UAAU,kBAAkB,CACtC,QAAgB,EAChB,QAAgB,EAChB,QAAgB,EAChB,SAAiB;IAEjB,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;IAEhF,MAAM,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAChC,MAAM,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAEhC,6DAA6D;IAC7D,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAA;IAC9C,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;IAEjD,MAAM,IAAI,GAAG,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAA;IAEvC,+DAA+D;IAC/D,mEAAmE;IACnE,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,CAAA;IACjE,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,CAAA;IAEjE,MAAM,UAAU,GAAG,UAAU,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE;QACpE,SAAS;QACT,SAAS,EAAE,KAAK;KACjB,CAAC,CAAA;IAEF,MAAM,SAAS,CAAC,QAAQ,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAA;IAE/C,MAAM,WAAW,GAAG,KAAK,GAAG,MAAM,CAAA;IAClC,OAAO;QACL,UAAU;QACV,WAAW;QACX,WAAW,EAAE,UAAU,GAAG,WAAW;KACtC,CAAA;AACH,CAAC"}

package/package.json

@@ -0,0 +1,60 @@
+{
+  "name": "designmaxxing",
+  "version": "0.1.0",
+  "description": "Pixel-perfect UI reverse engineering toolkit — extract design tokens, components, and layout from any web app",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "bin": {
+    "designmaxxing": "dist/cli/index.js"
+  },
+  "scripts": {
+    "build": "rm -rf dist && tsc",
+    "dev": "tsc --watch",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "lint": "tsc --noEmit",
+    "prepublishOnly": "npm run build && npm run test"
+  },
+  "keywords": [
+    "reverse-engineering",
+    "design-tokens",
+    "ui",
+    "css",
+    "playwright",
+    "extraction"
+  ],
+  "author": "mercuriumgroup",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/mercuriumgroup/UI-maxxing.git"
+  },
+  "license": "MIT",
+  "engines": {
+    "node": ">=18"
+  },
+  "files": [
+    "dist",
+    "!dist/**/*.test.js",
+    "!dist/**/*.test.js.map",
+    "!dist/**/*.test.d.ts",
+    "!dist/**/*.test.d.ts.map",
+    "README.md"
+  ],
+  "dependencies": {
+    "chalk": "^5.3.0",
+    "commander": "^12.0.0",
+    "fast-glob": "^3.3.0",
+    "ora": "^8.0.0",
+    "pixelmatch": "^7.1.0",
+    "playwright": "^1.48.0",
+    "pngjs": "^7.0.0",
+    "zod": "^3.23.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20.0.0",
+    "@types/pngjs": "^6.0.5",
+    "typescript": "^5.5.0",
+    "vitest": "^2.0.0"
+  }
+}