@a_ng_d/utils-ui-color-palette
Version:
Core utilities library for UI Color Palette - a color management plugin for design tools. This library provides the foundational color manipulation, contrast calculation, and palette generation features used in the plugin.
284 lines (283 loc) • 10.7 kB
JavaScript
var v = Object.defineProperty;
var E = (m, a, h) => a in m ? v(m, a, { enumerable: !0, configurable: !0, writable: !0, value: h }) : m[a] = h;
var d = (m, a, h) => E(m, typeof a != "symbol" ? a + "" : a, h);
import { C as S, H as f } from "../../color-1CXTuV84.js";
import { c as t } from "../../index-Beb8qoyd.js";
class A {
constructor({
base: a,
themes: h,
meta: r
}) {
d(this, "base");
d(this, "themes");
d(this, "meta");
d(this, "paletteData");
d(this, "currentScale");
d(this, "makePaletteData", () => (this.themes.forEach((a) => {
const h = {
id: a.id,
name: a.name,
description: a.description,
colors: [],
type: a.type
};
this.base.colors.forEach((r) => {
const g = Object.entries(a.scale).reverse().map((e) => {
if (r.alpha.isEnabled) {
const s = new S({
render: "RGB",
sourceColor: [
r.rgb.r * 255,
r.rgb.g * 255,
r.rgb.b * 255
],
alpha: parseFloat((e[1] / 100).toFixed(2)),
hueShifting: r.hue.shift !== void 0 ? r.hue.shift : 0,
chromaShifting: r.chroma.shift !== void 0 ? r.chroma.shift : 100,
algorithmVersion: this.base.algorithmVersion,
visionSimulationMode: a.visionSimulationMode
}), b = new S({
render: "RGB",
sourceColor: t(r.alpha.backgroundColor).rgb(),
algorithmVersion: this.base.algorithmVersion,
visionSimulationMode: a.visionSimulationMode
});
switch (this.base.colorSpace) {
case "LCH":
return this.base.areSourceColorsLocked ? [
e,
s.setColorWithAlpha(),
b.setColorWithAlpha()
] : [
e,
s.lcha(),
b.lcha()
];
case "OKLCH":
return this.base.areSourceColorsLocked ? [
e,
s.setColorWithAlpha(),
b.setColorWithAlpha()
] : [
e,
s.oklcha(),
b.oklcha()
];
case "LAB":
return this.base.areSourceColorsLocked ? [
e,
s.setColorWithAlpha(),
b.setColorWithAlpha()
] : [
e,
s.laba(),
b.laba()
];
case "OKLAB":
return this.base.areSourceColorsLocked ? [
e,
s.setColorWithAlpha(),
b.setColorWithAlpha()
] : [
e,
s.oklaba(),
b.oklaba()
];
case "HSL":
return this.base.areSourceColorsLocked ? [
e,
s.setColorWithAlpha(),
b.setColorWithAlpha()
] : [
e,
s.hsla(),
b.hsla()
];
case "HSLUV":
return this.base.areSourceColorsLocked ? [
e,
s.setColorWithAlpha(),
b.setColorWithAlpha()
] : [
e,
s.hsluva(),
b.hsluva()
];
default:
return [e, [0, 0, 0], [255, 255, 255]];
}
} else {
const s = new S({
render: "RGB",
sourceColor: [
r.rgb.r * 255,
r.rgb.g * 255,
r.rgb.b * 255
],
lightness: e[1],
hueShifting: r.hue.shift !== void 0 ? r.hue.shift : 0,
chromaShifting: r.chroma.shift !== void 0 ? r.chroma.shift : 100,
algorithmVersion: this.base.algorithmVersion,
visionSimulationMode: a.visionSimulationMode
});
switch (this.base.colorSpace) {
case "LCH":
return [e, s.lch()];
case "OKLCH":
return [e, s.oklch()];
case "LAB":
return [e, s.lab()];
case "OKLAB":
return [e, s.oklab()];
case "HSL":
return [e, s.hsl()];
case "HSLUV":
return [e, s.hsluv()];
default:
return [e, [0, 0, 0]];
}
}
}), u = {
id: r.id,
name: r.name,
description: r.description,
shades: [],
type: "color"
}, i = [
r.rgb.r * 255,
r.rgb.g * 255,
r.rgb.b * 255
], c = new f();
c.rgb_r = r.rgb.r, c.rgb_g = r.rgb.g, c.rgb_b = r.rgb.b, c.rgbToHsluv(), u.shades.push({
name: "source",
description: "Source color",
hex: t(i).hex(),
rgb: i,
gl: t(i).gl(),
lch: t(i).lch(),
oklch: t(i).oklch(),
lab: t(i).lab(),
oklab: t(i).oklab(),
hsl: t(i).hsl(),
hsluv: [
c.hsluv_h,
c.hsluv_s,
c.hsluv_l
],
type: "source color"
});
const k = g.map(
(e) => t.distance(
t(i).hex(),
t(e[1]).hex(),
"rgb"
)
), l = k.indexOf(Math.min(...k));
g.forEach((e, s) => {
const b = t.distance(
t(i).hex(),
t(e[1]).hex(),
"rgb"
), L = Object.keys(this.currentScale).find(
(p) => p === e[0][0]
) ?? "0", o = new f(), C = new S({
render: "RGB",
sourceColor: t(i).rgb(),
visionSimulationMode: a.visionSimulationMode
}).setColor(), n = new S({
render: "HEX",
sourceColor: t(i).rgb(),
visionSimulationMode: a.visionSimulationMode
}).setColor();
s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? (o.rgb_r = Number(C[0]) / 255, o.rgb_g = Number(C[1]) / 255, o.rgb_b = Number(C[2]) / 255) : (o.rgb_r = Number(e[1][0]) / 255, o.rgb_g = Number(e[1][1]) / 255, o.rgb_b = Number(e[1][2]) / 255), o.rgbToHsluv(), u.shades.push({
name: L,
description: `Shade/Tint color with ${typeof e[0][1] == "number" ? e[0][1].toFixed(1) : e[0][1]}% of ${r.alpha.isEnabled ? "opacity" : "lightness"}`,
hex: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).hex() : t(e[1]).hex(),
rgb: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).rgb() : t(e[1]).rgb(),
gl: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).gl() : t(e[1]).gl(),
lch: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).lch() : t(e[1]).lch(),
oklch: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).oklch() : t(e[1]).oklch(),
lab: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).lab() : t(e[1]).lab(),
oklab: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).oklab() : t(e[1]).oklab(),
hsl: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled ? t(n).hsl() : t(e[1]).hsl(),
hsluv: [o.hsluv_h, o.hsluv_s, o.hsluv_l],
alpha: r.alpha.isEnabled ? parseFloat((e[0][1] / 100).toFixed(2)) : void 0,
backgroundColor: r.alpha.isEnabled && r.alpha.backgroundColor ? t(e[2]).rgb() : void 0,
mixedColor: r.alpha.isEnabled && r.alpha.backgroundColor ? new S({
visionSimulationMode: a.visionSimulationMode
}).mixColorsRgb(
[
...e[1],
parseFloat(
(e[0][1] / 100).toFixed(2)
)
],
[...e[2], 1]
) : void 0,
isClosestToRef: b < 4 && !this.base.areSourceColorsLocked,
isSourceColorLocked: s === l && this.base.areSourceColorsLocked && !r.alpha.isEnabled,
isTransparent: r.alpha.isEnabled,
type: "color shade/tint"
});
}), h.colors.push(u);
}), this.paletteData.themes.push(h);
}), this.paletteData));
d(this, "makeLibraryData", (a, h) => {
const r = this.makePaletteData();
return r.themes.flatMap(
(u) => u.colors.flatMap(
(i) => i.shades.flatMap((c) => {
const k = `${u.id}:${i.id}:${c.name}`, l = h == null ? void 0 : h.find(
(e) => e.id === k
);
return {
id: k,
paletteName: r.name,
themeName: u.name,
colorName: i.name,
shadeName: c.name,
...(a == null ? void 0 : a.includes("alpha")) && { alpha: c.alpha ?? 1 },
...(a == null ? void 0 : a.includes("hex")) && { hex: c.hex },
...(a == null ? void 0 : a.includes("gl")) && { gl: c.gl },
...(a == null ? void 0 : a.includes("description")) && {
description: i.description
},
...(a == null ? void 0 : a.includes("collection_id")) && {
collectionId: l == null ? void 0 : l.collectionId
},
...(a == null ? void 0 : a.includes("mode_id")) && {
modeId: l == null ? void 0 : l.modeId
},
...(a == null ? void 0 : a.includes("variable_id")) && {
variableId: l == null ? void 0 : l.variableId
},
...(a == null ? void 0 : a.includes("style_id")) && {
styleId: l == null ? void 0 : l.styleId
}
};
})
)
);
});
d(this, "makePaletteFullData", () => ({
base: this.base,
themes: this.themes,
libraryData: this.makeLibraryData(),
meta: this.meta,
version: "2025.06",
type: "UI_COLOR_PALETTE"
}));
var g;
this.base = a, this.themes = h, this.meta = r, this.paletteData = {
name: a.name ?? "UI Color Palette",
description: a.description,
themes: [],
type: "palette"
}, this.currentScale = ((g = h.find((u) => u.isEnabled)) == null ? void 0 : g.scale) ?? {};
}
}
export {
A as default
};
//# sourceMappingURL=data.js.map