Skip to content

feat(color-picker): add EyeDropper API support for color sampling - #2615

Open
Lfan-ke wants to merge 1 commit into
Tencent:developfrom
Lfan-ke:feat/color-picker-eyedropper
Open

feat(color-picker): add EyeDropper API support for color sampling#2615
Lfan-ke wants to merge 1 commit into
Tencent:developfrom
Lfan-ke:feat/color-picker-eyedropper

Conversation

@Lfan-ke

@Lfan-ke Lfan-ke commented Jul 7, 2026

Copy link
Copy Markdown

关联 Issue

closes #2568

变更内容

js/color-picker/ 下新增 eyedropper.ts 模块,封装浏览器原生 EyeDropper API,向上游框架(Vue / React / 小程序等)提供统一的吸色能力:

  • isEyeDropperSupported() - 运行时能力检测,通过 globalThis.EyeDropper 判断(兼容 SSR/Node 环境)
  • openEyeDropper(signal?) - 调起系统吸色器,返回用户选中的十六进制颜色值;用户取消或发生错误均返回 null
  • 支持 AbortSignal,可在组件卸载时中断进行中的取色
  • 导出 EyeDropperResult / EyeDropperOpenOptions 接口,供框架层类型复用

测试

新增 test/unit/color-picker/eyedropper.test.ts,9 个用例,覆盖:

  • SSR(无 globalThis.EyeDropper)返回 false / null
  • 非函数类型的 EyeDropper 全局值被正确过滤
  • 取色成功时返回十六进制颜色
  • AbortSignal 被正确透传
  • 用户取消(AbortError)和任意异常均安全返回 null

框架侧实现

本 PR 为公共工具层,三个框架侧 PR 均依赖此模块:

@Lfan-ke
Lfan-ke force-pushed the feat/color-picker-eyedropper branch from aab535b to dbc6fe2 Compare July 7, 2026 10:55
@Lfan-ke
Lfan-ke changed the base branch from main to develop July 7, 2026 10:55
Signed-off-by: 林晨 (Leo Cheng) <leo-cheng@vip.qq.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[ColorPicker] 支持吸色

2 participants