fix(tui): raise neutral permission backgrounds (#37513)

This commit is contained in:
James Long 2026-07-17 11:35:02 -04:00 committed by GitHub
commit bd79e24842
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 41 additions and 42 deletions

View file

@ -2,6 +2,7 @@ import type { RGBA } from "@opentui/core"
import type { Accessor } from "solid-js"
import type {
ActionVariant,
Mode,
ResolvedActionState,
ResolvedThemeView,
} from "./index"
@ -9,7 +10,7 @@ import { ActionState, HueStep } from "./schema"
type StateFlags = Partial<Record<ActionState, boolean>>
export function createComponentTheme(current: Accessor<ResolvedThemeView>) {
export function createComponentTheme(current: Accessor<ResolvedThemeView>, mode: Accessor<Mode>) {
const textAction = actions((variant, state) => current().text.action[variant][state])
const backgroundAction = actions((variant, state) => current().background.action[variant][state])
const textFormfield = formfield((state) => current().text.formfield[state])
@ -78,6 +79,7 @@ export function createComponentTheme(current: Accessor<ResolvedThemeView>) {
hue,
increase: (color: RGBA, amount = 1) => current().increase(color, amount),
decrease: (color: RGBA, amount = 1) => current().decrease(color, amount),
raise: (color: RGBA) => (mode() === "light" ? current().increase(color) : current().decrease(color)),
text,
background,
border: () => current().border.default,

View file

@ -1,18 +1,20 @@
import { createComponent, createContext, useContext, type Accessor, type ParentProps } from "solid-js"
import { createComponentTheme, type ComponentTheme } from "./component"
import type { ContextKey, ResolvedTheme } from "./index"
import type { ContextKey, Mode, ResolvedTheme } from "./index"
type ThemeRuntime = {
readonly resolved: Accessor<ResolvedTheme>
readonly mode: Accessor<Mode>
readonly component: ComponentTheme
}
const ThemeContext = createContext<ThemeRuntime>()
export function ThemeProvider(props: ParentProps<{ theme: ResolvedTheme }>) {
export function ThemeProvider(props: ParentProps<{ theme: ResolvedTheme; mode?: Mode }>) {
const resolved = () => props.theme
const mode = () => props.mode ?? "light"
return createComponent(ThemeContext.Provider, {
value: { resolved, component: createComponentTheme(resolved) },
value: { resolved, mode, component: createComponentTheme(resolved, mode) },
get children() {
return props.children
},
@ -28,7 +30,7 @@ export function ContextProvider(props: ParentProps<{ context: ContextKey }>) {
}
context()
return createComponent(ThemeContext.Provider, {
value: { resolved: parent.resolved, component: createComponentTheme(context) },
value: { resolved: parent.resolved, mode: parent.mode, component: createComponentTheme(context, parent.mode) },
get children() {
return props.children
},