gdp-color-picker 1.0.0

package/src/lib/utils/color.js

@@ -0,0 +1,216 @@
+
+/**
+ * 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
+  let r, g, b;
+  let i = Math.floor(h / 60);
+  let f = h / 60 - i;
+  let p = v * (1 - s);
+  let q = v * (1 - f * s);
+  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;
+  }
+
+  return {
+    r: Math.round(r * 255),
+    g: Math.round(g * 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;
+  b /= 255;
+
+  let max = Math.max(r, g, b);
+  let min = Math.min(r, g, b);
+  let h, s, v = max;
+
+  let d = max - min;
+  s = max === 0 ? 0 : d / max;
+
+  if (max === min) {
+    h = 0; // achromatic
+  } 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;
+    }
+    h /= 6;
+  }
+
+  return {
+    h: h * 360,
+    s: s,
+    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);
+    return hex.length === 1 ? "0" + hex : hex;
+  };
+  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;
+}
+
+/**
+ * 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('#')) {
+    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.]+))?\)$/);
+  if (rgbaMatch) {
+    const r = parseInt(rgbaMatch[1], 10);
+    const g = parseInt(rgbaMatch[2], 10);
+    const b = parseInt(rgbaMatch[3], 10);
+    const a = rgbaMatch[4] !== undefined ? parseFloat(rgbaMatch[4]) : 1;
+    const hsv = rgbToHsv(r, g, b);
+    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;
+
+  if (max === min) {
+    h = s = 0; // achromatic
+  } 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;
+    }
+    h /= 6;
+  }
+
+  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
+  } 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;
+      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);
+    g = hue2rgb(p, q, h);
+    b = hue2rgb(p, q, h - 1/3);
+  }
+
+  return {
+    r: Math.round(r * 255),
+    g: Math.round(g * 255),
+    b: Math.round(b * 255)
+  };
+}