style/src/Utils/index.ts
2021-06-23 20:23:43 +02:00

48 lines
1.3 KiB
TypeScript

import { fromString } from "css-color-converter";
const countDecimals = (value) => {
if (Math.floor(value) === value) return 0;
return value.toString().split(".")[1].length || 0;
};
const generateColorShades = (
colors: { [key: string]: string },
options: {
keyList?: string[];
opacities?: number[];
outputType: "obj" | "cssVars";
}
) => {
const colorKeys = options.keyList
? Object.keys(colors)
: Object.keys(colors).filter((key) => options.keyList?.includes(key));
const generatedColorShadesArr: object[] = [];
colorKeys.forEach((key) => {
const colorString = colors[key];
const opacities = options.opacities
? options.opacities
: [0.1, 0.25, 0.5, 0.75];
opacities.forEach((opacity) => {
const rgba = fromString(colorString).toRgbaArray();
generatedColorShadesArr.push({
[countDecimals(opacity) === 1
? `${key}-${(opacity + "").split(".")[1]}0`
: `${key}-${
(opacity + "").split(".")[1]
}`]: `rgba(${rgba[0]},${rgba[1]},${rgba[2]},${opacity})`,
});
});
});
const generatedColorShades = Object.assign({}, generatedColorShadesArr);
return generatedColorShades;
};
export { generateColorShades };
export default { generateColorShades };