UNPKG

@public-ui/components

Version:

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

4 lines 3.3 kB
/*! * KoliBri - The accessible HTML-Standard */ import{r as rgba,m as rgba$1,q as s,L as Log,t as a11yHint,w as watchValidator}from"./common-7RW_NFNf.js";const getContrastYIQ=(r,o,t)=>(299*r+587*o+114*t)/1e3>=128?-1:1,calcColorContrast=(r,o,t,a=1)=>{const n=[Math.max(Math.min(Math.round(o[0]+a*Math.max(1,o[0]/100)),255),0),Math.max(Math.min(Math.round(o[1]+a*Math.max(1,o[1]/100)),255),0),Math.max(Math.min(Math.round(o[2]+a*Math.max(1,o[2]/100)),255),0)],e=s(rgba$1.hex(`rgba(${r.join(",")},1)`),rgba$1.hex(`rgba(${n.join(",")},1)`)),l=n[0]+n[1]+n[2];return 0===l||765===l||e>t?{background:r,foreground:n,contrast:e}:calcColorContrast(r,n,t,a)},cache=new Map,getColorContrast=(r,o,t,a=1)=>{if(cache.has(r))return cache.get(r);const n=calcColorContrast(r,o,t,a);return cache.set(r,n),n},createContrastColorPair=(r,o=7)=>{let t=[0,0,0,1],a=[255,255,255,1];"string"==typeof r?(t=rgba(r),a=t):"object"==typeof r&&null!==r&&"string"==typeof r.background&&"string"==typeof r.foreground&&(t=rgba(r.background),a="string"==typeof r.foreground?rgba(r.foreground):t);const n=getContrastYIQ(t[0],t[1],t[2]),e=getColorContrast([t[0],t[1],t[2]],[a[0],a[1],a[2]],o,n);return a=[...e.foreground,1],{background:rgba$1.hex(`rgba(${t.join(",")})`),foreground:rgba$1.hex(`rgba(${a.join(",")})`),contrast:e.contrast}},HEX_REGEX=/^#((\d|[a-f]){8}|(\d|[a-f]){6}|(\d|[a-f]){3,4})$/i;function isHexString(r){return HEX_REGEX.test(r)}function isColorObjectString(r){if(r.startsWith("{"))try{const o=JSON.parse(r);if(isValidColorPair(o))return{type:"ColorPair",value:o}}catch(r){return{type:null,value:null}}return{type:null,value:null}}function typeOfColor(r){if(r)if("string"==typeof r){if(isHexString(r))return{type:"string",valid:!0,value:r};{const o=isColorObjectString(r);if(o.value)return{type:o.type,valid:!0,value:o.value}}}else{const o=r;if(isValidColorPair(o))return{type:"ColorPair",valid:!0,value:o}}return{type:null,valid:!1,value:""}}function isValidColorPair(r){return!("object"!=typeof r||!r||"string"!=typeof r.backgroundColor||!("string"==typeof r.foregroundColor||r.foregroundColor&&"string"==typeof r.foregroundColor.primary&&"string"==typeof r.foregroundColor.secondary&&"string"==typeof r.foregroundColor.neutral))}function validatorFunction(r){const o=typeOfColor(r);switch(o.type){case null:return!1;case"string":case"ColorPair":return o.valid}}const validateColor=(r,o,t)=>{watchValidator(r,"_color",validatorFunction,new Set(["rgb in hex","ColorPair"]),o,t)},handleColorChange=r=>{var o;let t;const a=typeOfColor(r);switch(a.type){case"string":t=createContrastColorPair(a.value);break;case"ColorPair":{const r=a.value;let n="";"string"==typeof r.foregroundColor?n=r.foregroundColor:(null===(o=r.foregroundColor)||void 0===o?void 0:o.primary)&&(n=r.foregroundColor.primary),n&&"string"==typeof n||(n="#fff"),t=createContrastColorPair({background:r.backgroundColor,foreground:n});break}case null:Log.warn(`_color was empty or invalid (${JSON.stringify(r)})`),t=createContrastColorPair({background:"#000",foreground:"#000"})}return t.contrast<7&&a11yHint(`[KolBadge] The contrast of ${t.contrast} (≥7, AAA) is to low, between the color pair ${t.background} and ${t.foreground}.`),{backgroundColor:t.background,foregroundColor:t.foreground}};export{handleColorChange as h,validateColor as v};