dembrandt 0.7.2 → 0.8.0

package/README.md

@@ -54,12 +54,36 @@ dembrandt bmw.de --dark-mode       # Extract colors from dark mode variant
 dembrandt bmw.de --mobile          # Use mobile viewport (390x844, iPhone 12/13/14/15) for responsive analysis
 dembrandt bmw.de --slow            # 3x longer timeouts (24s hydration) for JavaScript-heavy sites
 dembrandt bmw.de --brand-guide      # Generate a brand guide PDF
+dembrandt bmw.de --pages 5         # Analyze 5 pages (homepage + 4 discovered pages), merges results
+dembrandt bmw.de --sitemap          # Discover pages from sitemap.xml instead of DOM links
+dembrandt bmw.de --pages 10 --sitemap # Combine: up to 10 pages discovered via sitemap
 dembrandt bmw.de --no-sandbox      # Disable Chromium sandbox (required for Docker/CI)
 dembrandt bmw.de --browser=firefox # Use Firefox instead of Chromium (better for Cloudflare bypass)
 ```
 
 Default: formatted terminal display only. Use `--save-output` to persist results as JSON files. Browser automatically retries in visible mode if headless extraction fails.
 
+### Multi-Page Extraction
+
+Analyze multiple pages to get a more complete picture of a site's design system. Results are merged into a single unified output with cross-page confidence boosting — colors appearing on multiple pages get higher confidence scores.
+
+```bash
+# Analyze homepage + 4 auto-discovered pages (default: 5 total)
+dembrandt stripe.com --pages 5
+
+# Use sitemap.xml for page discovery instead of DOM link scraping
+dembrandt stripe.com --sitemap
+
+# Combine both: up to 10 pages from sitemap
+dembrandt stripe.com --pages 10 --sitemap
+```
+
+**Page discovery** works two ways:
+- **DOM links** (default): Scrapes navigation, header, and footer links from the homepage, prioritizing key pages like /pricing, /about, /features
+- **Sitemap** (`--sitemap`): Parses sitemap.xml (checks robots.txt first), follows sitemapindex references, and scores URLs by importance
+
+Pages are crawled sequentially with polite delays. Failed pages are skipped without aborting the run.
+
 ### Browser Selection
 
 By default, dembrandt uses Chromium. If you encounter bot detection or timeouts (especially on sites behind Cloudflare), try Firefox which is often more successful at bypassing these protections:

package/index.js

@@ -15,13 +15,15 @@ import { extractBranding } from "./lib/extractors.js";
 import { displayResults } from "./lib/display.js";
 import { toW3CFormat } from "./lib/w3c-exporter.js";
 import { generatePDF } from "./lib/pdf.js";
+import { parseSitemap } from "./lib/discovery.js";
+import { mergeResults } from "./lib/merger.js";
 import { writeFileSync, mkdirSync } from "fs";
 import { join } from "path";
 
 program
   .name("dembrandt")
   .description("Extract design tokens from any website")
-  .version("0.7.2")
+  .version("0.7.3")
   .argument("<url>")
   .option("--browser <type>", "Browser to use (chromium|firefox)", "chromium")
   .option("--json-only", "Output raw JSON")
@@ -34,6 +36,12 @@ program
   .option("--no-sandbox", "Disable browser sandbox (needed for Docker/CI)")
   .option("--raw-colors", "Include pre-filter raw colors in JSON output")
   .option("--screenshot <path>", "Save a screenshot of the page")
+  .option("--pages <n>", "Analyze up to N total pages including start URL (default: 5)", (v) => {
+    const n = parseInt(v, 10);
+    if (isNaN(n) || n < 1) throw new Error(`--pages must be a positive integer, got: ${v}`);
+    return n;
+  })
+  .option("--sitemap", "Discover pages from sitemap.xml instead of DOM links")
   .action(async (input, opts) => {
     let url = input;
     if (!url.startsWith("http://") && !url.startsWith("https://")) {
@@ -67,13 +75,73 @@ program
         });
 
         try {
+          const isMultiPage = opts.pages || opts.sitemap;
+          const maxPages = (opts.pages || 5) - 1; // -1 because homepage counts
           result = await extractBranding(url, spinner, browser, {
             navigationTimeout: 90000,
             darkMode: opts.darkMode,
             mobile: opts.mobile,
             slow: opts.slow,
             screenshotPath: opts.screenshot,
+            discoverLinks: isMultiPage && !opts.sitemap ? maxPages : null,
           });
+
+          // Multi-page crawl
+          if (isMultiPage && maxPages > 0) {
+            spinner.start("Discovering pages...");
+
+            let additionalUrls;
+            if (opts.sitemap) {
+              // Try post-redirect URL first, fall back to user-provided URL
+              // (sites like spotify.com redirect browser to open.spotify.com
+              // but sitemap lives at www.spotify.com)
+              additionalUrls = await parseSitemap(result.url, maxPages);
+              if (additionalUrls.length === 0 && result.url !== url) {
+                additionalUrls = await parseSitemap(url, maxPages);
+              }
+            } else {
+              additionalUrls = result._discoveredLinks || [];
+            }
+
+            delete result._discoveredLinks;
+
+            if (additionalUrls.length === 0) {
+              spinner.warn("No additional pages discovered");
+            } else {
+              spinner.stop();
+              console.log(chalk.dim(`  Found ${additionalUrls.length} page(s) to analyze`));
+
+              const allResults = [result];
+              for (let i = 0; i < additionalUrls.length; i++) {
+                const pageUrl = additionalUrls[i];
+                const pageNum = i + 2;
+                const total = additionalUrls.length + 1;
+                spinner.start(`Extracting page ${pageNum}/${total}: ${new URL(pageUrl).pathname}`);
+
+                // Polite delay between pages
+                await new Promise(r => setTimeout(r, 2000 + Math.random() * 3000));
+
+                try {
+                  const pageResult = await extractBranding(pageUrl, spinner, browser, {
+                    navigationTimeout: 90000,
+                    darkMode: opts.darkMode,
+                    mobile: opts.mobile,
+                    slow: opts.slow,
+                  });
+                  delete pageResult._discoveredLinks;
+                  allResults.push(pageResult);
+                } catch (err) {
+                  spinner.warn(`Skipping ${pageUrl}: ${String(err?.message || err).slice(0, 80)}`);
+                }
+              }
+
+              spinner.stop();
+              result = mergeResults(allResults);
+            }
+          } else {
+            delete result._discoveredLinks;
+          }
+
           break;
         } catch (err) {
           await browser.close();

package/lib/colors.js

@@ -159,6 +159,33 @@ export function formatOklch(oklch, alpha) {
   return `oklch(${l}% ${c} ${h})`;
 }
 
+/**
+ * Compute CIE76 delta-E perceptual distance between two hex colors.
+ * Returns 0 for identical colors, ~100 for maximally different.
+ * @param {string} hex1 - Hex color string (e.g. "#ff0000")
+ * @param {string} hex2 - Hex color string
+ * @returns {number}
+ */
+export function deltaE(hex1, hex2) {
+  function toLab(hex) {
+    const rgb = hexToRgb(hex);
+    if (!rgb) return null;
+    const lr = srgbToLinear(rgb.r);
+    const lg = srgbToLinear(rgb.g);
+    const lb = srgbToLinear(rgb.b);
+    const xyz = linearRgbToXyz(lr, lg, lb);
+    return xyzToLab(xyz.x, xyz.y, xyz.z);
+  }
+  const lab1 = toLab(hex1);
+  const lab2 = toLab(hex2);
+  if (!lab1 || !lab2) return 999;
+  return Math.sqrt(
+    Math.pow(lab1.l - lab2.l, 2) +
+    Math.pow(lab1.a - lab2.a, 2) +
+    Math.pow(lab1.b - lab2.b, 2)
+  );
+}
+
 /**
  * Parse a hex color string and return RGB values
  * @param {string} hex - Hex color (#fff, #ffffff, #ffffffaa)

package/lib/discovery.js

@@ -0,0 +1,247 @@
+/**
+ * Page Discovery
+ *
+ * Discovers internal pages from a starting URL via DOM link extraction
+ * or sitemap.xml parsing.
+ */
+
+/**
+ * Score a URL path for importance (higher = more important).
+ * Prioritizes shallow, navigational paths over blog posts / legal pages.
+ */
+export function scoreUrl(pathname) {
+  const lc = pathname.toLowerCase();
+
+  // Exclude noise
+  const exclude = [
+    /\/(login|signin|sign-in|signup|sign-up|register|auth)/,
+    /\/(terms|privacy|legal|cookie|gdpr|tos)/,
+    /\/(cdn-cgi|wp-admin|wp-content|wp-json)/,
+    /\.(pdf|jpg|jpeg|png|gif|svg|webp|zip|tar|gz|mp4|mp3)$/,
+    /\/tag\//,
+    /\/author\//,
+    /\/page\/\d+/,
+    /\?/,  // query strings (shouldn't appear here but safety)
+  ];
+  if (exclude.some(r => r.test(lc))) return -1;
+
+  let score = 100;
+
+  // Prefer shallow paths
+  const depth = (pathname.match(/\//g) || []).length;
+  score -= depth * 10;
+
+  // Boost key navigational pages
+  const boosts = [
+    [/^\/(pricing|plans?|cost)/, 30],
+    [/^\/(about|company|team|story)/, 25],
+    [/^\/(product|features?|solutions?)/, 25],
+    [/^\/(enterprise|business|platform)/, 20],
+    [/^\/(contact|demo|trial|start)/, 20],
+    [/^\/(docs|documentation|developers?|api)/, 15],
+    [/^\/(blog|resources|insights|news)/, 10],
+  ];
+  for (const [re, boost] of boosts) {
+    if (re.test(lc)) { score += boost; break; }
+  }
+
+  return score;
+}
+
+/**
+ * Discover internal links from an already-loaded Playwright page.
+ * Call after extractBranding() has loaded and scrolled the page.
+ *
+ * @param {import('playwright-core').Page} page
+ * @param {string} baseUrl - The starting URL (used to determine same-origin)
+ * @param {number} maxPages - Maximum number of URLs to return
+ * @returns {Promise<string[]>} Ordered list of URLs to crawl (excluding homepage)
+ */
+export async function discoverLinks(page, baseUrl, maxPages) {
+  const origin = new URL(baseUrl).origin;
+
+  const links = await page.evaluate((origin) => {
+    const results = [];
+    const navSelectors = [
+      'nav a', 'header a', 'footer a',
+      '[role="navigation"] a', '[aria-label*="nav"] a',
+      '[data-nav] a', '.nav a', '.navbar a', '.header a', '.menu a',
+    ];
+
+    // Score links by location: nav/header/footer = 2, elsewhere = 1
+    const scored = new Map(); // pathname → { href, locationScore }
+
+    function addLinks(selector, locationScore) {
+      document.querySelectorAll(selector).forEach(a => {
+        try {
+          const url = new URL(a.href);
+          if (url.origin !== origin) return;
+          const pathname = url.pathname.replace(/\/$/, '') || '/';
+          if (!scored.has(pathname) || scored.get(pathname).locationScore < locationScore) {
+            scored.set(pathname, { href: url.origin + pathname, locationScore });
+          }
+        } catch {}
+      });
+    }
+
+    navSelectors.forEach(sel => addLinks(sel, 2));
+    addLinks('a[href]', 1);
+
+    scored.forEach(({ href, locationScore }, pathname) => {
+      results.push({ href, pathname, locationScore });
+    });
+
+    return results;
+  }, origin);
+
+  // Remove homepage itself
+  const homepagePath = new URL(baseUrl).pathname.replace(/\/$/, '') || '/';
+
+  const scored = links
+    .filter(l => l.pathname !== homepagePath)
+    .map(l => ({ ...l, score: scoreUrl(l.pathname) + (l.locationScore * 5) }))
+    .filter(l => l.score >= 0)
+    .sort((a, b) => b.score - a.score);
+
+  return scored.slice(0, maxPages).map(l => l.href);
+}
+
+const FETCH_OPTS = {
+  headers: { 'User-Agent': 'Mozilla/5.0 (compatible; Dembrandt/1.0)' },
+};
+
+/**
+ * Discover sitemap URLs by checking robots.txt first, then common paths.
+ * Returns the first sitemap XML that responds successfully.
+ */
+async function findSitemapUrls(origin) {
+  // 1. Check robots.txt for Sitemap: directives
+  try {
+    const res = await fetch(`${origin}/robots.txt`, {
+      ...FETCH_OPTS,
+      signal: AbortSignal.timeout(5000),
+    });
+    if (res.ok) {
+      const text = await res.text();
+      const sitemaps = [...text.matchAll(/^Sitemap:\s*(.+)$/gmi)]
+        .map(m => m[1].trim())
+        .filter(u => u.startsWith('http'));
+      if (sitemaps.length > 0) return sitemaps;
+    }
+  } catch {}
+
+  // 2. Fall back to common sitemap locations
+  return [
+    `${origin}/sitemap.xml`,
+    `${origin}/sitemap_index.xml`,
+    `${origin}/sitemap/sitemap-index.xml`,
+  ];
+}
+
+/**
+ * Fetch a single sitemap URL, returning its XML text or empty string.
+ */
+async function fetchSitemap(url) {
+  try {
+    const res = await fetch(url, {
+      ...FETCH_OPTS,
+      signal: AbortSignal.timeout(10000),
+    });
+    if (!res.ok) return '';
+    const text = await res.text();
+    return text.includes('<') ? text : ''; // sanity check for XML
+  } catch {
+    return '';
+  }
+}
+
+/**
+ * Discover pages from a site's sitemap.xml.
+ * Checks robots.txt for Sitemap directives, then tries common paths.
+ * Follows sitemapindex references one level deep.
+ *
+ * @param {string} baseUrl - The starting URL (should be post-redirect)
+ * @param {number} maxPages - Maximum number of URLs to return
+ * @returns {Promise<string[]>} List of URLs from sitemap (excluding homepage)
+ */
+export async function parseSitemap(baseUrl, maxPages) {
+  const base = new URL(baseUrl);
+
+  // Find and fetch sitemap(s)
+  const candidates = await findSitemapUrls(base.origin);
+  let xml = '';
+  for (const candidate of candidates) {
+    xml = await fetchSitemap(candidate);
+    if (xml) break;
+  }
+  if (!xml) return [];
+
+  // Also accept www/non-www variants of the same domain
+  const acceptedHostnames = new Set([base.hostname]);
+  if (base.hostname.startsWith('www.')) {
+    acceptedHostnames.add(base.hostname.slice(4));
+  } else {
+    acceptedHostnames.add('www.' + base.hostname);
+  }
+
+  // Expand sitemapindex references up to two levels deep
+  let allXml = xml;
+  if (xml.includes('<sitemapindex')) {
+    const extractLocs = (text) => [...text.matchAll(/<loc>\s*(https?:\/\/[^<]+)\s*<\/loc>/g)]
+      .map(m => m[1].trim())
+      .filter(u => { try { return acceptedHostnames.has(new URL(u).hostname); } catch { return false; } });
+
+    const childUrls = extractLocs(xml).slice(0, 10);
+    const childXmls = await Promise.all(childUrls.map(u => fetchSitemap(u)));
+
+    // Check if children are also sitemapindex (e.g. Spotify's 3-level hierarchy)
+    const grandchildFetches = [];
+    const pageXmls = [];
+    for (const childXml of childXmls) {
+      if (!childXml) continue;
+      if (childXml.includes('<sitemapindex')) {
+        const gcUrls = extractLocs(childXml).slice(0, 3);
+        grandchildFetches.push(...gcUrls.map(u => fetchSitemap(u)));
+      } else {
+        pageXmls.push(childXml);
+      }
+    }
+    if (grandchildFetches.length > 0) {
+      const gcXmls = await Promise.all(grandchildFetches);
+      pageXmls.push(...gcXmls);
+    }
+    allXml = pageXmls.join('\n');
+  }
+
+  const homepagePath = base.pathname.replace(/\/$/, '') || '/';
+
+  const urls = [...allXml.matchAll(/<loc>\s*(https?:\/\/[^<]+)\s*<\/loc>/g)]
+    .map(m => m[1].trim())
+    .filter(u => {
+      try { return acceptedHostnames.has(new URL(u).hostname); }
+      catch { return false; }
+    })
+    .map(u => {
+      const p = new URL(u);
+      return p.origin + (p.pathname.replace(/\/$/, '') || '/');
+    });
+
+  // Deduplicate
+  const seen = new Set();
+  const deduped = [];
+  for (const u of urls) {
+    const path = new URL(u).pathname;
+    if (path === homepagePath) continue;
+    if (seen.has(u)) continue;
+    seen.add(u);
+    deduped.push(u);
+  }
+
+  // Score and sort
+  const scored = deduped
+    .map(u => ({ href: u, score: scoreUrl(new URL(u).pathname) }))
+    .filter(l => l.score >= 0)
+    .sort((a, b) => b.score - a.score);
+
+  return scored.slice(0, maxPages).map(l => l.href);
+}

package/lib/display.js

@@ -33,6 +33,10 @@ export function displayResults(data) {
     second: '2-digit'
   });
   console.log(chalk.dim('├─') + ' ' + chalk.dim(timeString));
+  if (data.pages && data.pages.length > 1) {
+    const paths = data.pages.map(p => new URL(p.url).pathname || '/').join(', ');
+    console.log(chalk.dim('├─') + ' ' + chalk.dim(`${data.pages.length} pages: ${paths}`));
+  }
   console.log(chalk.dim('│'));
 
   displayLogo(data.logo);

package/lib/extractors.js

@@ -7,6 +7,7 @@
 
 import chalk from "chalk";
 import { convertColor } from "./colors.js";
+import { discoverLinks } from "./discovery.js";
 
 /**
  * Main extraction function - orchestrates the entire brand analysis process
@@ -157,9 +158,22 @@ export async function extractBranding(
           300 + Math.random() * 400,
           200 + Math.random() * 300
         );
-        await page.evaluate(() => window.scrollTo(0, 400));
+        // Scroll through entire page to trigger lazy-loaded content
+        await page.evaluate(async () => {
+          const delay = (ms) => new Promise(r => setTimeout(r, ms));
+          const scrollStep = 600;
+          const maxHeight = Math.min(document.body.scrollHeight, 30000);
+          let y = 0;
+          while (y < maxHeight) {
+            y = Math.min(y + scrollStep, maxHeight);
+            window.scrollTo(0, y);
+            await delay(150 + Math.random() * 100);
+          }
+          // Scroll back to top
+          window.scrollTo(0, 0);
+        });
         spinner.stop();
-        console.log(chalk.hex('#50FA7B')(`  ✓ Human behavior simulated`));
+        console.log(chalk.hex('#50FA7B')(`  ✓ Full page scrolled (lazy content triggered)`));
 
         // Final hydration wait
         spinner.start("Final content stabilization...");
@@ -641,6 +655,15 @@ export async function extractBranding(
       result.colors.rawColors = colors._raw || [];
     }
 
+    // Discover internal links for multi-page extraction
+    if (options.discoverLinks) {
+      try {
+        result._discoveredLinks = await discoverLinks(page, page.url(), options.discoverLinks);
+      } catch {
+        result._discoveredLinks = [];
+      }
+    }
+
     return result;
   } catch (error) {
     spinner.fail("Extraction failed");

package/lib/merger.js

@@ -0,0 +1,311 @@
+/**
+ * Multi-Page Result Merger
+ *
+ * Merges extraction results from multiple pages into a single
+ * unified result that is a superset of the single-page result: all single-page
+ * fields are preserved, with additional multi-page metadata (pages array,
+ * pageCount on palette entries) added.
+ */
+
+import { deltaE } from './colors.js';
+
+const DELTA_E_THRESHOLD = 15;
+
+function mergeColors(results) {
+  const base = results[0].colors;
+
+  // Pool all palette entries with their source page index
+  const allColors = [];
+  results.forEach((r, pageIdx) => {
+    (r.colors?.palette || []).forEach(c => {
+      allColors.push({ ...c, _pageIdx: pageIdx });
+    });
+  });
+
+  // Perceptual dedup across all pages
+  const merged = [];
+  const used = new Set();
+
+  for (let i = 0; i < allColors.length; i++) {
+    if (used.has(i)) continue;
+
+    const c = allColors[i];
+    const similar = [c];
+    const pagesSeen = new Set([c._pageIdx]);
+
+    for (let j = i + 1; j < allColors.length; j++) {
+      if (used.has(j)) continue;
+      try {
+        if (deltaE(c.normalized, allColors[j].normalized) < DELTA_E_THRESHOLD) {
+          similar.push(allColors[j]);
+          pagesSeen.add(allColors[j]._pageIdx);
+          used.add(j);
+        }
+      } catch { /* skip unparseable colors */ }
+    }
+    used.add(i);
+
+    // Keep variant with highest count as canonical
+    const best = similar.sort((a, b) => b.count - a.count)[0];
+    const totalCount = similar.reduce((s, x) => s + (x.count || 0), 0);
+    const pageCount = pagesSeen.size;
+
+    // Boost confidence when color appears on multiple pages
+    let confidence = best.confidence;
+    if (pageCount > 1 && confidence === 'low') confidence = 'medium';
+    if (pageCount > 2 && confidence === 'medium') confidence = 'high';
+
+    const { _pageIdx, ...clean } = best;
+    merged.push({ ...clean, count: totalCount, confidence, pageCount });
+  }
+
+  // Semantic: homepage wins, fill missing from other pages
+  const semantic = { ...base.semantic };
+  for (let i = 1; i < results.length; i++) {
+    const s = results[i].colors?.semantic || {};
+    for (const [k, v] of Object.entries(s)) {
+      if (!semantic[k] && v) semantic[k] = v;
+    }
+  }
+
+  // CSS variables: union, first occurrence wins
+  const cssVariables = {};
+  results.forEach(r => {
+    const vars = r.colors?.cssVariables || {};
+    for (const [k, v] of Object.entries(vars)) {
+      if (!(k in cssVariables)) cssVariables[k] = v;
+    }
+  });
+
+  return { ...base, semantic, palette: merged, cssVariables };
+}
+
+function mergeTypography(results) {
+  const base = results[0].typography || {};
+
+  // Dedup styles by (family, size, weight) tuple, sum counts
+  const styleMap = new Map();
+  results.forEach(r => {
+    (r.typography?.styles || []).forEach(s => {
+      const key = `${s.family}|${s.size}|${s.weight}`;
+      if (!styleMap.has(key)) {
+        styleMap.set(key, { ...s, count: 1 });
+      } else {
+        styleMap.get(key).count++;
+      }
+    });
+  });
+
+  // Merge sources
+  const sources = { ...(base.sources || {}) };
+  results.slice(1).forEach(r => {
+    const s = r.typography?.sources || {};
+    for (const [k, v] of Object.entries(s)) {
+      if (Array.isArray(v)) {
+        sources[k] = [...new Set([...(sources[k] || []), ...v])];
+      } else if (v && !sources[k]) {
+        sources[k] = v;
+      }
+    }
+  });
+
+  const styles = [...styleMap.values()].sort((a, b) => parseFloat(b.size) - parseFloat(a.size));
+  return { ...base, styles, sources };
+}
+
+/**
+ * Fingerprint a component by its visual properties.
+ * Buttons and links have states.default; badges have top-level props.
+ */
+function fingerprintComponent(c) {
+  const base = c.states?.default || c;
+  return [
+    base.backgroundColor || '', base.color || '', base.borderRadius || '',
+    base.fontSize || '', base.fontWeight || '', base.border || ''
+  ].join('|');
+}
+
+function mergeComponentArray(arrays) {
+  const map = new Map();
+  arrays.flat().forEach(item => {
+    const key = fingerprintComponent(item);
+    if (!map.has(key)) {
+      map.set(key, { ...item, count: item.count || 1 });
+    } else {
+      map.get(key).count += (item.count || 1);
+    }
+  });
+  return [...map.values()].sort((a, b) => b.count - a.count);
+}
+
+/**
+ * Merge grouped component objects (inputs: {text,checkbox,...}, badges: {all,byVariant}).
+ * Preserves the grouping keys and merges each sub-array independently.
+ */
+function mergeComponentGroups(groupObjects) {
+  const grouped = {};
+  groupObjects.forEach(obj => {
+    if (!obj) return;
+    for (const [key, val] of Object.entries(obj)) {
+      if (Array.isArray(val)) {
+        if (!grouped[key]) grouped[key] = [];
+        grouped[key].push(val);
+      } else if (typeof val === 'object' && val !== null) {
+        // Nested groups like byVariant: { error: [], warning: [], ... }
+        if (!grouped[key]) grouped[key] = {};
+        for (const [subKey, subArr] of Object.entries(val)) {
+          if (Array.isArray(subArr)) {
+            if (!grouped[key][subKey]) grouped[key][subKey] = [];
+            grouped[key][subKey].push(subArr);
+          }
+        }
+      }
+    }
+  });
+
+  const merged = {};
+  for (const [key, val] of Object.entries(grouped)) {
+    if (Array.isArray(val)) {
+      merged[key] = mergeComponentArray(val);
+    } else {
+      // Nested groups
+      merged[key] = {};
+      for (const [subKey, subArrays] of Object.entries(val)) {
+        merged[key][subKey] = mergeComponentArray(subArrays);
+      }
+    }
+  }
+  return merged;
+}
+
+function mergeComponents(results) {
+  return {
+    buttons: mergeComponentArray(results.map(r => r.components?.buttons || [])),
+    inputs:  mergeComponentGroups(results.map(r => r.components?.inputs).filter(Boolean)),
+    links:   mergeComponentArray(results.map(r => r.components?.links || [])),
+    badges:  mergeComponentGroups(results.map(r => r.components?.badges).filter(Boolean)),
+  };
+}
+
+function mergeValueArrays(results, getter, valueKey = 'value') {
+  const map = new Map();
+  results.forEach(r => {
+    (getter(r) || []).forEach(item => {
+      const key = item[valueKey];
+      if (!map.has(key)) {
+        map.set(key, { ...item });
+      } else {
+        const e = map.get(key);
+        e.count = (e.count || 0) + (item.count || 1);
+        e.frequency = (e.frequency || 0) + (item.frequency || 0);
+      }
+    });
+  });
+  return [...map.values()].sort((a, b) => (b.count || b.frequency || 0) - (a.count || a.frequency || 0));
+}
+
+function mergeSpacing(results) {
+  const base = results[0].spacing || {};
+  const values = mergeValueArrays(results, r => r.spacing?.commonValues, 'px');
+  return { ...base, commonValues: values };
+}
+
+function mergeBorderRadius(results) {
+  const base = results[0].borderRadius || {};
+  const values = mergeValueArrays(results, r => r.borderRadius?.values);
+  // Recompute confidence from aggregated count
+  for (const v of values) {
+    if (v.count > 10) v.confidence = 'high';
+    else if (v.count > 3) v.confidence = 'medium';
+  }
+  return { ...base, values };
+}
+
+function mergeBorders(results) {
+  const map = new Map();
+  results.forEach(r => {
+    (r.borders?.combinations || []).forEach(item => {
+      const key = `${item.width}|${item.style}|${item.color}`;
+      if (!map.has(key)) {
+        map.set(key, { ...item, elements: [...(item.elements || [])] });
+      } else {
+        const e = map.get(key);
+        e.count += (item.count || 1);
+        const elementSet = new Set([...(e.elements || []), ...(item.elements || [])]);
+        e.elements = [...elementSet].slice(0, 5);
+        if (e.count > 10) e.confidence = 'high';
+        else if (e.count > 3) e.confidence = 'medium';
+      }
+    });
+  });
+  return {
+    combinations: [...map.values()].sort((a, b) => b.count - a.count),
+  };
+}
+
+function mergeShadows(results) {
+  const map = new Map();
+  results.forEach(r => {
+    (r.shadows || []).forEach(s => {
+      const key = s.shadow || s.value || JSON.stringify(s);
+      if (!map.has(key)) {
+        map.set(key, { ...s, count: s.count || 1 });
+      } else {
+        map.get(key).count += (s.count || 1);
+      }
+    });
+  });
+  // Recompute confidence from aggregated count
+  for (const s of map.values()) {
+    if (s.count > 10) s.confidence = 'high';
+    else if (s.count > 3) s.confidence = 'medium';
+  }
+  return [...map.values()].sort((a, b) => b.count - a.count);
+}
+
+function mergeByName(results, getter) {
+  const seen = new Set();
+  const out = [];
+  results.forEach(r => {
+    (getter(r) || []).forEach(item => {
+      const key = item.name || item.library || JSON.stringify(item);
+      if (!seen.has(key)) { seen.add(key); out.push(item); }
+    });
+  });
+  return out;
+}
+
+/**
+ * Merge an array of per-page result objects into a single unified result.
+ * @param {Object[]} results - Array of extractBranding() result objects
+ * @returns {Object} Merged result with same shape as single-page result
+ */
+export function mergeResults(results) {
+  if (results.length === 0) throw new Error('No results to merge');
+  if (results.length === 1) return results[0];
+
+  const home = results[0];
+
+  return {
+    url: home.url,
+    extractedAt: home.extractedAt,
+    siteName: home.siteName,
+    logo: home.logo,
+    favicons: home.favicons,
+    colors: mergeColors(results),
+    typography: mergeTypography(results),
+    spacing: mergeSpacing(results),
+    borderRadius: mergeBorderRadius(results),
+    borders: mergeBorders(results),
+    shadows: mergeShadows(results),
+    components: mergeComponents(results),
+    breakpoints: [
+      ...new Map(
+        results.flatMap(r => r.breakpoints || []).map(b => [b.px, b])
+      ).values()
+    ].sort((a, b) => parseInt(b.px) - parseInt(a.px)),
+    iconSystem: mergeByName(results, r => r.iconSystem),
+    frameworks: mergeByName(results, r => r.frameworks),
+    pages: results.map(r => ({ url: r.url, extractedAt: r.extractedAt })),
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dembrandt",
-  "version": "0.7.2",
+  "version": "0.8.0",
   "description": "Extract design tokens and brand assets from any website",
   "main": "index.js",
   "type": "module",