@public-ui/components/dist/components/color.js

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

/*!
 * KoliBri - The accessible HTML-Standard
 */
import { L as Log, q as a11yHint, a as watchValidator } from './prop.validators.js';
import { c as createContrastColorPair } from './contrast.js';

const HEX_REGEX = /^#((\d|[a-f]){8}|(\d|[a-f]){6}|(\d|[a-f]){3,4})$/i;
function isHexString(value) {
    return HEX_REGEX.test(value);
}
function isColorObjectString(value) {
    if (value.startsWith('{')) {
        try {
            const parsed = JSON.parse(value);
            if (isValidColorPair(parsed))
                return { type: 'ColorPair', value: parsed };
        }
        catch (_a) {
            return { type: null, value: null };
        }
    }
    return { type: null, value: null };
}
function typeOfColor(value) {
    if (value) {
        if (typeof value === 'string') {
            if (isHexString(value))
                return { type: 'string', valid: true, value: value };
            else {
                const colorObject = isColorObjectString(value);
                if (colorObject.value)
                    return { type: colorObject.type, valid: true, value: colorObject.value };
            }
        }
        else {
            const asColorPair = value;
            if (isValidColorPair(asColorPair))
                return { type: 'ColorPair', valid: true, value: asColorPair };
        }
    }
    return { type: null, valid: false, value: '' };
}
function isValidColorPair(value) {
    return !!(typeof value === 'object' && value && typeof value.backgroundColor === 'string' && typeof value.foregroundColor === 'string');
}
function validatorFunction(value) {
    const valueType = typeOfColor(value);
    switch (valueType.type) {
        case null:
            return false;
        case 'string':
        case 'ColorPair':
            return valueType.valid;
    }
}
const validateColor = (component, value, options) => {
    watchValidator(component, '_color', validatorFunction, new Set(['rgb in hex', 'ColorPair']), value, options);
};
const handleColorChange = (value) => {
    let colorContrast;
    const valueType = typeOfColor(value);
    switch (valueType.type) {
        case 'string':
            colorContrast = createContrastColorPair(valueType.value);
            break;
        case 'ColorPair': {
            const asColorPair = valueType.value;
            let foreground = '';
            if (typeof asColorPair.foregroundColor === 'string')
                foreground = asColorPair.foregroundColor;
            if (!foreground || typeof foreground !== 'string')
                foreground = '#fff';
            colorContrast = createContrastColorPair({
                background: asColorPair.backgroundColor,
                foreground,
            });
            break;
        }
        case null:
            Log.warn(`_color was empty or invalid (${JSON.stringify(value)})`);
            colorContrast = createContrastColorPair({
                background: '#000',
                foreground: '#000',
            });
    }
    if (colorContrast.contrast < 7) {
        a11yHint(`[KolBadge] The contrast of ${colorContrast.contrast} (≥7, AAA) is to low, between the color pair ${colorContrast.background} and ${colorContrast.foreground}.`);
    }
    return {
        backgroundColor: colorContrast.background,
        foregroundColor: colorContrast.foreground,
    };
};

export { handleColorChange as h, validateColor as v };
//# sourceMappingURL=color.js.map

//# sourceMappingURL=color.js.map