From 4d81656c279a7f9f3a8c13312306d1e49a9535b9 Mon Sep 17 00:00:00 2001
From: shamanic <shamanicbeatbox@gmail.com>
Date: Thu, 22 Jan 2026 01:46:03 +0000
Subject: [PATCH] fix: use selectedForeground for transparent background themes
 in dialogs

---
 packages/opencode/src/cli/cmd/tui/ui/dialog-alert.tsx   | 5 +++--
 packages/opencode/src/cli/cmd/tui/ui/dialog-confirm.tsx | 7 +++----
 packages/opencode/src/cli/cmd/tui/ui/dialog-help.tsx    | 5 +++--
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/opencode/src/cli/cmd/tui/ui/dialog-alert.tsx b/packages/opencode/src/cli/cmd/tui/ui/dialog-alert.tsx
index 45e946fa7c30..03faaafb59a2 100644
--- a/packages/opencode/src/cli/cmd/tui/ui/dialog-alert.tsx
+++ b/packages/opencode/src/cli/cmd/tui/ui/dialog-alert.tsx
@@ -1,5 +1,5 @@
 import { TextAttributes } from "@opentui/core"
-import { useTheme } from "../context/theme"
+import { useTheme, selectedForeground } from "../context/theme"
 import { useDialog, type DialogContext } from "./dialog"
 import { useKeyboard } from "@opentui/solid"
 
@@ -12,6 +12,7 @@ export type DialogAlertProps = {
 export function DialogAlert(props: DialogAlertProps) {
   const dialog = useDialog()
   const { theme } = useTheme()
+  const fg = selectedForeground(theme)
 
   useKeyboard((evt) => {
     if (evt.name === "return") {
@@ -40,7 +41,7 @@ export function DialogAlert(props: DialogAlertProps) {
             dialog.clear()
           }}
         >
-          <text fg={theme.selectedListItemText}>ok</text>
+          <text fg={fg}>ok</text>
         </box>
       </box>
     </box>
diff --git a/packages/opencode/src/cli/cmd/tui/ui/dialog-confirm.tsx b/packages/opencode/src/cli/cmd/tui/ui/dialog-confirm.tsx
index 8431a39461db..6b1a3069d2b8 100644
--- a/packages/opencode/src/cli/cmd/tui/ui/dialog-confirm.tsx
+++ b/packages/opencode/src/cli/cmd/tui/ui/dialog-confirm.tsx
@@ -1,5 +1,5 @@
 import { TextAttributes } from "@opentui/core"
-import { useTheme } from "../context/theme"
+import { useTheme, selectedForeground } from "../context/theme"
 import { useDialog, type DialogContext } from "./dialog"
 import { createStore } from "solid-js/store"
 import { For } from "solid-js"
@@ -16,6 +16,7 @@ export type DialogConfirmProps = {
 export function DialogConfirm(props: DialogConfirmProps) {
   const dialog = useDialog()
   const { theme } = useTheme()
+  const fg = selectedForeground(theme)
   const [store, setStore] = createStore({
     active: "confirm" as "confirm" | "cancel",
   })
@@ -55,9 +56,7 @@ export function DialogConfirm(props: DialogConfirmProps) {
                 dialog.clear()
               }}
             >
-              <text fg={key === store.active ? theme.selectedListItemText : theme.textMuted}>
-                {Locale.titlecase(key)}
-              </text>
+              <text fg={key === store.active ? fg : theme.textMuted}>{Locale.titlecase(key)}</text>
             </box>
           )}
         </For>
diff --git a/packages/opencode/src/cli/cmd/tui/ui/dialog-help.tsx b/packages/opencode/src/cli/cmd/tui/ui/dialog-help.tsx
index 056ce41dacf2..0503977daf10 100644
--- a/packages/opencode/src/cli/cmd/tui/ui/dialog-help.tsx
+++ b/packages/opencode/src/cli/cmd/tui/ui/dialog-help.tsx
@@ -1,5 +1,5 @@
 import { TextAttributes } from "@opentui/core"
-import { useTheme } from "@tui/context/theme"
+import { useTheme, selectedForeground } from "@tui/context/theme"
 import { useDialog } from "./dialog"
 import { useKeyboard } from "@opentui/solid"
 import { useKeybind } from "@tui/context/keybind"
@@ -7,6 +7,7 @@ import { useKeybind } from "@tui/context/keybind"
 export function DialogHelp() {
   const dialog = useDialog()
   const { theme } = useTheme()
+  const fg = selectedForeground(theme)
   const keybind = useKeybind()
 
   useKeyboard((evt) => {
@@ -30,7 +31,7 @@ export function DialogHelp() {
       </box>
       <box flexDirection="row" justifyContent="flex-end" paddingBottom={1}>
         <box paddingLeft={3} paddingRight={3} backgroundColor={theme.primary} onMouseUp={() => dialog.clear()}>
-          <text fg={theme.selectedListItemText}>ok</text>
+          <text fg={fg}>ok</text>
         </box>
       </box>
     </box>