From 74dfbb697235b0db87355d3f8575dc2ba45dddf7 Mon Sep 17 00:00:00 2001 From: maria Date: Sat, 10 Oct 2026 20:08:12 -0300 Subject: [PATCH] fix(web): composer banner titles truncate beside their icon instead of wrapping (#17699) Co-authored-by: maria-rcks <254055478+maria-rcks@users.noreply.github.com> --- apps/web/src/components/chat/ComposerBanner.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/apps/web/src/components/chat/ComposerBanner.tsx b/apps/web/src/components/chat/ComposerBanner.tsx index 6fbd65fc87c817e16d1515bc0b6993f6134088bd..900f18d4e520a71cb4c076abaa778ccf5b86d894 100644 --- a/apps/web/src/components/chat/ComposerBanner.tsx +++ b/apps/web/src/components/chat/ComposerBanner.tsx @@ -201,7 +201,9 @@ function Row({ "not-has-[>[data-slot=composer-banner-actions]]:grid-cols-[var(--composer-banner-icon-column)_minmax(0,1fr)]", "[&:is(button)]:cursor-pointer [&:is(button)]:rounded-md [&:is(button)]:focus-visible:outline-2 [&:is(button)]:focus-visible:-outline-offset-2 [&:is(button)]:focus-visible:outline-ring", // Actions share the title row while the title fits and move below it otherwise. - layout === "wrap-actions" && "flex flex-wrap *:data-[slot=composer-banner-content]:grow", + // The content's max width keeps it beside the icon, so a long title truncates instead of wrapping. + layout === "wrap-actions" && + "flex flex-wrap *:data-[slot=composer-banner-content]:max-w-[calc(100%-var(--composer-banner-icon-column)-var(--spacing))] *:data-[slot=composer-banner-content]:grow", layout === "approval" && "items-start gap-x-2 gap-y-3", className, ), -- 2.54.0