gdp-color-picker 1.0.0 → 1.1.0

package/src/lib/utils/color.js

@@ -1,23 +1,9 @@
-
-/**
- * Clamps a value between min and max
- * @param {number} value 
- * @param {number} min 
- * @param {number} max 
- */
 export function clamp(value, min, max) {
   return Math.min(Math.max(value, min), max);
 }
 
-/**
- * Converts HSV to RGB
- * @param {number} h Hue 0-360
- * @param {number} s Saturation 0-1
- * @param {number} v Value 0-1
- * @returns {{r: number, g: number, b: number}}
- */
 export function hsvToRgb(h, s, v) {
-  h = ((h % 360) + 360) % 360; // Normalize hue
+  h = ((h % 360) + 360) % 360;
   let r, g, b;
   let i = Math.floor(h / 60);
   let f = h / 60 - i;
@@ -26,29 +12,49 @@ export function hsvToRgb(h, s, v) {
   let t = v * (1 - (1 - f) * s);
 
   switch (i % 6) {
-    case 0: r = v; g = t; b = p; break;
-    case 1: r = q; g = v; b = p; break;
-    case 2: r = p; g = v; b = t; break;
-    case 3: r = p; g = q; b = v; break;
-    case 4: r = t; g = p; b = v; break;
-    case 5: r = v; g = p; b = q; break;
-    default: r = 0; g = 0; b = 0;
+    case 0:
+      r = v;
+      g = t;
+      b = p;
+      break;
+    case 1:
+      r = q;
+      g = v;
+      b = p;
+      break;
+    case 2:
+      r = p;
+      g = v;
+      b = t;
+      break;
+    case 3:
+      r = p;
+      g = q;
+      b = v;
+      break;
+    case 4:
+      r = t;
+      g = p;
+      b = v;
+      break;
+    case 5:
+      r = v;
+      g = p;
+      b = q;
+      break;
+    default:
+      r = 0;
+      g = 0;
+      b = 0;
   }
 
   return {
     r: Math.round(r * 255),
     g: Math.round(g * 255),
-    b: Math.round(b * 255)
+    b: Math.round(b * 255),
   };
 }
 
-/**
- * Converts RGB to HSV
- * @param {number} r Red 0-255
- * @param {number} g Green 0-255
- * @param {number} b Blue 0-255
- * @returns {{h: number, s: number, v: number}}
- */
 export function rgbToHsv(r, g, b) {
   r /= 255;
   g /= 255;
@@ -56,19 +62,28 @@ export function rgbToHsv(r, g, b) {
 
   let max = Math.max(r, g, b);
   let min = Math.min(r, g, b);
-  let h, s, v = max;
+  let h,
+    s,
+    v = max;
 
   let d = max - min;
   s = max === 0 ? 0 : d / max;
 
   if (max === min) {
-    h = 0; // achromatic
+    h = 0;
   } else {
     switch (max) {
-      case r: h = (g - b) / d + (g < b ? 6 : 0); break;
-      case g: h = (b - r) / d + 2; break;
-      case b: h = (r - g) / d + 4; break;
-      default: h = 0;
+      case r:
+        h = (g - b) / d + (g < b ? 6 : 0);
+        break;
+      case g:
+        h = (b - r) / d + 2;
+        break;
+      case b:
+        h = (r - g) / d + 4;
+        break;
+      default:
+        h = 0;
     }
     h /= 6;
   }
@@ -76,17 +91,10 @@ export function rgbToHsv(r, g, b) {
   return {
     h: h * 360,
     s: s,
-    v: v
+    v: v,
   };
 }
 
-/**
- * Converts RGB to Hex string
- * @param {number} r 
- * @param {number} g 
- * @param {number} b 
- * @returns {string} Hex string (e.g., "#ff0000")
- */
 export function rgbToHex(r, g, b) {
   const toHex = (c) => {
     const hex = Math.round(c).toString(16);
@@ -95,45 +103,36 @@ export function rgbToHex(r, g, b) {
   return "#" + toHex(r) + toHex(g) + toHex(b);
 }
 
-/**
- * Converts Hex string to RGB
- * @param {string} hex 
- * @returns {{r: number, g: number, b: number} | null}
- */
 export function hexToRgb(hex) {
-  // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
   const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
   hex = hex.replace(shorthandRegex, function(m, r, g, b) {
     return r + r + g + g + b + b;
   });
 
   const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-  return result ? {
-    r: parseInt(result[1], 16),
-    g: parseInt(result[2], 16),
-    b: parseInt(result[3], 16)
-  } : null;
+  return result
+    ? {
+        r: parseInt(result[1], 16),
+        g: parseInt(result[2], 16),
+        b: parseInt(result[3], 16),
+      }
+    : null;
 }
 
-/**
- * Parses a color string to HSV
- * @param {string} color 
- * @returns {{h: number, s: number, v: number, a: number}}
- */
 export function parseColor(color) {
   if (!color) return { h: 0, s: 1, v: 1, a: 1 };
 
-  // Hex
-  if (color.startsWith('#')) {
+  if (color.startsWith("#")) {
     const rgb = hexToRgb(color);
     if (rgb) {
       const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);
       return { ...hsv, a: 1 };
     }
   }
-  
-  // RGB/RGBA
-  const rgbaMatch = color.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/);
+
+  const rgbaMatch = color.match(
+    /^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/
+  );
   if (rgbaMatch) {
     const r = parseInt(rgbaMatch[1], 10);
     const g = parseInt(rgbaMatch[2], 10);
@@ -143,34 +142,37 @@ export function parseColor(color) {
     return { ...hsv, a };
   }
 
-  // Default fallback
   return { h: 0, s: 1, v: 1, a: 1 };
 }
 
-/**
- * Converts RGB to HSL
- * @param {number} r Red 0-255
- * @param {number} g Green 0-255
- * @param {number} b Blue 0-255
- * @returns {{h: number, s: number, l: number}}
- */
 export function rgbToHsl(r, g, b) {
   r /= 255;
   g /= 255;
   b /= 255;
 
-  let max = Math.max(r, g, b), min = Math.min(r, g, b);
-  let h, s, l = (max + min) / 2;
+  let max = Math.max(r, g, b),
+    min = Math.min(r, g, b);
+  let h,
+    s,
+    l = (max + min) / 2;
 
   if (max === min) {
-    h = s = 0; // achromatic
+    h = s = 0;
   } else {
     let d = max - min;
     s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
     switch (max) {
-      case r: h = (g - b) / d + (g < b ? 6 : 0); break;
-      case g: h = (b - r) / d + 2; break;
-      case b: h = (r - g) / d + 4; break;
+      case r:
+        h = (g - b) / d + (g < b ? 6 : 0);
+        break;
+      case g:
+        h = (b - r) / d + 2;
+        break;
+      case b:
+        h = (r - g) / d + 4;
+        break;
+      default:
+        h = 0;
     }
     h /= 6;
   }
@@ -178,39 +180,32 @@ export function rgbToHsl(r, g, b) {
   return { h: h * 360, s: s, l: l };
 }
 
-/**
- * Converts HSL to RGB
- * @param {number} h Hue 0-360
- * @param {number} s Saturation 0-1
- * @param {number} l Lightness 0-1
- * @returns {{r: number, g: number, b: number}}
- */
 export function hslToRgb(h, s, l) {
   let r, g, b;
 
   if (s === 0) {
-    r = g = b = l; // achromatic
+    r = g = b = l;
   } else {
     const hue2rgb = (p, q, t) => {
       if (t < 0) t += 1;
       if (t > 1) t -= 1;
-      if (t < 1/6) return p + (q - p) * 6 * t;
-      if (t < 1/2) return q;
-      if (t < 2/3) return p + (q - p) * (2/3 - t) * 6;
+      if (t < 1 / 6) return p + (q - p) * 6 * t;
+      if (t < 1 / 2) return q;
+      if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
       return p;
     };
 
     const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
     const p = 2 * l - q;
     h /= 360;
-    r = hue2rgb(p, q, h + 1/3);
+    r = hue2rgb(p, q, h + 1 / 3);
     g = hue2rgb(p, q, h);
-    b = hue2rgb(p, q, h - 1/3);
+    b = hue2rgb(p, q, h - 1 / 3);
   }
 
   return {
     r: Math.round(r * 255),
     g: Math.round(g * 255),
-    b: Math.round(b * 255)
+    b: Math.round(b * 255),
   };
 }