CSS output for LCH color spaces uses NaN, producing invalid color

[haykam821]

Hey! With chroma.js 3.0.0, the css method seems to produce invalid values for certain colors:

chroma('white').lch(); // [100,0,NaN]
chroma('white').css("lch"); // "lch(100% 0 NaNdeg)"

Tested in a browser, lch(100% 0 NaNdeg) is an invalid color value. I would expect the css method to always provide a valid color value, even if the color doesn't necessarily make sense in the given color space.

I believe this issue is not a duplicate of #322, as the css method previously took care when handling NaN, regardless of whether hsl included NaN in its output:

chroma('white').hsl(); // [NaN,0,1,1]
chroma('white').css("hsl"); // "hsl(0deg 0% 100%)"

[vinerz]

+1 on this issue. Having to use a few 0.003 to prevent a NaN, which obviously tints the color in an unwanted way

[vinerz]

I made a monkeypatch that gives me nausea, but it... works. At least my work can progress.

import chroma, { Color } from "chroma-js";

Color.prototype.__css = Color.prototype.css;

Color.prototype.css = function cssPatch(format: string): string {
  return this.__css(format).replaceAll("NaN", "0");
};

[gka]

thanks for reporting this. I fixed the bug in the 3.1.0 release.