gdp-color-picker 1.0.0 → 1.1.1

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.
@@ -1,23 +1,9 @@
1
-
2
- /**
3
- * Clamps a value between min and max
4
- * @param {number} value
5
- * @param {number} min
6
- * @param {number} max
7
- */
8
1
  export function clamp(value, min, max) {
9
2
  return Math.min(Math.max(value, min), max);
10
3
  }
11
4
 
12
- /**
13
- * Converts HSV to RGB
14
- * @param {number} h Hue 0-360
15
- * @param {number} s Saturation 0-1
16
- * @param {number} v Value 0-1
17
- * @returns {{r: number, g: number, b: number}}
18
- */
19
5
  export function hsvToRgb(h, s, v) {
20
- h = ((h % 360) + 360) % 360; // Normalize hue
6
+ h = ((h % 360) + 360) % 360;
21
7
  let r, g, b;
22
8
  let i = Math.floor(h / 60);
23
9
  let f = h / 60 - i;
@@ -26,29 +12,49 @@ export function hsvToRgb(h, s, v) {
26
12
  let t = v * (1 - (1 - f) * s);
27
13
 
28
14
  switch (i % 6) {
29
- case 0: r = v; g = t; b = p; break;
30
- case 1: r = q; g = v; b = p; break;
31
- case 2: r = p; g = v; b = t; break;
32
- case 3: r = p; g = q; b = v; break;
33
- case 4: r = t; g = p; b = v; break;
34
- case 5: r = v; g = p; b = q; break;
35
- default: r = 0; g = 0; b = 0;
15
+ case 0:
16
+ r = v;
17
+ g = t;
18
+ b = p;
19
+ break;
20
+ case 1:
21
+ r = q;
22
+ g = v;
23
+ b = p;
24
+ break;
25
+ case 2:
26
+ r = p;
27
+ g = v;
28
+ b = t;
29
+ break;
30
+ case 3:
31
+ r = p;
32
+ g = q;
33
+ b = v;
34
+ break;
35
+ case 4:
36
+ r = t;
37
+ g = p;
38
+ b = v;
39
+ break;
40
+ case 5:
41
+ r = v;
42
+ g = p;
43
+ b = q;
44
+ break;
45
+ default:
46
+ r = 0;
47
+ g = 0;
48
+ b = 0;
36
49
  }
37
50
 
38
51
  return {
39
52
  r: Math.round(r * 255),
40
53
  g: Math.round(g * 255),
41
- b: Math.round(b * 255)
54
+ b: Math.round(b * 255),
42
55
  };
43
56
  }
44
57
 
45
- /**
46
- * Converts RGB to HSV
47
- * @param {number} r Red 0-255
48
- * @param {number} g Green 0-255
49
- * @param {number} b Blue 0-255
50
- * @returns {{h: number, s: number, v: number}}
51
- */
52
58
  export function rgbToHsv(r, g, b) {
53
59
  r /= 255;
54
60
  g /= 255;
@@ -56,19 +62,28 @@ export function rgbToHsv(r, g, b) {
56
62
 
57
63
  let max = Math.max(r, g, b);
58
64
  let min = Math.min(r, g, b);
59
- let h, s, v = max;
65
+ let h,
66
+ s,
67
+ v = max;
60
68
 
61
69
  let d = max - min;
62
70
  s = max === 0 ? 0 : d / max;
63
71
 
64
72
  if (max === min) {
65
- h = 0; // achromatic
73
+ h = 0;
66
74
  } else {
67
75
  switch (max) {
68
- case r: h = (g - b) / d + (g < b ? 6 : 0); break;
69
- case g: h = (b - r) / d + 2; break;
70
- case b: h = (r - g) / d + 4; break;
71
- default: h = 0;
76
+ case r:
77
+ h = (g - b) / d + (g < b ? 6 : 0);
78
+ break;
79
+ case g:
80
+ h = (b - r) / d + 2;
81
+ break;
82
+ case b:
83
+ h = (r - g) / d + 4;
84
+ break;
85
+ default:
86
+ h = 0;
72
87
  }
73
88
  h /= 6;
74
89
  }
@@ -76,17 +91,10 @@ export function rgbToHsv(r, g, b) {
76
91
  return {
77
92
  h: h * 360,
78
93
  s: s,
79
- v: v
94
+ v: v,
80
95
  };
81
96
  }
82
97
 
83
- /**
84
- * Converts RGB to Hex string
85
- * @param {number} r
86
- * @param {number} g
87
- * @param {number} b
88
- * @returns {string} Hex string (e.g., "#ff0000")
89
- */
90
98
  export function rgbToHex(r, g, b) {
91
99
  const toHex = (c) => {
92
100
  const hex = Math.round(c).toString(16);
@@ -95,45 +103,36 @@ export function rgbToHex(r, g, b) {
95
103
  return "#" + toHex(r) + toHex(g) + toHex(b);
96
104
  }
97
105
 
98
- /**
99
- * Converts Hex string to RGB
100
- * @param {string} hex
101
- * @returns {{r: number, g: number, b: number} | null}
102
- */
103
106
  export function hexToRgb(hex) {
104
- // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
105
107
  const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
106
108
  hex = hex.replace(shorthandRegex, function(m, r, g, b) {
107
109
  return r + r + g + g + b + b;
108
110
  });
109
111
 
110
112
  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
111
- return result ? {
112
- r: parseInt(result[1], 16),
113
- g: parseInt(result[2], 16),
114
- b: parseInt(result[3], 16)
115
- } : null;
113
+ return result
114
+ ? {
115
+ r: parseInt(result[1], 16),
116
+ g: parseInt(result[2], 16),
117
+ b: parseInt(result[3], 16),
118
+ }
119
+ : null;
116
120
  }
117
121
 
118
- /**
119
- * Parses a color string to HSV
120
- * @param {string} color
121
- * @returns {{h: number, s: number, v: number, a: number}}
122
- */
123
122
  export function parseColor(color) {
124
123
  if (!color) return { h: 0, s: 1, v: 1, a: 1 };
125
124
 
126
- // Hex
127
- if (color.startsWith('#')) {
125
+ if (color.startsWith("#")) {
128
126
  const rgb = hexToRgb(color);
129
127
  if (rgb) {
130
128
  const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);
131
129
  return { ...hsv, a: 1 };
132
130
  }
133
131
  }
134
-
135
- // RGB/RGBA
136
- const rgbaMatch = color.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/);
132
+
133
+ const rgbaMatch = color.match(
134
+ /^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/
135
+ );
137
136
  if (rgbaMatch) {
138
137
  const r = parseInt(rgbaMatch[1], 10);
139
138
  const g = parseInt(rgbaMatch[2], 10);
@@ -143,34 +142,37 @@ export function parseColor(color) {
143
142
  return { ...hsv, a };
144
143
  }
145
144
 
146
- // Default fallback
147
145
  return { h: 0, s: 1, v: 1, a: 1 };
148
146
  }
149
147
 
150
- /**
151
- * Converts RGB to HSL
152
- * @param {number} r Red 0-255
153
- * @param {number} g Green 0-255
154
- * @param {number} b Blue 0-255
155
- * @returns {{h: number, s: number, l: number}}
156
- */
157
148
  export function rgbToHsl(r, g, b) {
158
149
  r /= 255;
159
150
  g /= 255;
160
151
  b /= 255;
161
152
 
162
- let max = Math.max(r, g, b), min = Math.min(r, g, b);
163
- let h, s, l = (max + min) / 2;
153
+ let max = Math.max(r, g, b),
154
+ min = Math.min(r, g, b);
155
+ let h,
156
+ s,
157
+ l = (max + min) / 2;
164
158
 
165
159
  if (max === min) {
166
- h = s = 0; // achromatic
160
+ h = s = 0;
167
161
  } else {
168
162
  let d = max - min;
169
163
  s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
170
164
  switch (max) {
171
- case r: h = (g - b) / d + (g < b ? 6 : 0); break;
172
- case g: h = (b - r) / d + 2; break;
173
- case b: h = (r - g) / d + 4; break;
165
+ case r:
166
+ h = (g - b) / d + (g < b ? 6 : 0);
167
+ break;
168
+ case g:
169
+ h = (b - r) / d + 2;
170
+ break;
171
+ case b:
172
+ h = (r - g) / d + 4;
173
+ break;
174
+ default:
175
+ h = 0;
174
176
  }
175
177
  h /= 6;
176
178
  }
@@ -178,39 +180,32 @@ export function rgbToHsl(r, g, b) {
178
180
  return { h: h * 360, s: s, l: l };
179
181
  }
180
182
 
181
- /**
182
- * Converts HSL to RGB
183
- * @param {number} h Hue 0-360
184
- * @param {number} s Saturation 0-1
185
- * @param {number} l Lightness 0-1
186
- * @returns {{r: number, g: number, b: number}}
187
- */
188
183
  export function hslToRgb(h, s, l) {
189
184
  let r, g, b;
190
185
 
191
186
  if (s === 0) {
192
- r = g = b = l; // achromatic
187
+ r = g = b = l;
193
188
  } else {
194
189
  const hue2rgb = (p, q, t) => {
195
190
  if (t < 0) t += 1;
196
191
  if (t > 1) t -= 1;
197
- if (t < 1/6) return p + (q - p) * 6 * t;
198
- if (t < 1/2) return q;
199
- if (t < 2/3) return p + (q - p) * (2/3 - t) * 6;
192
+ if (t < 1 / 6) return p + (q - p) * 6 * t;
193
+ if (t < 1 / 2) return q;
194
+ if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
200
195
  return p;
201
196
  };
202
197
 
203
198
  const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
204
199
  const p = 2 * l - q;
205
200
  h /= 360;
206
- r = hue2rgb(p, q, h + 1/3);
201
+ r = hue2rgb(p, q, h + 1 / 3);
207
202
  g = hue2rgb(p, q, h);
208
- b = hue2rgb(p, q, h - 1/3);
203
+ b = hue2rgb(p, q, h - 1 / 3);
209
204
  }
210
205
 
211
206
  return {
212
207
  r: Math.round(r * 255),
213
208
  g: Math.round(g * 255),
214
- b: Math.round(b * 255)
209
+ b: Math.round(b * 255),
215
210
  };
216
211
  }