@wordpress/components
Version:
UI components for WordPress.
59 lines (58 loc) • 2.07 kB
JavaScript
import { colord, extend } from "colord";
import namesPlugin from "colord/plugins/names";
import a11yPlugin from "colord/plugins/a11y";
import { __ } from "@wordpress/i18n";
extend([namesPlugin, a11yPlugin]);
const isSimpleCSSColor = (value) => {
const valueIsCssVariable = /var\(/.test(value !== null && value !== void 0 ? value : "");
const valueIsColorMix = /color-mix\(/.test(value !== null && value !== void 0 ? value : "");
return !valueIsCssVariable && !valueIsColorMix;
};
const extractColorNameFromCurrentValue = (currentValue, colors = [], showMultiplePalettes = false) => {
if (!currentValue) {
return "";
}
const currentValueIsSimpleColor = currentValue ? isSimpleCSSColor(currentValue) : false;
const normalizedCurrentValue = currentValueIsSimpleColor ? colord(currentValue).toHex() : currentValue;
const colorPalettes = showMultiplePalettes ? colors : [{
colors
}];
for (const {
colors: paletteColors
} of colorPalettes) {
for (const {
name: colorName,
color: colorValue
} of paletteColors) {
const normalizedColorValue = currentValueIsSimpleColor ? colord(colorValue).toHex() : colorValue;
if (normalizedCurrentValue === normalizedColorValue) {
return colorName;
}
}
}
return __("Custom");
};
const isMultiplePaletteObject = (obj) => Array.isArray(obj.colors) && !("color" in obj);
const isMultiplePaletteArray = (arr) => {
return arr.length > 0 && arr.every((colorObj) => isMultiplePaletteObject(colorObj));
};
const normalizeColorValue = (value, element) => {
if (!value || !element || isSimpleCSSColor(value)) {
return value;
}
const {
ownerDocument
} = element;
const {
defaultView
} = ownerDocument;
const computedBackgroundColor = defaultView?.getComputedStyle(element).backgroundColor;
return computedBackgroundColor ? colord(computedBackgroundColor).toHex() : value;
};
export {
extractColorNameFromCurrentValue,
isMultiplePaletteArray,
isMultiplePaletteObject,
normalizeColorValue
};
//# sourceMappingURL=utils.js.map