import { clsx, type ClassValue } from "clsx"
import { extendTailwindMerge } from "tailwind-merge"

// 扩展 tailwind-merge，让自定义 fontSize 类不和颜色类冲突
const twMerge = extendTailwindMerge({
  extend: {
    classGroups: {
      // 把自定义字号类归到 'font-size' 组，和颜色类 'text-color' 分开
      'font-size': [
        'text-display',
        'text-h1',
        'text-h2',
        'text-h3',
        'text-h4',
        'text-base',
        'text-sm-body',
        'text-caption',
      ],
    },
  },
})

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}