design-constraint-validator 1.0.0 → 2.0.1

package/adapters/README.md

@@ -1,46 +1,46 @@
-# Adapters
-
-DCV supports multiple **input shapes** via lightweight adapters that normalize external token formats into DCV's internal model.
-
-## Goals
-- Accept common design-token ecosystems with zero/low friction.
-- Preserve **IDs** and **provenance** so diagnostics remain meaningful.
-- Avoid mutation: adapters are **pure mappings**.
-
-## Currently targeted
-- **Style Dictionary** (`*.json`)  
-  - Map `tokens.foo.bar.value` → DCV node id `tokens.foo.bar`
-  - Preserve `type`, `description` if present
-- **Tokens Studio JSON** (Figma plugin export)  
-  - Map `$value`, `$type`, `$description` to DCV fields
-- **DTCG** schema
-  - Normalize `value`, `type`, `extensions` to DCV keys
-
-## Minimal internal shape (simplified)
-
-```ts
-type DCVToken = {
-  id: string;                 // stable dot-path id
-  type?: string;              // 'color' | 'dimension' | ...
-  value: unknown;             // normalized primitive (hex, number, etc.)
-  meta?: Record<string, any>; // passthrough fields (description, file, source)
-};
-```
-
-## Writing a custom adapter
-
-```ts
-export function fromMyFormat(json: any): DCVToken[] {
-  // 1) walk your input
-  // 2) produce DCVToken[] with stable ids & normalized values
-  // 3) do not throw on unknown fields; pass through to meta
-  return tokens;
-}
-```
-
-**Tip:** Keep **IDs stable**; diagnostics and graphs depend on them.
-
-## Policy inputs
-
-Policies are separate JSONs (e.g., AA, AAA, org presets).
-Adapters do **not** alter policy files; they only map tokens.
+# Adapters
+
+DCV supports multiple **input shapes** via lightweight adapters that normalize external token formats into DCV's internal model.
+
+## Goals
+- Accept common design-token ecosystems with zero/low friction.
+- Preserve **IDs** and **provenance** so diagnostics remain meaningful.
+- Avoid mutation: adapters are **pure mappings**.
+
+## Currently targeted
+- **Style Dictionary** (`*.json`)  
+  - Map `tokens.foo.bar.value` → DCV node id `tokens.foo.bar`
+  - Preserve `type`, `description` if present
+- **Tokens Studio JSON** (Figma plugin export)  
+  - Map `$value`, `$type`, `$description` to DCV fields
+- **DTCG** schema
+  - Normalize `value`, `type`, `extensions` to DCV keys
+
+## Minimal internal shape (simplified)
+
+```ts
+type DCVToken = {
+  id: string;                 // stable dot-path id
+  type?: string;              // 'color' | 'dimension' | ...
+  value: unknown;             // normalized primitive (hex, number, etc.)
+  meta?: Record<string, any>; // passthrough fields (description, file, source)
+};
+```
+
+## Writing a custom adapter
+
+```ts
+export function fromMyFormat(json: any): DCVToken[] {
+  // 1) walk your input
+  // 2) produce DCVToken[] with stable ids & normalized values
+  // 3) do not throw on unknown fields; pass through to meta
+  return tokens;
+}
+```
+
+**Tip:** Keep **IDs stable**; diagnostics and graphs depend on them.
+
+## Policy inputs
+
+Policies are separate JSONs (e.g., AA, AAA, org presets).
+Adapters do **not** alter policy files; they only map tokens.

package/adapters/css.ts

@@ -1,116 +1,116 @@
-// adapters/css.ts
-export type TokenId = string;
-export type TokenValue = string | number;
-
-// Turn a token ID into a CSS custom property name.
-// Default: "--dimension-spacing-scale-4" (neutral, reversible).
-export type VarMapper = (id: TokenId) => string | null;
-
-export const defaultVarMapper: VarMapper = (id) =>
-  `--${id.replace(/[^a-z0-9.]/gi, "-").replace(/\.+/g, "-").toLowerCase()}`;
-
-// Manifest driven mapping allowing canonical + legacy aliases.
-export type ManifestRow = { id: string; canonicalVar?: string | null; legacyVars?: string[] };
-
-export interface VarMapping { canonical: string; aliases: string[] };
-
-/**
- * Build a mapping of token id -> {canonical, aliases} from an optional manifest.
- * If no manifest provided, falls back to defaultVarMapper with no aliases.
- */
-export function buildVarMapping(ids: Iterable<string>, manifest?: ManifestRow[]): Map<string, VarMapping> {
-  const map = new Map<string, VarMapping>();
-  const byId: Map<string, ManifestRow> = new Map();
-  if (manifest) {
-    for (const row of manifest) {
-      if (!row || !row.id) continue;
-      byId.set(row.id, row);
-    }
-  }
-  for (const id of ids) {
-    const row = byId.get(id);
-  // Always fall back to generated name so canonical is never null.
-  const canonical = ((row?.canonicalVar ? row.canonicalVar.trim() : "") || defaultVarMapper(id)) as string;
-    const aliasSet = new Set<string>();
-    (row?.legacyVars || []).forEach(a => {
-      if (!a) return;
-      const alias = a.trim();
-      if (alias && alias !== canonical) aliasSet.add(alias);
-    });
-    map.set(id, { canonical, aliases: Array.from(aliasSet) });
-  }
-  return map;
-}
-
-export function makeManifestVarMapper(manifest: ManifestRow[]): VarMapper {
-  const byId = new Map<string, string>();
-  for (const m of manifest) if (m.canonicalVar) byId.set(m.id, m.canonicalVar);
-  return (id) => byId.get(id) ?? defaultVarMapper(id);
-}
-
-// Build a CSS block from a map of token IDs to values.
-function buildCssBlock(
-  values: Record<TokenId, TokenValue>,
-  opts: { mapVar?: VarMapper; manifest?: ManifestRow[] }
-): string {
-  const decls: string[] = [];
-  if (opts.manifest) {
-    const mapping = buildVarMapping(Object.keys(values), opts.manifest);
-    for (const [id, val] of Object.entries(values)) {
-      const m = mapping.get(id);
-      if (!m) continue;
-      const v = String(val).trim();
-      if (!v) continue;
-      decls.push(`${m.canonical}: ${v};`);
-      for (const alias of m.aliases) {
-        decls.push(`${alias}: var(${m.canonical});`);
-      }
-    }
-  } else {
-    const mapVar = opts.mapVar ?? defaultVarMapper;
-    for (const [id, val] of Object.entries(values)) {
-      const cssVar = mapVar(id);
-      if (!cssVar) continue; // skip if intentionally unmapped
-      const v = String(val).trim();
-      if (v) decls.push(`${cssVar}: ${v};`);
-    }
-  }
-  return decls.join("\n    ");
-}
-
-/**
- * Generate CSS for a *full* :root block (use for initial build from flat values).
- */
-export function valuesToCss(
-  values: Record<TokenId, TokenValue>,
-  opts?: { selector?: string; layer?: string; mapVar?: VarMapper; manifest?: ManifestRow[] }
-): string {
-  const selector = opts?.selector ?? ":root";
-  const layer = opts?.layer ?? "tokens";
-  const body = buildCssBlock(values, { mapVar: opts?.mapVar, manifest: opts?.manifest });
-  return `@layer ${layer} {\n  ${selector} {\n    ${body}\n  }\n}`;
-}
-
-/**
- * Generate CSS for a *patch* (small overlay you can inject at runtime).
- */
-export function patchToCss(
-  patch: Record<TokenId, TokenValue>,
-  opts?: { selector?: string; layer?: string; mapVar?: VarMapper; manifest?: ManifestRow[] }
-): string {
-  const selector = opts?.selector ?? ":root";
-  const layer = opts?.layer ?? "tokens-overrides";
-  const body = buildCssBlock(patch, { mapVar: opts?.mapVar, manifest: opts?.manifest });
-  return `@layer ${layer} {\n  ${selector} {\n    ${body}\n  }\n}`;
-}
-
-/**
- * (Browser only) Replace the contents of a <style> element with the given CSS.
- */
-export function applyCssToStyleEl(styleEl: { textContent: string | null }, cssText: string) {
-  styleEl.textContent = cssText;
-}
-
-// NOTE: The design studio -> catalog preview iframe token sync uses a simplified
-// :root { --token: value } block (no @layer) built ad-hoc. For a layered build
-// prefer valuesToCss / patchToCss helpers above.
+// adapters/css.ts
+export type TokenId = string;
+export type TokenValue = string | number;
+
+// Turn a token ID into a CSS custom property name.
+// Default: "--dimension-spacing-scale-4" (neutral, reversible).
+export type VarMapper = (id: TokenId) => string | null;
+
+export const defaultVarMapper: VarMapper = (id) =>
+  `--${id.replace(/[^a-z0-9.]/gi, "-").replace(/\.+/g, "-").toLowerCase()}`;
+
+// Manifest driven mapping allowing canonical + legacy aliases.
+export type ManifestRow = { id: string; canonicalVar?: string | null; legacyVars?: string[] };
+
+export interface VarMapping { canonical: string; aliases: string[] };
+
+/**
+ * Build a mapping of token id -> {canonical, aliases} from an optional manifest.
+ * If no manifest provided, falls back to defaultVarMapper with no aliases.
+ */
+export function buildVarMapping(ids: Iterable<string>, manifest?: ManifestRow[]): Map<string, VarMapping> {
+  const map = new Map<string, VarMapping>();
+  const byId: Map<string, ManifestRow> = new Map();
+  if (manifest) {
+    for (const row of manifest) {
+      if (!row || !row.id) continue;
+      byId.set(row.id, row);
+    }
+  }
+  for (const id of ids) {
+    const row = byId.get(id);
+  // Always fall back to generated name so canonical is never null.
+  const canonical = ((row?.canonicalVar ? row.canonicalVar.trim() : "") || defaultVarMapper(id)) as string;
+    const aliasSet = new Set<string>();
+    (row?.legacyVars || []).forEach(a => {
+      if (!a) return;
+      const alias = a.trim();
+      if (alias && alias !== canonical) aliasSet.add(alias);
+    });
+    map.set(id, { canonical, aliases: Array.from(aliasSet) });
+  }
+  return map;
+}
+
+export function makeManifestVarMapper(manifest: ManifestRow[]): VarMapper {
+  const byId = new Map<string, string>();
+  for (const m of manifest) if (m.canonicalVar) byId.set(m.id, m.canonicalVar);
+  return (id) => byId.get(id) ?? defaultVarMapper(id);
+}
+
+// Build a CSS block from a map of token IDs to values.
+function buildCssBlock(
+  values: Record<TokenId, TokenValue>,
+  opts: { mapVar?: VarMapper; manifest?: ManifestRow[] }
+): string {
+  const decls: string[] = [];
+  if (opts.manifest) {
+    const mapping = buildVarMapping(Object.keys(values), opts.manifest);
+    for (const [id, val] of Object.entries(values)) {
+      const m = mapping.get(id);
+      if (!m) continue;
+      const v = String(val).trim();
+      if (!v) continue;
+      decls.push(`${m.canonical}: ${v};`);
+      for (const alias of m.aliases) {
+        decls.push(`${alias}: var(${m.canonical});`);
+      }
+    }
+  } else {
+    const mapVar = opts.mapVar ?? defaultVarMapper;
+    for (const [id, val] of Object.entries(values)) {
+      const cssVar = mapVar(id);
+      if (!cssVar) continue; // skip if intentionally unmapped
+      const v = String(val).trim();
+      if (v) decls.push(`${cssVar}: ${v};`);
+    }
+  }
+  return decls.join("\n    ");
+}
+
+/**
+ * Generate CSS for a *full* :root block (use for initial build from flat values).
+ */
+export function valuesToCss(
+  values: Record<TokenId, TokenValue>,
+  opts?: { selector?: string; layer?: string; mapVar?: VarMapper; manifest?: ManifestRow[] }
+): string {
+  const selector = opts?.selector ?? ":root";
+  const layer = opts?.layer ?? "tokens";
+  const body = buildCssBlock(values, { mapVar: opts?.mapVar, manifest: opts?.manifest });
+  return `@layer ${layer} {\n  ${selector} {\n    ${body}\n  }\n}`;
+}
+
+/**
+ * Generate CSS for a *patch* (small overlay you can inject at runtime).
+ */
+export function patchToCss(
+  patch: Record<TokenId, TokenValue>,
+  opts?: { selector?: string; layer?: string; mapVar?: VarMapper; manifest?: ManifestRow[] }
+): string {
+  const selector = opts?.selector ?? ":root";
+  const layer = opts?.layer ?? "tokens-overrides";
+  const body = buildCssBlock(patch, { mapVar: opts?.mapVar, manifest: opts?.manifest });
+  return `@layer ${layer} {\n  ${selector} {\n    ${body}\n  }\n}`;
+}
+
+/**
+ * (Browser only) Replace the contents of a <style> element with the given CSS.
+ */
+export function applyCssToStyleEl(styleEl: { textContent: string | null }, cssText: string) {
+  styleEl.textContent = cssText;
+}
+
+// NOTE: The design studio -> catalog preview iframe token sync uses a simplified
+// :root { --token: value } block (no @layer) built ad-hoc. For a layered build
+// prefer valuesToCss / patchToCss helpers above.

package/adapters/decisionthemes.d.ts

@@ -0,0 +1,44 @@
+/**
+ * DecisionThemes Adapter (Placeholder)
+ *
+ * This adapter will integrate with the DecisionThemes framework (coming 2026).
+ * It transforms VT (Value Themes) + DT (Decision Themes) into flat tokens for DCV validation.
+ *
+ * @see https://www.decisionthemes.com
+ * @see docs/Adapters.md for implementation details
+ *
+ * @example
+ * ```typescript
+ * import { decisionthemesAdapter } from './adapters/decisionthemes.js';
+ *
+ * const { tokens, policy } = decisionthemesAdapter({
+ *   vt: { ... }, // Value Themes (raw values)
+ *   dt: { ... }  // Decision Themes (formulas)
+ * });
+ *
+ * // tokens = flat token object for DCV validation
+ * // policy = auto-generated constraints from 5-axis model
+ * ```
+ */
+export interface VT {
+    [key: string]: any;
+}
+export interface DT {
+    [key: string]: any;
+}
+export interface DecisionThemesInput {
+    vt: VT;
+    dt: DT;
+}
+export interface DecisionThemesOutput {
+    tokens: Record<string, any>;
+    policy?: string;
+}
+/**
+ * Transform DecisionThemes (VT+DT) into DCV-compatible tokens
+ *
+ * @param input - VT (values) + DT (decisions)
+ * @returns Flat tokens + optional policy JSON
+ */
+export declare function decisionthemesAdapter(_input: DecisionThemesInput): DecisionThemesOutput;
+//# sourceMappingURL=decisionthemes.d.ts.map

package/adapters/decisionthemes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"decisionthemes.d.ts","sourceRoot":"","sources":["decisionthemes.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,MAAM,WAAW,EAAE;IAEjB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED,MAAM,WAAW,EAAE;IAEjB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,EAAE,CAAC;IACP,EAAE,EAAE,EAAE,CAAC;CACR;AAED,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,mBAAmB,GAAG,oBAAoB,CASvF"}

package/adapters/decisionthemes.js

@@ -0,0 +1,35 @@
+/**
+ * DecisionThemes Adapter (Placeholder)
+ *
+ * This adapter will integrate with the DecisionThemes framework (coming 2026).
+ * It transforms VT (Value Themes) + DT (Decision Themes) into flat tokens for DCV validation.
+ *
+ * @see https://www.decisionthemes.com
+ * @see docs/Adapters.md for implementation details
+ *
+ * @example
+ * ```typescript
+ * import { decisionthemesAdapter } from './adapters/decisionthemes.js';
+ *
+ * const { tokens, policy } = decisionthemesAdapter({
+ *   vt: { ... }, // Value Themes (raw values)
+ *   dt: { ... }  // Decision Themes (formulas)
+ * });
+ *
+ * // tokens = flat token object for DCV validation
+ * // policy = auto-generated constraints from 5-axis model
+ * ```
+ */
+/**
+ * Transform DecisionThemes (VT+DT) into DCV-compatible tokens
+ *
+ * @param input - VT (values) + DT (decisions)
+ * @returns Flat tokens + optional policy JSON
+ */
+export function decisionthemesAdapter(_input) {
+    // TODO: Implement when DecisionThemes integration is ready
+    // This will call the DecisionThemes resolver/compute engine to process _input
+    throw new Error('DecisionThemes adapter not yet implemented. ' +
+        'This is a placeholder for future integration with the DecisionThemes framework. ' +
+        'See https://www.decisionthemes.com for updates.');
+}

package/adapters/decisionthemes.ts

@@ -0,0 +1,59 @@
+/**
+ * DecisionThemes Adapter (Placeholder)
+ *
+ * This adapter will integrate with the DecisionThemes framework (coming 2026).
+ * It transforms VT (Value Themes) + DT (Decision Themes) into flat tokens for DCV validation.
+ *
+ * @see https://www.decisionthemes.com
+ * @see docs/Adapters.md for implementation details
+ *
+ * @example
+ * ```typescript
+ * import { decisionthemesAdapter } from './adapters/decisionthemes.js';
+ *
+ * const { tokens, policy } = decisionthemesAdapter({
+ *   vt: { ... }, // Value Themes (raw values)
+ *   dt: { ... }  // Decision Themes (formulas)
+ * });
+ *
+ * // tokens = flat token object for DCV validation
+ * // policy = auto-generated constraints from 5-axis model
+ * ```
+ */
+
+export interface VT {
+  // Value Themes - raw design values
+  [key: string]: any;
+}
+
+export interface DT {
+  // Decision Themes - formulas and decision mappings
+  [key: string]: any;
+}
+
+export interface DecisionThemesInput {
+  vt: VT;
+  dt: DT;
+}
+
+export interface DecisionThemesOutput {
+  tokens: Record<string, any>;
+  policy?: string;
+}
+
+/**
+ * Transform DecisionThemes (VT+DT) into DCV-compatible tokens
+ *
+ * @param input - VT (values) + DT (decisions)
+ * @returns Flat tokens + optional policy JSON
+ */
+export function decisionthemesAdapter(_input: DecisionThemesInput): DecisionThemesOutput {
+  // TODO: Implement when DecisionThemes integration is ready
+  // This will call the DecisionThemes resolver/compute engine to process _input
+
+  throw new Error(
+    'DecisionThemes adapter not yet implemented. ' +
+    'This is a placeholder for future integration with the DecisionThemes framework. ' +
+    'See https://www.decisionthemes.com for updates.'
+  );
+}

package/adapters/js.ts

@@ -1,14 +1,14 @@
-// adapters/js.ts
-import { buildVarMapping, defaultVarMapper, type ManifestRow } from './css.js';
-
-export function emitJS(values: Record<string, any>, manifest?: ManifestRow[]): string {
-  const ids = Object.keys(values).sort();
-  let mapping: Map<string, { canonical: string; aliases: string[] }> | undefined;
-  if (manifest) mapping = buildVarMapping(ids, manifest);
-  const lines: string[] = [];
-  for (const id of ids) {
-    const canonical = mapping ? mapping.get(id)!.canonical : defaultVarMapper(id);
-    if (canonical) lines.push(`  "${canonical}": ${JSON.stringify(values[id])}`);
-  }
-  return `// Generated by DCV. Do not edit.\nexport default {\n${lines.join(',\n')}\n};\n`;
-}
+// adapters/js.ts
+import { buildVarMapping, defaultVarMapper, type ManifestRow } from './css.js';
+
+export function emitJS(values: Record<string, any>, manifest?: ManifestRow[]): string {
+  const ids = Object.keys(values).sort();
+  let mapping: Map<string, { canonical: string; aliases: string[] }> | undefined;
+  if (manifest) mapping = buildVarMapping(ids, manifest);
+  const lines: string[] = [];
+  for (const id of ids) {
+    const canonical = mapping ? mapping.get(id)!.canonical : defaultVarMapper(id);
+    if (canonical) lines.push(`  "${canonical}": ${JSON.stringify(values[id])}`);
+  }
+  return `// Generated by DCV. Do not edit.\nexport default {\n${lines.join(',\n')}\n};\n`;
+}

package/adapters/json.ts

@@ -1,45 +1,45 @@
-// adapters/json.ts
-import { buildVarMapping, defaultVarMapper, type ManifestRow } from './css.js';
-
-export function emitJSON(values: Record<string, any>, manifest?: ManifestRow[]): string {
-  const ids = Object.keys(values).sort();
-  let mapping: Map<string, { canonical: string; aliases: string[] }> | undefined;
-  if (manifest) mapping = buildVarMapping(ids, manifest);
-  const out: Record<string, any> = {};
-  for (const id of ids) {
-    const canonical = mapping ? mapping.get(id)!.canonical : defaultVarMapper(id);
-    if (canonical) out[canonical] = values[id];
-  }
-  return JSON.stringify(out, null, 2) + '\n';
-}
-// adapters/json.ts
-import type { TokenId, TokenValue, FlatToken } from '../core/flatten.js';
-
-/**
- * Generates a JSON representation of the entire token set and dependency graph.
- */
-export function valuesToJson(data: {
-  flat: Record<TokenId, FlatToken>;
-  edges: [TokenId, TokenId][];
-}): string {
-  const values = Object.fromEntries(Object.entries(data.flat).map(([id, token]) => [id, token.value]));
-  const edges = data.edges.map(([from, to]) => ({ from, to }));
-
-  return JSON.stringify({
-    tokens: values,
-    edges: edges,
-  }, null, 2);
-}
-
-/**
- * Generates a JSON representation of a patch from an engine commit.
- */
-export function patchToJson(patch: {
-  patch: Record<TokenId, TokenValue>;
-  affected: TokenId[];
-}): string {
-  return JSON.stringify({
-    changed: patch.patch,
-    affected: patch.affected,
-  }, null, 2);
-}
+// adapters/json.ts
+import { buildVarMapping, defaultVarMapper, type ManifestRow } from './css.js';
+
+export function emitJSON(values: Record<string, any>, manifest?: ManifestRow[]): string {
+  const ids = Object.keys(values).sort();
+  let mapping: Map<string, { canonical: string; aliases: string[] }> | undefined;
+  if (manifest) mapping = buildVarMapping(ids, manifest);
+  const out: Record<string, any> = {};
+  for (const id of ids) {
+    const canonical = mapping ? mapping.get(id)!.canonical : defaultVarMapper(id);
+    if (canonical) out[canonical] = values[id];
+  }
+  return JSON.stringify(out, null, 2) + '\n';
+}
+// adapters/json.ts
+import type { TokenId, TokenValue, FlatToken } from '../core/flatten.js';
+
+/**
+ * Generates a JSON representation of the entire token set and dependency graph.
+ */
+export function valuesToJson(data: {
+  flat: Record<TokenId, FlatToken>;
+  edges: [TokenId, TokenId][];
+}): string {
+  const values = Object.fromEntries(Object.entries(data.flat).map(([id, token]) => [id, token.value]));
+  const edges = data.edges.map(([from, to]) => ({ from, to }));
+
+  return JSON.stringify({
+    tokens: values,
+    edges: edges,
+  }, null, 2);
+}
+
+/**
+ * Generates a JSON representation of a patch from an engine commit.
+ */
+export function patchToJson(patch: {
+  patch: Record<TokenId, TokenValue>;
+  affected: TokenId[];
+}): string {
+  return JSON.stringify({
+    changed: patch.patch,
+    affected: patch.affected,
+  }, null, 2);
+}

package/cli/build-css.ts

@@ -1,32 +1,32 @@
-// cli/build-css.ts
-import { writeFileSync, readFileSync, mkdirSync } from "node:fs";
-import { dirname } from "node:path";
-import { flattenTokens } from "../core/flatten.js";
-import { valuesToCss } from "../adapters/css.js";
-
-const tokens = JSON.parse(readFileSync("tokens/tokens.example.json", "utf8"));
-const { flat } = flattenTokens(tokens);
-
-const allValues: Record<string, string|number> =
-  Object.fromEntries(Object.values(flat).map(t => [t.id, t.value]));
-
-import yargs from "yargs";
-import { hideBin } from "yargs/helpers";
-
-const argv = yargs(hideBin(process.argv)).option('out', {
-  alias: 'o',
-  type: 'string',
-  description: 'Output file path',
-  default: 'dist/tokens.css'
-}).parseSync();
-
-// ... existing code ...
-
-const outFile = argv.out;
-const css = valuesToCss(allValues, { layer: "tokens", selector: ":root" });
-// ... existing code ...
-
-
-mkdirSync(dirname(outFile), { recursive: true });
-writeFileSync(outFile, css);
-console.log(`Wrote ${outFile}`);
+// cli/build-css.ts
+import { writeFileSync, readFileSync, mkdirSync } from "node:fs";
+import { dirname } from "node:path";
+import { flattenTokens } from "../core/flatten.js";
+import { valuesToCss } from "../adapters/css.js";
+
+const tokens = JSON.parse(readFileSync("tokens/tokens.example.json", "utf8"));
+const { flat } = flattenTokens(tokens);
+
+const allValues: Record<string, string|number> =
+  Object.fromEntries(Object.values(flat).map(t => [t.id, t.value]));
+
+import yargs from "yargs";
+import { hideBin } from "yargs/helpers";
+
+const argv = yargs(hideBin(process.argv)).option('out', {
+  alias: 'o',
+  type: 'string',
+  description: 'Output file path',
+  default: 'dist/tokens.css'
+}).parseSync();
+
+// ... existing code ...
+
+const outFile = argv.out;
+const css = valuesToCss(allValues, { layer: "tokens", selector: ":root" });
+// ... existing code ...
+
+
+mkdirSync(dirname(outFile), { recursive: true });
+writeFileSync(outFile, css);
+console.log(`Wrote ${outFile}`);