import { expect, test } from "bun:test";
import {
  CORE_DESIGN_SYSTEMS,
  validateDesignSystem,
  compileDesignSystem,
} from "@wrnexus/design-system";
import { STUDIO_PRESETS } from "../src/presets.ts";
import { studioHtml } from "../src/shell.ts";
import { StudioSession } from "../src/session.ts";

test("thirteen distinct Studio presets validate and compile both modes without changing core presets", () => {
  expect(Object.keys(STUDIO_PRESETS)).toHaveLength(13);
  expect(Object.keys(CORE_DESIGN_SYSTEMS)).toEqual(["square", "soft", "angular"]);
  const signatures = new Set<string>();
  for (const [id, system] of Object.entries(STUDIO_PRESETS)) {
    expect(system.id).toBe(id);
    expect(validateDesignSystem(system)).toEqual([]);
    expect(studioHtml).toContain(`<option value="${id}">${system.name}</option>`);
    signatures.add(JSON.stringify([system.tokens, system.modes]));
    for (const mode of ["light", "dark"])
      expect(() => compileDesignSystem(system, { mode })).not.toThrow();
  }
  expect(signatures.size).toBe(13);
});

test("choosing a new preset stays undoable and never mutates the catalog", () => {
  const session = new StudioSession(STUDIO_PRESETS.square);
  const original = JSON.stringify(STUDIO_PRESETS.swiss);
  session.replace(STUDIO_PRESETS.swiss!, "Selected Swiss");
  session.edit(JSON.stringify({ ...session.valid, name: "My Swiss" }));
  expect(JSON.stringify(STUDIO_PRESETS.swiss)).toBe(original);
  session.undo();
  session.undo();
  expect(session.valid.id).toBe("square");
});

test("revised directions stay distinct and Editorial status tokens remain monochrome", () => {
  const organic = ["soft", "forest", "ember"].map((id) => STUDIO_PRESETS[id]!);
  expect(new Set(organic.map((s) => s.modes!.light!["color.bg"]!.value)).size).toBe(3);
  expect(new Set(organic.map((s) => s.tokens["shape.control"]!.value)).size).toBe(3);
  for (const tokens of [
    STUDIO_PRESETS.editorial!.tokens,
    ...Object.values(STUDIO_PRESETS.editorial!.modes!),
  ]) {
    for (const name of ["success", "warning", "danger", "info"]) {
      const color = String(tokens[`color.${name}`]!.value);
      expect(color).toMatch(/^#([0-9a-f]{2})\1\1$/i);
    }
  }
});