vuestic-ui
Version:
Vue 3 UI Framework
106 lines (105 loc) • 3.61 kB
JavaScript
import { c as camelCaseToKebabCase, k as kebabCaseToCamelCase } from "../../utils/text-case.js";
import { p as parseColorToRGB, r as rgbToString, h as hslToString, s as shiftHSLA, a as parseColorToHSL, b as setHSLA, c as colorToString } from "../../utils/color.js";
const isCSSVariable = (strColor) => /var\(--.+\)/.test(strColor);
const cssVariableName = (colorName) => `--va-${camelCaseToKebabCase(colorName)}`;
const normalizeColorName = (colorName) => kebabCaseToCamelCase(colorName);
const colorToRgba = (color, opacity) => {
const { r, g, b } = parseColorToRGB(color);
return rgbToString({ r, g, b, a: opacity });
};
const getColorLightness = (color) => {
const { r, g, b } = parseColorToRGB(color);
return Math.sqrt(r * r * 0.241 + g * g * 0.691 + b * b * 0.068);
};
const getBoxShadowColor = (color, opacity = 0.4) => {
return colorToRgba(color, opacity);
};
const getBoxShadowColorFromBg = (background, opacity = 0.4) => {
return colorToRgba(background, opacity);
};
const getHoverColor = (color, opacity = 0.2) => {
return colorToRgba(color, opacity);
};
const getFocusColor = (color, opacity = 0.3) => {
return colorToRgba(color, opacity);
};
const shiftHSLAColor = (color, shift) => {
return hslToString(shiftHSLA(parseColorToHSL(color), shift));
};
const setHSLAColor = (color, shift) => {
return hslToString(setHSLA(parseColorToHSL(color), shift));
};
const shiftGradientColor = (color) => {
const newColor = parseColorToHSL(color);
if (newColor.s < 10) {
return shiftHSLAColor(newColor, { h: 2, s: 5, l: 10 });
}
if (newColor.s < 30) {
return shiftHSLAColor(newColor, { s: -14, l: 11 });
}
if (newColor.h >= 0 && newColor.h < 44 || newColor.h >= 285) {
return shiftHSLAColor(newColor, { h: 11, s: 27, l: 8 });
}
if (newColor.h >= 44 && newColor.h < 85) {
return shiftHSLAColor(newColor, { h: 3, l: 9 });
}
if (newColor.h >= 85 && newColor.h < 165) {
return shiftHSLAColor(newColor, { h: 16, l: 14 });
}
if (newColor.h >= 165 && newColor.h < 285) {
return shiftHSLAColor(newColor, { h: -15, s: 3, l: 2 });
}
throw new Error("This method should handle all colors. But it didn't for some reason.");
};
const getGradientBackground = (color) => {
const colorLeft = shiftGradientColor(color);
return `linear-gradient(to right, ${colorLeft}, ${colorToString(color)})`;
};
const getStateMaskGradientBackground = (color, maskColor, maskOpacity) => {
const mask = colorToRgba(maskColor, maskOpacity);
return `linear-gradient(0deg, ${mask}, ${mask}), ${color}`;
};
const applyColors = (color1, color2) => {
const c1 = parseColorToRGB(color1);
const c2 = parseColorToRGB(color2);
const weight = c2.a;
if (weight === 1) {
return rgbToString(c2);
}
if (weight === 0) {
return rgbToString(c1);
}
return rgbToString({
r: Math.round(c1.r * (1 - weight) + c2.r * weight),
g: Math.round(c1.g * (1 - weight) + c2.g * weight),
b: Math.round(c1.b * (1 - weight) + c2.b * weight),
a: c1.a
});
};
const isColorTransparent = (color) => {
if (!color) {
return false;
}
if (color === "transparent") {
return true;
}
return parseColorToRGB(color).a <= 0.1;
};
export {
getBoxShadowColor as a,
getFocusColor as b,
getHoverColor as c,
colorToRgba as d,
applyColors as e,
getBoxShadowColorFromBg as f,
getGradientBackground as g,
setHSLAColor as h,
getStateMaskGradientBackground as i,
cssVariableName as j,
isCSSVariable as k,
getColorLightness as l,
isColorTransparent as m,
normalizeColorName as n,
shiftHSLAColor as s
};
//# sourceMappingURL=utils.js.map