cfc/cfc-frontend/utils/brand-colors.js

/**
 * 品牌色板 — JS 侧单一事实源
 *
 * 说明：
 * - SCSS 变量编译期才解析，JS 块内无法引用 $var，因此在此处维护一份等值副本。
 * - 替换原则：仅替换 <script> 块内的纯 hex 字符串字面量（颜色字面量，如 '#F97316'）。
 * - 不替换 canvas 绘图参数、动态拼接色、数据中携带的 hex（保持原始）。
 *
 * 对应 uni.scss §12-§16 令牌：
 *   $brand-primary    #F97316    → BrandColors.primary
 *   $brand-primary-light  #FB923C → BrandColors.primaryLight
 *   $uni-primary-pale #FFF7ED    → BrandColors.primaryPale
 *   $dim-body         #FF8C42    → BrandColors.body
 *   $dim-mind         #FF6B9D    → BrandColors.mind
 *   $dim-wisdom       #6366F1    → BrandColors.wisdom
 *   $dim-action       #10B981    → BrandColors.action
 *   $dim-wealth       #F59E0B    → BrandColors.wealth
 *   $status-success   #10B981    → BrandColors.success
 *   $status-danger    #EF4444    → BrandColors.danger
 *   $status-warning   #FBBF24    → BrandColors.warning
 *   $facade-text-strong #333     → BrandColors.textStrong
 *   $facade-text-body   #666     → BrandColors.textBody
 *   $facade-text-muted  #999     → BrandColors.textMuted
 *   $facade-fill-ghost  #FAFAFA  → BrandColors.fillGhost
 *   $facade-fill-gray-50 #F9FAFB → BrandColors.fillGray50
 *   $app-surface        #FFFFFF  → BrandColors.white
 *   $status-danger-strong-2 #C62828 → BrandColors.dangerDeep
 */
export const BrandColors = {
  // 品牌橙族
  primary: '#F97316',
  primaryLight: '#FB923C',
  primaryPale: '#FFF7ED',
  primaryDark: '#EA580C',
  primaryDeep: '#C2410C',  // 深橙（画布卡片文字档）
  bodyLight: '#FFB366',    // 身体维度亮档（画布渐变终）
  bodyTint: '#FFF8F0',     // 身体维度浅底（$dim-body-tint）

  // 五维身份色
  body: '#FF8C42',
  mind: '#FF6B9D',
  wisdom: '#6366F1',
  action: '#10B981',
  wealth: '#F59E0B',

  // 状态色
  success: '#10B981',
  successLight3: '#34D399', // emerald-400 成功亮档·三档
  warning: '#FBBF24',
  danger: '#EF4444',
  dangerLight2: '#FB7185',  // rose-400 危险亮档·二档（睡眠质量条）
  info: '#0EA5E9',          // sky-500 信息
  infoLight: '#38BDF8',     // sky-400 信息亮档
  infoBlue: '#3B82F6',      // blue-500 信息蓝（智慧维度组件色板）
  infoBlueLight: '#60A5FA', // blue-400 信息蓝亮档
  wisdomLight: '#818CF8',   // indigo-400 智慧亮档

  // 中性灰阶
  white: '#FFFFFF',
  textStrong: '#333333',
  textBody: '#666666',
  textMuted: '#999999',
  fillGhost: '#FAFAFA',
  fillGray50: '#F9FAFB',

  // 状态深阶
  dangerDeep: '#C62828',
  violetDeep: '#7C3AED',   // violet-600 深紫（#7C3AED）

  // 中性灰阶扩展（对应 $facade-text-gray-400 / $facade-text-slate / $facade-hairline-2）
  textGray400: '#9CA3AF',
  textSlate: '#6B7280',
  hairline2: '#EEE',
  textFaint: '#888',
  gray200: '#E5E7EB',      // gray-200 浅灰（canvas 连线/分隔）
  textGray800: '#1F2937',  // gray-800 深灰（$facade-text-gray-800）

  // Plutchik 八基本情绪色板（情绪打卡专属；单一事实源）
  emotionJoy: '#FFD93D',       // 开心
  emotionTrust: '#6BCB77',     // 信任
  emotionFear: '#9B59B6',      // 恐惧
  emotionSurprise: '#FF9FF3',  // 惊讶
  emotionSadness: '#6B9BD2',   // 悲伤/难过
  emotionDisgust: '#A0A0A0',   // 厌恶
  emotionAnger: '#FF6B6B',     // 烦躁/愤怒

  // 语义别名（后端配置色兜底；SCSS 侧等值令牌见 uni.scss $facade-violet/$status-info）
  violet: '#8B5CF6',      // violet-500 紫罗兰（心智维度组件色板）
  infoBlue: '#3B82F6',    // blue-500 信息蓝（智慧维度组件色板）

  // 通用语义别名（方便使用）
  brand: '#F97316',
  dimMind: '#FF6B9D',
  dimWisdom: '#6366F1',
  dimAction: '#10B981',
  dimBody: '#FF8C42',
  dimWealth: '#F59E0B',
}

// 向后兼容导出（避免 import 路径散乱）
export default BrandColors