design-constraint-validator 1.0.0 → 2.0.1

package/cli/commands/build.ts

@@ -1,65 +1,65 @@
-import { join, dirname, resolve } from 'node:path';
-import { readFileSync, writeFileSync, existsSync, mkdirSync } from 'node:fs';
-import { flattenTokens, type FlatToken } from '../../core/flatten.js';
-import { valuesToCss, type ManifestRow } from '../../adapters/css.js';
-import { emitJSON } from '../../adapters/json.js';
-import { emitJS } from '../../adapters/js.js';
-import type { BuildOptions } from '../types.js';
-
-export async function buildCommand(options: BuildOptions & { [k: string]: any }): Promise<void> {
-  const { loadTokensWithBreakpoint } = await import('../../core/breakpoints.js');
-  const tokens = loadTokensWithBreakpoint();
-  const { flat } = flattenTokens(tokens);
-  let allValues = Object.fromEntries(Object.values(flat).map(t => [t.id, (t as FlatToken).value]));
-  if (options.theme) {
-    const themePath = join('tokens/themes', `${options.theme}.json`);
-    if (existsSync(themePath)) {
-      const themeTokens = JSON.parse(readFileSync(themePath, 'utf8'));
-      Object.assign(allValues, themeTokens);
-    }
-  }
-  const format = options.format || 'css';
-  const defaultOutput = `dist/tokens.${format}`;
-  let manifest: ManifestRow[] | undefined;
-  if (options.mapper) {
-    try {
-      const mp = resolve(options.mapper);
-      if (!existsSync(mp)) throw new Error(`mapper file not found: ${mp}`);
-      manifest = JSON.parse(readFileSync(mp, 'utf8')) as ManifestRow[];
-      if (!Array.isArray(manifest)) throw new Error('mapper manifest must be an array');
-    } catch (e) {
-      const msg = e instanceof Error ? e.message : String(e);
-      console.error(`Failed to load mapper manifest: ${msg}`);
-      process.exit(1);
-    }
-  }
-  const allFormats = options.allFormats ?? options['all-formats'];
-  if (allFormats) {
-    const dir = 'dist'; if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
-    const css = valuesToCss(allValues, { manifest });
-    writeFileSync('dist/tokens.css', css, 'utf8');
-    if (options.dryRun) console.log(css);
-    writeFileSync('dist/tokens.json', emitJSON(allValues, manifest), 'utf8');
-    writeFileSync('dist/tokens.js', emitJS(allValues, manifest), 'utf8');
-    console.log(`Tokens written (all formats) to dist/ (css/json/js)${manifest ? ' with mapper' : ''}`);
-    return;
-  }
-  const dryRun = options.dryRun ?? options['dry-run'];
-  if (format === 'css') {
-    const css = valuesToCss(allValues, { manifest });
-  if (dryRun) { console.log(css); return; }
-    const outPath = options.output || defaultOutput; const dir = dirname(outPath); if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
-    writeFileSync(outPath, css, 'utf8');
-    console.log(`CSS tokens written to ${outPath}${manifest ? ' (manifest mapper applied)' : ''}`);
-  } else if (format === 'json') {
-    const outPath = options.output || defaultOutput; const dir = dirname(outPath); if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
-  if (dryRun) { console.log(emitJSON(allValues, manifest)); return; }
-    writeFileSync(outPath, emitJSON(allValues, manifest), 'utf8');
-    console.log(`JSON tokens written to ${outPath}${manifest ? ' (manifest mapper applied)' : ''}`);
-  } else if (format === 'js') {
-    const outPath = options.output || defaultOutput; const dir = dirname(outPath); if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
-  if (dryRun) { console.log(emitJS(allValues, manifest)); return; }
-    writeFileSync(outPath, emitJS(allValues, manifest), 'utf8');
-    console.log(`JS tokens written to ${outPath}${manifest ? ' (manifest mapper applied)' : ''}`);
-  }
-}
+import { join, dirname, resolve } from 'node:path';
+import { readFileSync, writeFileSync, existsSync, mkdirSync } from 'node:fs';
+import { flattenTokens, type FlatToken } from '../../core/flatten.js';
+import { valuesToCss, type ManifestRow } from '../../adapters/css.js';
+import { emitJSON } from '../../adapters/json.js';
+import { emitJS } from '../../adapters/js.js';
+import type { BuildOptions } from '../types.js';
+
+export async function buildCommand(options: BuildOptions & { [k: string]: any }): Promise<void> {
+  const { loadTokensWithBreakpoint } = await import('../../core/breakpoints.js');
+  const tokens = loadTokensWithBreakpoint();
+  const { flat } = flattenTokens(tokens);
+  let allValues = Object.fromEntries(Object.values(flat).map(t => [t.id, (t as FlatToken).value]));
+  if (options.theme) {
+    const themePath = join('tokens/themes', `${options.theme}.json`);
+    if (existsSync(themePath)) {
+      const themeTokens = JSON.parse(readFileSync(themePath, 'utf8'));
+      Object.assign(allValues, themeTokens);
+    }
+  }
+  const format = options.format || 'css';
+  const defaultOutput = `dist/tokens.${format}`;
+  let manifest: ManifestRow[] | undefined;
+  if (options.mapper) {
+    try {
+      const mp = resolve(options.mapper);
+      if (!existsSync(mp)) throw new Error(`mapper file not found: ${mp}`);
+      manifest = JSON.parse(readFileSync(mp, 'utf8')) as ManifestRow[];
+      if (!Array.isArray(manifest)) throw new Error('mapper manifest must be an array');
+    } catch (e) {
+      const msg = e instanceof Error ? e.message : String(e);
+      console.error(`Failed to load mapper manifest: ${msg}`);
+      process.exit(1);
+    }
+  }
+  const allFormats = options.allFormats ?? options['all-formats'];
+  if (allFormats) {
+    const dir = 'dist'; if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
+    const css = valuesToCss(allValues, { manifest });
+    writeFileSync('dist/tokens.css', css, 'utf8');
+    if (options.dryRun) console.log(css);
+    writeFileSync('dist/tokens.json', emitJSON(allValues, manifest), 'utf8');
+    writeFileSync('dist/tokens.js', emitJS(allValues, manifest), 'utf8');
+    console.log(`Tokens written (all formats) to dist/ (css/json/js)${manifest ? ' with mapper' : ''}`);
+    return;
+  }
+  const dryRun = options.dryRun ?? options['dry-run'];
+  if (format === 'css') {
+    const css = valuesToCss(allValues, { manifest });
+  if (dryRun) { console.log(css); return; }
+    const outPath = options.output || defaultOutput; const dir = dirname(outPath); if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
+    writeFileSync(outPath, css, 'utf8');
+    console.log(`CSS tokens written to ${outPath}${manifest ? ' (manifest mapper applied)' : ''}`);
+  } else if (format === 'json') {
+    const outPath = options.output || defaultOutput; const dir = dirname(outPath); if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
+  if (dryRun) { console.log(emitJSON(allValues, manifest)); return; }
+    writeFileSync(outPath, emitJSON(allValues, manifest), 'utf8');
+    console.log(`JSON tokens written to ${outPath}${manifest ? ' (manifest mapper applied)' : ''}`);
+  } else if (format === 'js') {
+    const outPath = options.output || defaultOutput; const dir = dirname(outPath); if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
+  if (dryRun) { console.log(emitJS(allValues, manifest)); return; }
+    writeFileSync(outPath, emitJS(allValues, manifest), 'utf8');
+    console.log(`JS tokens written to ${outPath}${manifest ? ' (manifest mapper applied)' : ''}`);
+  }
+}

package/cli/commands/graph.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"graph.d.ts","sourceRoot":"","sources":["graph.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAyBhD,wBAAsB,YAAY,CAAC,OAAO,EAAE,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,CA8GvE"}
+{"version":3,"file":"graph.d.ts","sourceRoot":"","sources":["graph.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AA2BhD,wBAAsB,YAAY,CAAC,OAAO,EAAE,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,CAuJvE"}

package/cli/commands/graph.js

@@ -1,6 +1,8 @@
 import { existsSync, readFileSync, writeFileSync, mkdirSync } from 'node:fs';
 import { flattenTokens } from '../../core/flatten.js';
 import { exportGraphImage } from '../../core/image-export.js';
+import { setupConstraints } from '../constraint-registry.js';
+import { loadConfig } from '../config.js';
 // Local helper for non-poset dependency graphs
 function generateDependencyGraph(edges, format) {
     switch (format) {
@@ -103,12 +105,14 @@ export async function graphCommand(options) {
                     const { Engine } = await import('../../core/engine.js');
                     const { MonotonicPlugin, parseSize } = await import('../../core/constraints/monotonic.js');
                     const { MonotonicLightness } = await import('../../core/constraints/monotonic-lightness.js');
-                    const { ThresholdPlugin } = await import('../../core/constraints/threshold.js');
-                    const { flat, edges } = flattenTokens(tokens);
+                    const { flat, edges: depEdges } = flattenTokens(tokens);
                     const init = {};
-                    Object.values(flat).forEach(t => { const ft = t; init[ft.id] = ft.value; });
-                    const engine = new Engine(init, edges);
-                    const allIdsInHasse = new Set([...h.keys(), ...Array.from(h.values()).flatMap(s => [...s])]);
+                    Object.values(flat).forEach((t) => {
+                        const ft = t;
+                        init[ft.id] = ft.value;
+                    });
+                    const engine = new Engine(init, depEdges);
+                    const allIdsInHasse = new Set([...h.keys(), ...Array.from(h.values()).flatMap((s) => [...s])]);
                     let issues = [];
                     if (name === 'color') {
                         const colorOrders = order;
@@ -118,10 +122,20 @@ export async function graphCommand(options) {
                         const numericOrders = order;
                         issues = MonotonicPlugin(numericOrders, parseSize, 'monotonic').evaluate(engine, allIdsInHasse);
                     }
-                    const thresholdIssues = ThresholdPlugin([{ id: 'control.size.min', op: '>=', valuePx: 44, where: 'Touch target (WCAG / Apple HIG)' }]).evaluate(engine, allIdsInHasse);
-                    issues.push(...thresholdIssues);
+                    // Attach threshold (and any other runtime constraints) respecting config flags
+                    const cfgRes = loadConfig(undefined);
+                    if (cfgRes.ok) {
+                        const config = cfgRes.value;
+                        const knownIds = new Set(Object.keys(flat));
+                        setupConstraints(engine, { config, bp: breakpoint }, { knownIds });
+                        const runtimeIssues = engine.evaluate(allIdsInHasse);
+                        issues.push(...runtimeIssues);
+                    }
                     const severityRank = { error: 2, warn: 1 };
-                    const filteredIssues = issues.filter(it => { const level = it.level || 'error'; return severityRank[level] >= severityRank[minSeverity]; });
+                    const filteredIssues = issues.filter((it) => {
+                        const level = it.level || 'error';
+                        return severityRank[level] >= severityRank[minSeverity];
+                    });
                     const edgeViol = new Set();
                     const nodeViol = new Set();
                     if (labelViolations)
@@ -134,13 +148,15 @@ export async function graphCommand(options) {
                             nodeViol.add(b);
                             if (labelViolations && edgeLabels) {
                                 let label = it.message ?? 'violation';
-                                if (labelTruncate > 0 && label.length > labelTruncate)
+                                if (labelTruncate > 0 && label.length > labelTruncate) {
                                     label = label.slice(0, labelTruncate - 1) + '…';
+                                }
                                 edgeLabels.set(`${a}|${b}`, label);
                             }
                         }
-                        else if (typeof it.id === 'string')
+                        else if (typeof it.id === 'string') {
                             nodeViol.add(it.id);
+                        }
                     }
                     highlight = { nodes: nodeViol, edges: edgeViol, color: violationColor };
                     if (onlyViolations) {

package/cli/commands/graph.ts

@@ -1,137 +1,180 @@
-import { existsSync, readFileSync, writeFileSync, mkdirSync } from 'node:fs';
-import type { GraphOptions } from '../types.js';
-import { flattenTokens, type FlatToken } from '../../core/flatten.js';
-import { exportGraphImage } from '../../core/image-export.js';
-
-// Local helper for non-poset dependency graphs
-function generateDependencyGraph(edges: Array<[string, string]>, format: string): string {
-  switch (format) {
-    case 'dot': {
-      const dotNodes = new Set<string>(); edges.forEach(([f,t]) => { dotNodes.add(f); dotNodes.add(t); });
-      let dot = 'digraph tokens {\n  rankdir=LR;\n  node [shape=box, style=rounded];\n\n';
-      dotNodes.forEach(n => { dot += `  "${n}";\n`; });
-      dot += '\n'; edges.forEach(([f,t]) => { dot += `  "${f}" -> "${t}";\n`; });
-      return dot + '}\n'; }
-    case 'mermaid': {
-      let mermaid = 'graph LR\n'; const mermaidNodes = new Set<string>();
-      edges.forEach(([from,to]) => { const fromId = from.replace(/[^a-zA-Z0-9]/g,'_'); const toId = to.replace(/[^a-zA-Z0-9]/g,'_');
-        if (!mermaidNodes.has(fromId)) { mermaid += `  ${fromId}["${from}"]\n`; mermaidNodes.add(fromId); }
-        if (!mermaidNodes.has(toId)) { mermaid += `  ${toId}["${to}"]\n`; mermaidNodes.add(toId); }
-        mermaid += `  ${fromId} --> ${toId}\n`; });
-      return mermaid; }
-    case 'json':
-    default: return JSON.stringify({ nodes: Array.from(new Set(edges.flat())), edges }, null, 2);
-  }
-}
-
-export async function graphCommand(options: GraphOptions): Promise<void> {
-  const { parseBreakpoints } = await import('../../core/breakpoints.js');
-  const bps = parseBreakpoints(process.argv);
-  const plan = bps.length ? bps : [undefined];
-  if (options.hasse) {
-    const name = options.hasse;
-  const bundle = (options as any).bundle;
-  const fmt = (options.format === 'json' ? 'mermaid' : options.format) as 'mermaid' | 'dot' | 'svg' | 'png';
-    const imageFrom = options.imageFrom || 'mermaid';
-    const filterPrefixes = options.filterPrefix ? options.filterPrefix.split(',').map(s=>s.trim()).filter(Boolean) : [];
-    const excludePrefixes = options.excludePrefix ? options.excludePrefix.split(',').map(s=>s.trim()).filter(Boolean) : [];
-    const onlyViolations = options.onlyViolations || false;
-    const highlightViolations = options.highlightViolations || false;
-    const violationColor = options.violationColor || '#ff2d55';
-    const labelViolations = options.labelViolations || false;
-    const labelTruncate = Math.max(0, options.labelTruncate || 0);
-    const minSeverity = options.minSeverity || 'warn';
-    const focus = options.focus; const radius = Math.max(0, options.radius || 1);
-    for (const breakpoint of plan) {
-      const suffixParts: string[] = [];
-      if (breakpoint) suffixParts.push(breakpoint);
-      if (filterPrefixes.length) suffixParts.push(filterPrefixes.join('_'));
-      if (excludePrefixes.length) suffixParts.push('not-' + excludePrefixes.join('_'));
-      if (focus) suffixParts.push(`focus-${focus.replace(/[^\w.*-]/g,'_')}-r${radius}`);
-      if (onlyViolations) suffixParts.push('violations'); else if (highlightViolations) suffixParts.push('highlight-violations');
-      if (labelViolations) suffixParts.push('labeled');
-      const suffix = suffixParts.length ? '-' + suffixParts.map(s=>s.replace(/[^\w.-]/g,'_')).join('__') : '';
-      const baseFmt = fmt === 'svg' || fmt === 'png' ? (imageFrom === 'dot' ? 'dot' : 'mermaid') : fmt;
-      const ext = baseFmt === 'mermaid' ? 'mmd' : 'dot';
-      const outDir = 'dist/graphs'; const baseFile = `${outDir}/${name}${suffix}-hasse.${ext}`;
-      try {
-        const src = `themes/${name}.order.json`;
-        if (!existsSync(src)) { console.error(`❌ Order constraint file not found: ${src}`); process.exit(1); }
-        const { order } = JSON.parse(readFileSync(src, 'utf8'));
-        const { buildPoset, transitiveReduction, toMermaidHasseStyled, toDotHasseStyled, filterByPrefix, filterExcludePrefix, khopSubgraph, pickSeedsByPattern } = await import('../../core/poset.js');
-        let g = buildPoset(order);
-        if (filterPrefixes.length) g = filterByPrefix(g, filterPrefixes);
-        if (excludePrefixes.length) g = filterExcludePrefix(g, excludePrefixes);
-        let h = transitiveReduction(g);
-        if (focus) { const nodes = new Set<string>([...h.keys(), ...Array.from(h.values()).flatMap(s=>[...s])]); const seeds = pickSeedsByPattern(nodes, focus); h = khopSubgraph(h, seeds, radius); }
-        let highlight: { nodes: Set<string>; edges: Set<string>; color?: string } | undefined; let edgeLabels: Map<string,string> | undefined;
-        if (onlyViolations || highlightViolations || labelViolations) {
-          const { loadTokensWithBreakpoint } = await import('../../core/breakpoints.js');
-            const tokens = loadTokensWithBreakpoint(breakpoint); const { flattenTokens } = await import('../../core/flatten.js');
-            const { Engine } = await import('../../core/engine.js');
-            const { MonotonicPlugin, parseSize } = await import('../../core/constraints/monotonic.js');
-            const { MonotonicLightness } = await import('../../core/constraints/monotonic-lightness.js');
-            const { ThresholdPlugin } = await import('../../core/constraints/threshold.js');
-            const { flat, edges } = flattenTokens(tokens); const init: Record<string,string|number> = {}; Object.values(flat).forEach(t => { const ft = t as FlatToken; init[ft.id] = ft.value; });
-            const engine = new Engine(init, edges);
-            const allIdsInHasse = new Set<string>([...h.keys(), ...Array.from(h.values()).flatMap(s=>[...s])]);
-            let issues: any[] = [];
-            if (name === 'color') {
-              const colorOrders = order as [string, '<='|'>=', string][]; issues = MonotonicLightness(colorOrders).evaluate(engine, allIdsInHasse);
-            } else {
-              const numericOrders = order as [string, '<='|'>=', string][]; issues = MonotonicPlugin(numericOrders, parseSize, 'monotonic').evaluate(engine, allIdsInHasse);
-            }
-            const thresholdIssues = ThresholdPlugin([{ id: 'control.size.min', op: '>=', valuePx: 44, where: 'Touch target (WCAG / Apple HIG)' }]).evaluate(engine, allIdsInHasse); issues.push(...thresholdIssues);
-            const severityRank = { error: 2, warn: 1 } as const;
-            const filteredIssues = issues.filter(it => { const level = (it.level as 'warn'|'error') || 'error'; return severityRank[level] >= severityRank[minSeverity]; });
-            const edgeViol = new Set<string>(); const nodeViol = new Set<string>(); if (labelViolations) edgeLabels = new Map<string,string>();
-            for (const it of filteredIssues) {
-              if (typeof it.id === 'string' && it.id.includes('|')) { const [a,b] = it.id.split('|'); edgeViol.add(`${a}|${b}`); nodeViol.add(a); nodeViol.add(b); if (labelViolations && edgeLabels) { let label = it.message ?? 'violation'; if (labelTruncate > 0 && label.length > labelTruncate) label = label.slice(0, labelTruncate - 1) + '…'; edgeLabels.set(`${a}|${b}`, label); } }
-              else if (typeof it.id === 'string') nodeViol.add(it.id);
-            }
-            highlight = { nodes: nodeViol, edges: edgeViol, color: violationColor };
-            if (onlyViolations) {
-              const pruned: Map<string, Set<string>> = new Map();
-              for (const [u, vs] of h) {
-                for (const v of vs) {
-                  if (edgeViol.has(`${u}|${v}`) || nodeViol.has(u) || nodeViol.has(v)) { if (!pruned.has(u)) pruned.set(u, new Set()); pruned.get(u)!.add(v); if (!pruned.has(v)) pruned.set(v, new Set()); }
-                }
-              }
-              h = pruned;
-            }
-        }
-        const bpLabel = breakpoint ? ` @${breakpoint}` : '';
-        const title = `${name}${suffix ? ' ' + suffix : ''}${bpLabel} (Hasse)`;
-        const mermaidContent = toMermaidHasseStyled(h, { title, highlight, labels: edgeLabels });
-        const dotContent = toDotHasseStyled(h, { title, highlight, labels: edgeLabels });
-        mkdirSync(outDir, { recursive: true });
-        if (bundle) {
-          const mFile = baseFile.replace(/\.dot$/,'-bundle.mmd').replace(/\.mmd$/,'-bundle.mmd');
-          const dFile = baseFile.replace(/\.mmd$/,'-bundle.dot').replace(/\.dot$/,'-bundle.dot');
-          writeFileSync(mFile, mermaidContent);
-          writeFileSync(dFile, dotContent);
-        }
-        const baseContent = baseFmt === 'mermaid' ? mermaidContent : dotContent;
-        writeFileSync(baseFile, baseContent);
-        if (fmt === 'svg' || fmt === 'png') {
-          const imgFile = `${outDir}/${name}${suffix}-hasse.${fmt}`;
-          const { ok, hint } = exportGraphImage(baseFile, imgFile, fmt, imageFrom);
-          if (ok) console.log(`✓ Wrote ${baseFile} and ${imgFile}`); else console.log(`✓ Wrote ${baseFile} (image export skipped). ${hint}`);
-        } else {
-          const hasViolations = highlight && (highlight.edges.size > 0 || highlight.nodes.size > 0);
-          const message = (onlyViolations || highlightViolations) && !hasViolations ? `✓ Wrote ${baseFile} (no violations in slice)` : `✓ Wrote ${baseFile}`;
-          console.log(message);
-        }
-      } catch (error) { console.error(`❌ Error generating Hasse diagram for ${breakpoint}:`, error); process.exit(1); }
-    }
-    return; }
-  for (const breakpoint of plan) {
-    const { loadTokensWithBreakpoint } = await import('../../core/breakpoints.js');
-    const tokens = loadTokensWithBreakpoint(breakpoint); const { edges } = flattenTokens(tokens);
-    let filteredEdges = edges;
-    if (options.filter) { const filterRegex = new RegExp(options.filter); filteredEdges = edges.filter(([from,to]) => filterRegex.test(from) || filterRegex.test(to)); }
-    const format = options.format || 'json'; const graph = generateDependencyGraph(filteredEdges, format);
-    if (options.output) { const bpSuffix = breakpoint ? `.${breakpoint}` : ''; const outputPath = options.output.replace(/(\.[^.]+)$/ , `${bpSuffix}$1`); writeFileSync(outputPath, graph, 'utf8'); console.log(`Dependency graph written to: ${outputPath}`); }
-    else { if (breakpoint) console.log(`\n=== ${breakpoint.toUpperCase()} ===`); console.log(graph); }
-  }
-}
+import { existsSync, readFileSync, writeFileSync, mkdirSync } from 'node:fs';
+import type { GraphOptions } from '../types.js';
+import { flattenTokens, type FlatToken } from '../../core/flatten.js';
+import { exportGraphImage } from '../../core/image-export.js';
+import { setupConstraints } from '../constraint-registry.js';
+import { loadConfig } from '../config.js';
+
+// Local helper for non-poset dependency graphs
+function generateDependencyGraph(edges: Array<[string, string]>, format: string): string {
+  switch (format) {
+    case 'dot': {
+      const dotNodes = new Set<string>(); edges.forEach(([f,t]) => { dotNodes.add(f); dotNodes.add(t); });
+      let dot = 'digraph tokens {\n  rankdir=LR;\n  node [shape=box, style=rounded];\n\n';
+      dotNodes.forEach(n => { dot += `  "${n}";\n`; });
+      dot += '\n'; edges.forEach(([f,t]) => { dot += `  "${f}" -> "${t}";\n`; });
+      return dot + '}\n'; }
+    case 'mermaid': {
+      let mermaid = 'graph LR\n'; const mermaidNodes = new Set<string>();
+      edges.forEach(([from,to]) => { const fromId = from.replace(/[^a-zA-Z0-9]/g,'_'); const toId = to.replace(/[^a-zA-Z0-9]/g,'_');
+        if (!mermaidNodes.has(fromId)) { mermaid += `  ${fromId}["${from}"]\n`; mermaidNodes.add(fromId); }
+        if (!mermaidNodes.has(toId)) { mermaid += `  ${toId}["${to}"]\n`; mermaidNodes.add(toId); }
+        mermaid += `  ${fromId} --> ${toId}\n`; });
+      return mermaid; }
+    case 'json':
+    default: return JSON.stringify({ nodes: Array.from(new Set(edges.flat())), edges }, null, 2);
+  }
+}
+
+export async function graphCommand(options: GraphOptions): Promise<void> {
+  const { parseBreakpoints } = await import('../../core/breakpoints.js');
+  const bps = parseBreakpoints(process.argv);
+  const plan = bps.length ? bps : [undefined];
+  if (options.hasse) {
+    const name = options.hasse;
+  const bundle = (options as any).bundle;
+  const fmt = (options.format === 'json' ? 'mermaid' : options.format) as 'mermaid' | 'dot' | 'svg' | 'png';
+    const imageFrom = options.imageFrom || 'mermaid';
+    const filterPrefixes = options.filterPrefix ? options.filterPrefix.split(',').map(s=>s.trim()).filter(Boolean) : [];
+    const excludePrefixes = options.excludePrefix ? options.excludePrefix.split(',').map(s=>s.trim()).filter(Boolean) : [];
+    const onlyViolations = options.onlyViolations || false;
+    const highlightViolations = options.highlightViolations || false;
+    const violationColor = options.violationColor || '#ff2d55';
+    const labelViolations = options.labelViolations || false;
+    const labelTruncate = Math.max(0, options.labelTruncate || 0);
+    const minSeverity = options.minSeverity || 'warn';
+    const focus = options.focus; const radius = Math.max(0, options.radius || 1);
+    for (const breakpoint of plan) {
+      const suffixParts: string[] = [];
+      if (breakpoint) suffixParts.push(breakpoint);
+      if (filterPrefixes.length) suffixParts.push(filterPrefixes.join('_'));
+      if (excludePrefixes.length) suffixParts.push('not-' + excludePrefixes.join('_'));
+      if (focus) suffixParts.push(`focus-${focus.replace(/[^\w.*-]/g,'_')}-r${radius}`);
+      if (onlyViolations) suffixParts.push('violations'); else if (highlightViolations) suffixParts.push('highlight-violations');
+      if (labelViolations) suffixParts.push('labeled');
+      const suffix = suffixParts.length ? '-' + suffixParts.map(s=>s.replace(/[^\w.-]/g,'_')).join('__') : '';
+      const baseFmt = fmt === 'svg' || fmt === 'png' ? (imageFrom === 'dot' ? 'dot' : 'mermaid') : fmt;
+      const ext = baseFmt === 'mermaid' ? 'mmd' : 'dot';
+      const outDir = 'dist/graphs'; const baseFile = `${outDir}/${name}${suffix}-hasse.${ext}`;
+      try {
+        const src = `themes/${name}.order.json`;
+        if (!existsSync(src)) { console.error(`❌ Order constraint file not found: ${src}`); process.exit(1); }
+        const { order } = JSON.parse(readFileSync(src, 'utf8'));
+        const { buildPoset, transitiveReduction, toMermaidHasseStyled, toDotHasseStyled, filterByPrefix, filterExcludePrefix, khopSubgraph, pickSeedsByPattern } = await import('../../core/poset.js');
+        let g = buildPoset(order);
+        if (filterPrefixes.length) g = filterByPrefix(g, filterPrefixes);
+        if (excludePrefixes.length) g = filterExcludePrefix(g, excludePrefixes);
+        let h = transitiveReduction(g);
+        if (focus) { const nodes = new Set<string>([...h.keys(), ...Array.from(h.values()).flatMap(s=>[...s])]); const seeds = pickSeedsByPattern(nodes, focus); h = khopSubgraph(h, seeds, radius); }
+        let highlight: { nodes: Set<string>; edges: Set<string>; color?: string } | undefined; let edgeLabels: Map<string,string> | undefined;
+        if (onlyViolations || highlightViolations || labelViolations) {
+          const { loadTokensWithBreakpoint } = await import('../../core/breakpoints.js');
+          const tokens = loadTokensWithBreakpoint(breakpoint);
+          const { flattenTokens } = await import('../../core/flatten.js');
+          const { Engine } = await import('../../core/engine.js');
+          const { MonotonicPlugin, parseSize } = await import('../../core/constraints/monotonic.js');
+          const { MonotonicLightness } = await import('../../core/constraints/monotonic-lightness.js');
+
+          const { flat, edges: depEdges } = flattenTokens(tokens);
+          const init: Record<string, string | number> = {};
+          Object.values(flat).forEach((t) => {
+            const ft = t as FlatToken;
+            init[ft.id] = ft.value;
+          });
+          const engine = new Engine(init, depEdges);
+
+          const allIdsInHasse = new Set<string>([...h.keys(), ...Array.from(h.values()).flatMap((s) => [...s])]);
+          let issues: any[] = [];
+          if (name === 'color') {
+            const colorOrders = order as [string, '<=' | '>=', string][];
+            issues = MonotonicLightness(colorOrders).evaluate(engine, allIdsInHasse);
+          } else {
+            const numericOrders = order as [string, '<=' | '>=', string][];
+            issues = MonotonicPlugin(numericOrders, parseSize, 'monotonic').evaluate(engine, allIdsInHasse);
+          }
+
+          // Attach threshold (and any other runtime constraints) respecting config flags
+          const cfgRes = loadConfig(undefined);
+          if (cfgRes.ok) {
+            const config = cfgRes.value;
+            const knownIds = new Set(Object.keys(flat as Record<string, FlatToken>));
+            setupConstraints(engine, { config, bp: breakpoint }, { knownIds });
+            const runtimeIssues = engine.evaluate(allIdsInHasse);
+            issues.push(...runtimeIssues);
+          }
+
+          const severityRank = { error: 2, warn: 1 } as const;
+          const filteredIssues = issues.filter((it) => {
+            const level = (it.level as 'warn' | 'error') || 'error';
+            return severityRank[level] >= severityRank[minSeverity];
+          });
+          const edgeViol = new Set<string>();
+          const nodeViol = new Set<string>();
+          if (labelViolations) edgeLabels = new Map<string, string>();
+          for (const it of filteredIssues) {
+            if (typeof it.id === 'string' && it.id.includes('|')) {
+              const [a, b] = it.id.split('|');
+              edgeViol.add(`${a}|${b}`);
+              nodeViol.add(a);
+              nodeViol.add(b);
+              if (labelViolations && edgeLabels) {
+                let label = it.message ?? 'violation';
+                if (labelTruncate > 0 && label.length > labelTruncate) {
+                  label = label.slice(0, labelTruncate - 1) + '…';
+                }
+                edgeLabels.set(`${a}|${b}`, label);
+              }
+            } else if (typeof it.id === 'string') {
+              nodeViol.add(it.id);
+            }
+          }
+          highlight = { nodes: nodeViol, edges: edgeViol, color: violationColor };
+          if (onlyViolations) {
+            const pruned: Map<string, Set<string>> = new Map();
+            for (const [u, vs] of h) {
+              for (const v of vs) {
+                if (edgeViol.has(`${u}|${v}`) || nodeViol.has(u) || nodeViol.has(v)) {
+                  if (!pruned.has(u)) pruned.set(u, new Set());
+                  pruned.get(u)!.add(v);
+                  if (!pruned.has(v)) pruned.set(v, new Set());
+                }
+              }
+            }
+            h = pruned;
+          }
+        }
+        const bpLabel = breakpoint ? ` @${breakpoint}` : '';
+        const title = `${name}${suffix ? ' ' + suffix : ''}${bpLabel} (Hasse)`;
+        const mermaidContent = toMermaidHasseStyled(h, { title, highlight, labels: edgeLabels });
+        const dotContent = toDotHasseStyled(h, { title, highlight, labels: edgeLabels });
+        mkdirSync(outDir, { recursive: true });
+        if (bundle) {
+          const mFile = baseFile.replace(/\.dot$/,'-bundle.mmd').replace(/\.mmd$/,'-bundle.mmd');
+          const dFile = baseFile.replace(/\.mmd$/,'-bundle.dot').replace(/\.dot$/,'-bundle.dot');
+          writeFileSync(mFile, mermaidContent);
+          writeFileSync(dFile, dotContent);
+        }
+        const baseContent = baseFmt === 'mermaid' ? mermaidContent : dotContent;
+        writeFileSync(baseFile, baseContent);
+        if (fmt === 'svg' || fmt === 'png') {
+          const imgFile = `${outDir}/${name}${suffix}-hasse.${fmt}`;
+          const { ok, hint } = exportGraphImage(baseFile, imgFile, fmt, imageFrom);
+          if (ok) console.log(`✓ Wrote ${baseFile} and ${imgFile}`); else console.log(`✓ Wrote ${baseFile} (image export skipped). ${hint}`);
+        } else {
+          const hasViolations = highlight && (highlight.edges.size > 0 || highlight.nodes.size > 0);
+          const message = (onlyViolations || highlightViolations) && !hasViolations ? `✓ Wrote ${baseFile} (no violations in slice)` : `✓ Wrote ${baseFile}`;
+          console.log(message);
+        }
+      } catch (error) { console.error(`❌ Error generating Hasse diagram for ${breakpoint}:`, error); process.exit(1); }
+    }
+    return; }
+  for (const breakpoint of plan) {
+    const { loadTokensWithBreakpoint } = await import('../../core/breakpoints.js');
+    const tokens = loadTokensWithBreakpoint(breakpoint); const { edges } = flattenTokens(tokens);
+    let filteredEdges = edges;
+    if (options.filter) { const filterRegex = new RegExp(options.filter); filteredEdges = edges.filter(([from,to]) => filterRegex.test(from) || filterRegex.test(to)); }
+    const format = options.format || 'json'; const graph = generateDependencyGraph(filteredEdges, format);
+    if (options.output) { const bpSuffix = breakpoint ? `.${breakpoint}` : ''; const outputPath = options.output.replace(/(\.[^.]+)$/ , `${bpSuffix}$1`); writeFileSync(outputPath, graph, 'utf8'); console.log(`Dependency graph written to: ${outputPath}`); }
+    else { if (breakpoint) console.log(`\n=== ${breakpoint.toUpperCase()} ===`); console.log(graph); }
+  }
+}

package/cli/commands/index.ts

@@ -1,7 +1,7 @@
-export { setCommand } from './set.js';
-export { buildCommand } from './build.js';
-export { validateCommand } from './validate.js';
-export { graphCommand } from './graph.js';
-export { whyCommand } from './why.js';
-export { patchCommand } from './patch.js';
-export { patchApplyCommand } from './patch-apply.js';
+export { setCommand } from './set.js';
+export { buildCommand } from './build.js';
+export { validateCommand } from './validate.js';
+export { graphCommand } from './graph.js';
+export { whyCommand } from './why.js';
+export { patchCommand } from './patch.js';
+export { patchApplyCommand } from './patch-apply.js';