@composy/color-core

@composy/color-core 是 packages/color 的核心层，负责沉淀框架无关的颜色计算、主题生成、主题状态、设计系统映射、性能优化与 engine 集成能力。

当前能力分析

当前 core 已经覆盖以下主能力：

• 颜色基础能力：Color 类、颜色空间转换、混色、对比度与可访问性分析。
• 主题生成能力：基于主色生成色阶、语义色、CSS Variables 与设计系统映射。
• 主题运行时能力：ThemeManager、ThemeModeManager、BaseThemeAdapter。
• AI 配色助手：ColorAI 在 API 不可用时使用本地算法降级，并在每条建议中保留 schemeType。
• 性能能力：缓存、对象池、批处理、性能监控与自动优化器。
• engine 集成能力：createColorEnginePlugin、颜色相关 state keys 与 event keys。

本次整理后，core 不再暴露 Vue 专属插件实现，框架适配能力统一收敛到 @composy/color-vue。

目录结构

src/
  index.ts              # 包统一入口，重导出 ./color 模块
  accessibility/        # 颜色无障碍工具（色盲模拟、对比度检查、WCAG 审计）
  ai/                   # AI 颜色助手（智能配色建议、颜色上下文分析）
  analyzer/             # 颜色分析器（分布分析、调色板提取、主导色识别）
  animation/            # 颜色动画（插值、贝塞尔曲线、样条曲线渐变）
  batch/                # 批量颜色处理（并行/串行批量转换、操作）
  brand/                # 品牌颜色管理（品牌色配置、品牌调色板生成）
  color/                # 包主入口，聚合导出所有子模块
  constants/            # 常量定义（命名颜色表、色阶常量）
  core/                 # 核心颜色能力（Color 类、转换、分析、调色板、色彩科学）
  designSystems/        # 设计系统映射（Ant Design、Tailwind、Material Design 等）
  engine/               # 引擎插件（状态键、事件键、插件工厂函数）
  gradient/             # 渐变生成器（线性、径向、锥形、网格渐变）
  harmony/              # 色彩和谐（互补色、类似色、三元色等配色方案）
  locales/              # 多语言支持（中文、英文、日文等 10+ 语言）
  palette/              # 调色板工具（CSS 变量生成、暗色模式调色板）
  performance/          # 性能优化（懒加载、批量处理器、Web Worker 支持）
  schemes/              # 颜色方案生成器（自适应方案、和谐方案评估）
  selectors/            # 选择器 Web Component（颜色选择器、主题色/模式选择器）
  theme/                # 主题生成（色阶生成、CSS 变量注入、语义色映射）
  themes/               # 主题管理（ThemeManager、模式管理器、持久化、预设）
  types/                # 类型定义（基础类型、增强类型、类型守卫）
  utils/                # 工具函数（缓存、颜色空间、验证、错误处理、数学运算）

目录约束：

• src/index.ts 是包的统一入口。
• 所有可复用核心逻辑都保留在 core 内部，不依赖 Vue。
• engine/ 只放面向 @composy/engine-core 的框架无关插件协议与状态键。

安装

pnpm add @composy/color-core

快速使用

import {
  Color,
  createColorEnginePlugin,
  generateThemeColors,
  ThemeManager,
} from '@composy/color-core'

// 创建颜色实例
const color = new Color('#1677ff')
const lighter = color.lighten(12)

// 创建主题管理器
const themeManager = new ThemeManager({
  prefix: 'ld',
  storageKey: 'demo-color-theme',
})

// 应用主题色
const theme = themeManager.applyTheme('#1677ff')

// 生成主题色阶
const tokens = generateThemeColors('#1677ff')

// 创建引擎插件
const enginePlugin = createColorEnginePlugin()

void lighter
void theme
void tokens
void enginePlugin

构建产物

通过 @composy/builder 与工作区 postbuild 统一产出：

• dist/：UMD 单文件产物（dist/index.js、dist/index.min.js）。
• es/：ESM + 可直接消费的 CSS/JS 产物。
• esm/：保留源码模块结构的 ESM 产物。
• lib/：CommonJS 产物（lib/index.cjs）。

测试

pnpm type-check    # TypeScript 类型检查
pnpm lint:check    # ESLint 代码规范检查
pnpm test:run      # 运行单元测试
pnpm test:coverage # 运行测试覆盖率
pnpm build         # 构建产物

当前测试重点覆盖：

• engine 插件状态同步与卸载清理。
• 缓存预热与重复操作命中路径。
• 构建与类型检查入口。

代码质量

• 全量中文注释：73 个源码文件均包含完整的逐行中文注释，覆盖模块说明、类型定义、函数参数、返回值和逻辑流程。
• 零 any 类型：源码中禁止使用 any 类型（types/enhanced.ts 中的 TypeScript 类型系统 any 是标准用法），所有类型均使用完整定义。
• BEM 命名规范：所有 DOM class 使用 ldesign- 前缀，CSS 变量使用 --ldesign- 前缀。
• 详细优化记录：参见 OPTIMIZE-TASKS.md。

与 Vue 适配层的边界

• @composy/color-core：只负责核心算法、状态和框架无关插件能力。
• @composy/color-vue：负责 Vue 组件、composables、原生 Vue Plugin 与 engine Vue 适配。

如果你需要在 Vue 3 项目中直接接入颜色主题能力，请使用 @composy/color-vue。