d3-color - npm Package Compare versions

Comparing version 0.0.2 to 0.0.3

build/color.js

@@ -38,2 +38,5 @@ 'use strict';
 function format(r, g, b) {
+  if (isNaN(r)) r = 0;
+  if (isNaN(g)) g = 0;
+  if (isNaN(b)) b = 0;
   return "#"
@@ -51,3 +54,4 @@ + (r < 16 ? "0" + r.toString(16) : r.toString(16))
   if (arguments.length === 1) {
-    if (!(r instanceof rgb)) r = color(r).rgb();
+    if (!(r instanceof Color)) r = color(r);
+    r = r.rgb();
     b = r.b;
@@ -240,4 +244,4 @@ g = r.g;
 __prototype.rgb = function() {
-  var h = isNaN(this.h) ? 0 : this.h,
-      s = isNaN(this.s) ? 0 : this.s,
+  var h = this.h,
+      s = isNaN(this.h) || isNaN(this.s) ? 0 : this.s,
       l = this.l,
@@ -255,3 +259,3 @@ m2 = l <= .5 ? l * (1 + s) : l + s - l * s,
   if (arguments.length === 1) {
-    if (h instanceof hsl) {
+    if (h instanceof Hsl) {
       l = h.l;
@@ -261,3 +265,5 @@ s = h.s;
     } else {
-      if (!(h instanceof rgb)) h = rgb(h);
+      if (!(h instanceof Color)) h = color(h);
+      if (h instanceof Hsl) return h;
+      h = h.rgb();
       var r = h.r / 255,
@@ -290,5 +296,5 @@ g = h.g / 255,
       : (m = /^#([0-9a-f]{6})$/.exec(format)) ? (m = parseInt(m[1], 16), rgb((m & 0xff0000) >> 16, (m & 0xff00) >> 8, m & 0xff)) // #ff0000
-      : (m = /^rgb\s*\(\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*\)$/.exec(format)) ? rgb(m[1], m[2], m[3]) // rgb(255,0,0)
-      : (m = /^rgb\s*\(\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? rgb(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100) // rgb(100%,0%,0%)
-      : (m = /^hsl\s*\(\s*([-+]?\d+(?:\.\d+)?)\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? hsl(m[1], m[2] / 100, m[3] / 100) // hsl(120,50%,50%)
+      : (m = /^rgb\(\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*\)$/.exec(format)) ? rgb(m[1], m[2], m[3]) // rgb(255,0,0)
+      : (m = /^rgb\(\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? rgb(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100) // rgb(100%,0%,0%)
+      : (m = /^hsl\(\s*([-+]?\d+(?:\.\d+)?)\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? hsl(m[1], m[2] / 100, m[3] / 100) // hsl(120,50%,50%)
       : named.has(format) ? rgbn(named.get(format))
@@ -338,4 +344,4 @@ : rgb(NaN, NaN, NaN);
   var y = (this.l + 16) / 116,
-      x = y + this.a / 500,
-      z = y - this.b / 200;
+      x = isNaN(this.a) ? y : y + this.a / 500,
+      z = isNaN(this.b) ? y : y - this.b / 200;
   y = Yn * lab2xyz(y);
@@ -380,34 +386,16 @@ x = Xn * lab2xyz(x);
 };
-var rad2deg = 180 / Math.PI;
 
-var hcl = function(h, c, l) {
-  if (arguments.length === 1) {
-    if (h instanceof hcl) {
-      l = h.l;
-      c = h.c;
-      h = h.h;
-    } else {
-      if (!(h instanceof lab)) h = lab(h);
-      l = h.l;
-      c = Math.sqrt(h.a * h.a + h.b * h.b);
-      h = Math.atan2(h.b, h.a) * rad2deg;
-    }
-  }
-  return new Hcl(h, c, l);
-}
-
 var lab = function(l, a, b) {
   if (arguments.length === 1) {
-    if (l instanceof lab) {
+    if (l instanceof Lab) {
       b = l.b;
       a = l.a;
       l = l.l;
-    } else if (l instanceof hcl) {
-      var h = isNaN(l.h) ? 0 : l.h * deg2rad,
-          c = isNaN(l.c) ? 0 : l.c;
-      b = Math.sin(h) * c;
-      a = Math.cos(h) * c;
+    } else if (l instanceof Hcl) {
+      var h = l.h * deg2rad;
+      b = Math.sin(h) * l.c;
+      a = Math.cos(h) * l.c;
       l = l.l;
     } else {
-      if (!(l instanceof rgb)) l = rgb(l);
+      if (!(l instanceof Rgb)) l = rgb(l);
       var r = rgb2xyz(l.r),
@@ -427,2 +415,19 @@ g = rgb2xyz(l.g),
 lab.prototype = Lab.prototype;
+var rad2deg = 180 / Math.PI;
+
+var hcl = function(h, c, l) {
+  if (arguments.length === 1) {
+    if (h instanceof Hcl) {
+      l = h.l;
+      c = h.c;
+      h = h.h;
+    } else {
+      if (!(h instanceof Lab)) h = lab(h);
+      l = h.l;
+      c = Math.sqrt(h.a * h.a + h.b * h.b);
+      h = Math.atan2(h.b, h.a) * rad2deg;
+    }
+  }
+  return new Hcl(h, c, l);
+}
 hcl.prototype = Hcl.prototype;
@@ -443,3 +448,5 @@
   return function(t) {
-    a.h = ah + bh * t; // XXX this doesn’t wrap around
+    a.h = ah + bh * t;
+    if (a.h > 360) a.h -= 360;
+    else if (a.h < 0) a.h += 360;
     a.c = ac + bc * t;
@@ -481,3 +488,5 @@ a.l = al + bl * t
   return function(t) {
-    a.h = ah + bh * t; // XXX this doesn’t wrap around
+    a.h = ah + bh * t;
+    if (a.h > 360) a.h -= 360;
+    else if (a.h < 0) a.h += 360;
     a.s = as + bs * t;
@@ -484,0 +493,0 @@ a.l = al + bl * t

package.json

 {
   "name": "d3-color",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "Colorspaces!",
@@ -5,0 +5,0 @@ "main": "build/color",

README.md

@@ -5,12 +5,14 @@ # d3-color
 
-* Parsing RGB colors with percentages is now supported (e.g., `rgb(30%,40%,50%)`). Decimal values where integers are required are no longer allowed (e.g., `rgb(100.5,0,0)` is not a valid color).
+* A new color method parses the specified string according to [CSS Color Module Level 3](http://www.w3.org/TR/css3-color/#colorunits) and returns the corresponding color in its colorspace. For HSL color values, this is the HSL colorspace; for other values, the RGB colorspace is used.
 
+* In addition, the color method now correctly parses RGB colors with percentages (e.g., `rgb(30%,40%,50%)`). Decimal values where integers are required are no longer allowed (e.g., `rgb(100.5,0,0)` is not a valid color).
+
 * The rgb.brighter method no longer special-cases behavior for black and very dark channels; it is now a simple channel multiplier, consistent with rgb.darker and implementations in the other colorspaces.
 
-* The rgb.hsl method has been removed; use the hsl constructor to convert any color to the HSL colorspace (e.g., `hsl(rgb)`).
+* The rgb.hsl method has been removed; use the appropriate constructor to convert any desired colorspace (e.g., `hsl(foo)`).
 
-* All colorspaces, including RGB, now support the color.rgb method. This method returns a new color instance representing the nearest-equivalent color in the RGB colorspace.
+* All colorspaces, including RGB, now support the color.rgb method. This method returns a color instance representing the nearest-equivalent color in the RGB colorspace. For RGB colors, it returns `this`. Use the rgb constructor if you want a copy.
 
-* Colors are now validated upon construction. For example, an RGB color’s `r`, `g` and `b` values are integers in the range [0,100]. An HSL color’s `h` is a number in the range [0,360), while `s` and `l` are numbers in the range [0,1].
+* When converting to HCL, hue and chroma are no longer undefined if the luminance is zero. Thus, the roundtrip from Lab to HCL and back again no longer loses information.
 
-* A new color method parses the specified string according to [CSS Color Module Level 3](http://www.w3.org/TR/css3-color/#colorunits) and returns the corresponding color in its colorspace. For HSL color values, this is the HSL colorspace; for other values, the RGB colorspace is used.
+* Colors are now validated upon construction. For example, an RGB color’s `r`, `g` and `b` values are integers in the range [0,100]; an HSL color’s `h` is a number in the range [0,360), while `s` and `l` are numbers in the range [0,1].

src/color.js

@@ -17,5 +17,5 @@ import rgb from "./rgb";
       : (m = /^#([0-9a-f]{6})$/.exec(format)) ? (m = parseInt(m[1], 16), rgb((m & 0xff0000) >> 16, (m & 0xff00) >> 8, m & 0xff)) // #ff0000
-      : (m = /^rgb\s*\(\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*\)$/.exec(format)) ? rgb(m[1], m[2], m[3]) // rgb(255,0,0)
-      : (m = /^rgb\s*\(\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? rgb(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100) // rgb(100%,0%,0%)
-      : (m = /^hsl\s*\(\s*([-+]?\d+(?:\.\d+)?)\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? hsl(m[1], m[2] / 100, m[3] / 100) // hsl(120,50%,50%)
+      : (m = /^rgb\(\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*,\s*([-+]?\d+)\s*\)$/.exec(format)) ? rgb(m[1], m[2], m[3]) // rgb(255,0,0)
+      : (m = /^rgb\(\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? rgb(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100) // rgb(100%,0%,0%)
+      : (m = /^hsl\(\s*([-+]?\d+(?:\.\d+)?)\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*,\s*([-+]?\d+(?:\.\d+)?)%\s*\)$/.exec(format)) ? hsl(m[1], m[2] / 100, m[3] / 100) // hsl(120,50%,50%)
       : named.has(format) ? rgbn(named.get(format))
@@ -22,0 +22,0 @@ : rgb(NaN, NaN, NaN);

src/hcl.js

 import {default as color, Color} from "./color";
-import {default as lab, Kn} from "./lab";
+import {default as lab, Lab, Kn} from "./lab";
 
@@ -9,3 +9,3 @@ export var deg2rad = Math.PI / 180;
   if (arguments.length === 1) {
-    if (h instanceof hcl) {
+    if (h instanceof Hcl) {
       l = h.l;
@@ -15,3 +15,3 @@ c = h.c;
     } else {
-      if (!(h instanceof lab)) h = lab(h);
+      if (!(h instanceof Lab)) h = lab(h);
       l = h.l;
@@ -18,0 +18,0 @@ c = Math.sqrt(h.a * h.a + h.b * h.b);

src/hsl.js

@@ -1,2 +0,2 @@
-import {Color} from "./color";
+import {default as color, Color} from "./color";
 import {default as rgb, Rgb} from "./rgb";
@@ -6,3 +6,3 @@
   if (arguments.length === 1) {
-    if (h instanceof hsl) {
+    if (h instanceof Hsl) {
       l = h.l;
@@ -12,3 +12,5 @@ s = h.s;
     } else {
-      if (!(h instanceof rgb)) h = rgb(h);
+      if (!(h instanceof Color)) h = color(h);
+      if (h instanceof Hsl) return h;
+      h = h.rgb();
       var r = h.r / 255,
@@ -55,4 +57,4 @@ g = h.g / 255,
 prototype.rgb = function() {
-  var h = isNaN(this.h) ? 0 : this.h,
-      s = isNaN(this.s) ? 0 : this.s,
+  var h = this.h,
+      s = isNaN(this.h) || isNaN(this.s) ? 0 : this.s,
       l = this.l,
@@ -59,0 +61,0 @@ m2 = l <= .5 ? l * (1 + s) : l + s - l * s,

src/interpolateHcl.js

@@ -16,3 +16,5 @@ import hcl from "./hcl";
   return function(t) {
-    a.h = ah + bh * t; // XXX this doesn’t wrap around
+    a.h = ah + bh * t;
+    if (a.h > 360) a.h -= 360;
+    else if (a.h < 0) a.h += 360;
     a.c = ac + bc * t;
@@ -19,0 +21,0 @@ a.l = al + bl * t

src/interpolateHsl.js

@@ -16,3 +16,5 @@ import hsl from "./hsl";
   return function(t) {
-    a.h = ah + bh * t; // XXX this doesn’t wrap around
+    a.h = ah + bh * t;
+    if (a.h > 360) a.h -= 360;
+    else if (a.h < 0) a.h += 360;
     a.s = as + bs * t;
@@ -19,0 +21,0 @@ a.l = al + bl * t

src/lab.js

 import {default as color, Color} from "./color";
 import {default as rgb, Rgb} from "./rgb";
-import {default as hcl, deg2rad} from "./hcl";
+import {default as hcl, Hcl, deg2rad} from "./hcl";
 
@@ -17,14 +17,13 @@ export var Kn = 18;
   if (arguments.length === 1) {
-    if (l instanceof lab) {
+    if (l instanceof Lab) {
       b = l.b;
       a = l.a;
       l = l.l;
-    } else if (l instanceof hcl) {
-      var h = isNaN(l.h) ? 0 : l.h * deg2rad,
-          c = isNaN(l.c) ? 0 : l.c;
-      b = Math.sin(h) * c;
-      a = Math.cos(h) * c;
+    } else if (l instanceof Hcl) {
+      var h = l.h * deg2rad;
+      b = Math.sin(h) * l.c;
+      a = Math.cos(h) * l.c;
       l = l.l;
     } else {
-      if (!(l instanceof rgb)) l = rgb(l);
+      if (!(l instanceof Rgb)) l = rgb(l);
       var r = rgb2xyz(l.r),
@@ -62,4 +61,4 @@ g = rgb2xyz(l.g),
   var y = (this.l + 16) / 116,
-      x = y + this.a / 500,
-      z = y - this.b / 200;
+      x = isNaN(this.a) ? y : y + this.a / 500,
+      z = isNaN(this.b) ? y : y - this.b / 200;
   y = Yn * lab2xyz(y);
@@ -66,0 +65,0 @@ x = Xn * lab2xyz(x);

src/rgb.js

@@ -8,3 +8,4 @@ import {default as color, Color} from "./color";
   if (arguments.length === 1) {
-    if (!(r instanceof rgb)) r = color(r).rgb();
+    if (!(r instanceof Color)) r = color(r);
+    r = r.rgb();
     b = r.b;
@@ -44,2 +45,5 @@ g = r.g;
 export function format(r, g, b) {
+  if (isNaN(r)) r = 0;
+  if (isNaN(g)) g = 0;
+  if (isNaN(b)) b = 0;
   return "#"
@@ -46,0 +50,0 @@ + (r < 16 ? "0" + r.toString(16) : r.toString(16))

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

33731

increased by2.02%

Lines of code

949

increased by1.93%

Number of lines in readme file

18

increased by12.5%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes