refactor(color-picker): ensure mode switches based on color value

[RylanBot]

🤔 这个 PR 的性质是？

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

🔗 相关 Issue

• [ColorPicker] 支持拖拽删除渐变颜色点及格式补全 #2544
• [colorPicker] 两种颜色模式时，切换模式对应色值没有更新，也没有相关监听方法 #2821
• [ColorPicker] 预设色支持渐变色 #3127
• [colorPicker] 渐变模式下，v-model值发生改变后popupContent的内容并未实时刷新 #3791
• [ColorPicker] 同时支持两种模式，渐变值回显问题 #3486

💡 需求背景和解决方案

Tip

以下出现的双栏截图和视频，左边均是有问题的版本，右边是预期合理的版本

1. PC 端统一修复➕重构

序号	描述	类型
1.1	「渐变」切回「单色」模式	① CSS 中的色值仍保留渐变时的格式，未按预期转换为 rgba ② 新增最近使用颜色仍为渐变色，未更新为单色 Tencent/tdesign-vue#3566
1.2	自动根据当前数值切换模式	① 🐛 Trigger Input 【视频 1-2-1】 / #3486 / #2821 ② ♻️ 最近使用颜色、预设颜色 【视频 1-2-2】
1.3	透明通道	① 🐛 Trigger Input 无法同步透明度值 【视频 1-3-1】 ② ♻️ 优化格式化返回值，例如 RGB 转为 RGBA，HSL 转为 HSLA 等
1.4	colorModes = {['linear-gradient']}	当用户仅使用渐变模式时，预设颜色中过滤非渐变的色值
1.5	Trigger Input	① 由于之前的逻辑是先检查用户输入色值是否有效，再决定是否更新 → 导致无法直接删除某个字母，只能整体粘贴替换，现在移除验证 ② 移除 onBlur 事件，避免与 onChange 重复触发 ③ onChange 回调传入 context: { color: ColorObject; trigger: 'input' }，符合文档标注的 TS 类型，避免返回给用户一个 undefined 或合成事件

2. Vue Next 特有 Bug 修复

序号	类型	描述
2.1	渐变模式	Trigger 中的依赖陷入死循环 → 使用键盘快速删除渐变字符串的一个个字母，容易导致整个页面卡死 （线上文档 该组件稳定复现）

📝 更新日志

• 本条 PR 不需要纳入 Changelog

tdesign-vue-next

• refactor(ColorPicker): 自动根据「触发器 / 最近颜色 / 预设颜色」的色值进行切换单色和渐变模式；只开启渐变模式时，过滤「预设颜色 / 当前颜色」中的非渐变色值；新增 format HEX8，移除 HSB；使用渐变模式的业务请注意此变更 ⚠️
• fix(ColorPicker): 开启透明通道时的返回值格式化异常

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

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

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

[tdesign-bot]

TDesign Component Site Preview Open

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

[pkg-pr-new]

tdesign-vue-next-demo

npm i https://pkg.pr.new/tdesign-vue-next@5319

commit: cb6f41d

[Copilot]

Pull Request Overview

This PR refactors the color-picker panel component to ensure that the mode switches automatically based on the current color value. It updates the logic to use a new getModeByColor function for determining the color mode, adjusts color state updates accordingly, and refines the event triggers in the setColor handlers.

Comments suppressed due to low confidence (1)

packages/components/color-picker/components/panel/index.tsx:249

• [nitpick] Consider renaming the 'value' parameter in handleSetColor to 'colorValue' for improved clarity about its purpose.

const handleSetColor = (value: string, trigger: ColorPickerChangeTrigger) => {

[RylanBot]

Note

需要等 common 仓库 PR 合并，并同步对应的公共方法

[liweijie0812]

/update-common

[tdesign-bot]

📝 更新日志

tdesign-vue-next

• refactor(ColorPicker): 自动根据「触发器 / 最近颜色 / 预设颜色」的色值进行切换单色和渐变模式；只开启渐变模式时，过滤「预设颜色 / 当前颜色」中的非渐变色值；新增 format HEX8，移除 HSB；使用渐变模式的业务请注意此变更 ⚠️
• fix(ColorPicker): 开启透明通道时的返回值格式化异常