More sacred patterns added

src/components/ThemeControls.tsx

@@ -51,7 +51,7 @@ const ThemeControls: React.FC = () => {
   const handleRandomize = (few = false) => {
     const newBaseHue = Math.floor(Math.random() * 360)
     const newUiSaturation = randomInteger(15, 65)
-    const newSyntaxSaturation = randomInteger(10, 65)
+    const newSyntaxSaturation = randomInteger(20, 65)
     const schemeValues = Object.values(ColorScheme).filter(
       (value) => typeof value === 'number'
     ) as number[]

src/components/ThemePreview.tsx

@@ -7,6 +7,7 @@ import { IGrammarDefinition, Registry, RegistryOptions } from 'monaco-textmate'
 import { wireTmGrammars } from 'monaco-editor-textmate'
 import { generateSemanticThemeJSON } from '@/lib/generator/export'
 import { convertTheme } from '@/lib/utils/convertTheme'
+import Color from 'color'
 
 interface ITokenEntry {
   name?: string
@@ -91,7 +92,59 @@ const codeSnippets = {
     '  );\n' +
     '};\n' +
     '\n' +
-    'export default UserProfile;\n',
+    'export default UserProfile;\n' +
+    'import type {\n' +
+    '  UIColors,\n' +
+    '  SyntaxColors,\n' +
+    '  AnsiColors,\n' +
+    '  VSCodeTheme,\n' +
+    '} from "@/lib/types/colors"\n' +
+    '\n' +
+    'import Color from "color"\n' +
+    '\n' +
+    'export function generateSemanticThemeJSON(\n' +
+    '  name: string = "Generated Color Theme",\n' +
+    '  colors: UIColors,\n' +
+    '  syntaxColors: SyntaxColors,\n' +
+    '  ansiColors: AnsiColors\n' +
+    '): { themeJSON: string; themeObject: VSCodeTheme } {\n' +
+    '  const theme = {\n' +
+    '    name: name,\n' +
+    '    type: Color(colors.BG1).isDark()\n' +
+    '      ? ("dark" as "dark" | "light")\n' +
+    '      : ("light" as "dark" | "light"),\n' +
+    '    semanticClass: "theme.rlabs",\n' +
+    '    semanticHighlighting: true,\n' +
+    '    colors: {\n' +
+    '      // # Integrated Terminal Colors\n' +
+    '      "terminal.background": colors.BG1,\n' +
+    '      "terminal.foreground": colors.FG1,\n' +
+    '      "terminal.border": colors.BORDER,\n' +
+    '      "terminal.ansiBrightBlack": ansiColors.BrightBlack,\n' +
+    '      "terminal.ansiBrightRed": ansiColors.BrightRed,\n' +
+    '      "terminal.ansiBrightGreen": ansiColors.BrightGreen,\n' +
+    '      "terminal.ansiBrightYellow": ansiColors.BrightYellow,\n' +
+    '      "terminal.ansiBrightBlue": ansiColors.BrightBlue,\n' +
+    '      "terminal.ansiBrightMagenta": ansiColors.BrightMagenta,\n' +
+    '      "terminal.ansiBrightCyan": ansiColors.BrightCyan,\n' +
+    '      "terminal.ansiBrightWhite": ansiColors.BrightWhite,\n' +
+    '      "terminal.ansiBlack": ansiColors.Black,\n' +
+    '      "terminal.ansiRed": ansiColors.Red,\n' +
+    '      "terminal.ansiGreen": ansiColors.Green,\n' +
+    '      "terminal.ansiYellow": ansiColors.Yellow,\n' +
+    '      "terminal.ansiBlue": ansiColors.Blue,\n' +
+    '      "terminal.ansiMagenta": ansiColors.Magenta,\n' +
+    '      "terminal.ansiCyan": ansiColors.Cyan,\n' +
+    '      "terminal.ansiWhite": ansiColors.White,\n' +
+    '      "terminal.selectionBackground": colors.selection,\n' +
+    '    }\n' +
+    '  };\n' +
+    '\n' +
+    '  return {\n' +
+    '    themeJSON: JSON.stringify(theme),\n' +
+    '    themeObject: theme\n' +
+    '  };\n' +
+    '}\n',
 
   'javascript.js':
     '// Class definition\n' +
@@ -757,8 +810,8 @@ const ThemePreview: React.FC = () => {
       </div>
       <p className="text-xs text-center mt-2">
         * This is a preview of the theme. The colors and tokens are not accurate
-        because of limitations of the monaco editor. The result in vscode will
-        be more granular and slightly different.
+        because of limitations in monaco editor. The result in vscode can be
+        more granular and slightly different.
       </p>
     </section>
   )

src/lib/generator/colorUtils.ts

@@ -223,6 +223,178 @@ export function generateSchemeColors(
         Math.abs(baseHue - angle + 360) % 360,
       ]
       break
+    case ColorScheme.SriYantra:
+      const angles: number[] = []
+      for (let i = 1; i <= 9; i++) {
+        angles.push((baseHue + i * 20) % 360)
+      }
+      result = [baseHue, ...angles]
+      break
+    case ColorScheme.KabbalahTreeOfLife:
+      const values: number[] = []
+      for (let i = 1; i <= 10; i++) {
+        values.push((baseHue + i * 15) % 360)
+      }
+      result = [baseHue, ...values]
+      break
+    case ColorScheme.Torus:
+      const u = degreesToRadians(baseHue % 360)
+      const v = degreesToRadians((baseHue * 2) % 360)
+      const R = 1 // Major radius
+      const r = 0.5 // Minor radius
+      const x = ((R + r * Math.cos(v)) * Math.cos(u)) % 360
+      const y = ((R + r * Math.cos(v)) * Math.sin(u)) % 360
+      const z = (r * Math.sin(v)) % 360
+      result = [baseHue, x, y, z]
+      break
+    case ColorScheme.MandelbrotSet:
+      const c_re = Math.cos(degreesToRadians(baseHue))
+      const c_im = Math.sin(degreesToRadians(baseHue))
+      const maxIterations = 10
+      let z_re = 0
+      let z_im = 0
+      const iterations: number[] = []
+      for (let i = 0; i < maxIterations; i++) {
+        const z_re_new = z_re * z_re - z_im * z_im + c_re
+        const z_im_new = 2 * z_re * z_im + c_im
+        z_re = z_re_new
+        z_im = z_im_new
+        iterations.push(Math.sqrt(z_re * z_re + z_im * z_im) % 360)
+        if (z_re * z_re + z_im * z_im > 4) break
+      }
+      result = [baseHue, ...iterations]
+      break
+    case ColorScheme.SierpinskiTriangle:
+      const triangleIterations = 5
+      const areas: number[] = []
+      let area = baseHue
+      for (let i = 0; i < triangleIterations; i++) {
+        areas.push(area % 360)
+        area = area / 2
+      }
+      result = [baseHue, ...areas]
+      break
+    // case ColorScheme.SierpinskiCarpet:
+    //   result = [baseHue, ...sierpinskiCarpet(baseHue)]
+    //   break
+    case ColorScheme.KochSnowflake:
+      const flakeIterations = 5
+      const lengths: number[] = []
+      let length = baseHue
+      for (let i = 0; i < flakeIterations; i++) {
+        lengths.push(length % 360)
+        length = length / 3
+      }
+      result = [baseHue, ...lengths]
+      break
+    case ColorScheme.CelticKnot:
+      const knotAngles: number[] = []
+      for (let i = 1; i <= 8; i++) {
+        const angle = (baseHue + i * 45) % 360
+        knotAngles.push(angle)
+      }
+      result = [baseHue, ...knotAngles]
+      break
+    case ColorScheme.Labirinth:
+      const paths: number[] = []
+      for (let i = 1; i <= 7; i++) {
+        paths.push((baseHue + i * 10) % 360)
+      }
+      result = [baseHue, ...paths]
+      break
+    case ColorScheme.YinYang:
+      const proportion = Math.abs(Math.sin(degreesToRadians(baseHue)))
+      result = [
+        baseHue,
+        (proportion * 360) % 360,
+        ((1 - proportion) * 360) % 360,
+      ]
+      break
+    case ColorScheme.StarTetrahedron:
+      const starAngles: number[] = []
+      for (let i = 0; i < 4; i++) {
+        starAngles.push((baseHue + i * 90) % 360)
+      }
+      result = [baseHue, ...starAngles]
+      break
+    case ColorScheme.Hamsa:
+      const hamsaLengths: number[] = [
+        (baseHue * 0.5) % 360,
+        (baseHue * 0.6) % 360,
+        (baseHue * 0.7) % 360,
+      ]
+      result = [baseHue, ...hamsaLengths]
+      break
+    case ColorScheme.Enneagram:
+      const enneagramAngles: number[] = []
+      for (let i = 0; i < 9; i++) {
+        enneagramAngles.push((baseHue + i * 40) % 360)
+      }
+      result = [baseHue, ...enneagramAngles]
+      break
+    case ColorScheme.Hexagram:
+      const hexagramAngles: number[] = []
+      for (let i = 0; i < 6; i++) {
+        hexagramAngles.push((baseHue + i * 60) % 360)
+      }
+      result = [baseHue, ...hexagramAngles]
+      break
+    case ColorScheme.ChakraSymbols:
+      const chakraValues: number[] = []
+      for (let i = 1; i <= 7; i++) {
+        chakraValues.push((baseHue + i * 30) % 360)
+      }
+      result = [baseHue, ...chakraValues]
+      break
+    case ColorScheme.SpiralDynamics:
+      const spiralValues: number[] = []
+      for (let i = 1; i <= 6; i++) {
+        spiralValues.push((baseHue * Math.pow(1.5, i)) % 360)
+      }
+      result = [baseHue, ...spiralValues]
+      break
+    case ColorScheme.DoubleTorus:
+      const du = degreesToRadians(baseHue % 360)
+      const dv = degreesToRadians((baseHue * 2) % 360)
+      const R1 = 1 // Major radius of the first torus
+      const r1 = 0.5 // Minor radius of the first torus
+      const R2 = 1 // Major radius of the second torus
+      const r2 = 0.5 // Minor radius of the second torus
+
+      // First torus coordinates
+      const x1 = ((R1 + r1 * Math.cos(dv)) * Math.cos(du)) % 360
+      const y1 = ((R1 + r1 * Math.cos(dv)) * Math.sin(du)) % 360
+      const z1 = (r1 * Math.sin(dv)) % 360
+
+      // Second torus coordinates (shifted)
+      const x2 =
+        ((R2 + r2 * Math.cos(dv + Math.PI)) * Math.cos(du + Math.PI)) % 360
+      const y2 =
+        ((R2 + r2 * Math.cos(dv + Math.PI)) * Math.sin(du + Math.PI)) % 360
+      const z2 = (r2 * Math.sin(dv + Math.PI)) % 360
+
+      result = [baseHue, x1, y1, z1, x2, y2, z2]
+      break
+    case ColorScheme.RosettePattern:
+      const k = ((baseHue % 360) / 360) * 10 + 2 // Number of petals between 2 and 12
+      const points: number[] = []
+      const numPoints = 10
+      for (let i = 0; i < numPoints; i++) {
+        const theta = (2 * Math.PI * i) / numPoints
+        const r = Math.cos(k * theta) % 360
+        points.push(r)
+      }
+      result = [baseHue, ...points]
+      break
+    case ColorScheme.NestedPolygons:
+      const sides = Math.floor((baseHue % 360) / 30) + 3 // Number of sides from 3 to 15
+      const layers = 5 // Number of nested layers
+      const polygons: number[] = []
+      for (let i = 1; i <= layers; i++) {
+        polygons.push((sides * i) % 360)
+      }
+      result = [baseHue, ...polygons]
+      break
     default:
       result = [baseHue]
   }
@@ -397,3 +569,7 @@ export function adjustSaturation(saturation: number): number {
 export function adjustLightness(lightness: number): number {
   return Math.max(0, Math.min(100, lightness))
 }
+// Utility function to convert degrees to radians
+function degreesToRadians(degrees: number): number {
+  return (degrees * Math.PI) / 180
+}