import { DeltaBackend } from './delta-remote' ; import { Theme } from '../shared/shared-types' ; import { ipcBackend } from './ipc' ; import React , { useContext , useMemo } from 'react' ; export namespace ThemeManager { let currentThemeMetaData ; let currentThemeChangeHook = ( ) => { } ; export async function refresh ( ) { const theme = await DeltaBackend . call ( 'extras.getActiveTheme' ) ; if ( theme ) { currentThemeMetaData = theme . theme ; const themeVars = window . document . getElementById ( 'theme-vars' ) ; if ( ! themeVars ) { throw new Error ( '#theme-vars element not found' ) ; } themeVars . innerText = theme . data ; currentThemeChangeHook ( ) ; } } ipcBackend . on ( 'theme-update' , _e => refresh ( ) ) ; refresh ( ) ; export function getCurrentThemeMetaData ( ) { return currentThemeMetaData ; } export function setUpdateHook ( hook ) { currentThemeChangeHook = hook ; } } /** contains a theme identifier so we can get a rerender if it changes */ export const ThemeContext = React . createContext < number > ( 0 ) ; export const useThemeCssVar = ( css_var_name ) => { const tc = useContext ( ThemeContext ) ; const result = useMemo ( ( ) => { tc ; return getComputedStyle ( document . firstElementChild as Element ) . getPropertyValue ( css_var_name ) . trim ( ) ; } , [ tc , css_var_name ] ) ; return result ; } ;