From 48e80611c6eeb89e8872620d35dea4d8650a84f2 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 3 Oct 2026 16:37:03 +0000
Subject: [PATCH] refactor(ui-web): leave the cn() fix to #115

#115 fixes the same tailwind-merge bug more completely (text, control,
icon and spacing scales, guarded against styles.css) and adds the same
two files, so this branch drops its narrower copy to avoid the overlap.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016or6oqCqP8wbNafvhnbLQT
---
 packages/ui-web/src/lib/utils.test.ts | 19 -------------------
 packages/ui-web/src/lib/utils.ts      | 24 +-----------------------
 2 files changed, 1 insertion(+), 42 deletions(-)
 delete mode 100644 packages/ui-web/src/lib/utils.test.ts

diff --git a/packages/ui-web/src/lib/utils.test.ts b/packages/ui-web/src/lib/utils.test.ts
deleted file mode 100644
index a9cfa41..0000000
--- a/packages/ui-web/src/lib/utils.test.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { describe, expect, it } from "vitest";
-import { buttonVariants } from "../components/ui/button";
-import { cn } from "./utils";
-
-describe("cn", () => {
-  it("treats the ui type scale as font size, not color", () => {
-    expect(cn("text-primary-foreground", "text-ui-body")).toBe(
-      "text-primary-foreground text-ui-body",
-    );
-    expect(cn("text-ui-body", "text-base")).toBe("text-base");
-  });
-
-  it("keeps the variant label color on resized buttons", () => {
-    const classes = cn(buttonVariants({ size: "lg", className: "text-base" })).split(" ");
-    expect(classes).toContain("text-primary-foreground");
-    expect(classes).toContain("text-base");
-    expect(classes).not.toContain("text-ui-body");
-  });
-});
diff --git a/packages/ui-web/src/lib/utils.ts b/packages/ui-web/src/lib/utils.ts
index 88560bd..365058c 100644
--- a/packages/ui-web/src/lib/utils.ts
+++ b/packages/ui-web/src/lib/utils.ts
@@ -1,27 +1,5 @@
 import { type ClassValue, clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-
-// The shared type scale (`text-ui-*`) is a font size, not a color. Without this,
-// `text-ui-body` would replace `text-primary-foreground` and hide button labels.
-const twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      "font-size": [
-        {
-          text: [
-            "ui-caption",
-            "ui-label",
-            "ui-body-sm",
-            "ui-body",
-            "ui-reading",
-            "ui-title-sm",
-            "ui-title",
-          ],
-        },
-      ],
-    },
-  },
-});
+import { twMerge } from "tailwind-merge";
 
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));