From c2a301b12af6e18148eb1d46123c4187f4bdb78e Mon Sep 17 00:00:00 2001
From: maria <maria@kuuro.net>
Date: Sat, 10 Oct 2026 02:16:42 -0300
Subject: [PATCH] fix(web): nested corners follow their container's radius
 (#17695)

Co-authored-by: maria-rcks <254055478+maria-rcks@users.noreply.github.com>
---
 apps/web/src/components/chat/ComposerBanner.tsx        | 10 ++++++++++
 apps/web/src/components/chat/ComposerCommandMenu.tsx   |  2 +-
 .../components/search/ProjectContentSearchDialog.tsx   |  2 +-
 apps/web/src/pierre-tree-theme.ts                      |  2 +-
 4 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/components/chat/ComposerBanner.tsx b/apps/web/src/components/chat/ComposerBanner.tsx
index 317c2136da87f1d44b3a6e9a9a1a2a7c31cb3825..6fbd65fc87c817e16d1515bc0b6993f6134088bd 100644
--- a/apps/web/src/components/chat/ComposerBanner.tsx
+++ b/apps/web/src/components/chat/ComposerBanner.tsx
@@ -165,6 +165,16 @@ function Root({
         density === "comfortable" && "[--composer-banner-padding-block:--spacing(1.25)]",
         density === "spacious" && "px-3 [--composer-banner-padding-block:--spacing(3)]",
         width === "content" ? "w-fit max-w-full flex-none" : "@container",
+        // The first row's last action sits in the banner's corner: its outer corner follows the
+        // banner's curve (2xl minus the 1 spacing inset), and floating banners curve below too.
+        // Actions may also arrive grouped in one wrapper element (usage-limit recovery).
+        "[&>[data-composer-banner-row]:first-child>[data-slot=composer-banner-actions]>[data-slot=button]:last-child]:rounded-se-xl",
+        "[&>[data-composer-banner-row]:first-child>[data-slot=composer-banner-actions]>:last-child>[data-slot=button]:last-of-type]:rounded-se-xl",
+        "[&>:first-child>[data-composer-banner-row]:first-child>[data-slot=composer-banner-actions]>[data-slot=button]:last-child]:rounded-se-xl",
+        placement === "floating" && [
+          "[&>[data-composer-banner-row]:only-child>[data-slot=composer-banner-actions]>[data-slot=button]:last-child]:rounded-ee-xl",
+          "[&>[data-composer-banner-row]:only-child>[data-slot=composer-banner-actions]>:last-child>[data-slot=button]:last-of-type]:rounded-ee-xl",
+        ],
         className,
       )}
       data-slot="composer-banner"
diff --git a/apps/web/src/components/chat/ComposerCommandMenu.tsx b/apps/web/src/components/chat/ComposerCommandMenu.tsx
index edd28efe1d7f747175ae51ae837f50e00aa9b232..e89f4375ef85217849faab386a56554d45e92b96 100644
--- a/apps/web/src/components/chat/ComposerCommandMenu.tsx
+++ b/apps/web/src/components/chat/ComposerCommandMenu.tsx
@@ -110,7 +110,7 @@ export const ComposerCommandMenu = memo(function ComposerCommandMenu(props: {
     >
       <ComposerBanner.Surface
         ref={listRef}
-        className="flex min-h-0 w-full flex-col overflow-hidden pb-(--chat-composer-attachment-overlap) **:data-[slot=scroll-area-scrollbar]:data-[orientation=vertical]:my-4"
+        className="flex min-h-0 w-full flex-col overflow-hidden pb-(--chat-composer-attachment-overlap) **:data-[slot=command-item]:rounded-lg **:data-[slot=scroll-area-scrollbar]:data-[orientation=vertical]:my-4"
         data-composer-command-drawer="true"
       >
         {props.items.length > 0 ? (
diff --git a/apps/web/src/components/search/ProjectContentSearchDialog.tsx b/apps/web/src/components/search/ProjectContentSearchDialog.tsx
index f429d36e3f609c9b30379dd74bddf6a0bd0c8163..4dd38e6d458defb32e9a79646a3f2a09a19464ff 100644
--- a/apps/web/src/components/search/ProjectContentSearchDialog.tsx
+++ b/apps/web/src/components/search/ProjectContentSearchDialog.tsx
@@ -173,7 +173,7 @@ function OpenContentSearchDialog(props: {
       escapeLabel="Back"
       footerActionLabel="Open file"
       inputAccessory={
-        <div className="absolute inset-e-2.5 top-1/2 flex shrink-0 -translate-y-1/2 items-center gap-0.5 rounded-md border bg-muted/30 p-0.5">
+        <div className="absolute inset-e-2.5 top-1/2 flex shrink-0 -translate-y-1/2 items-center gap-0.5 rounded-lg border bg-muted/30 p-0.5">
           <SearchOptionButton
             active={caseSensitive}
             disabled={!search.canReadFiles}
diff --git a/apps/web/src/pierre-tree-theme.ts b/apps/web/src/pierre-tree-theme.ts
index 3f191d255789a74cdb653a6a88287af98262cded..606b77f6860e5bc9ee31cfb07e08ab1a8181a087 100644
--- a/apps/web/src/pierre-tree-theme.ts
+++ b/apps/web/src/pierre-tree-theme.ts
@@ -10,7 +10,7 @@ export const PIERRE_TREE_UNSAFE_CSS = `
     --trees-font-family-override: var(--font-sans);
     --trees-font-size-override: 0.75rem;
   }
-  button[data-type='item'] { border-radius: 5px; }
+  button[data-type='item'], button[data-type='item']::before { border-radius: var(--radius-md); }
   svg[data-icon-name='t3-tree-icon-loading'] { opacity: 0.6; }
   @media (prefers-reduced-motion: no-preference) {
     svg[data-icon-name='t3-tree-icon-loading'] { animation: t3-tree-spin 1s linear infinite; }
-- 
2.54.0