zugzbot 1.0.21 → 1.0.23

package/.opencode/oh-my-design/web/src/lib/core/survey-hash.ts

@@ -1,56 +0,0 @@
-import type { Overrides } from './types';
-
-/**
- * Survey result payload — everything the CLI needs to generate DESIGN.md.
- */
-export interface SurveyResult {
-  refId: string;
-  overrides: Overrides;
-  preferences: {
-    mood: string;
-    typographyChar: string;
-    buttonStyle: string;
-    inputStyle: string;
-    headerStyle: string;
-    cardStyle: string;
-    depthStyle: string;
-    density: string;
-    saturation: string;
-  };
-  components: string[];
-}
-
-/**
- * Encode survey result as OMD-{base64url} string.
- *
- * Format: JSON → base64url (different from config-hash which uses pipe-delimited).
- * Prefixed with "OMD-" for easy detection in terminal input.
- */
-export function encodeSurveyResult(result: SurveyResult): string {
-  const json = JSON.stringify(result);
-  if (typeof window !== 'undefined') {
-    return 'OMD-' + btoa(unescape(encodeURIComponent(json)))
-      .replace(/\+/g, '-')
-      .replace(/\//g, '_')
-      .replace(/=+$/, '');
-  }
-  return 'OMD-' + Buffer.from(json).toString('base64url');
-}
-
-/**
- * Decode OMD-{base64url} string back into SurveyResult.
- */
-export function decodeSurveyResult(code: string): SurveyResult {
-  const b64part = code.replace(/^OMD-/, '');
-  let b64 = b64part.replace(/-/g, '+').replace(/_/g, '/');
-  while (b64.length % 4) b64 += '=';
-
-  let decoded: string;
-  if (typeof window !== 'undefined') {
-    decoded = decodeURIComponent(escape(atob(b64)));
-  } else {
-    decoded = Buffer.from(b64, 'base64').toString('utf-8');
-  }
-
-  return JSON.parse(decoded) as SurveyResult;
-}

package/.opencode/oh-my-design/web/src/lib/core/types.ts

@@ -1,37 +0,0 @@
-export interface ReferenceEntry {
-  id: string;
-  name: string;
-  category: string;
-  primaryColor: string;
-  background: string;
-  foreground: string;
-  fontFamily: string;
-  headingWeight: string;
-  radius: string;
-  mood: string;
-}
-
-export interface ReferenceDetail extends ReferenceEntry {
-  designMd: string;
-  accent?: string;
-  border?: string;
-  mono?: string;
-}
-
-export interface Overrides {
-  primaryColor: string;
-  fontFamily: string;
-  headingWeight: string;
-  borderRadius: string;
-  darkMode: boolean;
-}
-
-export interface StylePreferences {
-  buttonStyle?: string;   // "sharp" | "rounded"
-  inputStyle?: string;    // "bordered" | "underline"
-  headerStyle?: string;   // "glass" | "solid"
-  cardStyle?: string;     // "bordered" | "elevated"
-  depthStyle?: string;    // "flat" | "layered"
-  density?: string;       // "compact" | "spacious"
-  [key: string]: string | undefined;
-}

package/.opencode/oh-my-design/web/src/lib/design-systems.ts

@@ -1,102 +0,0 @@
-/**
- * Official design-system / brand-guideline links per reference.
- * Derived from the autogenerated registry — to add or update an entry,
- * edit references/<id>/DESIGN.md frontmatter `ds` block, then run
- * `npm run build-registry`.
- */
-import { REGISTRY, REGISTRY_BY_ID } from "@/data/registry.generated";
-
-export type DesignSystemType = "system" | "brand";
-
-export interface DesignSystemInfo {
-  refId: string;
-  name: string;
-  url: string;
-  type: DesignSystemType;
-  description: string;
-  /** og:image / twitter:image harvested from the site (scripts/fetch-og-images.mjs).
-   *  Missing when the site doesn't publish one — UI falls back to a logo thumbnail. */
-  ogImage?: string;
-}
-
-export function getDesignSystem(refId: string): DesignSystemInfo | null {
-  const e = REGISTRY_BY_ID[refId];
-  if (!e?.ds) return null;
-  return {
-    refId,
-    name: e.ds.name,
-    url: e.ds.url,
-    type: e.ds.type,
-    description: e.ds.description,
-    ogImage: e.ds.ogImage,
-  };
-}
-
-export interface RelatedRef {
-  id: string;
-  name: string;
-  category: string;
-  primaryColor: string;
-}
-
-function hexToRgb(hex: string): [number, number, number] | null {
-  const m = hex.replace("#", "").match(/.{2}/g);
-  if (!m || m.length < 3) return null;
-  return [parseInt(m[0], 16), parseInt(m[1], 16), parseInt(m[2], 16)];
-}
-
-/**
- * Sibling references for the detail-page "Related design systems" block.
- * Same category first (the strongest "you might also like" signal), then
- * nearest by primary-color distance, so the list is always full and visually
- * coherent. Deterministic (id tie-break) so SSG output is stable. Powers
- * detail→detail internal links for session + crawl depth.
- */
-export function getRelatedReferences(id: string, n = 6): RelatedRef[] {
-  const self = REGISTRY_BY_ID[id];
-  if (!self) return [];
-  const selfRgb = hexToRgb(self.primaryColor);
-
-  const scored = REGISTRY.filter((e) => e.id !== id).map((e) => {
-    const sameCat = e.category === self.category ? 0 : 1;
-    const rgb = hexToRgb(e.primaryColor);
-    const dist =
-      selfRgb && rgb
-        ? Math.sqrt(
-            (selfRgb[0] - rgb[0]) ** 2 +
-              (selfRgb[1] - rgb[1]) ** 2 +
-              (selfRgb[2] - rgb[2]) ** 2,
-          )
-        : Number.MAX_SAFE_INTEGER;
-    return { e, sameCat, dist };
-  });
-
-  scored.sort(
-    (a, b) => a.sameCat - b.sameCat || a.dist - b.dist || a.e.id.localeCompare(b.e.id),
-  );
-
-  return scored.slice(0, n).map(({ e }) => ({
-    id: e.id,
-    name: e.displayName || e.name,
-    category: e.category,
-    primaryColor: e.primaryColor,
-  }));
-}
-
-/** All design-system entries, full systems first (alphabetical within each type). */
-export function getAllDesignSystems(): DesignSystemInfo[] {
-  return REGISTRY
-    .filter(e => e.ds)
-    .map(e => ({
-      refId: e.id,
-      name: e.ds!.name,
-      url: e.ds!.url,
-      type: e.ds!.type,
-      description: e.ds!.description,
-      ogImage: e.ds!.ogImage,
-    }))
-    .sort((a, b) => {
-      if (a.type !== b.type) return a.type === "system" ? -1 : 1;
-      return a.name.localeCompare(b.name);
-    });
-}

package/.opencode/oh-my-design/web/src/lib/extract-components.test.ts

@@ -1,116 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { readFileSync } from "node:fs";
-import { join } from "node:path";
-import { extractComponentSpecs } from "./extract-tokens";
-
-const REFS_DIR = join(process.cwd(), "..", "references");
-
-// These tests validate the PROSE §4 parser (extractComponentSpecs) on the
-// canonical-schema refs. The live preview now prefers structured
-// `tokens.components` over prose (componentsFromTokens), so we exercise the
-// prose parser directly here rather than through extractTokens().components.
-function loadRef(id: string) {
-  const md = readFileSync(join(REFS_DIR, id, "DESIGN.md"), "utf8");
-  return { components: extractComponentSpecs(md) };
-}
-
-describe("extractComponentSpecs against canonical-schema refs", () => {
-  // Toss is the pilot — its §4 was rewritten to the canonical Variant-block
-  // shape (see spec/components-schema.md). All required component types must
-  // be parsed and at least the minimum fields populated.
-  it("Toss — extracts all 8 subsections with valid variants", () => {
-    const tokens = loadRef("toss");
-    const blocks = tokens.components;
-
-    const types = blocks.map((b) => b.type);
-    expect(types).toContain("button");
-    expect(types).toContain("input");
-    expect(types).toContain("card");
-    expect(types).toContain("badge");
-    expect(types).toContain("tab");
-    expect(types).toContain("toast");
-    expect(types).toContain("dialog");
-    expect(types).toContain("toggle");
-  });
-
-  it("Toss — Buttons reflect TDS Mobile 2-axis (variant × color) shape with all 8 variants", () => {
-    const tokens = loadRef("toss");
-    const buttons = tokens.components.find((b) => b.type === "button");
-    expect(buttons).toBeDefined();
-    expect(buttons!.variants.length).toBe(8);
-    const fillPrimary = buttons!.variants.find((v) => v.name === "Fill / Primary");
-    expect(fillPrimary).toBeDefined();
-    expect(fillPrimary!.bg).toContain("#3182f6");
-    expect(fillPrimary!.fg).toContain("#ffffff");
-    expect(fillPrimary!.radius).toBe("16px");
-    expect(fillPrimary!.font).toContain("17px");
-    expect(fillPrimary!.font).toContain("Toss Product Sans");
-    expect(fillPrimary!.use).toContain("CTA");
-    // Dark color is #4e5968 (grey700) per TDS — NOT #191f28 (grey900)
-    const fillDark = buttons!.variants.find((v) => v.name === "Fill / Dark");
-    expect(fillDark!.bg).toContain("#4e5968");
-    // Weak Primary uses translucent layer on top of page bg
-    const weakPrimary = buttons!.variants.find((v) => v.name === "Weak / Primary");
-    expect(weakPrimary!.bg).toContain("rgba(100, 168, 255, 0.15)");
-    expect(weakPrimary!.fg).toContain("#2272eb");
-  });
-
-  it("Toss — Inputs has TDS variants box / line / big / hero (per TextField docs)", () => {
-    const tokens = loadRef("toss");
-    const inputs = tokens.components.find((b) => b.type === "input");
-    expect(inputs).toBeDefined();
-    const names = inputs!.variants.map((v) => v.name.toLowerCase());
-    // TDS TextField has 4 variants — box (default) is the workhorse.
-    expect(names.some((n) => n.includes("box"))).toBe(true);
-    expect(names.some((n) => n.includes("line"))).toBe(true);
-    expect(names.some((n) => n.includes("big"))).toBe(true);
-    expect(names.some((n) => n.includes("hero"))).toBe(true);
-  });
-
-  it("Toss — Cards has Standard + Featured + Compact", () => {
-    const tokens = loadRef("toss");
-    const cards = tokens.components.find((b) => b.type === "card");
-    expect(cards).toBeDefined();
-    expect(cards!.variants.length).toBeGreaterThanOrEqual(3);
-  });
-
-  it("Toss — Badges reflect TDS 2-axis fill/weak × color shape", () => {
-    const tokens = loadRef("toss");
-    const badges = tokens.components.find((b) => b.type === "badge");
-    expect(badges).toBeDefined();
-    // We list 8 representative variants: 4 fills + 4 weaks (out of 6 colors).
-    expect(badges!.variants.length).toBeGreaterThanOrEqual(6);
-    const names = badges!.variants.map((v) => v.name.toLowerCase());
-    expect(names.some((n) => n.includes("fill"))).toBe(true);
-    expect(names.some((n) => n.includes("weak"))).toBe(true);
-  });
-
-  // ── Batch 1: Kakao / Apple / Airbnb / Spotify ──────────────────────
-  // For each batch-1 ref, the four required component types (button / input /
-  // card / badge) must parse with at least one variant. We don't enforce
-  // exact variant counts here — the exact list is brand-specific — but the
-  // pipeline guarantee is "every brand has all four."
-
-  const REQUIRED_TYPES = ["button", "input", "card", "badge"] as const;
-
-  for (const ref of ["kakao", "apple", "airbnb", "spotify"]) {
-    it(`${ref} — has all 4 required component types with ≥1 variant each`, () => {
-      const tokens = loadRef(ref);
-      for (const t of REQUIRED_TYPES) {
-        const block = tokens.components.find((b) => b.type === t);
-        expect(block, `${ref} missing ${t} block`).toBeDefined();
-        expect(block!.variants.length, `${ref} ${t} has 0 variants`).toBeGreaterThan(0);
-      }
-    });
-
-    it(`${ref} — every Button variant has bg + fg + radius`, () => {
-      const tokens = loadRef(ref);
-      const buttons = tokens.components.find((b) => b.type === "button");
-      for (const v of buttons!.variants) {
-        expect(v.bg, `${ref} button "${v.name}" missing bg`).toBeTruthy();
-        expect(v.fg, `${ref} button "${v.name}" missing fg`).toBeTruthy();
-        expect(v.radius, `${ref} button "${v.name}" missing radius`).toBeTruthy();
-      }
-    });
-  }
-});

package/.opencode/oh-my-design/web/src/lib/extract-tokens.test.ts

@@ -1,202 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { applyOverrides, type ParsedTokens, type PreviewOverrides } from "./extract-tokens";
-
-// Minimal synthetic token set used for preview fidelity matrix. Keeps the
-// tests independent from reference DESIGN.md changes.
-function makeTokens(): ParsedTokens {
-  return {
-    identity: {
-      name: "Test",
-      primary: "#6366f1",
-      background: "#ffffff",
-      foreground: "#0a0a0a",
-      accent: "#ef4444",
-      border: "#e5e7eb",
-      mood: "calm",
-    },
-    typography: {
-      family: "Inter",
-      mono: undefined,
-      headingWeight: "600",
-      weights: [400, 500, 600, 700],
-      sizes: [12, 14, 16, 20, 24, 32, 48],
-      hierarchy: [
-        { role: "Display",   label: "Display XXL",  sampleText: "x", fontSize: 48, fontWeight: 600, lineHeight: 1.25, letterSpacing: "0" },
-        { role: "Heading 1", label: "Heading XL",   sampleText: "x", fontSize: 32, fontWeight: 600, lineHeight: 1.25, letterSpacing: "0" },
-        { role: "Heading 2", label: "Heading L",    sampleText: "x", fontSize: 24, fontWeight: 600, lineHeight: 1.4,  letterSpacing: "0" },
-        { role: "Body",      label: "Body M",       sampleText: "x", fontSize: 16, fontWeight: 400, lineHeight: 1.5,  letterSpacing: "0" },
-        { role: "Small",     label: "Small S",      sampleText: "x", fontSize: 14, fontWeight: 400, lineHeight: 1.5,  letterSpacing: "0", muted: true },
-        { role: "Caption",   label: "Caption XS",   sampleText: "x", fontSize: 12, fontWeight: 400, lineHeight: 1.5,  letterSpacing: "0", muted: true },
-        { role: "Smallest",  label: "Smallest XXS", sampleText: "x", fontSize: 10, fontWeight: 500, lineHeight: 1.5,  letterSpacing: "0.06em", muted: true },
-      ],
-      fonts: [],
-    },
-    radii: { button: "8px", input: "8px", card: "8px", dialog: "8px", badge: "8px" },
-    radiusScale: [
-      { element: "buttons", value: "8px" },
-      { element: "inputs",  value: "8px" },
-      { element: "cards",   value: "8px" },
-      { element: "dialogs", value: "8px" },
-      { element: "badges",  value: "8px" },
-    ],
-    palette: ["#6366f1"],
-    paletteRoles: [
-      { hex: "#6366f1", name: "Indigo", category: "brand", description: "Primary." },
-    ],
-    spacing: [4, 8, 12, 16, 24, 32],
-    spacingScale: [4, 8, 12, 16, 24, 32].map((v) => ({ value: v })),
-    functionalSpacing: { density: "comfortable", baseUnit: 4, sectionGap: 24, cardPadding: 16, elementGap: 8 },
-    borders: [],
-    components: [],
-    shadows: [
-      { name: "Subtle",  value: "0 1px 2px rgba(0,0,0,0.05)" },
-      { name: "Default", value: "0 1px 3px rgba(0,0,0,0.1)" },
-    ],
-    guidelines: [],
-  };
-}
-
-// ── Preview fidelity matrix ───────────────────────────────────────
-//
-// Every wizard input that is expected to alter the builder step-3 preview
-// must be observable in the ParsedTokens that applyOverrides returns. The
-// preview renderer (ReferencePreview → CardsSection / FormsSection / etc.)
-// consumes these fields directly, so asserting them covers the user-visible
-// result without booting a DOM. If a future change silently drops one of
-// these dimensions, the matching case fails.
-describe("applyOverrides (preview) – wizard fidelity matrix", () => {
-  const base = makeTokens();
-
-  it("returns tokens unchanged when overrides is undefined", () => {
-    const out = applyOverrides(base, undefined);
-    expect(out).toBe(base);
-  });
-
-  it("primaryColor override flows into identity.primary", () => {
-    const out = applyOverrides(base, { primaryColor: "#22c55e" });
-    expect(out.identity.primary).toBe("#22c55e");
-  });
-
-  it("empty-string primaryColor keeps the reference default (skip-wizard / as-is)", () => {
-    const out = applyOverrides(base, { primaryColor: "" } as PreviewOverrides);
-    expect(out.identity.primary).toBe("#6366f1");
-  });
-
-  it("borderRadius override cascades to button + input + card + dialog + badge", () => {
-    const out = applyOverrides(base, { borderRadius: "4px" });
-    expect(out.radii.button).toBe("4px");
-    expect(out.radii.input).toBe("4px");
-    expect(out.radii.card).toBe("4px");
-    expect(out.radii.dialog).toBe("4px");
-    expect(out.radii.badge).toBe("4px");
-  });
-
-  it("borderRadius caps card/dialog at 16px and badge at 8px on pill systems", () => {
-    const out = applyOverrides(base, { borderRadius: "9999px" });
-    expect(out.radii.button).toBe("9999px");
-    expect(out.radii.card).toBe("16px");
-    expect(out.radii.dialog).toBe("16px");
-    expect(out.radii.badge).toBe("8px");
-  });
-
-  it("fontFamily override flows into typography.family", () => {
-    const out = applyOverrides(base, { fontFamily: "Geist" });
-    expect(out.typography.family).toBe("Geist");
-  });
-
-  it("headingWeight override applies to Display / Heading 1 / Heading 2 tiers only", () => {
-    const out = applyOverrides(base, { headingWeight: "800" });
-    const weights = Object.fromEntries(out.typography.hierarchy.map((t) => [t.role, t.fontWeight]));
-    expect(weights["Display"]).toBe(800);
-    expect(weights["Heading 1"]).toBe(800);
-    expect(weights["Heading 2"]).toBe(800);
-    // Body and below must NOT be rewritten by headingWeight.
-    expect(weights["Body"]).toBe(400);
-    expect(weights["Small"]).toBe(400);
-  });
-
-  it("buttonStyle=rounded forces pill button radius regardless of borderRadius", () => {
-    const out = applyOverrides(base, {
-      borderRadius: "4px",
-      stylePreferences: { buttonStyle: "rounded" },
-    });
-    expect(out.radii.button).toBe("9999px");
-  });
-
-  it("buttonStyle=sharp clamps button radius to <=4px even with a large borderRadius", () => {
-    const out = applyOverrides(base, {
-      borderRadius: "16px",
-      stylePreferences: { buttonStyle: "sharp" },
-    });
-    expect(out.radii.button).toBe("4px");
-  });
-
-  it("inputStyle=underline zeroes the input radius (decouples from button system)", () => {
-    const out = applyOverrides(base, {
-      borderRadius: "12px",
-      stylePreferences: { inputStyle: "underline" },
-    });
-    expect(out.radii.input).toBe("0px");
-    expect(out.radii.button).toBe("12px");
-  });
-
-  it("inputStyle=bordered keeps input radius aligned with buttons", () => {
-    const out = applyOverrides(base, {
-      borderRadius: "12px",
-      stylePreferences: { inputStyle: "bordered" },
-    });
-    expect(out.radii.input).toBe("12px");
-  });
-
-  it("cardStyle=bordered replaces shadows[0] with a flat 'none' recipe", () => {
-    const out = applyOverrides(base, { stylePreferences: { cardStyle: "bordered" } });
-    expect(out.shadows[0]).toEqual({ name: "Flat", value: "none" });
-  });
-
-  it("cardStyle=elevated leaves the reference's original shadows intact", () => {
-    const out = applyOverrides(base, { stylePreferences: { cardStyle: "elevated" } });
-    expect(out.shadows).toEqual(base.shadows);
-  });
-
-  // density is consumed by the renderer (resolveDensity → cardPad, fieldGap),
-  // not by applyOverrides itself. It still must survive the token merge so the
-  // preview component can read it from the same stylePreferences object.
-  // This test locks in the contract that we don't accidentally strip it.
-  it("density preference is preserved (renderer reads stylePreferences directly)", () => {
-    const prefs = { density: "compact" } as const;
-    const out = applyOverrides(base, { stylePreferences: prefs });
-    // applyOverrides does not attach prefs to the returned tokens; the caller
-    // passes `preferences` straight to the section components. Guard that at
-    // least the identity of the input object is stable for the caller.
-    expect(prefs.density).toBe("compact");
-    // And that applyOverrides didn't mutate it as a side-effect.
-    expect(Object.isFrozen(prefs) || prefs.density === "compact").toBe(true);
-    void out;
-  });
-
-  // Full stack combination — mirrors the "all dimensions at once" case in
-  // the DESIGN.md matrix. Ensures preview and DESIGN.md agree on conflict
-  // resolution (rounded wins over borderRadius, underline wins over
-  // borderRadius for input radius).
-  it("all wizard dimensions combined produce a coherent preview token set", () => {
-    const out = applyOverrides(base, {
-      primaryColor: "#22c55e",
-      fontFamily: "Geist",
-      headingWeight: "700",
-      borderRadius: "10px",
-      stylePreferences: {
-        buttonStyle: "rounded",
-        inputStyle: "underline",
-        cardStyle: "bordered",
-        density: "compact",
-      },
-    });
-    expect(out.identity.primary).toBe("#22c55e");
-    expect(out.typography.family).toBe("Geist");
-    expect(out.radii.button).toBe("9999px");       // rounded wins over 10px
-    expect(out.radii.input).toBe("0px");           // underline zeros it
-    expect(out.radii.card).toBe("16px");           // pill cap for cards
-    expect(out.shadows[0]).toEqual({ name: "Flat", value: "none" }); // bordered
-    expect(out.typography.hierarchy[0].fontWeight).toBe(700);
-  });
-});