5f:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 60:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 61:T1291,import { parseHex, rgbToHex } from "@/lib/color" type ColorVision = "normal" | "protanopia" | "deuteranopia" | "tritanopia" type Lab = { l: number; a: number; b: number } type ColorConflict = { a: number b: number vision: ColorVision deltaE: number } // Machado、Oliveira、Fernandes 2009，作者发布表的 severity 1.0： // https://www.inf.ufrgs.br/~oliveira/pubs_files/CVD_Simulation/CVD_Simulation.html const matrices = { protanopia: [ [0.152286, 1.052583, -0.204868], [0.114503, 0.786281, 0.099216], [-0.003882, -0.048116, 1.051998], ], deuteranopia: [ [0.367322, 0.860646, -0.227968], [0.280085, 0.672501, 0.047413], [-0.01182, 0.04294, 0.968881], ], tritanopia: [ [1.255528, -0.076749, -0.178779], [-0.078411, 0.930809, 0.147602], [0.004733, 0.691367, 0.3039], ], } as const function linear(v: number) { v /= 255 return v <= 0.04045 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4 } function channels(hex: string) { const rgb = parseHex(hex) if (!rgb) throw new TypeError("无效的 HEX 颜色") return [linear(rgb.r), linear(rgb.g), linear(rgb.b)] as const } /** 模拟结果保留线性 RGB 浮点值：色差直接用它计算，取整只发生在输出 HEX 时 */ function simulateLinear(hex: string, type: Exclude) { const rgb = channels(hex) const transform = (row: readonly [number, number, number]) => Math.max( 0, Math.min( 1, row.reduce((sum, coefficient, i) => sum + coefficient * rgb[i]!, 0), ), ) const matrix = matrices[type] return [ transform(matrix[0]), transform(matrix[1]), transform(matrix[2]), ] as const } function simulateColorVision( hex: string, type: Exclude, ) { const [r, g, b] = simulateLinear(hex, type) const encode = (v: number) => 255 * (v <= 0.0031308 ? 12.92 * v : 1.055 * v ** (1 / 2.4) - 0.055) return rgbToHex({ r: encode(r), g: encode(g), b: encode(b), a: 1 }) } function linearToLab([r, g, b]: readonly [number, number, number]): Lab { const f = (v: number) => v > (6 / 29) ** 3 ? Math.cbrt(v) : v / (3 * (6 / 29) ** 2) + 4 / 29 const x = f((0.4124564 * r + 0.3575761 * g + 0.1804375 * b) / 0.95047) const y = f(0.2126729 * r + 0.7151522 * g + 0.072175 * b) const z = f((0.0193339 * r + 0.119192 * g + 0.9503041 * b) / 1.08883) return { l: 116 * y - 16, a: 500 * (x - y), b: 200 * (y - z) } } function hexToLab(hex: string): Lab { return linearToLab(channels(hex)) } function deltaE2000(p: Lab, q: Lab) { const rad = Math.PI / 180, cos = (v: number) => Math.cos(v * rad), sin = (v: number) => Math.sin(v * rad) const c = (Math.hypot(p.a, p.b) + Math.hypot(q.a, q.b)) / 2 const g = 0.5 * (1 - Math.sqrt(c ** 7 / (c ** 7 + 25 ** 7))) const a1 = (1 + g) * p.a, a2 = (1 + g) * q.a const c1 = Math.hypot(a1, p.b), c2 = Math.hypot(a2, q.b) const hue = (a: number, b: number) => a === 0 && b === 0 ? 0 : (Math.atan2(b, a) / rad + 360) % 360 const h1 = hue(a1, p.b), h2 = hue(a2, q.b) const dl = q.l - p.l, dc = c2 - c1 let dh = h2 - h1 if (c1 * c2 === 0) dh = 0 else if (dh > 180) dh -= 360 else if (dh < -180) dh += 360 const dH = 2 * Math.sqrt(c1 * c2) * sin(dh / 2) const L = (p.l + q.l) / 2, C = (c1 + c2) / 2 const H = c1 * c2 === 0 ? h1 + h2 : Math.abs(h1 - h2) <= 180 ? (h1 + h2) / 2 : (h1 + h2 + (h1 + h2 < 360 ? 360 : -360)) / 2 const T = 1 - 0.17 * cos(H - 30) + 0.24 * cos(2 * H) + 0.32 * cos(3 * H + 6) - 0.2 * cos(4 * H - 63) const sl = 1 + (0.015 * (L - 50) ** 2) / Math.sqrt(20 + (L - 50) ** 2), sc = 1 + 0.045 * C, sh = 1 + 0.015 * C * T const rt = -2 * Math.sqrt(C ** 7 / (C ** 7 + 25 ** 7)) * sin(60 * Math.exp(-(((H - 275) / 25) ** 2))) return Math.sqrt( (dl / sl) ** 2 + (dc / sc) ** 2 + (dH / sh) ** 2 + rt * (dc / sc) * (dH / sh), ) } function findColorConflicts( colors: string[], { threshold = 10, visions = ["normal", "protanopia", "deuteranopia", "tritanopia"], }: { threshold?: number; visions?: ColorVision[] } = {}, ) { const result: ColorConflict[] = [] for (const vision of visions) { const labs = colors.map((c) => linearToLab( vision === "normal" ? channels(c) : simulateLinear(c, vision), ), ) for (let a = 0; a < labs.length; a++) for (let b = a + 1; b < labs.length; b++) { const deltaE = deltaE2000(labs[a]!, labs[b]!) if (deltaE < threshold) result.push({ a, b, vision, deltaE }) } } return result } export { simulateColorVision, hexToLab, deltaE2000, findColorConflicts } export type { ColorConflict, ColorVision, Lab } 5e:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L5f",null,{"namespace":"@yiui","registryDependencies":["https://yiui.dev/r/color.json"]}]]}],null]}],["$","$L60",null,{"files":[{"path":"src/registry/lib/color-vision.ts","content":"$61","type":"registry:ui","target":"lib/color-vision.ts"}],"className":"h-[70svh] min-h-80"}]]}]