jb-core
Version:
jb design system core modules
2 lines • 4.15 kB
JavaScript
;var e=class{get value(){return`oklch(${this.lightness} ${this.chroma} ${this.hue})`}constructor(e,t){this.variableName=t,this.lightness=e.lightness,this.chroma=e.chroma,this.hue=e.hue}};function t(t){return new e({lightness:6*(3+1.3*t)*.01,chroma:.001*(14+.09*t),hue:258.36},`--jb-neutral-${t}`)}function r(t){return new e({lightness:t.lightness+.07,chroma:t.chroma+.07,hue:t.hue},`${t.variableName}-hover`)}function n(t){return new e({lightness:t.lightness-.1,chroma:t.chroma-.05,hue:t.hue},`${t.variableName}-pressed`)}function s(t){const r=Math.min(t.lightness+.12*(1-t.lightness),.985),n=t.chroma*(1-.15*(r-t.lightness));return new e({lightness:r,chroma:Number(n.toFixed(3)),hue:t.hue},`${t.variableName}-l`)}function a(t){const r=Math.max(t.lightness-.12*t.lightness,.02),n=t.chroma*(1-.15*(r-t.lightness));return new e({lightness:r,chroma:n,hue:t.hue},`${t.variableName}-d`)}function i(t){const r=Math.min(t.lightness+.65*(1-t.lightness),.93),n=.55*t.chroma*(1-.08*(r-t.lightness)),s=t.hue>=70&&t.hue<=162?5:-3,a=t.hue+s;return new e({lightness:r,chroma:Number(n.toFixed(3)),hue:a},`${t.variableName}-subtle`)}function o(t){const r=Math.max(t.lightness-.35,.22),n=Math.min(1.6*t.chroma,.28);return new e({lightness:Number(r.toFixed(3)),chroma:Number(n.toFixed(3)),hue:t.hue},`${t.variableName}-contrast`)}function l(e){return{main:e,hover:r(e),pressed:n(e),light:s(e),dark:a(e),subtle:i(e),contrast:o(e)}}const h=new e({lightness:.6,chroma:.26,hue:256},"--jb-primary"),u=new e({lightness:.6,chroma:.26,hue:286},"--jb-secondary"),c=new e({lightness:.75,chroma:.18,hue:70},"--jb-yellow"),m=new e({lightness:.68,chroma:.1484,hue:162.1},"--jb-green"),g=new e({lightness:.6,chroma:.22,hue:23.21},"--jb-red"),b={single:{black:new e({lightness:.14,chroma:0,hue:0},"--jb-black"),white:new e({lightness:1,chroma:0,hue:0},"--jb-white"),highlight:new e({lightness:.93,chroma:.2302,hue:125.18},"--jb-highlight")},neutral:[t(0),t(1),t(2),t(3),t(4),t(5),t(6),t(7),t(8),t(9),t(10)],primary:l(h),secondary:l(u),yellow:l(c),green:l(m),red:l(g)};function p(e){try{const{value:t,...r}=e;window.CSS.registerProperty({...r}),d(e.name,t)}catch(e){}}function d(e,t){try{t&&(document.documentElement.style.getPropertyValue(e)||document.documentElement.style.setProperty(e,t))}catch(e){}}function x(e,t){p({name:t??e.variableName,syntax:"<color>",inherits:!0,initialValue:e.value})}function y(){var e;!function(e){x(e.neutral[0],"--jb-neutral"),x(e.primary.main),x(e.secondary.main),x(e.single.black),x(e.single.white),x(e.single.highlight),x(e.yellow.main),x(e.green.main),x(e.red.main),x(e.red.main);for(let t=1;t<=10;t++)x(e.neutral[t])}(b),x((e=b).single.black,"--jb-text-primary"),x(e.neutral[7],"--jb-text-secondary"),x(e.single.white,"--jb-text-contrast")}function w(){p({name:"--jb-radius",inherits:!0,value:"1rem",initialValue:"16px",syntax:"<length-percentage>"}),p({name:"--jb-radius-xs",inherits:!0,value:"0.5rem",initialValue:"8px",syntax:"<length-percentage>"}),p({name:"--jb-radius-sm",inherits:!0,value:"0.75rem",initialValue:"12px",syntax:"<length-percentage>"}),p({name:"--jb-radius-lg",inherits:!0,value:"1.25rem",initialValue:"20px",syntax:"<length-percentage>"}),p({name:"--jb-radius-xl",inherits:!0,value:"1.5rem",initialValue:"24px",syntax:"<length-percentage>"})}exports.createColorGroup=l,exports.createThemeColor=function(t){const r={};return Object.keys(t).forEach((n=>{const s=l(new e(t[n],`---jb-${n}`));r[n]=s})),r},exports.defaultColors=b,exports.defineColors=y,exports.defineSizes=w,exports.getContrastColor=o,exports.getDarkerColor=a,exports.getHoverColor=r,exports.getLighterColor=s,exports.getNeutralColor=t,exports.getPressedColor=n,exports.getSubtleColor=i,exports.registerCssProperty=p,exports.registerDefaultVariables=function(){w(),y()},exports.setColors=function(e){function t(e){document.documentElement.style.setProperty(e.variableName,e.value)}function r(e){t(e.main),t(e.light),t(e.dark),t(e.contrast),t(e.subtle),t(e.hover),t(e.pressed)}e.primary&&r(e.primary),e.secondary&&r(e.secondary),e.green&&r(e.green),e.red&&r(e.red),e.yellow&&r(e.yellow)},exports.setCssProperty=d;
//# sourceMappingURL=index.cjs.js.map