Button bug

frontend/DESIGN.md

@@ -761,8 +761,12 @@ chevron keep their size, and only the name gives way (a `truncate` span with
 `title=` holding the full name). This is the rule for any Button that holds a
 user-supplied name (a chat, agent or source) in a flex row: Button's base is
 `shrink-0 whitespace-nowrap`, so `min-w-0` alone does nothing. Pass `min-w-0
-shrink` (or `flex-1` / `w-full` when it should fill the row) and put the name
-in the `truncate` span; its icons stay `shrink-0`.
+shrink` (or `flex-1` when it should fill the row) and put the name in the
+`truncate` span; its icons stay `shrink-0`. `w-full` doesn't count: a
+`w-full shrink-0` Button takes the whole row and pushes its neighbour out,
+under the next control (an `outline` Button's fill is translucent in dark, so
+it shows through there and hides in light). `variant="combobox"` already
+carries `min-w-0 shrink`, like the fields it sits among.
 
 New Chat is `SquarePen` everywhere: the phone bar, the sidebar's New Chat row
 and the collapsed rail. `Plus` means "add an item to this list", not "start

frontend/src/components/ui/button.tsx

@@ -42,8 +42,10 @@ const buttonVariants = cva(
         // variant below sets the row's own padding and radius.
         'sidebar-item':
           'text-foreground hover:bg-sidebar-accent aria-[current=page]:bg-sidebar-accent',
+        // A field, so it gives way in a row like Input and SelectTrigger do
+        // (the base is shrink-0), keeping a neighbour's edit button in view.
         combobox:
-          'border border-input bg-card font-normal shadow-xs hover:bg-accent data-placeholder:text-muted-foreground',
+          'min-w-0 shrink border border-input bg-card font-normal shadow-xs hover:bg-accent data-placeholder:text-muted-foreground',
         // Underline tabs (FilePicker's drives, the agent page sub-nav). Mark the
         // current tab with data-active; the 2px border is always there so the
         // row height doesn't move. The compound variant squares the corners.

frontend/src/settings/Prompts.tsx

@@ -286,7 +286,7 @@ export default function Prompts({
           aria-label={titleAs === 'heading' ? titleText : undefined}
           data-placeholder={selectedPrompt?.name ? undefined : ''}
           className={cn(
-            'w-full min-w-0 justify-between',
+            'w-full justify-between',
             titleAs === 'row' && 'sm:w-56',
           )}
         >