ThemesStyle() — ui Function Reference

Architecture documentation for the ThemesStyle() function in themes-styles.tsx from the ui codebase.

Function tsx ComponentRegistry Styles

Entity Profile

ComponentRegistry→ Styles→ ThemesStyle() — ui Function Reference

Dependency Diagram

graph TD
  7435a0f0_93c0_c4fd_79ab_2b89282552d0["ThemesStyle()"]
  13d890e8_b41f_7c4d_34cd_f52fd093ad72["themes-styles.tsx"]
  7435a0f0_93c0_c4fd_79ab_2b89282552d0 -->|defined in| 13d890e8_b41f_7c4d_34cd_f52fd093ad72
  style 7435a0f0_93c0_c4fd_79ab_2b89282552d0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

deprecated/www/components/themes-styles.tsx lines 5–31

export function ThemesStyle() {
  const { themesConfig } = useThemesConfig()

  if (!themesConfig.activeTheme) {
    return null
  }

  return (
    <style>
      {`
.themes-wrapper,
[data-chart] {
  ${Object.entries(themesConfig.activeTheme.cssVars.light)
    .map(([key, value]) => `${key}: ${value};`)
    .join("\n")}
}

.dark .themes-wrapper,
.dark [data-chart] {
  ${Object.entries(themesConfig.activeTheme.cssVars.dark)
    .map(([key, value]) => `${key}: ${value};`)
    .join("\n")}
}
  `}
    </style>
  )
}