@soybeanjs/colord 0.0.7 → 0.0.8
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.
- package/dist/{colord-CLzIbIN2.js → colord-CiL21DdP.js} +12 -6
- package/dist/{colord-Dc09uNcG.d.ts → colord-DjohCNUk.d.ts} +4 -67
- package/dist/colord.d.ts +1 -1
- package/dist/colord.js +8 -8
- package/dist/extend-Cjbo01n8.js +15 -0
- package/dist/{extend-D_jQFvDk.d.ts → extend-DmcZT4-q.d.ts} +2 -1
- package/dist/{get-SLuYLSG9.js → get-DjkEJgax.js} +1 -1
- package/dist/{hsv-OOAVcaRH.js → hsv-6f-Avk00.js} +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.js +9 -20
- package/dist/lab-BXLaTQvQ.js +27 -0
- package/dist/{lab-9NsKpGel.js → lab-DklZwOkG.js} +3 -3
- package/dist/{manipulate-DCHNBCkU.js → manipulate-DJ-cBonL.js} +3 -3
- package/dist/oklch-sYjVoJRG.js +186 -0
- package/dist/palette/index.d.ts +30 -0
- package/dist/palette/index.js +518 -0
- package/dist/plugins/a11y.d.ts +2 -2
- package/dist/plugins/a11y.js +3 -3
- package/dist/plugins/cmyk.d.ts +2 -2
- package/dist/plugins/cmyk.js +1 -1
- package/dist/plugins/harmonies.d.ts +1 -1
- package/dist/plugins/hwb.d.ts +2 -2
- package/dist/plugins/hwb.js +2 -2
- package/dist/plugins/lab.d.ts +2 -2
- package/dist/plugins/lab.js +6 -27
- package/dist/plugins/lch.d.ts +2 -2
- package/dist/plugins/lch.js +4 -4
- package/dist/plugins/minify.d.ts +1 -1
- package/dist/plugins/minify.js +1 -1
- package/dist/plugins/mix.d.ts +2 -2
- package/dist/plugins/mix.js +6 -6
- package/dist/plugins/names.d.ts +1 -1
- package/dist/plugins/oklab.d.ts +2 -2
- package/dist/plugins/oklab.js +2 -2
- package/dist/plugins/oklch.d.ts +2 -2
- package/dist/plugins/oklch.js +3 -184
- package/dist/plugins/xyz.d.ts +2 -2
- package/dist/plugins/xyz.js +3 -3
- package/dist/{rgb-BVkoWOmR.js → rgb-BIWjP3hJ.js} +2 -2
- package/dist/types-B93dJkfp.d.ts +112 -0
- package/dist/{xyz-DsYRwYO_.js → xyz-Czd8MTub.js} +2 -2
- package/package.json +6 -1
- /package/dist/{utils-CshL9w1R.js → utils-BhDL0kto.js} +0 -0
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { l as round, v as ALPHA_PRECISION } from "./utils-
|
|
2
|
-
import { a as parseRgbString, c as roundRgb, i as parseRgb, s as rgbToRgbString } from "./rgb-
|
|
3
|
-
import { i as roundHsv, n as parseHsv, r as rgbToHsv } from "./hsv-
|
|
4
|
-
import { a as saturate, c as rgbToHsl, l as rgbToHslString, n as invert, o as parseHsl, r as lighten, s as parseHslString, t as changeAlpha, u as roundHsl } from "./manipulate-
|
|
5
|
-
import { t as getBrightness } from "./get-
|
|
1
|
+
import { l as round, v as ALPHA_PRECISION } from "./utils-BhDL0kto.js";
|
|
2
|
+
import { a as parseRgbString, c as roundRgb, i as parseRgb, s as rgbToRgbString } from "./rgb-BIWjP3hJ.js";
|
|
3
|
+
import { i as roundHsv, n as parseHsv, r as rgbToHsv } from "./hsv-6f-Avk00.js";
|
|
4
|
+
import { a as saturate, c as rgbToHsl, l as rgbToHslString, n as invert, o as parseHsl, r as lighten, s as parseHslString, t as changeAlpha, u as roundHsl } from "./manipulate-DJ-cBonL.js";
|
|
5
|
+
import { t as getBrightness } from "./get-DjkEJgax.js";
|
|
6
6
|
|
|
7
7
|
//#region src/models/hex.ts
|
|
8
8
|
const hexMatcher = /^#([0-9a-f]{3,8})$/i;
|
|
@@ -37,6 +37,12 @@ const rgbToHex = (rgb) => {
|
|
|
37
37
|
return `#${format(r)}${format(g)}${format(b)}${alphaHex}`;
|
|
38
38
|
};
|
|
39
39
|
|
|
40
|
+
//#endregion
|
|
41
|
+
//#region src/shared/common.ts
|
|
42
|
+
function keysOf(record) {
|
|
43
|
+
return Object.keys(record);
|
|
44
|
+
}
|
|
45
|
+
|
|
40
46
|
//#endregion
|
|
41
47
|
//#region src/shared/parse.ts
|
|
42
48
|
const parsers = {
|
|
@@ -249,4 +255,4 @@ var Colord = class {
|
|
|
249
255
|
};
|
|
250
256
|
|
|
251
257
|
//#endregion
|
|
252
|
-
export { parsers as a, getFormat as i, colord as n, random as r, Colord as t };
|
|
258
|
+
export { parsers as a, getFormat as i, colord as n, keysOf as o, random as r, Colord as t };
|
|
@@ -1,70 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
alpha: number;
|
|
4
|
-
};
|
|
5
|
-
type RgbColor = WithAlpha<{
|
|
6
|
-
r: number;
|
|
7
|
-
g: number;
|
|
8
|
-
b: number;
|
|
9
|
-
}>;
|
|
10
|
-
type HslColor = WithAlpha<{
|
|
11
|
-
h: number;
|
|
12
|
-
s: number;
|
|
13
|
-
l: number;
|
|
14
|
-
}>;
|
|
15
|
-
type HsvColor = WithAlpha<{
|
|
16
|
-
h: number;
|
|
17
|
-
s: number;
|
|
18
|
-
v: number;
|
|
19
|
-
}>;
|
|
20
|
-
type HwbColor = WithAlpha<{
|
|
21
|
-
h: number;
|
|
22
|
-
w: number;
|
|
23
|
-
b: number;
|
|
24
|
-
}>;
|
|
25
|
-
type XyzColor = WithAlpha<{
|
|
26
|
-
x: number;
|
|
27
|
-
y: number;
|
|
28
|
-
z: number;
|
|
29
|
-
}>;
|
|
30
|
-
type LabColor = WithAlpha<{
|
|
31
|
-
l: number;
|
|
32
|
-
a: number;
|
|
33
|
-
b: number;
|
|
34
|
-
}>;
|
|
35
|
-
type LchColor = WithAlpha<{
|
|
36
|
-
l: number;
|
|
37
|
-
c: number;
|
|
38
|
-
h: number;
|
|
39
|
-
}>;
|
|
40
|
-
type CmykColor = WithAlpha<{
|
|
41
|
-
c: number;
|
|
42
|
-
m: number;
|
|
43
|
-
y: number;
|
|
44
|
-
k: number;
|
|
45
|
-
}>;
|
|
46
|
-
type OklabColor = LabColor;
|
|
47
|
-
type OklchColor = LchColor;
|
|
48
|
-
type PartialAlpha<O> = Omit<O, 'alpha'> & {
|
|
49
|
-
alpha?: number;
|
|
50
|
-
};
|
|
51
|
-
type ObjectColor = PartialAlpha<RgbColor> | PartialAlpha<HslColor> | PartialAlpha<HsvColor> | PartialAlpha<HwbColor> | PartialAlpha<XyzColor> | PartialAlpha<LabColor> | PartialAlpha<LchColor> | PartialAlpha<CmykColor> | PartialAlpha<OklabColor> | PartialAlpha<OklchColor>;
|
|
52
|
-
type AnyColor = string | ObjectColor;
|
|
53
|
-
type InputObject = Record<string, unknown>;
|
|
54
|
-
type Format = 'name' | 'hex' | 'rgb' | 'lrgb' | 'hsl' | 'hsv' | 'hwb' | 'xyz' | 'lab' | 'lch' | 'cmyk' | 'oklab' | 'oklch';
|
|
55
|
-
type Input = string | InputObject;
|
|
56
|
-
interface InputSource {
|
|
57
|
-
format: Format;
|
|
58
|
-
input: Input;
|
|
59
|
-
}
|
|
60
|
-
type ParseFunction<I extends Input> = (input: I) => RgbColor | null;
|
|
61
|
-
type Parser<I extends Input> = [ParseFunction<I>, Format];
|
|
62
|
-
type Parsers = {
|
|
63
|
-
string: Array<Parser<string>>;
|
|
64
|
-
object: Array<Parser<InputObject>>;
|
|
65
|
-
};
|
|
66
|
-
//#endregion
|
|
1
|
+
import { a as HsvColor, c as InputSource, i as HslColor, t as AnyColor, v as RgbColor } from "./types-B93dJkfp.js";
|
|
2
|
+
|
|
67
3
|
//#region src/colord.d.ts
|
|
4
|
+
|
|
68
5
|
/**
|
|
69
6
|
* Parses the given input color and creates a new `Colord` instance.
|
|
70
7
|
* See accepted input formats: https://github.com/omgovich/colord#color-parsing
|
|
@@ -174,4 +111,4 @@ declare class Colord {
|
|
|
174
111
|
isEqual(color: AnyColor | Colord): boolean;
|
|
175
112
|
}
|
|
176
113
|
//#endregion
|
|
177
|
-
export {
|
|
114
|
+
export { colord as n, Colord as t };
|
package/dist/colord.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as colord, t as Colord } from "./colord-
|
|
1
|
+
import { n as colord, t as Colord } from "./colord-DjohCNUk.js";
|
|
2
2
|
export { Colord, colord };
|
package/dist/colord.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import "./utils-
|
|
2
|
-
import "./rgb-
|
|
3
|
-
import { n as colord, t as Colord } from "./colord-
|
|
4
|
-
import "./hsv-
|
|
5
|
-
import "./manipulate-
|
|
6
|
-
import "./xyz-
|
|
7
|
-
import "./lab-
|
|
8
|
-
import "./get-
|
|
1
|
+
import "./utils-BhDL0kto.js";
|
|
2
|
+
import "./rgb-BIWjP3hJ.js";
|
|
3
|
+
import { n as colord, t as Colord } from "./colord-CiL21DdP.js";
|
|
4
|
+
import "./hsv-6f-Avk00.js";
|
|
5
|
+
import "./manipulate-DJ-cBonL.js";
|
|
6
|
+
import "./xyz-Czd8MTub.js";
|
|
7
|
+
import "./lab-DklZwOkG.js";
|
|
8
|
+
import "./get-DjkEJgax.js";
|
|
9
9
|
|
|
10
10
|
export { Colord, colord };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { a as parsers, t as Colord } from "./colord-CiL21DdP.js";
|
|
2
|
+
|
|
3
|
+
//#region src/extend.ts
|
|
4
|
+
const activePlugins = [];
|
|
5
|
+
const extend = (plugins) => {
|
|
6
|
+
plugins.forEach((plugin) => {
|
|
7
|
+
if (!activePlugins.includes(plugin)) {
|
|
8
|
+
plugin(Colord, parsers);
|
|
9
|
+
activePlugins.push(plugin);
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
//#endregion
|
|
15
|
+
export { extend as t };
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { _ as Parsers } from "./types-B93dJkfp.js";
|
|
2
|
+
import { t as Colord } from "./colord-DjohCNUk.js";
|
|
2
3
|
|
|
3
4
|
//#region src/extend.d.ts
|
|
4
5
|
type Plugin = (ColordClass: typeof Colord, parsers: Parsers) => void;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { i as isPresent, l as round, n as clampHue, t as clamp, v as ALPHA_PRECISION } from "./utils-
|
|
1
|
+
import { i as isPresent, l as round, n as clampHue, t as clamp, v as ALPHA_PRECISION } from "./utils-BhDL0kto.js";
|
|
2
2
|
|
|
3
3
|
//#region src/models/hsv.ts
|
|
4
4
|
const clampHsv = (hsv) => ({
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { a as
|
|
2
|
-
import { n as
|
|
1
|
+
import { a as HsvColor, b as XyzColor, f as OklabColor, i as HslColor, l as LabColor, o as HwbColor, p as OklchColor, r as Format, s as Input, t as AnyColor, u as LchColor, v as RgbColor } from "./types-B93dJkfp.js";
|
|
2
|
+
import { n as colord, t as Colord } from "./colord-DjohCNUk.js";
|
|
3
|
+
import { n as extend, t as Plugin } from "./extend-DmcZT4-q.js";
|
|
3
4
|
|
|
4
5
|
//#region src/shared/parse.d.ts
|
|
5
6
|
|
package/dist/index.js
CHANGED
|
@@ -1,22 +1,11 @@
|
|
|
1
|
-
import "./utils-
|
|
2
|
-
import "./rgb-
|
|
3
|
-
import {
|
|
4
|
-
import "./hsv-
|
|
5
|
-
import "./manipulate-
|
|
6
|
-
import "./xyz-
|
|
7
|
-
import "./lab-
|
|
8
|
-
import "./get-
|
|
1
|
+
import "./utils-BhDL0kto.js";
|
|
2
|
+
import "./rgb-BIWjP3hJ.js";
|
|
3
|
+
import { i as getFormat, n as colord, r as random, t as Colord } from "./colord-CiL21DdP.js";
|
|
4
|
+
import "./hsv-6f-Avk00.js";
|
|
5
|
+
import "./manipulate-DJ-cBonL.js";
|
|
6
|
+
import "./xyz-Czd8MTub.js";
|
|
7
|
+
import "./lab-DklZwOkG.js";
|
|
8
|
+
import "./get-DjkEJgax.js";
|
|
9
|
+
import { t as extend } from "./extend-Cjbo01n8.js";
|
|
9
10
|
|
|
10
|
-
//#region src/extend.ts
|
|
11
|
-
const activePlugins = [];
|
|
12
|
-
const extend = (plugins) => {
|
|
13
|
-
plugins.forEach((plugin) => {
|
|
14
|
-
if (!activePlugins.includes(plugin)) {
|
|
15
|
-
plugin(Colord, parsers);
|
|
16
|
-
activePlugins.push(plugin);
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
//#endregion
|
|
22
11
|
export { Colord, colord, extend, getFormat, random };
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { l as round, t as clamp } from "./utils-BhDL0kto.js";
|
|
2
|
+
import { a as parseLabToRgb, c as roundLab, i as parseLabStringToRgb, l as toLabStringBySource, o as rgbToLab, r as parseLabBySource, s as rgbToLabString } from "./lab-DklZwOkG.js";
|
|
3
|
+
import { r as getDeltaE2000 } from "./get-DjkEJgax.js";
|
|
4
|
+
|
|
5
|
+
//#region src/plugins/lab.ts
|
|
6
|
+
/**
|
|
7
|
+
* A plugin adding support for CIELAB color space.
|
|
8
|
+
* https://en.wikipedia.org/wiki/CIELAB_color_space
|
|
9
|
+
*/
|
|
10
|
+
const labPlugin = (ColordClass, parsers) => {
|
|
11
|
+
ColordClass.prototype.toLab = function toLab() {
|
|
12
|
+
return roundLab(parseLabBySource(this.getSource()) || rgbToLab(this.rgb));
|
|
13
|
+
};
|
|
14
|
+
ColordClass.prototype.toLabString = function toLabString() {
|
|
15
|
+
return toLabStringBySource(this.getSource()) || rgbToLabString(this.rgb);
|
|
16
|
+
};
|
|
17
|
+
ColordClass.prototype.delta = function delta(color = "#FFF") {
|
|
18
|
+
const compared = color instanceof ColordClass ? color : new ColordClass(color);
|
|
19
|
+
return clamp(round(getDeltaE2000(this.toLab(), compared.toLab()) / 100, 3));
|
|
20
|
+
};
|
|
21
|
+
parsers.string.push([parseLabStringToRgb, "lab"]);
|
|
22
|
+
parsers.object.push([parseLabToRgb, "lab"]);
|
|
23
|
+
};
|
|
24
|
+
var lab_default = labPlugin;
|
|
25
|
+
|
|
26
|
+
//#endregion
|
|
27
|
+
export { lab_default as n, labPlugin as t };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { a as mul3x3, d as M_D65_TO_D50, i as isPresent, l as round, o as parseAlpha, t as clamp, u as M_D50_TO_D65, v as ALPHA_PRECISION, y as D50 } from "./utils-
|
|
2
|
-
import { n as clampRgb } from "./rgb-
|
|
3
|
-
import { a as xyzToRgb, r as rgbToXyz } from "./xyz-
|
|
1
|
+
import { a as mul3x3, d as M_D65_TO_D50, i as isPresent, l as round, o as parseAlpha, t as clamp, u as M_D50_TO_D65, v as ALPHA_PRECISION, y as D50 } from "./utils-BhDL0kto.js";
|
|
2
|
+
import { n as clampRgb } from "./rgb-BIWjP3hJ.js";
|
|
3
|
+
import { a as xyzToRgb, r as rgbToXyz } from "./xyz-Czd8MTub.js";
|
|
4
4
|
|
|
5
5
|
//#region src/models/lab.ts
|
|
6
6
|
const EPSILON = 216 / 24389;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { i as isPresent, l as round, n as clampHue, o as parseAlpha, s as parseHue, t as clamp, v as ALPHA_PRECISION } from "./utils-
|
|
2
|
-
import { r as rgbToHsv, t as hsvToRgb } from "./hsv-
|
|
3
|
-
import { n as labToRgb, o as rgbToLab, t as clampLab } from "./lab-
|
|
1
|
+
import { i as isPresent, l as round, n as clampHue, o as parseAlpha, s as parseHue, t as clamp, v as ALPHA_PRECISION } from "./utils-BhDL0kto.js";
|
|
2
|
+
import { r as rgbToHsv, t as hsvToRgb } from "./hsv-6f-Avk00.js";
|
|
3
|
+
import { n as labToRgb, o as rgbToLab, t as clampLab } from "./lab-DklZwOkG.js";
|
|
4
4
|
|
|
5
5
|
//#region src/models/hsl.ts
|
|
6
6
|
const clampHsl = (hsl) => {
|
|
@@ -0,0 +1,186 @@
|
|
|
1
|
+
import { _ as OKLAB_M2_INV, a as mul3x3, c as parseValueToDecimal, g as OKLAB_M2, h as OKLAB_M1_INV, i as isPresent, l as round, m as OKLAB_M1, n as clampHue, o as parseAlpha, s as parseHue, t as clamp, v as ALPHA_PRECISION } from "./utils-BhDL0kto.js";
|
|
2
|
+
import { n as clampRgb, o as rgbToLinearRgb, r as linearRgbToRgb, t as clampLinearRgb } from "./rgb-BIWjP3hJ.js";
|
|
3
|
+
|
|
4
|
+
//#region src/models/oklch.ts
|
|
5
|
+
const clampOklch = (oklch) => {
|
|
6
|
+
const { l, c, h, alpha } = oklch;
|
|
7
|
+
return {
|
|
8
|
+
l: clamp(l, 0, 1),
|
|
9
|
+
c: clamp(c, 0, .37),
|
|
10
|
+
h: clampHue(h),
|
|
11
|
+
alpha: clamp(alpha)
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
const roundOklch = (oklch) => {
|
|
15
|
+
const { l, c, h, alpha } = oklch;
|
|
16
|
+
return {
|
|
17
|
+
l: round(l, 3),
|
|
18
|
+
c: round(c, 3),
|
|
19
|
+
h: round(h, 3),
|
|
20
|
+
alpha: round(alpha, ALPHA_PRECISION)
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
/**
|
|
24
|
+
* Convert OKLCH to Linear RGB without gamut mapping
|
|
25
|
+
*/
|
|
26
|
+
const oklchToLinearRgb = (oklch) => {
|
|
27
|
+
const { l, c, h, alpha } = oklch;
|
|
28
|
+
const hRad = h * Math.PI / 180;
|
|
29
|
+
const [r, g, b] = mul3x3(OKLAB_M1_INV, mul3x3(OKLAB_M2_INV, [
|
|
30
|
+
l,
|
|
31
|
+
c * Math.cos(hRad),
|
|
32
|
+
c * Math.sin(hRad)
|
|
33
|
+
]).map((v) => v * v * v));
|
|
34
|
+
return {
|
|
35
|
+
r,
|
|
36
|
+
g,
|
|
37
|
+
b,
|
|
38
|
+
alpha
|
|
39
|
+
};
|
|
40
|
+
};
|
|
41
|
+
/**
|
|
42
|
+
* Check if a linear RGB color is within sRGB gamut
|
|
43
|
+
*/
|
|
44
|
+
const isInGamut = (linearRgb, epsilon = 1e-6) => {
|
|
45
|
+
return linearRgb.r >= -epsilon && linearRgb.r <= 1 + epsilon && linearRgb.g >= -epsilon && linearRgb.g <= 1 + epsilon && linearRgb.b >= -epsilon && linearRgb.b <= 1 + epsilon;
|
|
46
|
+
};
|
|
47
|
+
/**
|
|
48
|
+
* Binary search to find maximum chroma that fits in sRGB gamut
|
|
49
|
+
* @param l - Lightness (0-1)
|
|
50
|
+
* @param h - Hue (0-360)
|
|
51
|
+
* @param alpha - Alpha (0-1)
|
|
52
|
+
* @returns Maximum chroma that fits in sRGB gamut
|
|
53
|
+
*/
|
|
54
|
+
const findGamutChroma = (l, h, alpha) => {
|
|
55
|
+
let min = 0;
|
|
56
|
+
let max = .37;
|
|
57
|
+
const epsilon = 1e-5;
|
|
58
|
+
if (isInGamut(oklchToLinearRgb({
|
|
59
|
+
l,
|
|
60
|
+
c: max,
|
|
61
|
+
h,
|
|
62
|
+
alpha
|
|
63
|
+
}), epsilon)) return max;
|
|
64
|
+
while (max - min > epsilon) {
|
|
65
|
+
const mid = (min + max) / 2;
|
|
66
|
+
if (isInGamut(oklchToLinearRgb({
|
|
67
|
+
l,
|
|
68
|
+
c: mid,
|
|
69
|
+
h,
|
|
70
|
+
alpha
|
|
71
|
+
}), epsilon)) min = mid;
|
|
72
|
+
else max = mid;
|
|
73
|
+
}
|
|
74
|
+
return min;
|
|
75
|
+
};
|
|
76
|
+
const oklchToRgb = (oklch) => {
|
|
77
|
+
const { l, h, alpha } = oklch;
|
|
78
|
+
let linearRgb = oklchToLinearRgb(oklch);
|
|
79
|
+
if (!isInGamut(linearRgb)) linearRgb = oklchToLinearRgb({
|
|
80
|
+
l,
|
|
81
|
+
c: findGamutChroma(l, h, alpha),
|
|
82
|
+
h,
|
|
83
|
+
alpha
|
|
84
|
+
});
|
|
85
|
+
linearRgb = clampLinearRgb(linearRgb);
|
|
86
|
+
return clampRgb(linearRgbToRgb(linearRgb));
|
|
87
|
+
};
|
|
88
|
+
const rgbToOklch = (rgb) => {
|
|
89
|
+
const lRgb = rgbToLinearRgb(rgb);
|
|
90
|
+
const [l, a, b] = mul3x3(OKLAB_M2, mul3x3(OKLAB_M1, [
|
|
91
|
+
lRgb.r,
|
|
92
|
+
lRgb.g,
|
|
93
|
+
lRgb.b
|
|
94
|
+
]).map((v) => Math.cbrt(v)));
|
|
95
|
+
const chroma = Math.sqrt(a * a + b * b);
|
|
96
|
+
let hue;
|
|
97
|
+
if (chroma < 1e-4) hue = 0;
|
|
98
|
+
else {
|
|
99
|
+
hue = Math.atan2(b, a) * (180 / Math.PI);
|
|
100
|
+
if (hue < 0) hue += 360;
|
|
101
|
+
}
|
|
102
|
+
return clampOklch({
|
|
103
|
+
l,
|
|
104
|
+
c: chroma,
|
|
105
|
+
h: hue,
|
|
106
|
+
alpha: rgb.alpha
|
|
107
|
+
});
|
|
108
|
+
};
|
|
109
|
+
const parseOklch = ({ l, c, h, alpha = 1 }) => {
|
|
110
|
+
if (!isPresent(l) || !isPresent(c) || !isPresent(h)) return null;
|
|
111
|
+
return clampOklch({
|
|
112
|
+
l: Number(l),
|
|
113
|
+
c: Number(c),
|
|
114
|
+
h: Number(h),
|
|
115
|
+
alpha: Number(alpha)
|
|
116
|
+
});
|
|
117
|
+
};
|
|
118
|
+
const parseOklchToRgb = (input) => {
|
|
119
|
+
const oklch = parseOklch(input);
|
|
120
|
+
if (!oklch) return null;
|
|
121
|
+
return oklchToRgb(oklch);
|
|
122
|
+
};
|
|
123
|
+
/**
|
|
124
|
+
* Parsing syntax: oklch(L c h [/ alpha])
|
|
125
|
+
* - L: <number|percentage>
|
|
126
|
+
* - c: <number>
|
|
127
|
+
* - h: <number>
|
|
128
|
+
* - alpha: <number|percentage>
|
|
129
|
+
*/
|
|
130
|
+
const oklchMatcher = /^oklch\(\s*([+-]?[\d.]+)%?\s+([+-]?[\d.]+)\s+([+-]?[\d.]+)(deg|grad|rad|turn)?(?:\s*\/\s*([+-]?[\d.]+%?))?\s*\)$/i;
|
|
131
|
+
const parseOklchString = (input) => {
|
|
132
|
+
const match = oklchMatcher.exec(input);
|
|
133
|
+
if (!match) return null;
|
|
134
|
+
const [_, l, c, h, unit, alpha] = match;
|
|
135
|
+
return clampOklch({
|
|
136
|
+
l: parseValueToDecimal(l),
|
|
137
|
+
c: Number.parseFloat(c),
|
|
138
|
+
h: parseHue(h, unit),
|
|
139
|
+
alpha: parseAlpha(alpha)
|
|
140
|
+
});
|
|
141
|
+
};
|
|
142
|
+
const parseOklchStringToRgb = (input) => {
|
|
143
|
+
const oklch = parseOklchString(input);
|
|
144
|
+
if (!oklch) return null;
|
|
145
|
+
return oklchToRgb(oklch);
|
|
146
|
+
};
|
|
147
|
+
const toOklchString = (oklch) => {
|
|
148
|
+
const { l, c, h, alpha } = roundOklch(oklch);
|
|
149
|
+
return alpha < 1 ? `oklch(${l} ${c} ${h} / ${alpha})` : `oklch(${l} ${c} ${h})`;
|
|
150
|
+
};
|
|
151
|
+
const rgbToOklchString = (rgb) => {
|
|
152
|
+
return toOklchString(rgbToOklch(rgb));
|
|
153
|
+
};
|
|
154
|
+
const parseOklchBySource = (source) => {
|
|
155
|
+
if (!source || source.format !== "oklch") return null;
|
|
156
|
+
const { input } = source;
|
|
157
|
+
if (typeof input === "string") return parseOklchString(input);
|
|
158
|
+
if (typeof input === "object") return parseOklch(input);
|
|
159
|
+
return null;
|
|
160
|
+
};
|
|
161
|
+
const toOklchStringBySource = (source) => {
|
|
162
|
+
const oklch = parseOklchBySource(source);
|
|
163
|
+
if (!oklch) return null;
|
|
164
|
+
return toOklchString(oklch);
|
|
165
|
+
};
|
|
166
|
+
|
|
167
|
+
//#endregion
|
|
168
|
+
//#region src/plugins/oklch.ts
|
|
169
|
+
/**
|
|
170
|
+
* A plugin adding support for OKLCH colorspace.
|
|
171
|
+
* https://bottosson.github.io/posts/oklab/
|
|
172
|
+
*/
|
|
173
|
+
const oklchPlugin = (ColordClass, parsers) => {
|
|
174
|
+
ColordClass.prototype.toOklch = function toOklch() {
|
|
175
|
+
return roundOklch(parseOklchBySource(this.getSource()) || rgbToOklch(this.rgb));
|
|
176
|
+
};
|
|
177
|
+
ColordClass.prototype.toOklchString = function toOklchString$1() {
|
|
178
|
+
return toOklchStringBySource(this.getSource()) || rgbToOklchString(this.rgb);
|
|
179
|
+
};
|
|
180
|
+
parsers.string.push([parseOklchStringToRgb, "oklch"]);
|
|
181
|
+
parsers.object.push([parseOklchToRgb, "oklch"]);
|
|
182
|
+
};
|
|
183
|
+
var oklch_default = oklchPlugin;
|
|
184
|
+
|
|
185
|
+
//#endregion
|
|
186
|
+
export { oklch_default as n, oklchPlugin as t };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { d as NearestPalette, g as PaletteColorLevel, h as OutputFormat, m as OutputColorMap, t as AnyColor, y as TailwindPaletteColor } from "../types-B93dJkfp.js";
|
|
2
|
+
|
|
3
|
+
//#region src/palette/constant.d.ts
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* TailwindCSS v4 official oklch palette data
|
|
7
|
+
*
|
|
8
|
+
* the format is `oklch` string
|
|
9
|
+
*/
|
|
10
|
+
declare const tailwindPalette: TailwindPaletteColor;
|
|
11
|
+
//#endregion
|
|
12
|
+
//#region src/palette/generate.d.ts
|
|
13
|
+
/**
|
|
14
|
+
* generate the palette
|
|
15
|
+
* @param input - the base color
|
|
16
|
+
* @param [format] - the format of the output color, default is 'oklch'
|
|
17
|
+
* @returns the palette
|
|
18
|
+
*/
|
|
19
|
+
declare function generatePalette<F extends OutputFormat>(input: AnyColor, format?: F): Record<PaletteColorLevel, OutputColorMap[F]>;
|
|
20
|
+
//#endregion
|
|
21
|
+
//#region src/palette/nearest.d.ts
|
|
22
|
+
/**
|
|
23
|
+
* find the nearest palette color
|
|
24
|
+
* @param input - the input color
|
|
25
|
+
* @param format - the format of the output color
|
|
26
|
+
* @returns the nearest palette color
|
|
27
|
+
*/
|
|
28
|
+
declare function generateNearestPalette<F extends OutputFormat>(input: AnyColor, format?: F): NearestPalette<F>;
|
|
29
|
+
//#endregion
|
|
30
|
+
export { generateNearestPalette, generatePalette, tailwindPalette };
|