[犀牛鸟]feat(color-picker): support eyedropper

[yzh505]

🤔 这个 PR 的性质是？

• 日常 bug 修复
• 新特性提交
• 文档改进
• 演示代码改进
• 组件样式/交互改进
• CI/CD 改进
• 重构
• 代码风格优化
• 测试用例
• 分支合并
• 其他

🔗 相关 Issue

Tencent/tdesign-common#2568

🔗相关PR

Tencent/tdesign-common#2637

需求背景

ColorPicker 目前只能通过面板手动调整颜色。业务中存在上传背景图后，需要直接从图片或页面中吸取颜色的场景，因此需要支持吸色能力。

解决方案

新增 eyeDropper 属性，支持 ColorPicker 和 ColorPickerPanel 开启吸色功能。开启后在颜色条前展示吸色按钮。

默认使用浏览器原生 EyeDropper API 进行屏幕取色；当配置 { mode: 'fallback' } 时，在不支持原生 API 的浏览器中使用 html2canvas-pro 截取当前页面并读取 canvas 像素作为兜底。

实现要点：

• ColorPicker / ColorPickerPanel 新增 eyeDropper prop，默认 false。
• 取色成功后触发 context.trigger = 'eyedropper'。
• 使用 tdesign-icons-vue-next 的 SipIcon 作为吸色图标，并通过 useGlobalIcon 支持全局图标替换。
• 浏览器不支持 EyeDropper API 时按钮展示禁用态。
• enableAlpha 开启时保留吸色前透明度。
• 渐变模式下只更新当前选中的渐变节点，不覆盖整个渐变为单色。
• 用户取消、取色失败或组件卸载不会触发 change。
• fallback 动态加载 html2canvas-pro，并限制截图 scale、使用 requestAnimationFrame 节流预览更新。
• 新增 eye-dropper 演示示例。

📝 更新日志

• 本条 PR 不需要纳入 Changelog

tdesign-vue-next

@tdesign-vue-next/chat

@tdesign-vue-next/nuxt

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项。⚠️

• [√] 文档已补充或无须补充
• [√] 代码演示已提供或无须提供
• [√] TypeScript 定义已补充或无须补充
• [√] Changelog 已提供或无须提供

[uyarn]

/update-common 2637

[tdesign-bot]

TDesign Component Site Preview Open

Component	Preview
tdesign-vue-next
@tdesign-vue-next/chat