https://chessbook.com/_build/assets/DesignSystem-DmPnVJ5m.js

1(function(){try{var e=typeof window<`u`?window:typeof global<`u`?global:typeof globalThis<`u`?globalThis:typeof self<`u`?self:{};e.SENTRY_RELEASE={id:`chessbook-web@bb8efeb7ea07680c803efd4da4817360df75da47`};var t=new e.Error().stack;t&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]=`a8be0c09-f4d3-4969-b8a2-802720f7b1aa`,e._sentryDebugIdIdentifier=`sentry-dbid-a8be0c09-f4d3-4969-b8a2-802720f7b1aa`)}catch{}})();import{O as e,P as t,T as n,j as r,l as i,o as a,p as o,x as s}from"./web-zdZ8e3vS.js";import{c,i as l,l as u,n as d,s as f,t as p}from"./design_system-FNTZTTEV.js";import{I as m}from"./SidebarTemplate-C1Xhep8F.js";import{n as h,t as g}from"./ColorSamples-CIexeGz8.js";var _=n(`<div class="w-full min-h-screen bg-gray-26 p-10 text-secondary"><div class="flex row"><div class="flex row ml-4 space-x-1"><!><!><!><!><!><!></div></div><h2 class="mt-12 mb-4 text-lg font-bold text-primary">Colours in use</h2><h2 class="mt-12 mb-4 text-lg font-bold text-primary">Board</h2><h2 class="mt-12 mb-1 text-lg font-bold text-primary">Chroma against lightness, per ramp</h2><p class="mb-6 max-w-3xl text-sm text-tertiary">Filled region: what sRGB can display for that hue. Outline: Display P3, which the ramps are designed for. The ramp's chroma follows the P3 boundary's shape, scaled to pass through the dashed target at L <!> where the hue allows. Dots outside the filled region show at full chroma on P3 screens and are clipped by the browser on sRGB screens.</p><div class="grid grid-cols-3 gap-x-6 gap-y-8">`),v=n(`<div><div class="mb-1 text-sm font-semibold text-primary"><span class="ml-2 font-normal text-tertiary">hue <!> · cusp L <!> · peak C <!> · target C <!></span></div><svg width=320 height=210 class=text-tertiary><path fill=none stroke=currentColor stroke-dasharray="2 2"></path><path fill-opacity=0.2 stroke=currentColor stroke-opacity=0.6></path><line stroke=currentColor stroke-dasharray="4 3"></line><!><text y=208 text-anchor=middle font-size=9 fill=currentColor>OKLCH lightness</text><!><!>`),y=n(`<svg><text text-anchor=middle font-size=9 fill=currentColor></svg>`,2),b=n(`<svg><text text-anchor=end font-size=9 fill=currentColor></svg>`,2),x=n(`<svg><circle r=4.5 stroke=white stroke-width=1></svg>`,2),S=n(`<svg><rect width=10 height=10 stroke=white></svg>`,2),C=n(`<svg><text text-anchor=middle font-size=9 fill=white></svg>`,2),w=n(`<div class=mr-2>`),T=n(`<div class="flex row items-center justify-between font-semibold"><div>`),E=n(`<div class="flex gap-2 items-center"><div class=font-semibold>`),D=()=>{var n=_(),r=n.firstChild,i=r.firstChild,a=i.firstChild,s=a.nextSibling,c=s.nextSibling,l=c.nextSibling,u=l.nextSibling,d=u.nextSibling,f=r.nextSibling,v=f.nextSibling,y=v.nextSibling.nextSibling,b=y.firstChild.nextSibling;b.nextSibling;var x=y.nextSibling;return o(n,t(m,{}),n.firstChild),o(r,t(L,{hue:`gray`,step:5}),r.firstChild),o(i,t(L,{hue:`red`,step:10,showShade:!0}),a),o(i,t(L,{hue:`green`,step:10}),s),o(i,t(L,{hue:`blue`,step:10}),c),o(i,t(L,{hue:`orange`,step:10}),l),o(i,t(L,{hue:`yellow`,step:10}),u),o(i,t(L,{hue:`purple`,step:10}),d),o(n,t(h,{}),f.nextSibling),o(n,t(g,{}),v.nextSibling),o(y,70,b),o(x,t(e,{get each(){return Object.keys(p)},children:e=>t(F,{name:e})})),n},O={green:`success`,red:`danger`,orange:`warning`,yellow:`learning`},k=320,A=210,j={l:36,r:10,t:14,b:28},M=.38,N=e=>j.l+e/100*(k-j.l-j.r),P=e=>A-j.b-e/M*(A-j.b-j.t),F=n=>{let a=u(n.name),p=a.target,m=l[n.name],h=e=>{let t=[];for(let n=0;n<=100;n+=2)t.push(`${N(n).toFixed(1)},${P(f(n,a.hue,e)).toFixed(1)}`);return`M${t.join(` L`)} L${N(100)},${P(0)} L${N(0)},${P(0)} Z`},g=Object.entries(m).map(([e,t])=>{let n=c(t);return{n:+e,v:t,L:n.L,C:n.C}}),_=O[n.name];var w=v(),T=w.firstChild,E=T.firstChild,D=E.firstChild.nextSibling,k=D.nextSibling.nextSibling,A=k.nextSibling.nextSibling,M=A.nextSibling.nextSibling,F=T.nextSibling,I=F.firstChild,L=I.nextSibling,R=L.nextSibling,z=R.nextSibling,B=z.nextSibling,V=B.nextSibling,H=V.nextSibling;return o(T,()=>n.name,T.firstChild),o(E,()=>+a.hue.toFixed(1),D),o(E,()=>a.cusp,k),o(E,()=>a.peak.toFixed(2),A),o(E,()=>p.toFixed(2),M),o(F,t(e,{each:[0,20,40,60,80,100],children:e=>(()=>{var t=y();return o(t,e),i(()=>({e:N(e),t:P(0)+12}),({e,t:n},r)=>{e!==r?.e&&s(t,`x`,e),n!==r?.t&&s(t,`y`,n)}),t})()}),z),o(F,t(e,{each:[0,.1,.2,.3],children:e=>(()=>{var t=b();return o(t,()=>e.toFixed(1)),i(()=>({e:j.l-4,t:P(e)+3}),({e,t:n},r)=>{e!==r?.e&&s(t,`x`,e),n!==r?.t&&s(t,`y`,n)}),t})()}),z.nextSibling),o(F,t(e,{each:g,children:e=>(()=>{var t=x();return i(()=>({e:N(e.L),t:P(e.C),a:e.v}),({e,t:n,a:r},i)=>{e!==i?.e&&s(t,`cx`,e),n!==i?.t&&s(t,`cy`,n),r!==i?.a&&s(t,`fill`,r)}

1),t})()}),V),o(F,t(r,{when:_,children:e=>[(()=>{var t=S();return i(()=>({e:N(d[e()])-5,t:P(c(l[e()]).C)-5,a:l[e()]}),({e,t:n,a:r},i)=>{e!==i?.e&&s(t,`x`,e),n!==i?.t&&s(t,`y`,n),r!==i?.a&&s(t,`fill`,r)}),t})(),(()=>{var t=C();return o(t,e),i(()=>({e:N(d[e()]),t:P(c(l[e()]).C)+17}),({e,t:n},r)=>{e!==r?.e&&s(t,`x`,e),n!==r?.t&&s(t,`y`,n)}),t})()]}),H),i(()=>({e:h(`p3`),t:h(`srgb`),a:m[60],o:N(0),i:P(p),n:N(100),s:P(p),h:N(50)}),({e,t,a:n,o:r,i,n:a,s:o,h:c},l)=>{e!==l?.e&&s(I,`d`,e),t!==l?.t&&s(L,`d`,t),n!==l?.a&&s(L,`fill`,n),r!==l?.o&&s(R,`x1`,r),i!==l?.i&&s(R,`y1`,i),a!==l?.n&&s(R,`x2`,a),o!==l?.s&&s(R,`y2`,o),c!==l?.h&&s(B,`x`,c)}),w},I=({className:e,showShade:n})=>{var s=T(),c=s.firstChild;return o(s,t(r,{when:n,get children(){var t=w();return o(t,()=>e.split(`-`)[2]),t}}),s.firstChild),i(()=>`w-20 h-8 ${e} rounded`,(e,t)=>{a(c,e,t)}),s},L=({hue:n,step:r,showShade:i})=>{let a=[];for(let e=100;e>=0;e-=r)a.push(e);var s=E(),c=s.firstChild;return o(c,n),o(s,t(e,{each:a,children:e=>t(I,{className:`bg-${n}-${e}`,showShade:!!i})}),null),s};export{D as default};