feat: add design system platform

2026-07-26 15:49:07 +09:00
parent e49d90f713
commit 13f28ef811
53 changed files with 3477 additions and 410 deletions
@@ -0,0 +1,48 @@
+import { readFile } from "node:fs/promises";
+
+import { describe, expect, it } from "vitest";
+
+import {
+  REQUIRED_COMPONENT_TOKENS,
+  REQUIRED_PRIMITIVE_TOKENS,
+  REQUIRED_SEMANTIC_TOKENS,
+} from "../../src/presentation/design-system/index.js";
+
+describe("design token contract", () => {
+  it("defines every registered token in its owning layer", async () => {
+    const layers = [
+      [
+        REQUIRED_PRIMITIVE_TOKENS,
+        "src/presentation/design-system/tokens/primitive.css",
+      ],
+      [
+        REQUIRED_SEMANTIC_TOKENS,
+        "src/presentation/design-system/tokens/semantic.css",
+      ],
+      [
+        REQUIRED_COMPONENT_TOKENS,
+        "src/presentation/design-system/tokens/component.css",
+      ],
+    ] as const;
+
+    for (const [tokens, file] of layers) {
+      const source = await readFile(file, "utf8");
+      for (const token of tokens) expect(source).toContain(`${token}:`);
+    }
+  });
+
+  it("provides dark and forced-color contracts", async () => {
+    const semantic = await readFile(
+      "src/presentation/design-system/tokens/semantic.css",
+      "utf8",
+    );
+    const component = await readFile(
+      "src/presentation/design-system/tokens/component.css",
+      "utf8",
+    );
+
+    expect(semantic).toContain(':root[data-theme="dark"]');
+    expect(component).toContain("@media (forced-colors: active)");
+    expect(component).toContain("--color-focus: Highlight");
+  });
+});