feat(studio): add Charcoal Pink dashboard preset

packages/design-studio/test/presets.test.ts

@@ -8,8 +8,8 @@ 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);
+test("fourteen distinct Studio presets validate and compile both modes without changing core presets", () => {
+  expect(Object.keys(STUDIO_PRESETS)).toHaveLength(14);
   expect(Object.keys(CORE_DESIGN_SYSTEMS)).toEqual(["square", "soft", "angular"]);
   const signatures = new Set<string>();
   for (const [id, system] of Object.entries(STUDIO_PRESETS)) {
@@ -20,7 +20,7 @@ test("thirteen distinct Studio presets validate and compile both modes without c
     for (const mode of ["light", "dark"])
       expect(() => compileDesignSystem(system, { mode })).not.toThrow();
   }
-  expect(signatures.size).toBe(13);
+  expect(signatures.size).toBe(14);
 });
 
 test("choosing a new preset stays undoable and never mutates the catalog", () => {
@@ -48,3 +48,23 @@ test("revised directions stay distinct and Editorial status tokens remain monoch
     }
   }
 });
+
+test("Charcoal / Pink defaults to dark and carries its fonts, geometry and accessible primary contrast", () => {
+  const preset = STUDIO_PRESETS.charcoal!;
+  expect(preset.defaultMode).toBe("dark");
+  expect(preset.googleFonts).toEqual(["Poppins"]);
+  expect(preset.modes!.dark!["color.bg"]!.value).toBe("#19181E");
+  expect(preset.modes!.dark!["color.primary"]!.value).toBe("#FA3D87");
+  expect(preset.modes!.dark!["color.primary-contrast"]!.value).toBe("#000000");
+  expect(preset.tokens["shape.control"]!.value).toBe("4px");
+  const session = new StudioSession(STUDIO_PRESETS.square);
+  session.replace(preset, "Selected Charcoal / Pink");
+  const css = compileDesignSystem(session.valid).css;
+  expect(css.startsWith('@import url("https://fonts.googleapis.com/css2?family=Poppins')).toBe(
+    true,
+  );
+  expect(css).toContain("font-size:14px");
+  expect(css).toContain("letter-spacing:-0.3px");
+  session.undo();
+  expect(session.valid.id).toBe("square");
+});