import { colorVar } from '../tokens'
import type { TokenColor } from '../tokens'
import { COLOR_TOKEN_KEYS } from './keys'

const COLOR_SET = new Set<string>(COLOR_TOKEN_KEYS as readonly string[])

/**
 * Map an EffectiveTokens key to its ui-tokens custom-property name.
 * color key  -> colorVar(key) = `--mod-color-<key>`
 * shape key  -> `--mod-<key>` (already carries radius-/font-size-/font-weight-)
 */
export function cssVarFor(key: string): string {
  return COLOR_SET.has(key) ? colorVar(key as TokenColor) : `--mod-${key}`
}