fix(tui): raise neutral permission backgrounds (#37513)
This commit is contained in:
parent
d67e035c18
commit
bd79e24842
7 changed files with 41 additions and 42 deletions
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -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
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue