UNPKG

@public-ui/components

Version:

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

97 lines (84 loc) 3.45 kB
/*! * KoliBri - The accessible HTML-Standard */ import { l as parse, m as hsl, r as rgb, n as rgba$1, q as s } from './common-Cx_AGO_M.js'; /** @module color-rgba */ function rgba (color) { // template literals if (Array.isArray(color) && color.raw) color = String.raw(...arguments); var values; //attempt to parse non-array arguments var parsed = parse(color); if (!parsed.space) return [] const min = parsed.space[0] === 'h' ? hsl.min : rgb.min; const max = parsed.space[0] === 'h' ? hsl.max : rgb.max; values = Array(3); values[0] = Math.min(Math.max(parsed.values[0], min[0]), max[0]); values[1] = Math.min(Math.max(parsed.values[1], min[1]), max[1]); values[2] = Math.min(Math.max(parsed.values[2], min[2]), max[2]); if (parsed.space[0] === 'h') { values = hsl.rgb(values); } values.push(Math.min(Math.max(parsed.alpha, 0), 1)); return values } const getContrastYIQ = (r, g, b) => { const yiq = (r * 299 + g * 587 + b * 114) / 1000; return yiq >= 128 ? -1 : 1; }; const calcColorContrast = (baseColor, contrastColor, ratio, dir = 1) => { const color = [ Math.max(Math.min(Math.round(contrastColor[0] + dir * Math.max(1, contrastColor[0] / 100)), 255), 0), Math.max(Math.min(Math.round(contrastColor[1] + dir * Math.max(1, contrastColor[1] / 100)), 255), 0), Math.max(Math.min(Math.round(contrastColor[2] + dir * Math.max(1, contrastColor[2] / 100)), 255), 0), ]; const contrast = s(rgba$1.hex(`rgba(${baseColor.join(',')},1)`), rgba$1.hex(`rgba(${color.join(',')},1)`)); const summe = color[0] + color[1] + color[2]; if (summe === 0 || summe === 765 || contrast > ratio) { return { background: baseColor, foreground: color, contrast, }; } else { return calcColorContrast(baseColor, color, ratio, dir); } }; const cache = new Map(); const getColorContrast = (baseColor, contrastColor, ratio, dir = 1) => { if (cache.has(baseColor)) { return cache.get(baseColor); } const color = calcColorContrast(baseColor, contrastColor, ratio, dir); cache.set(baseColor, color); return color; }; const createContrastColorPair = (color, contrastRatio = 7) => { let baseColor = [0, 0, 0, 1]; let contrastColor = [255, 255, 255, 1]; if (typeof color === 'string') { baseColor = rgba(color); contrastColor = baseColor; } else if (typeof color === 'object' && color !== null && typeof color.background === 'string' && typeof color.foreground === 'string') { baseColor = rgba(color.background); if (typeof color.foreground === 'string') { contrastColor = rgba(color.foreground); } else { contrastColor = baseColor; } } const yiq = getContrastYIQ(baseColor[0], baseColor[1], baseColor[2]); const colorContrast = getColorContrast([baseColor[0], baseColor[1], baseColor[2]], [contrastColor[0], contrastColor[1], contrastColor[2]], contrastRatio, yiq); contrastColor = [...colorContrast.foreground, 1]; return { background: rgba$1.hex(`rgba(${baseColor.join(',')})`), foreground: rgba$1.hex(`rgba(${contrastColor.join(',')})`), contrast: colorContrast.contrast, }; }; export { createContrastColorPair as c, rgba as r }; //# sourceMappingURL=contrast-DlURrMX4.js.map //# sourceMappingURL=contrast-DlURrMX4.js.map