From 2e30b2bb39a99a48fc95fd76374520ce592f5854 Mon Sep 17 00:00:00 2001
From: BigSimmo <87357024+BigSimmo@users.noreply.github.com>
Date: Tue, 28 Jul 2026 19:31:24 +0800
Subject: [PATCH] fix: preserve responsive sheet height caps

---
 src/components/ui/sheet.tsx | 13 +++++++------
 tests/sheet.dom.test.tsx    | 14 ++++++++++++++
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/src/components/ui/sheet.tsx b/src/components/ui/sheet.tsx
index 8fa9b44979..c09f5a8e97 100644
--- a/src/components/ui/sheet.tsx
+++ b/src/components/ui/sheet.tsx
@@ -288,6 +288,9 @@ export function Sheet({
   const defaultSheetIsFullscreen = placement !== "left" && mobilePlacement === "fullscreen";
   const defaultSheetIsTopAligned = placement !== "left" && mobilePlacement === "top";
   const defaultSheetUsesViewportSize = placement !== "left" && mobileSize === "viewport";
+  const contentClassTokens = contentClassName?.split(/\s+/) ?? [];
+  const hasMobileMaxHeight = contentClassTokens.some((token) => /^!?max-h-/.test(token));
+  const hasSmallScreenMaxHeight = contentClassTokens.some((token) => /^sm:!?max-h-/.test(token));
 
   const sheet = (
     <div
@@ -350,12 +353,10 @@ export function Sheet({
                             "rounded-t-2xl motion-safe:animate-sheet-up",
                             defaultSheetUsesViewportSize
                               ? "min-h-[calc(100dvh-2rem)] max-h-[calc(100dvh-1rem)] sm:min-h-0"
-                              : // Skip a default max-h when the caller already caps height via
-                                // contentClassName — cn() does not last-win Tailwind utilities,
-                                // so two unprefixed max-h-* classes race in CSS source order.
-                                /\bmax-h-/.test(contentClassName ?? "")
-                                ? undefined
-                                : "max-h-[calc(100dvh-2rem)] sm:max-h-[88dvh]",
+                              : cn(
+                                  !hasMobileMaxHeight && "max-h-[calc(100dvh-2rem)]",
+                                  !hasSmallScreenMaxHeight && "sm:max-h-[88dvh]",
+                                ),
                           ),
                     ),
               ),
diff --git a/tests/sheet.dom.test.tsx b/tests/sheet.dom.test.tsx
index 6973a74567..bbc328e3fb 100644
--- a/tests/sheet.dom.test.tsx
+++ b/tests/sheet.dom.test.tsx
@@ -119,6 +119,20 @@ describe("Sheet stacked-overlay coordination", () => {
     vi.useRealTimers();
   });
 
+  it("keeps caller-provided mobile and small-screen height caps authoritative", () => {
+    const { getByRole } = render(
+      <Sheet open onClose={vi.fn()} title="Capped sheet" contentClassName="max-h-[88dvh] sm:max-h-[min(80dvh,36rem)]">
+        <p>Body</p>
+      </Sheet>,
+    );
+
+    const classes = getByRole("dialog").classList;
+    expect(classes).toContain("max-h-[88dvh]");
+    expect(classes).toContain("sm:max-h-[min(80dvh,36rem)]");
+    expect(classes).not.toContain("max-h-[calc(100dvh-2rem)]");
+    expect(classes).not.toContain("sm:max-h-[88dvh]");
+  });
+
   it("upgrades from the close-button fallback to a late-mounted data-sheet-autofocus target", async () => {
     const onClose = vi.fn();
     const { rerender } = render(