ceos/opencode
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor(tui): remove secondary action styles (#37378)

Browse source
This commit is contained in:
James Long 2026-07-16 17:44:11 -04:00 • committed by GitHub
commit 309860558d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
16 changed files with 81 additions and 112 deletions
Download patch file Download diff file Expand all files Collapse all files

2
packages/tui/src/component/devtools-sidebar.tsx
View file

@ -20,7 +20,7 @@ export function DevToolsSidebar() {
{(group) => (
<box flexShrink={0} marginBottom={1}>
<box marginBottom={1}>
<text fg={themeV2.background.action.primary()} attributes={TextAttributes.BOLD}>
<text fg={themeV2.background.action()} attributes={TextAttributes.BOLD}>
{group.title}
</text>
</box>

55
packages/tui/src/component/prompt/index.tsx
View file

@ -187,7 +187,7 @@ export function Prompt(props: PromptProps) {
const renderer = useRenderer()
const exit = useExit()
const dimensions = useTerminalDimensions()
const { themeV2, syntax } = useTheme()
const { themeV2, syntax, mode } = useTheme()
const animationsEnabled = createMemo(() => config.animations ?? true)
const list = createMemo(() => props.placeholders?.normal ?? [])
const shell = createMemo(() => props.placeholders?.shell ?? [])
@ -1319,7 +1319,7 @@ export function Prompt(props: PromptProps) {
const highlight = createMemo(() => {
if (leader()) return themeV2.border()
if (store.mode === "shell") return themeV2.background.action.primary()
if (store.mode === "shell") return themeV2.background.action()
const agent = local.agent.current()
if (!agent) return themeV2.border()
return local.agent.color(agent.id)
@ -1378,6 +1378,12 @@ export function Prompt(props: PromptProps) {
})
const maxHeight = createMemo(() => Math.max(6, Math.floor(dimensions().height / 3)))
const promptBg = createMemo(() =>
mode() === "light"
? themeV2.increase(themeV2.background.surface.offset(), 1)
: themeV2.decrease(themeV2.background.surface.offset(), 1),
)
return (
<>
<box ref={(r: BoxRenderable) => (anchor = r)} visible={props.visible !== false} width="100%">
@ -1395,7 +1401,7 @@ export function Prompt(props: PromptProps) {
paddingRight={2}
paddingTop={1}
flexShrink={0}
backgroundColor={themeV2.background.action.secondary("focused")}
backgroundColor={promptBg()}
flexGrow={1}
width="100%"
>
@ -1471,10 +1477,8 @@ export function Prompt(props: PromptProps) {
if (props.disabled) return
r.target?.focus()
}}
focusedBackgroundColor={themeV2.background.action.secondary("focused")}
cursorColor={
props.disabled ? themeV2.background.surface.offset() : themeV2.text()
}
focusedBackgroundColor="transparent"
cursorColor={props.disabled ? themeV2.background.surface.offset() : themeV2.text()}
syntaxStyle={syntax()}
/>
<box flexDirection="row" flexShrink={0} paddingTop={1} gap={1} justifyContent="space-between">
@ -1493,16 +1497,11 @@ export function Prompt(props: PromptProps) {
<text fg={fadeColor(themeV2.text.subdued(), modelMetaAlpha())}>·</text>
<text
flexShrink={0}
fg={fadeColor(
leader() ? themeV2.text.subdued() : themeV2.text(),
modelMetaAlpha(),
)}
fg={fadeColor(leader() ? themeV2.text.subdued() : themeV2.text(), modelMetaAlpha())}
>
{local.model.parsed().model}
</text>
<text fg={fadeColor(themeV2.text.subdued(), modelMetaAlpha())}>
{currentProviderLabel()}
</text>
<text fg={fadeColor(themeV2.text.subdued(), modelMetaAlpha())}>{currentProviderLabel()}</text>
<Show when={showVariant()}>
<text fg={fadeColor(themeV2.text.subdued(), variantMetaAlpha())}>·</text>
<text>
@ -1536,15 +1535,15 @@ export function Prompt(props: PromptProps) {
borderColor={borderHighlight()}
customBorderChars={{
...EmptyBorder,
vertical: themeV2.background.action.secondary("focused").a !== 0 ? "╹" : " ",
vertical: promptBg().a !== 0 ? "╹" : " ",
}}
>
<box
height={1}
border={["bottom"]}
borderColor={themeV2.background.action.secondary("focused")}
borderColor={promptBg()}
customBorderChars={
themeV2.background.action.secondary("focused").a !== 0
promptBg().a !== 0
? {
...EmptyBorder,
horizontal: "▀",
@ -1561,23 +1560,15 @@ export function Prompt(props: PromptProps) {
<Match when={status() === "running"}>
<box flexDirection="row" gap={1} flexGrow={1} justifyContent="flex-start">
<box marginLeft={1}>
<Show
when={config.animations ?? true}
fallback={<text fg={themeV2.text.subdued()}>[⋯]</text>}
>
<Show when={config.animations ?? true} fallback={<text fg={themeV2.text.subdued()}>[⋯]</text>}>
<spinner color={spinnerDef().color} frames={spinnerDef().frames} interval={40} />
</Show>
</box>
<text
fg={store.interrupt > 0 ? themeV2.background.action.primary() : themeV2.text()}
>
<text fg={store.interrupt > 0 ? themeV2.background.action() : themeV2.text()}>
esc{" "}
<span
style={{
fg:
store.interrupt > 0
? themeV2.background.action.primary()
: themeV2.text.subdued(),
fg: store.interrupt > 0 ? themeV2.background.action() : themeV2.text.subdued(),
}}
>
{store.interrupt > 0 ? "again to interrupt" : "interrupt"}
@ -1613,13 +1604,7 @@ export function Prompt(props: PromptProps) {
<box gap={2} flexDirection="row">
<Show when={editorContextLabelState() !== "none" ? editorFileLabelDisplay() : undefined}>
{(file) => (
<text
fg={
editorContextLabelState() === "pending"
? themeV2.hue.accent(500)
: themeV2.text.subdued()
}
>
<text fg={editorContextLabelState() === "pending" ? themeV2.hue.accent(500) : themeV2.text.subdued()}>
{file()}
</text>
)}