getThemeCodeOKLCH() — ui Function Reference

Architecture documentation for the getThemeCodeOKLCH() function in theme-customizer.tsx from the ui codebase.

Function tsx Internationalization RTLLayout called by 1

Entity Profile

Internationalization→ RTLLayout→ getThemeCodeOKLCH() — ui Function Reference

Dependency Diagram

graph TD
  7a0a28fb_2687_f765_c5d6_2dba252a0c95["getThemeCodeOKLCH()"]
  99c48ee8_09f0_5ee4_48c9_597d941f294c["theme-customizer.tsx"]
  7a0a28fb_2687_f765_c5d6_2dba252a0c95 -->|defined in| 99c48ee8_09f0_5ee4_48c9_597d941f294c
  58ff6be5_2050_2b1b_9268_3918ae1d2f4e["CustomizerCode()"]
  58ff6be5_2050_2b1b_9268_3918ae1d2f4e -->|calls| 7a0a28fb_2687_f765_c5d6_2dba252a0c95
  style 7a0a28fb_2687_f765_c5d6_2dba252a0c95 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/components/theme-customizer.tsx lines 641–660

function getThemeCodeOKLCH(theme: BaseColorOKLCH | undefined, radius: number) {
  if (!theme) {
    return ""
  }

  const rootSection =
    ":root {\n  --radius: " +
    radius +
    "rem;\n" +
    Object.entries(theme.light)
      .map((entry) => "  --" + entry[0] + ": " + entry[1] + ";")
      .join("\n") +
    "\n}\n\n.dark {\n" +
    Object.entries(theme.dark)
      .map((entry) => "  --" + entry[0] + ": " + entry[1] + ";")
      .join("\n") +
    "\n}\n"

  return rootSection
}