import { ThemeConfig, ThemeColors } from "./ThemeConfig";

export function exportConfigToCss(config: ThemeConfig): string {
  let css = "";

  // Export light mode colors
  if (config.colors && Object.keys(config.colors).length > 0) {
    css += ":root {\n";

    // Add font family if present
    if (config.fontFamily) {
      css += `  --font-sans: ${config.fontFamily};\n`;
    }
    // Add radius if present
    if (config.radius) {
      css += `  --radius: ${config.radius};\n`;
    }

    css += exportColors(config.colors);

    css += "}\n";
  }

  // Export dark mode colors
  if (config.darkColors && Object.keys(config.darkColors).length > 0) {
    if (css) css += "\n";
    css += ".dark {\n";

    if (config.fontFamily) {
      css += `  --font-sans: ${config.fontFamily};\n`;
    }

    // Add radius if different from light mode
    if (config.radius && !config.colors) {
      css += `  --radius: ${config.radius};\n`;
    }

    css += exportColors(config.darkColors);

    css += "}\n";
  }

  // If no colors but has other config, export to :root
  if (!css && (config.radius || config.fontFamily)) {
    css += ":root {\n";
    if (config.fontFamily) {
      css += `  --font-sans: ${config.fontFamily};\n`;
    }
    if (config.radius) {
      css += `  --radius: ${config.radius};\n`;
    }
    css += "}\n";
  }

  return css || "/* No custom theme configuration */";
}

function exportColors(colors: ThemeColors): string {
  let css = "";

  const colorMap: Record<keyof ThemeColors, string> = {
    background: "--background",
    foreground: "--foreground",
    card: "--card",
    cardForeground: "--card-foreground",
    popover: "--popover",
    popoverForeground: "--popover-foreground",
    primary: "--primary",
    primaryForeground: "--primary-foreground",
    secondary: "--secondary",
    secondaryForeground: "--secondary-foreground",
    muted: "--muted",
    mutedForeground: "--muted-foreground",
    accent: "--accent",
    accentForeground: "--accent-foreground",
    destructive: "--destructive",
    destructiveForeground: "--destructive-foreground",
    border: "--border",
    input: "--input",
    ring: "--ring",
    sidebar: "--sidebar",
    sidebarBackground: "--sidebar-background",
    sidebarForeground: "--sidebar-foreground",
    sidebarPrimary: "--sidebar-primary",
    sidebarPrimaryForeground: "--sidebar-primary-foreground",
    sidebarAccent: "--sidebar-accent",
    sidebarAccentForeground: "--sidebar-accent-foreground",
    sidebarBorder: "--sidebar-border",
    sidebarRing: "--sidebar-ring",
  };

  for (const [key, cssVar] of Object.entries(colorMap)) {
    const value = colors[key as keyof ThemeColors];
    if (value) {
      css += `  ${cssVar}: ${value};\n`;
    }
  }

  return css;
}