gdp-color-picker 1.1.2 → 1.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.modern.mjs +1 -1
- package/dist/index.modern.mjs.map +1 -1
- package/dist/index.module.js +1 -1
- package/dist/index.module.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/lib/index.css +43 -4
- package/src/lib/index.js +12 -7
package/dist/index.umd.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.umd.js","sources":["../src/lib/utils/color.js","../src/lib/ColorBoard.js","../src/lib/Sliders.js","../src/lib/ColorInput.js","../src/lib/index.js"],"sourcesContent":["export function clamp(value, min, max) {\n return Math.min(Math.max(value, min), max);\n}\n\nexport function hsvToRgb(h, s, v) {\n h = ((h % 360) + 360) % 360;\n let r, g, b;\n let i = Math.floor(h / 60);\n let f = h / 60 - i;\n let p = v * (1 - s);\n let q = v * (1 - f * s);\n let t = v * (1 - (1 - f) * s);\n\n switch (i % 6) {\n case 0:\n r = v;\n g = t;\n b = p;\n break;\n case 1:\n r = q;\n g = v;\n b = p;\n break;\n case 2:\n r = p;\n g = v;\n b = t;\n break;\n case 3:\n r = p;\n g = q;\n b = v;\n break;\n case 4:\n r = t;\n g = p;\n b = v;\n break;\n case 5:\n r = v;\n g = p;\n b = q;\n break;\n default:\n r = 0;\n g = 0;\n b = 0;\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n\nexport function rgbToHsv(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b);\n let min = Math.min(r, g, b);\n let h,\n s,\n v = max;\n\n let d = max - min;\n s = max === 0 ? 0 : d / max;\n\n if (max === min) {\n h = 0;\n } else {\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return {\n h: h * 360,\n s: s,\n v: v,\n };\n}\n\nexport function rgbToHex(r, g, b) {\n const toHex = (c) => {\n const hex = Math.round(c).toString(16);\n return hex.length === 1 ? \"0\" + hex : hex;\n };\n return \"#\" + toHex(r) + toHex(g) + toHex(b);\n}\n\nexport function hexToRgb(hex) {\n const shorthandRegex = /^#?([a-f\\d])([a-f\\d])([a-f\\d])$/i;\n hex = hex.replace(shorthandRegex, function(m, r, g, b) {\n return r + r + g + g + b + b;\n });\n\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n}\n\nexport function parseColor(color) {\n if (!color) return { h: 0, s: 1, v: 1, a: 1 };\n\n if (color.startsWith(\"#\")) {\n const rgb = hexToRgb(color);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n return { ...hsv, a: 1 };\n }\n }\n\n const rgbaMatch = color.match(\n /^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*([\\d.]+))?\\)$/\n );\n if (rgbaMatch) {\n const r = parseInt(rgbaMatch[1], 10);\n const g = parseInt(rgbaMatch[2], 10);\n const b = parseInt(rgbaMatch[3], 10);\n const a = rgbaMatch[4] !== undefined ? parseFloat(rgbaMatch[4]) : 1;\n const hsv = rgbToHsv(r, g, b);\n return { ...hsv, a };\n }\n\n return { h: 0, s: 1, v: 1, a: 1 };\n}\n\nexport function rgbToHsl(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b),\n min = Math.min(r, g, b);\n let h,\n s,\n l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0;\n } else {\n let d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return { h: h * 360, s: s, l: l };\n}\n\nexport function hslToRgb(h, s, l) {\n let r, g, b;\n\n if (s === 0) {\n r = g = b = l;\n } else {\n const hue2rgb = (p, q, t) => {\n if (t < 0) t += 1;\n if (t > 1) t -= 1;\n if (t < 1 / 6) return p + (q - p) * 6 * t;\n if (t < 1 / 2) return q;\n if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;\n return p;\n };\n\n const q = l < 0.5 ? l * (1 + s) : l + s - l * s;\n const p = 2 * l - q;\n h /= 360;\n r = hue2rgb(p, q, h + 1 / 3);\n g = hue2rgb(p, q, h);\n b = hue2rgb(p, q, h - 1 / 3);\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n","import React, { useRef, useEffect, useState, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst ColorBoard = ({ hue, saturation, value, onChange, onComplete }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const {\n width,\n height,\n left,\n top,\n } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const y = clamp(e.clientY - top, 0, height);\n\n const newSaturation = x / width;\n const newValue = 1 - y / height;\n\n onChange(newSaturation, newValue);\n },\n [onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n if (onComplete) {\n onComplete();\n }\n }, [onComplete]);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className=\"color-board\"\n style={{\n backgroundColor: `hsl(${hue}, 100%, 50%)`,\n }}\n onMouseDown={handleMouseDown}\n >\n <div className=\"color-board-white\" />\n <div className=\"color-board-black\" />\n <div\n className=\"color-board-handler\"\n style={{\n left: `${saturation * 100}%`,\n top: `${(1 - value) * 100}%`,\n }}\n />\n </div>\n );\n};\n\nexport default ColorBoard;\n","import React, { useRef, useState, useEffect, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst Slider = ({ value, max, onChange, className, style, children }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const { width, left } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const newValue = (x / width) * max;\n onChange(newValue);\n },\n [max, onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n }, []);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className={`color-slider ${className || \"\"}`}\n style={style}\n onMouseDown={handleMouseDown}\n >\n <div\n className=\"color-slider-handler\"\n style={{\n left: `${(value / max) * 100}%`,\n }}\n />\n {children}\n </div>\n );\n};\n\nexport const HueSlider = ({ hue, onChange }) => {\n return (\n <Slider value={hue} max={360} onChange={onChange} className=\"hue-slider\" />\n );\n};\n\nexport const AlphaSlider = ({ alpha, color, onChange }) => {\n const { r, g, b } = color;\n return (\n <Slider\n value={alpha}\n max={1}\n onChange={onChange}\n className=\"alpha-slider-bg\"\n style={{\n background: `linear-gradient(to right, rgba(${r},${g},${b},0) 0%, rgba(${r},${g},${b},1) 100%)`,\n }}\n />\n );\n};\n","import React, { useState, useEffect, useCallback, useRef } from \"react\";\nimport {\n rgbToHex,\n hexToRgb,\n hsvToRgb,\n rgbToHsv,\n rgbToHsl,\n hslToRgb,\n} from \"./utils/color\";\n\nconst ColorInput = ({ hue, saturation, value, alpha, onChange }) => {\n const [mode, setMode] = useState(\"HEX\");\n const [localValue, setLocalValue] = useState({});\n const [showDropdown, setShowDropdown] = useState(false);\n const dropdownRef = useRef(null);\n\n // 点击外部关闭下拉菜单\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {\n setShowDropdown(false);\n }\n };\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n const getRgb = useCallback(() => hsvToRgb(hue, saturation, value), [\n hue,\n saturation,\n value,\n ]);\n\n useEffect(() => {\n const rgb = getRgb();\n if (mode === \"HEX\") {\n setLocalValue({ hex: rgbToHex(rgb.r, rgb.g, rgb.b) });\n } else if (mode === \"RGB\") {\n setLocalValue({ r: rgb.r, g: rgb.g, b: rgb.b });\n } else if (mode === \"HSL\") {\n const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);\n setLocalValue({\n h: Math.round(hsl.h),\n s: Math.round(hsl.s * 100),\n l: Math.round(hsl.l * 100),\n });\n }\n }, [hue, saturation, value, mode, getRgb]);\n\n const handleHexChange = (e) => {\n const val = e.target.value;\n setLocalValue({ ...localValue, hex: val });\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n }\n };\n\n const handleRgbChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const r = parseInt(newValue.r, 10);\n const g = parseInt(newValue.g, 10);\n const b = parseInt(newValue.b, 10);\n if (!isNaN(r) && !isNaN(g) && !isNaN(b)) {\n const hsv = rgbToHsv(\n Math.min(255, Math.max(0, r)),\n Math.min(255, Math.max(0, g)),\n Math.min(255, Math.max(0, b))\n );\n onChange({ ...hsv, a: alpha });\n }\n };\n\n const handleHslChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const h = parseInt(newValue.h, 10);\n const s = parseInt(newValue.s, 10);\n const l = parseInt(newValue.l, 10);\n if (!isNaN(h) && !isNaN(s) && !isNaN(l)) {\n const rgb = hslToRgb(\n Math.min(360, Math.max(0, h)),\n Math.min(100, Math.max(0, s)) / 100,\n Math.min(100, Math.max(0, l)) / 100\n );\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n };\n\n return (\n <div className=\"color-input-container\">\n <div\n className=\"mode-selector\"\n ref={dropdownRef}\n onClick={() => setShowDropdown(!showDropdown)}\n >\n <span>{mode.charAt(0) + mode.slice(1).toLowerCase()}</span>\n <span\n className=\"arrow\"\n style={{\n fontSize: \"10px\",\n marginLeft: \"4px\",\n transform: showDropdown ? \"rotate(180deg)\" : \"rotate(0deg)\",\n display: \"inline-block\",\n transition: \"transform 0.2s\",\n color: \"#8c8c8c\",\n }}\n >\n <svg\n viewBox=\"0 0 1024 1024\"\n width=\"10\"\n height=\"10\"\n fill=\"currentColor\"\n >\n <path d=\"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z\" />\n </svg>\n </span>\n {showDropdown && (\n <div className=\"mode-dropdown\">\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HEX\");\n setShowDropdown(false);\n }}\n >\n Hex\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"RGB\");\n setShowDropdown(false);\n }}\n >\n RGB\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HSL\");\n setShowDropdown(false);\n }}\n >\n HSL\n </div>\n </div>\n )}\n </div>\n\n <div className=\"color-input-fields\">\n {mode === \"HEX\" && (\n <div className=\"hex-input-wrapper\">\n <span className=\"hex-prefix\">#</span>\n <input\n className=\"color-input hex\"\n value={localValue.hex ? localValue.hex.replace(\"#\", \"\") : \"\"}\n onChange={handleHexChange}\n />\n </div>\n )}\n {mode === \"RGB\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"R\"\n value={localValue.r !== undefined ? localValue.r : \"\"}\n onChange={(e) => handleRgbChange(\"r\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"G\"\n value={localValue.g !== undefined ? localValue.g : \"\"}\n onChange={(e) => handleRgbChange(\"g\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"B\"\n value={localValue.b !== undefined ? localValue.b : \"\"}\n onChange={(e) => handleRgbChange(\"b\", e.target.value)}\n />\n </>\n )}\n {mode === \"HSL\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"H\"\n value={localValue.h !== undefined ? localValue.h : \"\"}\n onChange={(e) => handleHslChange(\"h\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"S\"\n value={localValue.s !== undefined ? localValue.s : \"\"}\n onChange={(e) => handleHslChange(\"s\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"L\"\n value={localValue.l !== undefined ? localValue.l : \"\"}\n onChange={(e) => handleHslChange(\"l\", e.target.value)}\n />\n </>\n )}\n <div className=\"color-input alpha-display\">\n {Math.round(alpha * 100)}%\n </div>\n </div>\n </div>\n );\n};\n\nexport default ColorInput;\n","import React, { useState, useRef, useEffect, useLayoutEffect } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport ColorBoard from \"./ColorBoard\";\nimport { HueSlider, AlphaSlider } from \"./Sliders\";\nimport ColorInput from \"./ColorInput\";\nimport {\n hsvToRgb,\n rgbToHex,\n parseColor,\n hexToRgb,\n rgbToHsv,\n} from \"./utils/color\";\nimport \"./index.css\";\n\nconst DEFAULT_PRESETS = [\n \"#E0B5AE\",\n \"#B2BBDE\",\n \"#F2DDB3\",\n \"#E0E5C5\",\n \"#BBD0C3\",\n \"#B5D1E3\",\n \"#FFFFFF\",\n \"#D25536\",\n \"#EFA154\",\n \"#F7DA7E\",\n \"#5FA67F\",\n \"#A2829D\",\n \"#D390A2\",\n \"#000000\",\n \"#0099A4\",\n \"#EABA00\",\n \"#C9462C\",\n \"#3171AC\",\n \"#783780\",\n \"#1E80EA\",\n \"#2AAC3B\",\n \"#B63455\",\n \"#81532F\",\n \"#AA9A5C\",\n \"#828281\",\n \"#055753\",\n \"#8F262B\",\n \"#F0D8D0\",\n];\n\nconst ColorPicker = ({\n value,\n defaultValue,\n onChange,\n showLabel = true,\n label = \"Color\",\n showArrow = true,\n showInput = true,\n showColorBoard = true,\n presets: customPresets,\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n const [isExpanded, setIsExpanded] = useState(false);\n const [recentColors, setRecentColors] = useState([]);\n const presets = customPresets || DEFAULT_PRESETS;\n\n const [color, setColor] = useState(() => {\n const initColor = value || defaultValue || \"#1677ff\";\n return parseColor(initColor);\n });\n\n const [inputValue, setInputValue] = useState(() => {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n return rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n });\n\n const containerRef = useRef(null);\n const triggerRef = useRef(null);\n const panelRef = useRef(null);\n const [panelStyle, setPanelStyle] = useState({});\n\n useEffect(() => {\n if (value !== undefined) {\n const newColor = parseColor(value);\n setColor(newColor);\n const rgb = hsvToRgb(newColor.h, newColor.s, newColor.v);\n setInputValue(rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase());\n }\n }, [value]);\n\n const handleChange = (newColor) => {\n const nextColor = { ...color, ...newColor };\n setColor(nextColor);\n\n const rgb = hsvToRgb(nextColor.h, nextColor.s, nextColor.v);\n const hex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setInputValue(hex);\n\n if (onChange) {\n onChange(hex, { ...rgb, a: nextColor.a });\n }\n };\n\n const handleInputChange = (e) => {\n const val = e.target.value;\n setInputValue(val);\n\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: color.a });\n }\n }\n };\n\n useLayoutEffect(() => {\n if (\n !isOpen ||\n !triggerRef.current ||\n !panelRef.current ||\n typeof window === \"undefined\"\n ) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const panelRect = panelRef.current.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const viewportWidth = window.innerWidth;\n\n let top = triggerRect.bottom + window.scrollY + 4;\n let left = triggerRect.left + window.scrollX;\n\n // 垂直方向边界检测\n if (triggerRect.bottom + panelRect.height + 4 > viewportHeight) {\n // 如果下方空间不足,且上方空间足够,则显示在上方\n if (triggerRect.top > panelRect.height + 4) {\n top = triggerRect.top + window.scrollY - panelRect.height - 4;\n }\n }\n\n // 水平方向边界检测\n if (triggerRect.left + panelRect.width > viewportWidth) {\n left = viewportWidth - panelRect.width - 10;\n }\n if (left < 0) left = 0;\n\n setPanelStyle({\n position: \"absolute\",\n top,\n left,\n zIndex: 9999,\n });\n }, [isOpen, isExpanded, recentColors.length]);\n\n const handleEyeDropper = async () => {\n if (!window.EyeDropper) {\n alert(\"当前浏览器不支持屏幕取色功能\");\n return;\n }\n\n try {\n const eyeDropper = new window.EyeDropper();\n const result = await eyeDropper.open();\n const { sRGBHex } = result;\n const rgb = hexToRgb(sRGBHex);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n } catch (e) {\n // 用户取消取色或发生错误\n console.log(\"EyeDropper failed or canceled:\", e);\n }\n };\n\n useEffect(() => {\n const handleClickOutside = (event) => {\n const containerEl = containerRef.current;\n const panelEl = panelRef.current;\n\n const isInContainer = containerEl && containerEl.contains(event.target);\n const isInPanel = panelEl && panelEl.contains(event.target);\n\n if (!isInContainer && !isInPanel) {\n setIsOpen(false);\n }\n };\n\n if (isOpen) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n } else {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const currentHex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setRecentColors((prev) => {\n if (prev.includes(currentHex)) return prev;\n return [currentHex, ...prev].slice(0, 10);\n });\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isOpen, color]);\n\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const displayColor = `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${color.a})`;\n const initialLimit = 14;\n const visiblePresets = isExpanded ? presets : presets.slice(0, initialLimit);\n const showExpand = presets.length > initialLimit;\n\n const panel = isOpen ? (\n <div className=\"color-picker-panel\" style={panelStyle} ref={panelRef}>\n {showColorBoard && (\n <div\n className=\"color-picker-board-wrapper\"\n style={{\n marginTop: \"10px\",\n paddingTop: \"10px\",\n borderTop: \"1px solid #eee\",\n }}\n >\n <ColorBoard\n hue={color.h}\n saturation={color.s}\n value={color.v}\n onChange={(s, v) => handleChange({ s, v })}\n onComplete={() => setIsOpen(false)}\n />\n <HueSlider hue={color.h} onChange={(h) => handleChange({ h })} />\n {/* <AlphaSlider\n alpha={color.a}\n color={rgb}\n onChange={(a) => handleChange({ a })}\n /> */}\n <ColorInput\n hue={color.h}\n saturation={color.s}\n value={color.v}\n alpha={color.a}\n onChange={(newHsv) => handleChange(newHsv)}\n />\n </div>\n )}\n <div className=\"color-picker-presets\">\n <div className=\"palette-section-title\" style={{ marginTop: 8 }}>\n <span>Recommended</span>\n <span\n className=\"color-picker-icon-right\"\n onClick={handleEyeDropper}\n title=\"屏幕取色\"\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <defs>\n <rect id=\"path-1\" x=\"0\" y=\"0\" width=\"16\" height=\"16\" />\n </defs>\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g transform=\"translate(-920.000000, -594.000000)\">\n <g transform=\"translate(720.000000, 418.000000)\">\n <g transform=\"translate(200.000000, 176.000000)\">\n <mask id=\"mask-2\" fill=\"white\">\n <use xlinkHref=\"#path-1\" />\n </mask>\n <g />\n <g\n mask=\"url(#mask-2)\"\n fill=\"#000000\"\n fillOpacity=\"0.85\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)\">\n <path\n d=\"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z\"\n transform=\"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n </div>\n <div className={`presets-grid modern`}>\n {presets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item preset-item-inner\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgbValue = hexToRgb(preset);\n if (rgbValue) {\n const hsv = rgbToHsv(rgbValue.r, rgbValue.g, rgbValue.b);\n handleChange({ ...hsv, a: 1 });\n setIsOpen(false);\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {/* {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? \"Less\" : \"More\"}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )} */}\n\n {recentColors.length > 0 && (\n <>\n <div className=\"palette-section-title\">Recent</div>\n <div className=\"presets-grid recent\">\n {recentColors.map((recentColor, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: recentColor }}\n onClick={() => {\n const rgbValue = hexToRgb(recentColor);\n if (rgbValue) {\n const hsv = rgbToHsv(rgbValue.r, rgbValue.g, rgbValue.b);\n handleChange({ ...hsv, a: 1 });\n setIsOpen(false);\n }\n }}\n title={recentColor}\n />\n ))}\n </div>\n </>\n )}\n </div>\n </div>\n ) : null;\n\n return (\n <div className=\"color-picker-container\" ref={containerRef}>\n <div className=\"color-picker-main-row\">\n <div className=\"color-picker-tooltip-trigger\">\n {showLabel && <span className=\"color-picker-label\">{label}</span>}\n\n <div\n className={`color-picker-trigger ${isOpen ? \"is-open\" : \"\"}`}\n onClick={() => setIsOpen(!isOpen)}\n ref={triggerRef}\n >\n <div\n className=\"color-block\"\n style={{ backgroundColor: displayColor }}\n />\n {showArrow && (\n <span className={`color-picker-arrow ${isOpen ? \"open\" : \"\"}`}>\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <g\n stroke=\"none\"\n strokeWidth=\"1\"\n fill=\"none\"\n fillRule=\"evenodd\"\n >\n <g\n transform=\"translate(-1348.000000, -88.000000)\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(0.000000, 60.000000)\">\n <g transform=\"translate(584.000000, 20.000000)\">\n <g transform=\"translate(728.000000, 4.000000)\">\n <g transform=\"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)\">\n <rect\n fill=\"#000000\"\n opacity=\"0\"\n x=\"0\"\n y=\"0\"\n width=\"16\"\n height=\"16\"\n />\n <path\n d=\"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z\"\n stroke=\"#FFFFFF\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n )}\n <span className=\"tooltip-text\">Color Picker</span>\n </div>\n </div>\n\n {showInput && (\n <div className=\"color-picker-input-wrapper\">\n <input\n type=\"text\"\n value={inputValue}\n onChange={handleInputChange}\n placeholder=\"Please input color\"\n />\n {inputValue && (\n <span\n className=\"input-clear-icon\"\n onClick={() => setInputValue(\"\")}\n >\n <img\n src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=\"\n alt=\"\"\n width=\"12\"\n height=\"12\"\n />\n </span>\n )}\n </div>\n )}\n </div>\n\n {typeof document !== \"undefined\" &&\n ReactDOM.createPortal(panel, document.body)}\n\n <div>\n <div className={`presets-grid modern`}>\n {visiblePresets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgb = hexToRgb(preset);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? \"Less\" : \"More\"}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )}\n </div>\n </div>\n );\n};\n\nexport default ColorPicker;\n"],"names":["clamp","value","min","max","Math","hsvToRgb","h","s","v","r","g","b","i","floor","f","p","q","t","round","rgbToHsv","d","rgbToHex","toHex","c","hex","toString","length","hexToRgb","replace","m","result","exec","parseInt","parseColor","color","a","startsWith","rgb","rgbaMatch","match","undefined","parseFloat","ColorBoard","hue","saturation","onChange","onComplete","containerRef","useRef","isDragging","setIsDragging","useState","handleChange","useCallback","e","current","width","height","left","top","getBoundingClientRect","x","clientX","y","clientY","handleMouseUp","useEffect","handleMouseMove","window","addEventListener","removeEventListener","React","createElement","ref","className","style","backgroundColor","onMouseDown","Slider","children","HueSlider","ColorInput","alpha","mode","setMode","localValue","setLocalValue","showDropdown","setShowDropdown","dropdownRef","handleClickOutside","event","contains","target","document","getRgb","hsl","l","rgbToHsl","handleRgbChange","key","val","newValue","isNaN","hsv","handleHslChange","hue2rgb","hslToRgb","onClick","charAt","slice","toLowerCase","fontSize","marginLeft","transform","display","transition","viewBox","fill","stopPropagation","test","Fragment","type","placeholder","DEFAULT_PRESETS","ColorPicker","defaultValue","showLabel","label","showArrow","showInput","showColorBoard","presets","customPresets","isOpen","setIsOpen","isExpanded","setIsExpanded","recentColors","setRecentColors","setColor","inputValue","setInputValue","toUpperCase","triggerRef","panelRef","panelStyle","setPanelStyle","newColor","nextColor","useLayoutEffect","triggerRect","panelRect","viewportHeight","innerHeight","viewportWidth","innerWidth","bottom","scrollY","scrollX","position","zIndex","containerEl","panelEl","isInContainer","isInPanel","currentHex","prev","includes","displayColor","visiblePresets","showExpand","panel","marginTop","paddingTop","borderTop","newHsv","handleEyeDropper","EyeDropper","alert","Promise","resolve","_temp","body","recover","eyeDropper","open","then","sRGBHex","_catch","console","log","reject","title","xmlns","id","stroke","strokeWidth","fillRule","xlinkHref","mask","fillOpacity","map","preset","idx","rgbValue","recentColor","opacity","src","alt","ReactDOM","createPortal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.umd.js","sources":["../src/lib/utils/color.js","../src/lib/ColorBoard.js","../src/lib/Sliders.js","../src/lib/ColorInput.js","../src/lib/index.js"],"sourcesContent":["export function clamp(value, min, max) {\n return Math.min(Math.max(value, min), max);\n}\n\nexport function hsvToRgb(h, s, v) {\n h = ((h % 360) + 360) % 360;\n let r, g, b;\n let i = Math.floor(h / 60);\n let f = h / 60 - i;\n let p = v * (1 - s);\n let q = v * (1 - f * s);\n let t = v * (1 - (1 - f) * s);\n\n switch (i % 6) {\n case 0:\n r = v;\n g = t;\n b = p;\n break;\n case 1:\n r = q;\n g = v;\n b = p;\n break;\n case 2:\n r = p;\n g = v;\n b = t;\n break;\n case 3:\n r = p;\n g = q;\n b = v;\n break;\n case 4:\n r = t;\n g = p;\n b = v;\n break;\n case 5:\n r = v;\n g = p;\n b = q;\n break;\n default:\n r = 0;\n g = 0;\n b = 0;\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n\nexport function rgbToHsv(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b);\n let min = Math.min(r, g, b);\n let h,\n s,\n v = max;\n\n let d = max - min;\n s = max === 0 ? 0 : d / max;\n\n if (max === min) {\n h = 0;\n } else {\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return {\n h: h * 360,\n s: s,\n v: v,\n };\n}\n\nexport function rgbToHex(r, g, b) {\n const toHex = (c) => {\n const hex = Math.round(c).toString(16);\n return hex.length === 1 ? \"0\" + hex : hex;\n };\n return \"#\" + toHex(r) + toHex(g) + toHex(b);\n}\n\nexport function hexToRgb(hex) {\n const shorthandRegex = /^#?([a-f\\d])([a-f\\d])([a-f\\d])$/i;\n hex = hex.replace(shorthandRegex, function(m, r, g, b) {\n return r + r + g + g + b + b;\n });\n\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n}\n\nexport function parseColor(color) {\n if (!color) return { h: 0, s: 1, v: 1, a: 1 };\n\n if (color.startsWith(\"#\")) {\n const rgb = hexToRgb(color);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n return { ...hsv, a: 1 };\n }\n }\n\n const rgbaMatch = color.match(\n /^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*([\\d.]+))?\\)$/\n );\n if (rgbaMatch) {\n const r = parseInt(rgbaMatch[1], 10);\n const g = parseInt(rgbaMatch[2], 10);\n const b = parseInt(rgbaMatch[3], 10);\n const a = rgbaMatch[4] !== undefined ? parseFloat(rgbaMatch[4]) : 1;\n const hsv = rgbToHsv(r, g, b);\n return { ...hsv, a };\n }\n\n return { h: 0, s: 1, v: 1, a: 1 };\n}\n\nexport function rgbToHsl(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b),\n min = Math.min(r, g, b);\n let h,\n s,\n l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0;\n } else {\n let d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return { h: h * 360, s: s, l: l };\n}\n\nexport function hslToRgb(h, s, l) {\n let r, g, b;\n\n if (s === 0) {\n r = g = b = l;\n } else {\n const hue2rgb = (p, q, t) => {\n if (t < 0) t += 1;\n if (t > 1) t -= 1;\n if (t < 1 / 6) return p + (q - p) * 6 * t;\n if (t < 1 / 2) return q;\n if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;\n return p;\n };\n\n const q = l < 0.5 ? l * (1 + s) : l + s - l * s;\n const p = 2 * l - q;\n h /= 360;\n r = hue2rgb(p, q, h + 1 / 3);\n g = hue2rgb(p, q, h);\n b = hue2rgb(p, q, h - 1 / 3);\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n","import React, { useRef, useEffect, useState, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst ColorBoard = ({ hue, saturation, value, onChange, onComplete }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const {\n width,\n height,\n left,\n top,\n } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const y = clamp(e.clientY - top, 0, height);\n\n const newSaturation = x / width;\n const newValue = 1 - y / height;\n\n onChange(newSaturation, newValue);\n },\n [onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n if (onComplete) {\n onComplete();\n }\n }, [onComplete]);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className=\"color-board\"\n style={{\n backgroundColor: `hsl(${hue}, 100%, 50%)`,\n }}\n onMouseDown={handleMouseDown}\n >\n <div className=\"color-board-white\" />\n <div className=\"color-board-black\" />\n <div\n className=\"color-board-handler\"\n style={{\n left: `${saturation * 100}%`,\n top: `${(1 - value) * 100}%`,\n }}\n />\n </div>\n );\n};\n\nexport default ColorBoard;\n","import React, { useRef, useState, useEffect, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst Slider = ({ value, max, onChange, className, style, children }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const { width, left } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const newValue = (x / width) * max;\n onChange(newValue);\n },\n [max, onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n }, []);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className={`color-slider ${className || \"\"}`}\n style={style}\n onMouseDown={handleMouseDown}\n >\n <div\n className=\"color-slider-handler\"\n style={{\n left: `${(value / max) * 100}%`,\n }}\n />\n {children}\n </div>\n );\n};\n\nexport const HueSlider = ({ hue, onChange }) => {\n return (\n <Slider value={hue} max={360} onChange={onChange} className=\"hue-slider\" />\n );\n};\n\nexport const AlphaSlider = ({ alpha, color, onChange }) => {\n const { r, g, b } = color;\n return (\n <Slider\n value={alpha}\n max={1}\n onChange={onChange}\n className=\"alpha-slider-bg\"\n style={{\n background: `linear-gradient(to right, rgba(${r},${g},${b},0) 0%, rgba(${r},${g},${b},1) 100%)`,\n }}\n />\n );\n};\n","import React, { useState, useEffect, useCallback, useRef } from \"react\";\nimport {\n rgbToHex,\n hexToRgb,\n hsvToRgb,\n rgbToHsv,\n rgbToHsl,\n hslToRgb,\n} from \"./utils/color\";\n\nconst ColorInput = ({ hue, saturation, value, alpha, onChange }) => {\n const [mode, setMode] = useState(\"HEX\");\n const [localValue, setLocalValue] = useState({});\n const [showDropdown, setShowDropdown] = useState(false);\n const dropdownRef = useRef(null);\n\n // 点击外部关闭下拉菜单\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {\n setShowDropdown(false);\n }\n };\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n const getRgb = useCallback(() => hsvToRgb(hue, saturation, value), [\n hue,\n saturation,\n value,\n ]);\n\n useEffect(() => {\n const rgb = getRgb();\n if (mode === \"HEX\") {\n setLocalValue({ hex: rgbToHex(rgb.r, rgb.g, rgb.b) });\n } else if (mode === \"RGB\") {\n setLocalValue({ r: rgb.r, g: rgb.g, b: rgb.b });\n } else if (mode === \"HSL\") {\n const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);\n setLocalValue({\n h: Math.round(hsl.h),\n s: Math.round(hsl.s * 100),\n l: Math.round(hsl.l * 100),\n });\n }\n }, [hue, saturation, value, mode, getRgb]);\n\n const handleHexChange = (e) => {\n const val = e.target.value;\n setLocalValue({ ...localValue, hex: val });\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n }\n };\n\n const handleRgbChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const r = parseInt(newValue.r, 10);\n const g = parseInt(newValue.g, 10);\n const b = parseInt(newValue.b, 10);\n if (!isNaN(r) && !isNaN(g) && !isNaN(b)) {\n const hsv = rgbToHsv(\n Math.min(255, Math.max(0, r)),\n Math.min(255, Math.max(0, g)),\n Math.min(255, Math.max(0, b))\n );\n onChange({ ...hsv, a: alpha });\n }\n };\n\n const handleHslChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const h = parseInt(newValue.h, 10);\n const s = parseInt(newValue.s, 10);\n const l = parseInt(newValue.l, 10);\n if (!isNaN(h) && !isNaN(s) && !isNaN(l)) {\n const rgb = hslToRgb(\n Math.min(360, Math.max(0, h)),\n Math.min(100, Math.max(0, s)) / 100,\n Math.min(100, Math.max(0, l)) / 100\n );\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n };\n\n return (\n <div className=\"color-input-container\">\n <div\n className=\"mode-selector\"\n ref={dropdownRef}\n onClick={() => setShowDropdown(!showDropdown)}\n >\n <span>{mode.charAt(0) + mode.slice(1).toLowerCase()}</span>\n <span\n className=\"arrow\"\n style={{\n fontSize: \"10px\",\n marginLeft: \"4px\",\n transform: showDropdown ? \"rotate(180deg)\" : \"rotate(0deg)\",\n display: \"inline-block\",\n transition: \"transform 0.2s\",\n color: \"#8c8c8c\",\n }}\n >\n <svg\n viewBox=\"0 0 1024 1024\"\n width=\"10\"\n height=\"10\"\n fill=\"currentColor\"\n >\n <path d=\"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z\" />\n </svg>\n </span>\n {showDropdown && (\n <div className=\"mode-dropdown\">\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HEX\");\n setShowDropdown(false);\n }}\n >\n Hex\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"RGB\");\n setShowDropdown(false);\n }}\n >\n RGB\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HSL\");\n setShowDropdown(false);\n }}\n >\n HSL\n </div>\n </div>\n )}\n </div>\n\n <div className=\"color-input-fields\">\n {mode === \"HEX\" && (\n <div className=\"hex-input-wrapper\">\n <span className=\"hex-prefix\">#</span>\n <input\n className=\"color-input hex\"\n value={localValue.hex ? localValue.hex.replace(\"#\", \"\") : \"\"}\n onChange={handleHexChange}\n />\n </div>\n )}\n {mode === \"RGB\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"R\"\n value={localValue.r !== undefined ? localValue.r : \"\"}\n onChange={(e) => handleRgbChange(\"r\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"G\"\n value={localValue.g !== undefined ? localValue.g : \"\"}\n onChange={(e) => handleRgbChange(\"g\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"B\"\n value={localValue.b !== undefined ? localValue.b : \"\"}\n onChange={(e) => handleRgbChange(\"b\", e.target.value)}\n />\n </>\n )}\n {mode === \"HSL\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"H\"\n value={localValue.h !== undefined ? localValue.h : \"\"}\n onChange={(e) => handleHslChange(\"h\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"S\"\n value={localValue.s !== undefined ? localValue.s : \"\"}\n onChange={(e) => handleHslChange(\"s\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"L\"\n value={localValue.l !== undefined ? localValue.l : \"\"}\n onChange={(e) => handleHslChange(\"l\", e.target.value)}\n />\n </>\n )}\n <div className=\"color-input alpha-display\">\n {Math.round(alpha * 100)}%\n </div>\n </div>\n </div>\n );\n};\n\nexport default ColorInput;\n","import React, { useState, useRef, useEffect, useLayoutEffect } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport ColorBoard from \"./ColorBoard\";\nimport { HueSlider, AlphaSlider } from \"./Sliders\";\nimport ColorInput from \"./ColorInput\";\nimport {\n hsvToRgb,\n rgbToHex,\n parseColor,\n hexToRgb,\n rgbToHsv,\n} from \"./utils/color\";\nimport \"./index.css\";\n\nconst DEFAULT_PRESETS = [\n \"#E0B5AE\",\n \"#B2BBDE\",\n \"#F2DDB3\",\n \"#E0E5C5\",\n \"#BBD0C3\",\n \"#B5D1E3\",\n \"#FFFFFF\",\n \"#D25536\",\n \"#EFA154\",\n \"#F7DA7E\",\n \"#5FA67F\",\n \"#A2829D\",\n \"#D390A2\",\n \"#000000\",\n \"#0099A4\",\n \"#EABA00\",\n \"#C9462C\",\n \"#3171AC\",\n \"#783780\",\n \"#1E80EA\",\n \"#2AAC3B\",\n \"#B63455\",\n \"#81532F\",\n \"#AA9A5C\",\n \"#828281\",\n \"#055753\",\n \"#8F262B\",\n \"#F0D8D0\",\n];\n\nconst ColorPicker = ({\n value,\n defaultValue,\n onChange,\n showLabel = true,\n label = \"Color\",\n showArrow = true,\n showInput = true,\n showColorBoard = true,\n presets: customPresets,\n tooltipText = \"Color Picker\",\n screenPickerTooltip = \"屏幕取色\",\n recommendedTitle = \"Recommended\",\n recentTitle = \"Recent\",\n moreText = \"More\",\n lessText = \"Less\",\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n const [isExpanded, setIsExpanded] = useState(false);\n const [recentColors, setRecentColors] = useState([]);\n const presets = customPresets || DEFAULT_PRESETS;\n\n const [color, setColor] = useState(() => {\n const initColor = value || defaultValue || \"#1677ff\";\n return parseColor(initColor);\n });\n\n const [inputValue, setInputValue] = useState(() => {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n return rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n });\n\n const containerRef = useRef(null);\n const triggerRef = useRef(null);\n const panelRef = useRef(null);\n const [panelStyle, setPanelStyle] = useState({});\n\n useEffect(() => {\n if (value !== undefined) {\n const newColor = parseColor(value);\n setColor(newColor);\n const rgb = hsvToRgb(newColor.h, newColor.s, newColor.v);\n setInputValue(rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase());\n }\n }, [value]);\n\n const handleChange = (newColor) => {\n const nextColor = { ...color, ...newColor };\n setColor(nextColor);\n\n const rgb = hsvToRgb(nextColor.h, nextColor.s, nextColor.v);\n const hex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setInputValue(hex);\n\n if (onChange) {\n onChange(hex, { ...rgb, a: nextColor.a });\n }\n };\n\n const handleInputChange = (e) => {\n const val = e.target.value;\n setInputValue(val);\n\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: color.a });\n }\n }\n };\n\n useLayoutEffect(() => {\n if (\n !isOpen ||\n !triggerRef.current ||\n !panelRef.current ||\n typeof window === \"undefined\"\n ) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const panelRect = panelRef.current.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const viewportWidth = window.innerWidth;\n\n let top = triggerRect.bottom + window.scrollY + 4;\n let left = triggerRect.left + window.scrollX;\n\n // 垂直方向边界检测\n if (triggerRect.bottom + panelRect.height + 4 > viewportHeight) {\n // 如果下方空间不足,且上方空间足够,则显示在上方\n if (triggerRect.top > panelRect.height + 4) {\n top = triggerRect.top + window.scrollY - panelRect.height - 4;\n }\n }\n\n // 水平方向边界检测\n if (triggerRect.left + panelRect.width > viewportWidth) {\n left = viewportWidth - panelRect.width - 10;\n }\n if (left < 0) left = 0;\n\n setPanelStyle({\n position: \"absolute\",\n top,\n left,\n zIndex: 9999,\n });\n }, [isOpen, isExpanded, recentColors.length]);\n\n const handleEyeDropper = async () => {\n if (!window.EyeDropper) {\n alert(\"当前浏览器不支持屏幕取色功能\");\n return;\n }\n\n try {\n const eyeDropper = new window.EyeDropper();\n const result = await eyeDropper.open();\n const { sRGBHex } = result;\n const rgb = hexToRgb(sRGBHex);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n } catch (e) {\n // 用户取消取色或发生错误\n console.log(\"EyeDropper failed or canceled:\", e);\n }\n };\n\n useEffect(() => {\n const handleClickOutside = (event) => {\n const containerEl = containerRef.current;\n const panelEl = panelRef.current;\n\n const isInContainer = containerEl && containerEl.contains(event.target);\n const isInPanel = panelEl && panelEl.contains(event.target);\n\n if (!isInContainer && !isInPanel) {\n setIsOpen(false);\n }\n };\n\n if (isOpen) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n } else {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const currentHex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setRecentColors((prev) => {\n if (prev.includes(currentHex)) return prev;\n return [currentHex, ...prev].slice(0, 10);\n });\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isOpen, color]);\n\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const displayColor = `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${color.a})`;\n const initialLimit = 14;\n const visiblePresets = isExpanded ? presets : presets.slice(0, initialLimit);\n const showExpand = presets.length > initialLimit;\n\n const panel = isOpen ? (\n <div className=\"color-picker-panel\" style={panelStyle} ref={panelRef}>\n {showColorBoard && (\n <div\n className=\"color-picker-board-wrapper\"\n style={{\n marginTop: \"10px\",\n borderTop: \"1px solid #eee\",\n }}\n >\n <ColorBoard\n hue={color.h}\n saturation={color.s}\n value={color.v}\n onChange={(s, v) => handleChange({ s, v })}\n onComplete={() => setIsOpen(false)}\n />\n <HueSlider hue={color.h} onChange={(h) => handleChange({ h })} />\n {/* <AlphaSlider\n alpha={color.a}\n color={rgb}\n onChange={(a) => handleChange({ a })}\n /> */}\n <ColorInput\n hue={color.h}\n saturation={color.s}\n value={color.v}\n alpha={color.a}\n onChange={(newHsv) => handleChange(newHsv)}\n />\n </div>\n )}\n <div className=\"color-picker-presets\">\n <div className=\"palette-section-title\" style={{ marginTop: 8 }}>\n <span>{recommendedTitle}</span>\n <span\n className=\"color-picker-icon-right\"\n onClick={handleEyeDropper}\n >\n <span className=\"tooltip-text-bubble\">{screenPickerTooltip}</span>\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <defs>\n <rect id=\"path-1\" x=\"0\" y=\"0\" width=\"16\" height=\"16\" />\n </defs>\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g transform=\"translate(-920.000000, -594.000000)\">\n <g transform=\"translate(720.000000, 418.000000)\">\n <g transform=\"translate(200.000000, 176.000000)\">\n <mask id=\"mask-2\" fill=\"white\">\n <use xlinkHref=\"#path-1\" />\n </mask>\n <g />\n <g\n mask=\"url(#mask-2)\"\n fill=\"#000000\"\n fillOpacity=\"0.85\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)\">\n <path\n d=\"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z\"\n transform=\"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n </div>\n <div className={`presets-grid modern`}>\n {presets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item preset-item-inner\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgbValue = hexToRgb(preset);\n if (rgbValue) {\n const hsv = rgbToHsv(rgbValue.r, rgbValue.g, rgbValue.b);\n handleChange({ ...hsv, a: 1 });\n setIsOpen(false);\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {/* {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? lessText : moreText}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )} */}\n\n {recentColors.length > 0 && (\n <>\n <div className=\"palette-section-title\">{recentTitle}</div>\n <div className=\"presets-grid recent\">\n {recentColors.map((recentColor, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: recentColor }}\n onClick={() => {\n const rgbValue = hexToRgb(recentColor);\n if (rgbValue) {\n const hsv = rgbToHsv(rgbValue.r, rgbValue.g, rgbValue.b);\n handleChange({ ...hsv, a: 1 });\n setIsOpen(false);\n }\n }}\n title={recentColor}\n />\n ))}\n </div>\n </>\n )}\n </div>\n </div>\n ) : null;\n\n return (\n <div className=\"color-picker-container\" ref={containerRef}>\n <div className=\"color-picker-main-row\">\n <div className=\"color-picker-tooltip-trigger\">\n {showLabel && <span className=\"color-picker-label\">{label}</span>}\n\n <div\n className={`color-picker-trigger ${isOpen ? \"is-open\" : \"\"}`}\n onClick={() => setIsOpen(!isOpen)}\n ref={triggerRef}\n >\n <div\n className=\"color-block\"\n style={{ backgroundColor: displayColor }}\n />\n {showArrow && (\n <span className={`color-picker-arrow ${isOpen ? \"open\" : \"\"}`}>\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <g\n stroke=\"none\"\n strokeWidth=\"1\"\n fill=\"none\"\n fillRule=\"evenodd\"\n >\n <g\n transform=\"translate(-1348.000000, -88.000000)\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(0.000000, 60.000000)\">\n <g transform=\"translate(584.000000, 20.000000)\">\n <g transform=\"translate(728.000000, 4.000000)\">\n <g transform=\"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)\">\n <rect\n fill=\"#000000\"\n opacity=\"0\"\n x=\"0\"\n y=\"0\"\n width=\"16\"\n height=\"16\"\n />\n <path\n d=\"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z\"\n stroke=\"#FFFFFF\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n )}\n <span className=\"tooltip-text\">{tooltipText}</span>\n </div>\n </div>\n\n {showInput && (\n <div className=\"color-picker-input-wrapper\">\n <input\n type=\"text\"\n value={inputValue}\n onChange={handleInputChange}\n placeholder=\"Please input color\"\n />\n {inputValue && (\n <span\n className=\"input-clear-icon\"\n onClick={() => setInputValue(\"\")}\n >\n <img\n src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=\"\n alt=\"\"\n width=\"12\"\n height=\"12\"\n />\n </span>\n )}\n </div>\n )}\n </div>\n\n {typeof document !== \"undefined\" &&\n ReactDOM.createPortal(panel, document.body)}\n\n <div>\n <div className={`presets-grid modern`}>\n {visiblePresets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgb = hexToRgb(preset);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? lessText : moreText}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )}\n </div>\n </div>\n );\n};\n\nexport default ColorPicker;\n"],"names":["clamp","value","min","max","Math","hsvToRgb","h","s","v","r","g","b","i","floor","f","p","q","t","round","rgbToHsv","d","rgbToHex","toHex","c","hex","toString","length","hexToRgb","replace","m","result","exec","parseInt","parseColor","color","a","startsWith","rgb","rgbaMatch","match","undefined","parseFloat","ColorBoard","hue","saturation","onChange","onComplete","containerRef","useRef","isDragging","setIsDragging","useState","handleChange","useCallback","e","current","width","height","left","top","getBoundingClientRect","x","clientX","y","clientY","handleMouseUp","useEffect","handleMouseMove","window","addEventListener","removeEventListener","React","createElement","ref","className","style","backgroundColor","onMouseDown","Slider","children","HueSlider","ColorInput","alpha","mode","setMode","localValue","setLocalValue","showDropdown","setShowDropdown","dropdownRef","handleClickOutside","event","contains","target","document","getRgb","hsl","l","rgbToHsl","handleRgbChange","key","val","newValue","isNaN","hsv","handleHslChange","hue2rgb","hslToRgb","onClick","charAt","slice","toLowerCase","fontSize","marginLeft","transform","display","transition","viewBox","fill","stopPropagation","test","Fragment","type","placeholder","DEFAULT_PRESETS","ColorPicker","defaultValue","showLabel","label","showArrow","showInput","showColorBoard","presets","customPresets","tooltipText","screenPickerTooltip","recommendedTitle","recentTitle","moreText","lessText","isOpen","setIsOpen","isExpanded","setIsExpanded","recentColors","setRecentColors","setColor","inputValue","setInputValue","toUpperCase","triggerRef","panelRef","panelStyle","setPanelStyle","newColor","nextColor","useLayoutEffect","triggerRect","panelRect","viewportHeight","innerHeight","viewportWidth","innerWidth","bottom","scrollY","scrollX","position","zIndex","containerEl","panelEl","isInContainer","isInPanel","currentHex","prev","includes","displayColor","visiblePresets","showExpand","panel","marginTop","borderTop","newHsv","EyeDropper","alert","Promise","resolve","_temp","body","recover","eyeDropper","open","then","sRGBHex","_catch","console","log","reject","xmlns","id","stroke","strokeWidth","fillRule","xlinkHref","mask","fillOpacity","map","preset","idx","rgbValue","title","recentColor","opacity","src","alt","ReactDOM","createPortal"],"mappings":"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"}
|
package/package.json
CHANGED
package/src/lib/index.css
CHANGED
|
@@ -285,7 +285,7 @@
|
|
|
285
285
|
padding: 5px 8px;
|
|
286
286
|
position: absolute;
|
|
287
287
|
z-index: 1001;
|
|
288
|
-
bottom:
|
|
288
|
+
bottom: 150%;
|
|
289
289
|
left: 77%;
|
|
290
290
|
transform: translateX(-50%);
|
|
291
291
|
opacity: 0;
|
|
@@ -384,15 +384,54 @@
|
|
|
384
384
|
}
|
|
385
385
|
.color-picker-icon-right {
|
|
386
386
|
float: right;
|
|
387
|
+
cursor: pointer;
|
|
387
388
|
display: flex;
|
|
388
389
|
align-items: center;
|
|
389
390
|
justify-content: center;
|
|
390
|
-
|
|
391
|
-
transition:
|
|
391
|
+
opacity: 0.65;
|
|
392
|
+
transition: opacity 0.2s;
|
|
393
|
+
position: relative;
|
|
392
394
|
}
|
|
393
395
|
|
|
394
396
|
.color-picker-icon-right:hover {
|
|
395
|
-
|
|
397
|
+
opacity: 1;
|
|
398
|
+
}
|
|
399
|
+
|
|
400
|
+
.tooltip-text-bubble {
|
|
401
|
+
visibility: hidden;
|
|
402
|
+
background-color: rgba(0, 0, 0, 0.85);
|
|
403
|
+
color: #fff;
|
|
404
|
+
text-align: center;
|
|
405
|
+
border-radius: 4px;
|
|
406
|
+
padding: 4px 8px;
|
|
407
|
+
position: absolute;
|
|
408
|
+
z-index: 1001;
|
|
409
|
+
bottom: 100%;
|
|
410
|
+
left: 50%;
|
|
411
|
+
transform: translateX(-10%);
|
|
412
|
+
opacity: 0;
|
|
413
|
+
transition: opacity 0.3s;
|
|
414
|
+
white-space: nowrap;
|
|
415
|
+
font-size: 12px;
|
|
416
|
+
pointer-events: none;
|
|
417
|
+
margin-bottom: 6px;
|
|
418
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
|
419
|
+
}
|
|
420
|
+
|
|
421
|
+
.tooltip-text-bubble::after {
|
|
422
|
+
content: "";
|
|
423
|
+
position: absolute;
|
|
424
|
+
top: 100%;
|
|
425
|
+
left: 20%;
|
|
426
|
+
margin-left: -5px;
|
|
427
|
+
border-width: 5px;
|
|
428
|
+
border-style: solid;
|
|
429
|
+
border-color: rgba(0, 0, 0, 0.85) transparent transparent transparent;
|
|
430
|
+
}
|
|
431
|
+
|
|
432
|
+
.color-picker-icon-right:hover .tooltip-text-bubble {
|
|
433
|
+
visibility: visible;
|
|
434
|
+
opacity: 1;
|
|
396
435
|
}
|
|
397
436
|
.palette-section-title {
|
|
398
437
|
font-size: 12px;
|
package/src/lib/index.js
CHANGED
|
@@ -53,6 +53,12 @@ const ColorPicker = ({
|
|
|
53
53
|
showInput = true,
|
|
54
54
|
showColorBoard = true,
|
|
55
55
|
presets: customPresets,
|
|
56
|
+
tooltipText = "Color Picker",
|
|
57
|
+
screenPickerTooltip = "屏幕取色",
|
|
58
|
+
recommendedTitle = "Recommended",
|
|
59
|
+
recentTitle = "Recent",
|
|
60
|
+
moreText = "More",
|
|
61
|
+
lessText = "Less",
|
|
56
62
|
}) => {
|
|
57
63
|
const [isOpen, setIsOpen] = useState(false);
|
|
58
64
|
const [isExpanded, setIsExpanded] = useState(false);
|
|
@@ -212,7 +218,6 @@ const ColorPicker = ({
|
|
|
212
218
|
className="color-picker-board-wrapper"
|
|
213
219
|
style={{
|
|
214
220
|
marginTop: "10px",
|
|
215
|
-
paddingTop: "10px",
|
|
216
221
|
borderTop: "1px solid #eee",
|
|
217
222
|
}}
|
|
218
223
|
>
|
|
@@ -240,12 +245,12 @@ const ColorPicker = ({
|
|
|
240
245
|
)}
|
|
241
246
|
<div className="color-picker-presets">
|
|
242
247
|
<div className="palette-section-title" style={{ marginTop: 8 }}>
|
|
243
|
-
<span>
|
|
248
|
+
<span>{recommendedTitle}</span>
|
|
244
249
|
<span
|
|
245
250
|
className="color-picker-icon-right"
|
|
246
251
|
onClick={handleEyeDropper}
|
|
247
|
-
title="屏幕取色"
|
|
248
252
|
>
|
|
253
|
+
<span className="tooltip-text-bubble">{screenPickerTooltip}</span>
|
|
249
254
|
<svg
|
|
250
255
|
width="16"
|
|
251
256
|
height="16"
|
|
@@ -306,7 +311,7 @@ const ColorPicker = ({
|
|
|
306
311
|
className="presets-collapse"
|
|
307
312
|
onClick={() => setIsExpanded(!isExpanded)}
|
|
308
313
|
>
|
|
309
|
-
{isExpanded ?
|
|
314
|
+
{isExpanded ? lessText : moreText}
|
|
310
315
|
<span className={`collapse-arrow ${isExpanded ? "expanded" : ""}`}>
|
|
311
316
|
▼
|
|
312
317
|
</span>
|
|
@@ -315,7 +320,7 @@ const ColorPicker = ({
|
|
|
315
320
|
|
|
316
321
|
{recentColors.length > 0 && (
|
|
317
322
|
<>
|
|
318
|
-
<div className="palette-section-title">
|
|
323
|
+
<div className="palette-section-title">{recentTitle}</div>
|
|
319
324
|
<div className="presets-grid recent">
|
|
320
325
|
{recentColors.map((recentColor, idx) => (
|
|
321
326
|
<div
|
|
@@ -398,7 +403,7 @@ const ColorPicker = ({
|
|
|
398
403
|
</svg>
|
|
399
404
|
</span>
|
|
400
405
|
)}
|
|
401
|
-
<span className="tooltip-text">
|
|
406
|
+
<span className="tooltip-text">{tooltipText}</span>
|
|
402
407
|
</div>
|
|
403
408
|
</div>
|
|
404
409
|
|
|
@@ -453,7 +458,7 @@ const ColorPicker = ({
|
|
|
453
458
|
className="presets-collapse"
|
|
454
459
|
onClick={() => setIsExpanded(!isExpanded)}
|
|
455
460
|
>
|
|
456
|
-
{isExpanded ?
|
|
461
|
+
{isExpanded ? lessText : moreText}
|
|
457
462
|
<span className={`collapse-arrow ${isExpanded ? "expanded" : ""}`}>
|
|
458
463
|
▼
|
|
459
464
|
</span>
|