@brimveyn/aimux 1.19.1 → 1.19.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brimveyn/aimux",
-  "version": "1.19.1",
+  "version": "1.19.2",
   "description": "A terminal multiplexer for AI CLIs. Run Claude, Codex, OpenCode side-by-side with tabbed navigation, split panes, and persistent sessions.",
   "keywords": [
     "ai",

package/src/ui/components/modals/shared/modal-keybinds-overlay.tsx

@@ -1,32 +1,12 @@
 import type { ModeId } from '@brimveyn/aimux-config'
 
-import { type BoxRenderable, type OptimizedBuffer, RGBA } from '@opentui/core'
-
 import { describeBindings } from '../../../../input/keymap/describe-bindings'
 import { useKeymap } from '../../../keymap-context'
 import { useTheme, useTransparent } from '../../../theme'
+import { fillBoxInterior } from '../../../transparent-fill'
 
 const KEYS_COLUMN_WIDTH = 12
 
-const TRANSPARENT_RGBA = RGBA.fromValues(0, 0, 0, 0)
-
-// Same trick as modal-shell: when our bg is transparent, BoxRenderable skips
-// its fill so the chrome chars underneath leak through. setCell bypasses alpha
-// blending and char-preservation, so we can wipe every interior cell to
-// (' ', TRANSPARENT_RGBA, TRANSPARENT_RGBA). No border on this overlay, so
-// fill the full bounds (no 1-cell inset).
-function fillBoxInteriorWithSpaces(this: BoxRenderable, buffer: OptimizedBuffer): void {
-  const x0 = this.screenX
-  const y0 = this.screenY
-  const endX = x0 + this.width
-  const endY = y0 + this.height
-  for (let y = y0; y < endY; y++) {
-    for (let x = x0; x < endX; x++) {
-      buffer.setCell(x, y, ' ', TRANSPARENT_RGBA, TRANSPARENT_RGBA)
-    }
-  }
-}
-
 interface ModalKeybindsOverlayProps {
   modeId: ModeId
   limit?: number
@@ -52,7 +32,7 @@ export function ModalKeybindsOverlay({ limit, modeId }: ModalKeybindsOverlayProp
         paddingRight={2}
         paddingTop={1}
         paddingBottom={1}
-        renderAfter={transparent ? fillBoxInteriorWithSpaces : undefined}
+        renderAfter={transparent ? fillBoxInterior : undefined}
       >
         {entries.map((binding) => (
           <box key={binding.description ?? binding.keys} flexDirection="row">

package/src/ui/components/modals/shared/modal-shell.tsx

@@ -1,9 +1,8 @@
 import type { ModeId } from '@brimveyn/aimux-config'
 import type { ReactNode } from 'react'
 
-import { type BoxRenderable, type OptimizedBuffer, RGBA } from '@opentui/core'
-
 import { useTheme, useTransparent } from '../../../theme'
+import { fillBorderedBoxInterior } from '../../../transparent-fill'
 import { ModalKeybindsOverlay } from './modal-keybinds-overlay'
 
 interface ModalShellProps {
@@ -16,38 +15,6 @@ interface ModalShellProps {
   width: number | `${number}%`
 }
 
-const TRANSPARENT_RGBA = RGBA.fromValues(0, 0, 0, 0)
-
-// opentui's BoxRenderable only paints a fill when `backgroundColor.a > 0`, so
-// a fully transparent modal bg leaks the chrome characters underneath. The
-// `renderAfter` hook runs after the box paints itself but before its children
-// render, so we manually overwrite every interior cell with a blank space.
-//
-// Two gotchas we hit by reading the zig source (packages/core/src/zig/buffer.zig):
-//  1. `setCellWithAlphaBlending` early-returns via `isFullyTransparent` when
-//     both fg and bg alpha are 0 — nothing gets written.
-//  2. Its `blendCells` deliberately preserves the destination char when the
-//     overlay char is `DEFAULT_SPACE_CHAR` (codepoint 32) so that drawing a
-//     space on top of existing text does not erase it.
-//
-// `setCell` (→ `bufferSetCell` → zig `buffer.set`) bypasses both: it writes
-// the cell unconditionally, no alpha check, no blending, no char preservation.
-function fillModalInteriorWithSpaces(this: BoxRenderable, buffer: OptimizedBuffer): void {
-  const x0 = this.screenX
-  const y0 = this.screenY
-  const w = this.width
-  const h = this.height
-  const startX = x0 + 1
-  const startY = y0 + 1
-  const endX = x0 + w - 1
-  const endY = y0 + h - 1
-  for (let y = startY; y < endY; y++) {
-    for (let x = startX; x < endX; x++) {
-      buffer.setCell(x, y, ' ', TRANSPARENT_RGBA, TRANSPARENT_RGBA)
-    }
-  }
-}
-
 export function ModalShell({
   children,
   footer,
@@ -76,7 +43,7 @@ export function ModalShell({
         backgroundColor={bg}
         padding={1}
         width={width}
-        renderAfter={transparent ? fillModalInteriorWithSpaces : undefined}
+        renderAfter={transparent ? fillBorderedBoxInterior : undefined}
       >
         <box width="100%" flexDirection="column" gap={listGap}>
           <box flexDirection="column">

package/src/ui/components/overlays/context-menu/context-menu-overlay.tsx

@@ -9,7 +9,8 @@ import {
   type ContextMenuState,
   subscribeContextMenu,
 } from '../../../context-menu/controller'
-import { useTheme } from '../../../theme'
+import { useTheme, useTransparent } from '../../../theme'
+import { fillBorderedBoxInterior } from '../../../transparent-fill'
 
 const MenuItem = memo(function MenuItem({
   active,
@@ -59,6 +60,7 @@ export function ContextMenuOverlay() {
   const [menu, setMenu] = useState<ContextMenuState | null>(null)
   const [selected, setSelected] = useState(0)
   const t = useTheme()
+  const transparent = useTransparent()
   const terminalCols = useAppStore((s) => s.layout.terminalCols)
   const terminalRows = useAppStore((s) => s.layout.terminalRows)
 
@@ -131,7 +133,8 @@ export function ContextMenuOverlay() {
         flexDirection="column"
         border
         borderColor={t.border}
-        backgroundColor={t.backgroundPanel}
+        backgroundColor={transparent ? 'transparent' : t.backgroundPanel}
+        renderAfter={transparent ? fillBorderedBoxInterior : undefined}
         onMouseDown={handleMenuMouseDown}
       >
         {menu.items.map(([label, onSelect], index) => (

package/src/ui/transparent-fill.ts

@@ -0,0 +1,49 @@
+import { type BoxRenderable, type OptimizedBuffer, RGBA } from '@opentui/core'
+
+export const TRANSPARENT_RGBA = RGBA.fromValues(0, 0, 0, 0)
+
+// opentui's BoxRenderable only paints a fill when `backgroundColor.a > 0`, so
+// a fully transparent bg leaks the chrome characters underneath. These helpers
+// run from a box's `renderAfter` hook (after the box paints itself, before its
+// children render) and manually overwrite every interior cell with a blank
+// space so the region reads as "emptied" instead of leaking.
+//
+// Two gotchas we hit by reading the zig source (packages/core/src/zig/buffer.zig):
+//  1. `setCellWithAlphaBlending` early-returns via `isFullyTransparent` when
+//     both fg and bg alpha are 0 — nothing gets written.
+//  2. Its `blendCells` deliberately preserves the destination char when the
+//     overlay char is `DEFAULT_SPACE_CHAR` (codepoint 32) so that drawing a
+//     space on top of existing text does not erase it.
+//
+// `setCell` (→ `bufferSetCell` → zig `buffer.set`) bypasses both: it writes
+// the cell unconditionally, no alpha check, no blending, no char preservation.
+
+// Bordered boxes: inset by 1 cell so the painted border is preserved.
+export function fillBorderedBoxInterior(this: BoxRenderable, buffer: OptimizedBuffer): void {
+  const x0 = this.screenX
+  const y0 = this.screenY
+  const w = this.width
+  const h = this.height
+  const startX = x0 + 1
+  const startY = y0 + 1
+  const endX = x0 + w - 1
+  const endY = y0 + h - 1
+  for (let y = startY; y < endY; y++) {
+    for (let x = startX; x < endX; x++) {
+      buffer.setCell(x, y, ' ', TRANSPARENT_RGBA, TRANSPARENT_RGBA)
+    }
+  }
+}
+
+// Borderless boxes: fill the full bounds (no inset).
+export function fillBoxInterior(this: BoxRenderable, buffer: OptimizedBuffer): void {
+  const x0 = this.screenX
+  const y0 = this.screenY
+  const endX = x0 + this.width
+  const endY = y0 + this.height
+  for (let y = y0; y < endY; y++) {
+    for (let x = x0; x < endX; x++) {
+      buffer.setCell(x, y, ' ', TRANSPARENT_RGBA, TRANSPARENT_RGBA)
+    }
+  }
+}