bismillahcss/src/flatten-color-palette.ts

The next-gen utility-first CSS framework for modern, futuristic web development.

import { colors } from "./colors"

/**
 * Utility function to flatten a color palette object.
 * Similar to what Tailwind uses internally for its theme resolution.
 */
export function flattenColorPalette(palette: Record<string, any> = colors): Record<string, string> {
    const flattened: Record<string, string> = {}

    Object.entries(palette).forEach(([name, value]) => {
        if (typeof value === "string") {
            flattened[name] = value
        } else if (typeof value === "object" && value !== null) {
            Object.entries(value).forEach(([shade, hex]) => {
                if (shade === "DEFAULT") {
                    flattened[name] = hex as string
                } else {
                    flattened[`${name}-${shade}`] = hex as string
                }
            })
        }
    })

    return flattened
}