vanilla-breeze 0.1.3 → 0.2.0

package/dist/cdn/components/quadrant-grid.js

@@ -0,0 +1,3 @@
+var M=window.matchMedia("(prefers-reduced-motion: reduce)");var w=new Map;function S(c,e,t={}){let s=t.priority??10,r={impl:e,bundle:t.bundle,contract:t.contract,priority:s},a=w.get(c);if(customElements.get(c)){if(!a||a.priority>=s){a&&a.priority===s&&a.impl!==e&&console.warn(`[VB Bundle] Tag <${c}> already registered by "${a.bundle}" (priority ${a.priority}). Skipping "${t.bundle}".`);return}console.warn(`[VB Bundle] Tag <${c}> defined by "${a.bundle}" cannot be replaced (customElements.define is permanent). "${t.bundle}" has higher priority but arrived late.`);return}if(a&&a.priority>=s){a.priority===s&&console.warn(`[VB Bundle] Tag <${c}> already registered by "${a.bundle}". Skipping "${t.bundle}" (first wins at equal priority).`);return}w.set(c,r),customElements.define(c,e)}var x=class extends HTMLElement{#s=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let e of this.#s)e();this.#s=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,t,s,r){e.addEventListener(t,s,r),this.#s.push(()=>e.removeEventListener(t,s,r))}setup(){}teardown(){}setState(e,t){this.#t||(this.#t=this.attachInternals());let s=this.#t.states;try{t?s.add(e):s.delete(e)}catch{let r=`--${e}`;t?s.add(r):s.delete(r)}}_adoptInternals(e){this.#t||(this.#t=e)}};var C=class c extends x{static#s=0;setup(){this.#l=`qg-${++c.#s}`;let e=this.getAttribute("x-label")||"",t=this.getAttribute("y-label")||"",s=this.getAttribute("x-low")||"Low",r=this.getAttribute("x-high")||"High",a=this.getAttribute("y-low")||"Low",u=this.getAttribute("y-high")||"High",p=[this.getAttribute("q1-label")||"Q1",this.getAttribute("q2-label")||"Q2",this.getAttribute("q3-label")||"Q3",this.getAttribute("q4-label")||"Q4"],m=this.hasAttribute("draggable"),y=[...this.querySelectorAll(":scope > [data-quadrant], :scope > [data-x][data-y]")],n=document.createElement("section");n.className="qg-wrapper",n.setAttribute("role","region"),n.setAttribute("aria-label",`${t} \xD7 ${e} quadrant grid`);let o=document.createElement("header");o.className="qg-y-label",o.setAttribute("aria-hidden","true"),o.textContent=`\u2191 ${t}`;let b=document.createElement("aside");b.className="qg-y-scale",b.setAttribute("aria-hidden","true"),b.innerHTML=`<span>${u}</span><span>${a}</span>`;let g=document.createElement("div");g.className="qg-grid";let d=document.createElement("aside");d.className="qg-x-scale",d.setAttribute("aria-hidden","true"),d.innerHTML=`<span>${s}</span><span>${r}</span>`;let E=document.createElement("footer");E.className="qg-x-label",E.setAttribute("aria-hidden","true"),E.textContent=`${e} \u2192`;for(let h=0;h<4;h++){let f=document.createElement("section");f.className="qg-quadrant",f.dataset.quadrantZone=String(h),f.setAttribute("aria-label",p[h]);let i=document.createElement("header");if(i.className="qg-quadrant-label",i.textContent=p[h],f.appendChild(i),m){let l=document.createElement("drag-surface");l.setAttribute("group",this.#l),l.setAttribute("aria-label",p[h]),l.setAttribute("data-layout","stack"),l.setAttribute("data-layout-gap","xs"),f.appendChild(l),this.#r[h]=l}else{let l=document.createElement("ul");l.className="qg-items",f.appendChild(l),this.#c[h]=l}g.appendChild(f),this.#d[h]=f}y.forEach((h,f)=>{let i=h,l=this.#g(i),$=m?this.#r[l]:this.#c[l];if(m&&(i.hasAttribute("draggable")||i.setAttribute("draggable","true")),i.hasAttribute("data-id")||(i.dataset.id=`qg-item-${f}`),i.hasAttribute("data-x")&&i.hasAttribute("data-y")){let q=parseFloat(i.getAttribute("data-x")??""),v=parseFloat(i.getAttribute("data-y")??"");if(Number.isFinite(q)&&Number.isFinite(v)){let L=l===0||l===3?(q-.5)*2:q*2,N=l===0||l===1?(v-.5)*2:v*2;if(i.style.setProperty("--qg-local-x",L.toFixed(4)),i.style.setProperty("--qg-local-y",N.toFixed(4)),i.classList.add("qg-pinned"),!i.style.getPropertyValue("--qg-pin-hue")){let F=i.dataset.id||(i.textContent||"").trim();i.style.setProperty("--qg-pin-hue",`${c.#p(F)}deg`)}}}if(m)$.appendChild(i);else{let q=document.createElement("li");q.appendChild(i),$.appendChild(q)}});let A=document.createElement("div");A.className="qg-live-region visually-hidden",A.setAttribute("role","status"),A.setAttribute("aria-live","polite"),n.appendChild(o),n.appendChild(b),n.appendChild(g),n.appendChild(d),n.appendChild(E),this.appendChild(n),this.appendChild(A),this.#q=g,this.#i=A,this.#u=p,m&&this.listen(this,"drag-surface:transfer",this.#b),this.#t()}#t(){if(typeof ResizeObserver>"u")return;let e=t=>{let s=t.offsetWidth,r=t.offsetHeight;s>0&&t.style.setProperty("--qg-pin-half-w",`${s/2}px`),r>0&&t.style.setProperty("--qg-pin-half-h",`${r/2}px`)};this.#n=new ResizeObserver(t=>{for(let s of t)e(s.target);this.#a()});for(let t of this.querySelectorAll(".qg-pinned"))this.#n.observe(t);this.#a()}#a(){this.#e||(this.#e=requestAnimationFrame(()=>{this.#e=0,this.#h()}))}#h(){for(let t of this.querySelectorAll(".qg-pinned")){let s=t;s.classList.remove("qg-clustered"),s.style.removeProperty("--qg-cluster-i"),s.style.removeProperty("--qg-cluster-n"),delete s.dataset.cluster,s.dataset.qgTabbed!==void 0&&(s.removeAttribute("tabindex"),delete s.dataset.qgTabbed)}let e=0;for(let t=0;t<4;t++){let s=this.#d[t];if(!s)continue;let r=[...s.querySelectorAll(".qg-pinned")];if(r.length<2)continue;let a=r.map(n=>n.getBoundingClientRect()),u=Array.from({length:r.length},(n,o)=>o),p=n=>u[n]===n?n:u[n]=p(u[n]),m=(n,o)=>{let b=p(n),g=p(o);b!==g&&(u[b]=g)};for(let n=0;n<r.length;n++)for(let o=n+1;o<r.length;o++)c.#f(a[n],a[o])&&m(n,o);let y=new Map;for(let n=0;n<r.length;n++){let o=p(n);y.has(o)||y.set(o,[]),y.get(o)?.push(n)}for(let n of y.values()){if(n.length<2)continue;let o=`c${++e}`;n.forEach((b,g)=>{let d=r[b];d.classList.add("qg-clustered"),d.dataset.cluster=o,d.style.setProperty("--qg-cluster-i",String(g)),d.style.setProperty("--qg-cluster-n",String(n.length)),!d.hasAttribute("tabindex")&&!d.matches("a, button, [contenteditable]")&&(d.setAttribute("tabindex","0"),d.dataset.qgTabbed="")})}}}teardown(){this.#n?.disconnect(),this.#n=null,this.#e&&cancelAnimationFrame(this.#e),this.#e=0}static#f(e,t){return!(e.right<=t.left||t.right<=e.left||e.bottom<=t.top||t.bottom<=e.top)}static#p(e){let t=5381;for(let s=0;s<e.length;s++)t=(t<<5)+t+e.charCodeAt(s)|0;return(t%360+360)%360}#b=e=>{let{item:t,fromSurface:s,toSurface:r}=e.detail,a=this.#o(s),u=this.#o(r);a==null||u==null||(t.setAttribute("data-quadrant",String(u)),this.#y(`Moved ${this.#m(t)} to ${this.#u[u]}`),this.dispatchEvent(new CustomEvent("quadrant-grid:move",{bubbles:!0,detail:{item:t,itemId:t.dataset.id,from:a,to:u}})))};#g(e){let t=parseInt(e.getAttribute("data-quadrant"),10);if(t>=0&&t<=3)return t;if(e.hasAttribute("data-x")&&e.hasAttribute("data-y")){let s=parseFloat(e.getAttribute("data-x")),r=parseFloat(e.getAttribute("data-y"));return c.quadrantFor(s,r)}return 0}static quadrantFor(e,t){let s=e>=.5,r=t>=.5;return r&&s?0:r&&!s?1:!r&&!s?2:3}#o(e){for(let t=0;t<4;t++)if(this.#r[t]===e)return t;return null}#m(e){return(e.textContent||"").trim().split(`
+`)[0]||"item"}#y(e){this.#i&&(this.#i.textContent=e)}#l="";#r={};#c={};#d={};#q=null;#i=null;#u=[];#n=null;#e=0};S("quadrant-grid",C);export{C as QuadrantGrid};
+//# sourceMappingURL=quadrant-grid.js.map

package/dist/cdn/components/quality-target.js

@@ -0,0 +1,12 @@
+var q=class extends HTMLElement{#i=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#i)t();this.#i=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,i,a){t.addEventListener(e,i,a),this.#i.push(()=>t.removeEventListener(e,i,a))}setup(){}teardown(){}setState(t,e){this.#t||(this.#t=this.attachInternals());let i=this.#t.states;try{e?i.add(t):i.delete(t)}catch{let a=`--${t}`;e?i.add(a):i.delete(a)}}_adoptInternals(t){this.#t||(this.#t=t)}};var dt=window.matchMedia("(prefers-reduced-motion: reduce)");var H=new Map;function U(r,t,e={}){let i=e.priority??10,a={impl:t,bundle:e.bundle,contract:e.contract,priority:i},n=H.get(r);if(customElements.get(r)){if(!n||n.priority>=i){n&&n.priority===i&&n.impl!==t&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${n.bundle}" (priority ${n.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${n.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(n&&n.priority>=i){n.priority===i&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${n.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}H.set(r,a),customElements.define(r,t)}var P=Object.freeze(["performance","accessibility","security","reliability","maintainability","observability","compatibility","scalability","portability","internationalization","privacy"]),I=Object.freeze(["critical","important","acceptable","not-relevant"]),B=Object.freeze({critical:"Critical",important:"Important",acceptable:"Acceptable","not-relevant":"Not relevant"}),Y=Object.freeze({accessibility:3,performance:5,security:5,reliability:4,observability:3,internationalization:4,compatibility:2,portability:3,privacy:4,scalability:5,maintainability:2}),J=Object.freeze({performance:"Performance",accessibility:"Accessibility",security:"Security",reliability:"Reliability",maintainability:"Maintainability",observability:"Observability",compatibility:"Compatibility",scalability:"Scalability",portability:"Portability",internationalization:"Internationalization",privacy:"Privacy"}),pt=Object.freeze({accessibility:"a11y",internationalization:"i18n",maintainability:"maint",observability:"obs",compatibility:"compat",portability:"porta",performance:"perf",reliability:"rely",scalability:"scale",security:"sec",privacy:"priv"}),nt=Object.freeze({critical:1,important:.6,acceptable:.3,"not-relevant":0});function w(r){return J[r]?J[r]:String(r).replace(/[-_]/g," ").replace(/\b\w/g,t=>t.toUpperCase())}function _(r,t={}){let e={};for(let i of r)Object.prototype.hasOwnProperty.call(t,i)&&Number.isFinite(Number(t[i]))?e[i]=Math.max(0,Math.floor(Number(t[i]))):Object.prototype.hasOwnProperty.call(Y,i)?e[i]=Y[i]:e[i]=1;return Object.freeze(e)}function R(r,t){let e=0;for(let[i,a]of Object.entries(r||{}))a==="critical"&&(e+=Number(t?.[i]??0));return e}function K(r){return Object.keys(r||{}).filter(t=>r[t]==="critical")}function X(r){let{vector:t={},rationales:e={},costWeights:i={},capacityPoints:a=1/0,overrunRationale:n="",minRationale:c=10,minOverrunRationale:l=10}=r||{},p=[],m=K(t);for(let h of m){let v=e[h];(typeof v!="string"||v.trim().length<c)&&p.push(`Critical "${h}" needs a rationale of at least ${c} characters.`)}let u=R(t,i);return Number.isFinite(a)&&u>a&&(typeof n!="string"||n.trim().length<l)&&p.push(`Over budget by ${u-a} points (${u}/${a}); overrunRationale of at least ${l} characters required.`),{valid:p.length===0,errors:p,criticalSum:u}}function Z({level:r,rationale:t,minRationale:e=10}){return I.includes(r)?r==="critical"&&(typeof t!="string"||t.trim().length<e)?{ok:!1,reason:"rationale-too-short"}:{ok:!0}:{ok:!1,reason:"pick-level"}}function G({ility:r,level:t,costWeight:e}){let i=w(r),a=t?B[t]||t:"unset",n=Number(e),c=Number.isFinite(n)?`${n} pts`:"? pts";return`${i} \u2014 ${a} \xB7 ${c}`}function Q(r){if(!r||typeof r!="string")return{};try{let t=JSON.parse(r);return t&&typeof t=="object"&&!Array.isArray(t)?t:{}}catch{return{}}}function tt(r){let t=[];for(let e=0;e<r;e++)t.push(-Math.PI/2+2*Math.PI*e/r);return t}function at({ilities:r,vector:t={},radius:e}){let i=tt(r.length);return r.map((a,n)=>{let c=t[a]||null,l=nt[c]??0;return{ility:a,level:c,x:$(Math.cos(i[n])*e*l),y:$(Math.sin(i[n])*e*l)}})}function j({ilities:r,radius:t}){let e=tt(r.length);return r.map((i,a)=>({ility:i,x:$(Math.cos(e[a])*t),y:$(Math.sin(e[a])*t)}))}var d="http://www.w3.org/2000/svg",st=Object.freeze([{ratio:1,label:"Critical",className:"ring-critical"},{ratio:.6,label:"Important",className:"ring-important"},{ratio:.3,label:"Acceptable",className:"ring-acceptable"}]),ot=.22;function et({ilities:r=[],vector:t={},costWeights:e={},capacityPoints:i=0,radius:a=100}={}){let n=document.createElementNS(d,"svg"),c=a+14,l=c+140,p=c+30;n.setAttribute("viewBox",`${-l} ${-p} ${l*2} ${p*2}`),n.setAttribute("role","group"),n.setAttribute("aria-label",`Quality target. ${K(t||{}).length} critical of ${r.length} ilities. Click any axis to edit.`);for(let o of st){let s=document.createElementNS(d,"polygon");s.setAttribute("class",`ring ${o.className}`);let M=j({ilities:r,radius:a*o.ratio});s.setAttribute("points",M.map(A=>`${A.x},${A.y}`).join(" ")),n.append(s)}let m=j({ilities:r,radius:a});for(let o of m){let s=document.createElementNS(d,"line");s.setAttribute("class","spoke"),s.setAttribute("x1","0"),s.setAttribute("y1","0"),s.setAttribute("x2",String(o.x)),s.setAttribute("y2",String(o.y)),n.append(s)}let u=at({ilities:r,vector:t,radius:a}),h=u.filter(o=>Math.hypot(o.x,o.y)>.5);if(h.length>=3){let o=document.createElementNS(d,"polygon");o.setAttribute("class","vector"),o.setAttribute("points",h.map(s=>`${s.x},${s.y}`).join(" ")),n.append(o)}else if(h.length>0)for(let o of h){let s=document.createElementNS(d,"line");s.setAttribute("class","vector-spoke"),s.setAttribute("x1","0"),s.setAttribute("y1","0"),s.setAttribute("x2",String(o.x)),s.setAttribute("y2",String(o.y)),n.append(s)}let v=j({ilities:r,radius:c});for(let o=0;o<r.length;o++){let s=r[o],M=u[o],A=v[o],z=Number(e?.[s]??0),O=t?.[s]??null,b=document.createElementNS(d,"g");b.setAttribute("class","axis"),b.setAttribute("data-ility",s),O&&b.setAttribute("data-level",String(O)),b.setAttribute("tabindex","0"),b.setAttribute("role","button"),b.setAttribute("aria-label",`${G({ility:s,level:O,costWeight:z})}. Activate to edit.`);let S=document.createElementNS(d,"rect");S.setAttribute("class","hit");let F=ct(A),T=100,W=22,it=A.x+(F==="end"?-T:F==="start"?0:-T/2),rt=A.y-W/2;if(S.setAttribute("x",String($(it))),S.setAttribute("y",String($(rt))),S.setAttribute("width",String(T)),S.setAttribute("height",String(W)),S.setAttribute("rx","4"),b.append(S),O){let L=document.createElementNS(d,"circle");L.setAttribute("class","marker"),L.setAttribute("cx",String(M.x)),L.setAttribute("cy",String(M.y)),L.setAttribute("r","4"),b.append(L)}let N=document.createElementNS(d,"text");N.setAttribute("class","axis-label"),N.setAttribute("x",String(A.x)),N.setAttribute("y",String(A.y)),N.setAttribute("text-anchor",F),N.setAttribute("dominant-baseline","middle"),N.textContent=w(s),b.append(N);let D=document.createElementNS(d,"title");D.textContent=G({ility:s,level:O,costWeight:z}),b.append(D),n.append(b)}let f=document.createElementNS(d,"g");f.setAttribute("class","center");let E=R(t,e);Number.isFinite(i)&&E>i&&f.setAttribute("data-over","");let y=a*ot,k=document.createElementNS(d,"circle");k.setAttribute("class","capacity-backdrop"),k.setAttribute("cx","0"),k.setAttribute("cy","0"),k.setAttribute("r",String($(y))),f.append(k);let g=document.createElementNS(d,"text");g.setAttribute("class","capacity-sum"),g.setAttribute("x","0"),g.setAttribute("y","-3"),g.setAttribute("text-anchor","middle"),g.setAttribute("dominant-baseline","middle"),g.textContent=String(E),f.append(g);let x=document.createElementNS(d,"text");return x.setAttribute("class","capacity-denom"),x.setAttribute("x","0"),x.setAttribute("y","11"),x.setAttribute("text-anchor","middle"),x.textContent=Number.isFinite(i)?`of ${i}`:"unbounded",f.append(x),n.append(f),n}function $(r){return Math.round(r*100)/100}function ct(r){return Math.abs(r.x)<4?"middle":r.x>0?"start":"end"}var V=class extends q{static formAssociated=!0;static get observedAttributes(){return["data-bind-to","data-capacity-points","data-cost-weights","data-radius","data-show-envelope","data-min-rationale","data-max-rationale","data-min-overrun-rationale","data-max-overrun-rationale","disabled","locked"]}#i;#t=[...P];#e={};#r={};#a=_(P);#s="";#y=!1;#l=null;#g=null;#u={};#h=null;constructor(){super(),this.#i=this.attachInternals(),this._adoptInternals(this.#i)}setup(){this.#m(),this.#x(),this.#o(),this.#$(),this.listen(this,"click",t=>this.#A(t)),this.listen(this,"keydown",t=>this.#E(t)),this.listen(this,"input",t=>this.#S(t))}teardown(){this.#l?.(),this.#l=null}attributeChangedCallback(t){this.isConnected&&(t==="data-bind-to"?(this.#x(),this.#o()):t==="data-capacity-points"?this.#o():t==="data-cost-weights"?(this.#m(),this.#o()):t==="data-radius"||t==="data-show-envelope"?this.#o():(t==="disabled"||t==="locked")&&this.#q())}get vector(){return{...this.#e}}set vector(t){this.#O(t),this.#c("property")}get rationales(){return{...this.#r}}set rationales(t){this.#L(t),this.#c("property")}get costWeights(){return{...this.#a}}get capacityPoints(){return this.#n()}set capacityPoints(t){this.#g=Number.isFinite(+t)?+t:null,this.#c("property")}get criticalSum(){return R(this.#e,this.#a)}get overBudget(){let t=this.#n();return Number.isFinite(t)&&this.criticalSum>t}get overrunRationale(){return this.#s}set overrunRationale(t){this.#s=String(t??"");let e=this.querySelector("[data-quality-overrun] textarea");e&&(e.value=this.#s),this.#b()}get ilities(){return[...this.#t]}set ilities(t){!Array.isArray(t)||t.length===0||(this.#t=[...t],this.#m(),this.#c("property"))}get value(){return{vector:{...this.#e},rationales:{...this.#r},costWeights:{...this.#a},capacityPoints:this.#w(),capacitySource:this.#C(),criticalSum:this.criticalSum,overrunRationale:this.#s||void 0,ironTriangleHash:this.#M()}}openEditor(t){if(!this.#t.includes(t))return;let e=this.#N(t);typeof e.showModal=="function"?e.showModal():e.setAttribute("open","")}checkValidity(){let{valid:t,errors:e}=X({vector:this.#e,rationales:this.#r,costWeights:this.#a,capacityPoints:this.#n(),overrunRationale:this.#s,minRationale:this.#d(),minOverrunRationale:this.#f()});this.setState("missing-rationale",!t);let i=this.querySelector("[data-quality-errors]");return i&&(i.textContent=e.join(" ")),t}#A(t){let e=t.target.closest?.(".axis[data-ility]");e&&this.contains(e)&&(t.preventDefault(),this.openEditor(e.dataset.ility))}#E(t){if(t.key!=="Enter"&&t.key!==" ")return;let e=t.target.closest?.(".axis[data-ility]");e&&this.contains(e)&&(t.preventDefault(),this.openEditor(e.dataset.ility))}#S(t){let e=t.target;e?.matches?.("[data-quality-overrun] textarea")&&(this.#s=e.value,this.checkValidity(),this.#b())}#N(t){if(this.#u[t])return this.#v(t),this.#u[t];let e=document.createElement("dialog");e.className=`quality-dialog quality-dialog--${t}`,e.setAttribute("aria-label",`${w(t)} \u2014 edit priority`);let i=document.createElement("form");i.method="dialog",i.setAttribute("data-layout","stack"),i.setAttribute("data-layout-gap","m");let a=document.createElement("h3");a.textContent=w(t),i.append(a);let n=document.createElement("fieldset");n.setAttribute("data-layout","stack"),n.setAttribute("data-layout-gap","2xs");let c=document.createElement("legend");c.textContent="Priority",n.append(c);for(let E of I){let C=document.createElement("label"),y=document.createElement("input");y.type="radio",y.name="level",y.value=E,C.append(y,document.createTextNode(" "+B[E])),n.append(C)}i.append(n);let l=document.createElement("form-field"),p=document.createElement("label");p.setAttribute("for",`quality-${t}-rationale`),p.textContent="Rationale (required when Critical)";let m=document.createElement("textarea");m.id=`quality-${t}-rationale`,m.name="rationale",m.rows=3,m.minLength=this.#d(),m.maxLength=this.#I(),m.placeholder=`Why \u2265 ${this.#d()} chars`,l.append(p,m),i.append(l);let u=document.createElement("p");u.className="message message-error",u.dataset.dialogError="",u.hidden=!0,i.append(u);let h=document.createElement("div");h.setAttribute("data-layout","cluster"),h.setAttribute("data-layout-gap","s"),h.setAttribute("data-layout-justify","end");let v=document.createElement("button");v.type="button",v.textContent="Cancel",v.addEventListener("click",()=>e.close("cancel"));let f=document.createElement("button");return f.type="submit",f.textContent="Save",h.append(v,f),i.append(h),e.append(i),this.append(e),this.#u[t]=e,i.addEventListener("submit",E=>{E.preventDefault();let y=i.querySelector('input[name="level"]:checked')?.value,g=i.querySelector('textarea[name="rationale"]')?.value??"",x=Z({level:y,rationale:g,minRationale:this.#d()});if(!x.ok){u.hidden=!1,u.textContent=x.reason==="pick-level"?"Pick a priority level.":`Rationale must be at least ${this.#d()} characters.`;return}this.#e[t]=y??"",y==="critical"?this.#r[t]=g.trim():delete this.#r[t],e.close("save"),this.#c("dialog",t)}),this.#v(t),e}#v(t){let e=this.#u[t];if(!e)return;let i=this.#e[t];for(let c of e.querySelectorAll('input[name="level"]')){let l=c;l.checked=l.value===i}let a=e.querySelector('textarea[name="rationale"]');a&&(a.value=this.#r[t]||"");let n=e.querySelector("[data-dialog-error]");n&&(n.hidden=!0,n.textContent="")}#$(){if(this.#h)return;let t=document.createElement("section");t.className="quality-footer",t.dataset.qualityFooter="",t.setAttribute("data-layout","stack"),t.setAttribute("data-layout-gap","s");let e=document.createElement("section");e.dataset.qualityOverrun="",e.hidden=!0,e.innerHTML=`
+      <strong>Over budget \u2014 explain why.</strong>
+      <small data-overrun-prompt></small>
+      <form-field>
+        <label for="quality-overrun">Overrun rationale (\u2265 ${this.#f()} chars)</label>
+        <textarea id="quality-overrun" name="overrunRationale"
+                  minlength="${this.#f()}"
+                  maxlength="${this.#R()}"
+                  rows="3"></textarea>
+      </form-field>
+    `,t.append(e);let i=document.createElement("p");i.dataset.qualityErrors="",i.className="message message-error",i.setAttribute("role","alert"),t.append(i),this.append(t),this.#h=t}#k(){if(!this.#h)return;let t=this.#n(),e=this.criticalSum,i=Number.isFinite(t)&&e>t,a=this.#h.querySelector("[data-quality-overrun]");if(a){a.hidden=!i;let n=a.querySelector("[data-overrun-prompt]");n&&Number.isFinite(t)&&(n.textContent=`You're over budget by ${e-t} points (${e}/${t}).`)}}#m(){let t=Q(this.getAttribute("data-cost-weights")||"");this.#a=_(this.#t,t)}#O(t){if(!(!t||typeof t!="object"))for(let[e,i]of Object.entries(t))I.includes(i)&&(this.#e[e]=i)}#L(t){if(!(!t||typeof t!="object"))for(let[e,i]of Object.entries(t))this.#r[e]=String(i??"")}#n(){let t=this.#p();if(t&&Number.isFinite(t.capacityPoints)&&t.capacityPoints>0)return t.capacityPoints;let e=Number(this.getAttribute("data-capacity-points"));if(Number.isFinite(e)&&e>0)return e;let i=this.#g;return i!==null&&Number.isFinite(i)&&i>0?i:1/0}#w(){let t=this.#n();return Number.isFinite(t)?t:null}#C(){let t=this.#p();return t?.capacitySource==="manual"?"manual":t?"formula":(this.getAttribute("data-capacity-points"),"manual")}#p(){let t=this.getAttribute("data-bind-to");if(!t)return null;let e=this.getRootNode(),i=e.getElementById?e.getElementById(t):document.getElementById(t);return i&&i.localName==="iron-triangle"?i:null}#M(){return this.#p()?.hash||null}#x(){this.#l?.(),this.#l=null;let t=this.#p();if(!t)return;let e=()=>this.#c("iron-triangle");t.addEventListener("iron-triangle:change",e),this.#l=()=>t.removeEventListener("iron-triangle:change",e)}#o(){let t=lt(Number(this.dataset.radius??100),30,400),e=this.#n(),i=et({ilities:this.#t,vector:this.#e,costWeights:this.#a,capacityPoints:e,radius:t}),a=this.querySelector(":scope > svg");a?a.replaceWith(i):this.prepend(i)}#c(t,e){this.#o(),this.#k();let i=this.#n(),a=this.criticalSum,n=Number.isFinite(i)&&a>i;if(this.setState("over-budget",n),this.#b(),n!==this.#y){let c=n?"quality-target:over-budget":"quality-target:under-budget",l=n?{delta:a-i,criticalSum:a,capacityPoints:i}:{slack:i-a,criticalSum:a,capacityPoints:i};this.dispatchEvent(new CustomEvent(c,{bubbles:!0,composed:!0,detail:l})),this.#y=n}this.dispatchEvent(new CustomEvent("quality-target:change",{bubbles:!0,composed:!0,detail:{...this.value,source:t,field:e}}))}#b(){try{this.#i.setFormValue(JSON.stringify(this.value))}catch{}}#q(){let t=this.hasAttribute("disabled")||this.hasAttribute("locked");for(let e of Object.values(this.#u))for(let i of e.querySelectorAll("input, textarea, select, button"))i.disabled=t}#d(){return Math.max(0,parseInt(this.dataset.minRationale??"10",10)||10)}#I(){return Math.max(10,parseInt(this.dataset.maxRationale??"200",10)||200)}#f(){return Math.max(0,parseInt(this.dataset.minOverrunRationale??"10",10)||10)}#R(){return Math.max(10,parseInt(this.dataset.maxOverrunRationale??"400",10)||400)}};function lt(r,t,e){return Math.max(t,Math.min(e,r))}U("quality-target",V);export{V as QualityTarget};
+//# sourceMappingURL=quality-target.js.map

package/dist/cdn/components/reaction-bar.js

@@ -0,0 +1,2 @@
+var g=window.matchMedia("(prefers-reduced-motion: reduce)");var p=new Map;function c(r,t,s={}){let e=s.priority??10,o={impl:t,bundle:s.bundle,contract:s.contract,priority:e},i=p.get(r);if(customElements.get(r)){if(!i||i.priority>=e){i&&i.priority===e&&i.impl!==t&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${s.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${i.bundle}" cannot be replaced (customElements.define is permanent). "${s.bundle}" has higher priority but arrived late.`);return}if(i&&i.priority>=e){i.priority===e&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${i.bundle}". Skipping "${s.bundle}" (first wins at equal priority).`);return}p.set(r,o),customElements.define(r,t)}var a=class extends HTMLElement{#e=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#e)t();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,s,e,o){t.addEventListener(s,e,o),this.#e.push(()=>t.removeEventListener(s,e,o))}setup(){}teardown(){}setState(t,s){this.#t||(this.#t=this.attachInternals());let e=this.#t.states;try{s?e.add(t):e.delete(t)}catch{let o=`--${t}`;s?e.add(o):e.delete(o)}}_adoptInternals(t){this.#t||(this.#t=t)}};var h=CSS.supports("anchor-name","--x"),f=CSS.supports("position-area","bottom"),b=0,d=class extends a{#e=null;#t=null;#s=null;#o=null;setup(){this.id||(this.id=`pop-over-${++b}`);let t=this.dataset.mode||"auto";this.hasAttribute("popover")||this.setAttribute("popover",t),this.#a(),this.#r(),this.#s=s=>{let e=s.newState==="open"?"show":"hide";this.dispatchEvent(new CustomEvent(`pop-over:${e}`,{detail:{state:s.newState},bubbles:!0,composed:!0})),!h&&s.newState==="open"&&this.#e&&this.#i()},this.listen(this,"beforetoggle",this.#s),h||(this.#o=()=>{this.matches(":popover-open")&&this.#e&&this.#i()},this.listen(window,"resize",this.#o),this.listen(window,"scroll",this.#o,{capture:!0,passive:!0}))}show(){this.matches(":popover-open")||this.showPopover()}hide(){this.matches(":popover-open")&&this.hidePopover()}toggle(){this.matches(":popover-open")?this.hide():this.show()}get open(){return this.matches(":popover-open")}#a(){let t=this.dataset.anchor;t?this.#e=document.getElementById(t)||document.querySelector(t):this.#e=document.querySelector(`[popovertarget="${CSS.escape(this.id)}"]`)}#r(){if(!(!this.#e||!h)&&(this.#t=`--pop-over-anchor-${this.id}`,this.#e.style.setProperty("anchor-name",this.#t),this.style.setProperty("position-anchor",this.#t),this.setAttribute("data-anchor-name",this.#t||""),!f)){let t=this.dataset.position||"bottom";this.#n(t)}}#n(t){let s="var(--_pop-over-offset, var(--size-xs))",e={top:{bottom:`calc(anchor(top) + ${s})`,left:"anchor(left)"},bottom:{top:`calc(anchor(bottom) + ${s})`,left:"anchor(left)"},left:{right:`calc(anchor(left) + ${s})`,top:"anchor(top)"},right:{left:`calc(anchor(right) + ${s})`,top:"anchor(top)"}},o=t.split("-")[0],i=e[o]||e.bottom;Object.entries(i).forEach(([n,l])=>this.style.setProperty(n,l))}#i(){if(!this.#e)return;let t=this.#e.getBoundingClientRect(),s=this.dataset.position||"bottom",e=this.#c(),o,i;switch(s.split("-")[0]){case"top":o=t.top-this.offsetHeight-e,i=t.left;break;case"left":o=t.top,i=t.left-this.offsetWidth-e;break;case"right":o=t.top,i=t.right+e;break;default:o=t.bottom+e,i=t.left;break}s.endsWith("-end")&&(s.startsWith("top")||s.startsWith("bottom")?i=t.right-this.offsetWidth:o=t.bottom-this.offsetHeight),this.style.position="fixed",this.style.top=`${Math.round(o)}px`,this.style.left=`${Math.round(i)}px`,this.style.margin="0"}#c(){let t={none:0,xs:4,s:8,m:16,l:24};return t[this.dataset.offset]??t.xs}};c("pop-over",d);var m=0,u=class extends a{#e;#t;#s;#o;setup(){this.setAttribute("role","toolbar"),this.hasAttribute("aria-label")||this.setAttribute("aria-label","Reactions"),this.#e=this.querySelector(":scope > template[data-palette]"),this.#a().forEach(t=>this.#r(t)),this.#c(),this.#d(),this.#l(),this.listen(this,"keydown",this.#f)}#a(){return[...this.querySelectorAll(":scope > button[data-reaction]")]}#r(t){if(t.dataset.decorated==="")return;t.dataset.decorated="",t.type="button",t.setAttribute("role","button");let s=t.textContent;t.replaceChildren();let e=document.createElement("span");e.className="reaction-emoji",e.setAttribute("aria-hidden","true"),e.textContent=s;let o=document.createElement("span");o.className="reaction-count",o.setAttribute("aria-hidden","true"),t.appendChild(e),t.appendChild(o),this.#n(t),this.listen(t,"click",()=>this.#i(t))}#n(t){let s=Number(t.dataset.count)||0,e=t.hasAttribute("data-mine"),o=t.querySelector(".reaction-emoji")?.textContent??"";t.querySelector(".reaction-count").textContent=s>0?String(s):"",t.setAttribute("aria-pressed",e?"true":"false");let i=s===1?"reaction":"reactions",n=e?", you reacted":"";t.setAttribute("aria-label",`${o}, ${s} ${i}${n}`)}#i(t){if(this.hasAttribute("data-disabled"))return;let s=t.dataset.reaction,e=Number(t.dataset.count)||0,o=t.hasAttribute("data-mine");this.dispatchEvent(new CustomEvent("reaction-bar:toggle",{bubbles:!0,detail:{reaction:s,action:o?"remove":"add",count:e,mine:o}}))}#c(){this.#t=document.createElement("button"),this.#t.type="button",this.#t.className="reaction-trigger",this.#t.textContent=this.getAttribute("data-trigger-icon")||"\u{1F600}",this.#t.setAttribute("aria-label",this.getAttribute("data-trigger-label")||"Add reaction"),this.#t.setAttribute("aria-haspopup","dialog"),this.#t.setAttribute("aria-expanded","false"),this.hasAttribute("data-disabled")&&(this.#t.disabled=!0),this.appendChild(this.#t)}#d(){if(!this.#e)return;let t=`reaction-bar-palette-${++m}`;this.#t.setAttribute("popovertarget",t),this.#s=document.createElement("pop-over"),this.#s.id=t,this.#s.className="reaction-palette",this.#s.dataset.position="top",this.#s.setAttribute("role","dialog"),this.#s.setAttribute("aria-label","Choose a reaction"),this.#o=document.createElement("div"),this.#o.className="reaction-palette-list",this.#o.setAttribute("role","group"),[...this.#e.content.cloneNode(!0).querySelectorAll("button[data-reaction]")].forEach(e=>{e.type="button",e.classList.add("reaction-palette-option");let o=e.textContent;e.setAttribute("aria-label",o),this.listen(e,"click",()=>this.#u(e)),this.#o.appendChild(e)}),this.#s.appendChild(this.#o),this.appendChild(this.#s),this.listen(this.#s,"pop-over:show",()=>{this.#t.setAttribute("aria-expanded","true"),this.dispatchEvent(new CustomEvent("reaction-bar:palette-open",{bubbles:!0})),this.#o.querySelector("button")?.focus()}),this.listen(this.#s,"pop-over:hide",()=>{this.#t.setAttribute("aria-expanded","false"),this.dispatchEvent(new CustomEvent("reaction-bar:palette-close",{bubbles:!0}))}),this.listen(this.#o,"keydown",this.#p)}#u(t){if(this.hasAttribute("data-disabled"))return;let s=t.dataset.reaction,e=this.querySelector(`:scope > button[data-reaction="${CSS.escape(s)}"]`);e?this.#i(e):this.dispatchEvent(new CustomEvent("reaction-bar:toggle",{bubbles:!0,detail:{reaction:s,action:"add",count:0,mine:!1}})),this.#s?.hide(),this.#t.focus()}#p=t=>{let s=[...this.#o.querySelectorAll("button")],e=s.indexOf(document.activeElement);if(e===-1)return;let o=e;switch(t.key){case"ArrowRight":case"ArrowDown":t.preventDefault(),o=(e+1)%s.length;break;case"ArrowLeft":case"ArrowUp":t.preventDefault(),o=(e-1+s.length)%s.length;break;case"Home":t.preventDefault(),o=0;break;case"End":t.preventDefault(),o=s.length-1;break;default:return}s[o].focus()};#h(){return[...this.querySelectorAll(":scope > button[data-reaction], :scope > .reaction-trigger")]}#l(){this.#h().forEach((s,e)=>s.setAttribute("tabindex",e===0?"0":"-1"))}#f=t=>{let s=this.#h(),e=document.activeElement?s.indexOf(document.activeElement):-1;if(e===-1)return;let o=e;switch(t.key){case"ArrowRight":t.preventDefault(),o=(e+1)%s.length;break;case"ArrowLeft":t.preventDefault(),o=(e-1+s.length)%s.length;break;case"Home":t.preventDefault(),o=0;break;case"End":t.preventDefault(),o=s.length-1;break;default:return}s.forEach((i,n)=>i.setAttribute("tabindex",n===o?"0":"-1")),s[o].focus()};setCount(t,s,e={}){let o=Number(s)||0,i=this.querySelector(`:scope > button[data-reaction="${CSS.escape(t)}"]`);if(o<=0){i&&(i.remove(),this.#l());return}if(!i){let n=this.#e?.content.querySelector(`button[data-reaction="${CSS.escape(t)}"]`),l=n?n.textContent:t;i=document.createElement("button"),i.dataset.reaction=t,i.textContent=l,this.insertBefore(i,this.#t),this.#r(i)}i.dataset.count=String(o),e.mine===!0?i.setAttribute("data-mine",""):e.mine===!1&&i.removeAttribute("data-mine"),this.#n(i),this.#l()}openPalette(){this.#s?.show()}closePalette(){this.#s?.hide()}};c("reaction-bar",u);export{u as ReactionBar};
+//# sourceMappingURL=reaction-bar.js.map

package/dist/cdn/components/reader-view.js

@@ -1,8 +1,8 @@
-var c=class extends HTMLElement{#t=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,i){t.addEventListener(e,s,i),this.#t.push(()=>t.removeEventListener(e,s,i))}setup(){}teardown(){}};var d=new Set,u=class o extends c{#t="scroll";#s=0;#a=1;#o=2;#n="auto";#l=[0];#r=null;#i=null;#e=null;#m=null;#p=null;#g=!1;#b=0;#w=!1;#f=null;#v=null;static FONT_SIZES=["0.875rem","0.9375rem","1rem","1.0625rem","1.125rem","1.25rem"];static SNAP_DELAY=90;static STORAGE_KEY="vb-reader";setup(){this.#w||(this.#Z(),this.#q(),this.#I(),this.#z(),this.#O(),this.#w=!0),this.#D(),this.#W(),this.#c(this.#t,!1),this.setAttribute("upgraded","")}teardown(){this.#p?.disconnect(),this.#p=null,this.removeAttribute("upgraded"),clearTimeout(this.#b),d.delete(this)}#q(){let t=this.getAttribute("mode");(t==="scroll"||t==="pages")&&(this.#t=t);let e=this.getAttribute("columns");e&&(this.#n=e)}#I(){let t=this.querySelector('[slot="chrome"]'),e=[...this.children].filter(h=>!h.matches('[slot="chrome"]')),s=document.createElement("header");s.className="reader-chrome",t?s.appendChild(t):s.innerHTML=this.#L();let i=document.createElement("div");i.className="reader-scroll";let a=document.createElement("div");a.className="reader-pager",a.setAttribute("role","region"),a.setAttribute("aria-label","Article pages");let n=document.createElement("div");n.className="reader-progress",n.setAttribute("aria-hidden","true");let l=document.createElement("nav");l.className="reader-page-nav",l.setAttribute("aria-label","Page navigation"),l.innerHTML=`
+var c=class extends HTMLElement{#t=[];#e;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,i){t.addEventListener(e,s,i),this.#t.push(()=>t.removeEventListener(e,s,i))}setup(){}teardown(){}setState(t,e){this.#e||(this.#e=this.attachInternals());let s=this.#e.states;try{e?s.add(t):s.delete(t)}catch{let i=`--${t}`;e?s.add(i):s.delete(i)}}_adoptInternals(t){this.#e||(this.#e=t)}};var d=new Set,u=class h extends c{#t="scroll";#e=0;#a=1;#r=2;#n="auto";#l=[0];#o=null;#s=null;#i=null;#E=null;#m=null;#g=!1;#c=null;#w=!1;#b=null;#f=null;static FONT_SIZES=["0.875rem","0.9375rem","1rem","1.0625rem","1.125rem","1.25rem"];static SNAP_DELAY=90;static STORAGE_KEY="vb-reader";setup(){this.#w||(this.#Z(),this.#I(),this.#q(),this.#z(),this.#O(),this.#w=!0),this.#D(),this.#W(),this.#d(this.#t,!1),this.setAttribute("upgraded","")}teardown(){this.#m?.disconnect(),this.#m=null,this.removeAttribute("upgraded"),this.#c!==null&&clearTimeout(this.#c),d.delete(this)}#I(){let t=this.getAttribute("mode");(t==="scroll"||t==="pages")&&(this.#t=t);let e=this.getAttribute("columns");e&&(this.#n=e)}#q(){let t=this.querySelector('[slot="chrome"]'),e=[...this.children].filter(l=>!l.matches('[slot="chrome"]')),s=document.createElement("header");s.className="reader-chrome",t?s.appendChild(t):s.innerHTML=this.#L();let i=document.createElement("div");i.className="reader-scroll";let a=document.createElement("div");a.className="reader-pager",a.setAttribute("role","region"),a.setAttribute("aria-label","Article pages");let n=document.createElement("div");n.className="reader-progress",n.setAttribute("aria-hidden","true");let o=document.createElement("nav");o.className="reader-page-nav",o.setAttribute("aria-label","Page navigation"),o.innerHTML=`
       <button class="reader-nav-btn" data-reader-action="prev-page" type="button" aria-label="Previous page">\u2190</button>
       <output class="reader-page-indicator" data-reader-output="page-indicator" aria-live="polite">1 / 1</output>
       <button class="reader-nav-btn" data-reader-action="next-page" type="button" aria-label="Next page">\u2192</button>
-    `,e.forEach(h=>i.appendChild(h)),this.textContent="",this.appendChild(s),this.appendChild(n);let r=document.createElement("main");r.className="reader-book",r.style.position="relative",r.style.minHeight="0",r.style.overflow="hidden",r.appendChild(i),r.appendChild(a),r.appendChild(l),this.appendChild(r),this.#e=i,this.#i=a,this.#m=l}#L(){let t=this.#F(),e=this.getAttribute("font-controls")!=="false",s=this.getAttribute("col-controls")!=="false",i=`
+    `,e.forEach(l=>i.appendChild(l)),this.textContent="",this.appendChild(s),this.appendChild(n);let r=document.createElement("main");r.className="reader-book",r.style.position="relative",r.style.minHeight="0",r.style.overflow="hidden",r.appendChild(i),r.appendChild(a),r.appendChild(o),this.appendChild(r),this.#i=i,this.#s=a,this.#E=o}#L(){let t=this.#F(),e=this.getAttribute("font-controls")!=="false",s=this.getAttribute("col-controls")!=="false",i=`
       <div class="reader-chrome-copy">
         <span class="reader-chrome-kicker">Reader</span>
         <span class="reader-chrome-title">${this.#V(t)}</span>
@@ -24,5 +24,5 @@ var c=class extends HTMLElement{#t=[];connectedCallback(){this.hasAttribute("dat
           <button class="reader-seg-btn" data-reader-action="set-columns" data-reader-value="1" type="button">1</button>
           <button class="reader-seg-btn" data-reader-action="set-columns" data-reader-value="2" type="button">2</button>
           <button class="reader-seg-btn" data-reader-action="set-columns" data-reader-value="3" type="button">3</button>
-        </div>`),i+="</div>",i}#F(){if(this.getAttribute("reader-title"))return this.getAttribute("reader-title");let t=this.querySelector("h1");return t?t.textContent.trim():document.title||"Reader"}#z(){if(this.#r=this.#e.querySelector(":scope > layout-columns"),this.#r)return;let t=document.createElement("layout-columns");[...this.#e.children].forEach(s=>t.appendChild(s)),this.#e.appendChild(t),this.#r=t}#c(t,e=!0){let s=this.#u();if(this.#t=t,this.setAttribute("mode",t),t==="pages"){for(let a of d)a!==this&&a.#c("scroll",!1);d.add(this),this.#i.appendChild(this.#r),this.#i.style.display="block",this.#e.style.display="none",this.#m.style.display="flex",this.#y(),this.#k(),requestAnimationFrame(()=>{this.#d(s)})}else d.delete(this),this.#e.appendChild(this.#r),this.#i.style.display="none",this.#e.style.display="",this.#m.style.display="none",this.#r.style.removeProperty("column-count"),this.#r.style.removeProperty("column-width"),requestAnimationFrame(()=>{let a=this.#e.scrollHeight-this.#e.clientHeight;this.#e.scrollTop=a>0?s*a:0,this.#A()});this.#N(),this.#S(),this.#E("reader-view:mode",{mode:t})}#H(){if(this.#n!=="auto")return Number(this.#n);let t=this.#i?.clientWidth||window.innerWidth;return t>=1680?3:t>=960?2:1}#y(){let t=this.#H();this.#r.style.setProperty("column-count",String(t)),this.#r.style.setProperty("column-width","auto"),this.setAttribute("columns",this.#n)}#d(t=this.#u()){if(this.#t!=="pages")return;let e=this.#i,s=e.clientWidth||1,i=e.scrollWidth,a=Math.max(0,i-s),n=i/s,l=Math.max(1,Math.ceil(n-.01));this.#l=[];for(let r=0;r<l;r++){let h=r===l-1?a:Math.min(r*s,a);(!this.#l.length||h-this.#l[this.#l.length-1]>1)&&this.#l.push(h)}this.#a=Math.max(1,this.#l.length),this.#s=this.#a>1?Math.min(Math.round(t*(this.#a-1)),this.#a-1):0,this.#h(this.#s,!1)}#h(t,e=!0){this.#s=Math.max(0,Math.min(t,this.#a-1));let s=this.#l[this.#s]??0;this.#g=!0;let i=e&&!this.#K();this.#i.scrollTo({left:s,behavior:i?"smooth":"instant"}),this.#x(),setTimeout(()=>{this.#g=!1},i?220:0)}#C(t){let e=0,s=1/0;return this.#l.forEach((i,a)=>{let n=Math.abs(i-t);n<s&&(s=n,e=a)}),e}#u(){if(this.#t==="scroll"){if(!this.#e)return 0;let e=this.#e.scrollHeight-this.#e.clientHeight;return e>0?this.#e.scrollTop/e:0}if(!this.#i)return 0;let t=this.#i.scrollWidth-this.#i.clientWidth;return t>0?this.#i.scrollLeft/t:0}#x(){let t=this.#a>1?this.#s/(this.#a-1):1;this.#T(t),this.querySelectorAll('[data-reader-output="page-indicator"]').forEach(e=>{e.textContent=`${this.#s+1} / ${this.#a}`}),this.querySelectorAll('[data-reader-action="prev-page"]').forEach(e=>{e.toggleAttribute("disabled",this.#s===0)}),this.querySelectorAll('[data-reader-action="next-page"]').forEach(e=>{e.toggleAttribute("disabled",this.#s===this.#a-1)}),this.#E("reader-view:page",{page:this.#s+1,total:this.#a})}#A(){if(this.#t!=="scroll"||!this.#e)return;let t=this.#e.scrollHeight-this.#e.clientHeight,e=t>0?this.#e.scrollTop/t:1;this.#T(e)}#T(t){this.style.setProperty("--_progress",String(t))}#k(){this.#r&&(this.#r.style.fontSize=o.FONT_SIZES[this.#o])}#P(t){let e=this.#o+t;if(e<0||e>=o.FONT_SIZES.length)return;this.#o=e;let s=this.#u();this.#k(),this.#M(),this.#t==="pages"&&requestAnimationFrame(()=>this.#d(s)),this.#S(),this.#E("reader-view:font",{size:o.FONT_SIZES[this.#o],index:this.#o})}#M(){this.querySelectorAll('[data-reader-action="font-decrease"]').forEach(t=>{t.toggleAttribute("disabled",this.#o===0)}),this.querySelectorAll('[data-reader-action="font-increase"]').forEach(t=>{t.toggleAttribute("disabled",this.#o===o.FONT_SIZES.length-1)})}#O(){this.addEventListener("click",t=>{let e=t.target.closest("[data-reader-action]");if(!e)return;switch(e.dataset.readerAction){case"toggle-mode":this.#c(this.#t==="scroll"?"pages":"scroll");break;case"set-mode-scroll":this.#c("scroll");break;case"set-mode-pages":this.#c("pages");break;case"font-increase":this.#P(1);break;case"font-decrease":this.#P(-1);break;case"set-columns":{let i=this.#u();this.#n=e.dataset.readerValue??"auto",this.#y(),this.#N(),this.#t==="pages"&&requestAnimationFrame(()=>this.#d(i)),this.#S();break}case"prev-page":this.#h(this.#s-1);break;case"next-page":this.#h(this.#s+1);break}}),this.#e.addEventListener("scroll",()=>this.#A(),{passive:!0}),this.#i.addEventListener("scroll",()=>{if(this.#t!=="pages")return;let t=this.#C(this.#i.scrollLeft);t!==this.#s&&(this.#s=t,this.#x()),!this.#g&&(clearTimeout(this.#b),this.#b=setTimeout(()=>{this.#h(this.#C(this.#i.scrollLeft),!1)},o.SNAP_DELAY))},{passive:!0}),this.#f=this.#R.bind(this)}#R(t){if(this.#t==="pages"&&!t.target?.matches?.("input, textarea, select, button, a, [contenteditable]"))switch(t.key){case"ArrowRight":case"PageDown":case" ":t.preventDefault(),this.#h(this.#s+1);break;case"ArrowLeft":case"PageUp":t.preventDefault(),this.#h(this.#s-1);break;case"Home":t.preventDefault(),this.#h(0,!1);break;case"End":t.preventDefault(),this.#h(this.#a-1,!1);break}}#D(){this.#p=new ResizeObserver(()=>{this.#t==="pages"?requestAnimationFrame(()=>{this.#y(),this.#d(this.#u())}):this.#A()}),this.#p.observe(this.#i)}#W(){this.#f&&this.listen(document,"keydown",this.#f),window.visualViewport&&(this.#v=()=>{this.#t==="pages"&&requestAnimationFrame(()=>this.#d())},this.listen(window.visualViewport,"resize",this.#v),this.listen(window.visualViewport,"scroll",this.#v))}#S(){if(this.getAttribute("persist")==="false")return;let t=this.getAttribute("storage-key")||o.STORAGE_KEY;try{localStorage.setItem(t,JSON.stringify({mode:this.#t,sizeIdx:this.#o,columns:this.#n}))}catch{}}#Z(){if(this.getAttribute("persist")==="false")return;let t=this.getAttribute("storage-key")||o.STORAGE_KEY;try{let e=JSON.parse(localStorage.getItem(t)??"null");if(!e)return;(e.mode==="scroll"||e.mode==="pages")&&(this.#t=e.mode),typeof e.sizeIdx=="number"&&e.sizeIdx>=0&&e.sizeIdx<o.FONT_SIZES.length&&(this.#o=e.sizeIdx),e.columns&&(this.#n=e.columns)}catch{}}#N(){this.querySelectorAll('[data-reader-action="set-mode-scroll"]').forEach(t=>{let e=this.#t==="scroll";t.setAttribute("data-reader-state",e?"active":""),t.setAttribute("aria-pressed",String(e))}),this.querySelectorAll('[data-reader-action="set-mode-pages"]').forEach(t=>{let e=this.#t==="pages";t.setAttribute("data-reader-state",e?"active":""),t.setAttribute("aria-pressed",String(e))}),this.querySelectorAll('[data-reader-action="set-columns"]').forEach(t=>{let e=t.dataset.readerValue===this.#n;t.setAttribute("data-reader-state",e?"active":"")}),this.#M(),this.querySelectorAll('[data-reader-output="mode-label"]').forEach(t=>{t.textContent=this.#t==="scroll"?"Scroll":"Pages"})}#E(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}#K(){return window.matchMedia("(prefers-reduced-motion: reduce)").matches}#V(t){let e=document.createElement("div");return e.textContent=t,e.innerHTML}};customElements.define("reader-view",u);
+        </div>`),i+="</div>",i}#F(){if(this.getAttribute("reader-title"))return this.getAttribute("reader-title");let t=this.querySelector("h1");return t?t.textContent.trim():document.title||"Reader"}#z(){let t=this.#i;if(!t||(this.#o=t.querySelector(":scope > layout-columns"),this.#o))return;let e=document.createElement("layout-columns");[...t.children].forEach(i=>e.appendChild(i)),t.appendChild(e),this.#o=e}#d(t,e=!0){let s=this.#p();this.#t=t,this.setAttribute("mode",t);let i=t==="pages",a=this.#i,n=this.#s,o=this.#o,r=this.#E;if(!(!a||!n||!o||!r)){if(i){for(let l of d)l!==this&&l.#d("scroll",!1);d.add(this),n.appendChild(o),n.style.display="block",a.style.display="none",r.style.display="flex",this.#v(),this.#k(),requestAnimationFrame(()=>{this.#u(s)})}else d.delete(this),a.appendChild(o),n.style.display="none",a.style.display="",r.style.display="none",o.style.removeProperty("column-count"),o.style.removeProperty("column-width"),requestAnimationFrame(()=>{let l=a.scrollHeight-a.clientHeight;a.scrollTop=l>0?s*l:0,this.#y()});this.#N(),this.#A(),this.#S("reader-view:mode",{mode:t})}}#H(){if(this.#n!=="auto")return Number(this.#n);let t=this.#s?.clientWidth||window.innerWidth;return t>=1680?3:t>=960?2:1}#v(){let t=this.#H();this.#o&&(this.#o.style.setProperty("column-count",String(t)),this.#o.style.setProperty("column-width","auto"),this.setAttribute("columns",this.#n))}#u(t=this.#p()){if(this.#t!=="pages")return;let e=this.#s;if(!e)return;let s=e.clientWidth||1,i=e.scrollWidth,a=Math.max(0,i-s),n=i/s,o=Math.max(1,Math.ceil(n-.01));this.#l=[];for(let r=0;r<o;r++){let l=r===o-1?a:Math.min(r*s,a);(!this.#l.length||l-this.#l[this.#l.length-1]>1)&&this.#l.push(l)}this.#a=Math.max(1,this.#l.length),this.#e=this.#a>1?Math.min(Math.round(t*(this.#a-1)),this.#a-1):0,this.#h(this.#e,!1)}#h(t,e=!0){this.#e=Math.max(0,Math.min(t,this.#a-1));let s=this.#l[this.#e]??0;this.#g=!0;let i=e&&!this.#K();this.#s?.scrollTo({left:s,behavior:i?"smooth":"instant"}),this.#x(),setTimeout(()=>{this.#g=!1},i?220:0)}#C(t){let e=0,s=1/0;return this.#l.forEach((i,a)=>{let n=Math.abs(i-t);n<s&&(s=n,e=a)}),e}#p(){if(this.#t==="scroll"){if(!this.#i)return 0;let e=this.#i.scrollHeight-this.#i.clientHeight;return e>0?this.#i.scrollTop/e:0}if(!this.#s)return 0;let t=this.#s.scrollWidth-this.#s.clientWidth;return t>0?this.#s.scrollLeft/t:0}#x(){let t=this.#a>1?this.#e/(this.#a-1):1;this.#T(t),this.querySelectorAll('[data-reader-output="page-indicator"]').forEach(e=>{e.textContent=`${this.#e+1} / ${this.#a}`}),this.querySelectorAll('[data-reader-action="prev-page"]').forEach(e=>{e.toggleAttribute("disabled",this.#e===0)}),this.querySelectorAll('[data-reader-action="next-page"]').forEach(e=>{e.toggleAttribute("disabled",this.#e===this.#a-1)}),this.#S("reader-view:page",{page:this.#e+1,total:this.#a})}#y(){if(this.#t!=="scroll"||!this.#i)return;let t=this.#i.scrollHeight-this.#i.clientHeight,e=t>0?this.#i.scrollTop/t:1;this.#T(e)}#T(t){this.style.setProperty("--_progress",String(t))}#k(){this.#o&&(this.#o.style.fontSize=h.FONT_SIZES[this.#r])}#P(t){let e=this.#r+t;if(e<0||e>=h.FONT_SIZES.length)return;this.#r=e;let s=this.#p();this.#k(),this.#M(),this.#t==="pages"&&requestAnimationFrame(()=>this.#u(s)),this.#A(),this.#S("reader-view:font",{size:h.FONT_SIZES[this.#r],index:this.#r})}#M(){this.querySelectorAll('[data-reader-action="font-decrease"]').forEach(t=>{t.toggleAttribute("disabled",this.#r===0)}),this.querySelectorAll('[data-reader-action="font-increase"]').forEach(t=>{t.toggleAttribute("disabled",this.#r===h.FONT_SIZES.length-1)})}#O(){this.addEventListener("click",t=>{let s=t.target?.closest("[data-reader-action]");if(!s)return;switch(s.dataset.readerAction){case"toggle-mode":this.#d(this.#t==="scroll"?"pages":"scroll");break;case"set-mode-scroll":this.#d("scroll");break;case"set-mode-pages":this.#d("pages");break;case"font-increase":this.#P(1);break;case"font-decrease":this.#P(-1);break;case"set-columns":{let a=this.#p();this.#n=s.dataset.readerValue??"auto",this.#v(),this.#N(),this.#t==="pages"&&requestAnimationFrame(()=>this.#u(a)),this.#A();break}case"prev-page":this.#h(this.#e-1);break;case"next-page":this.#h(this.#e+1);break}}),this.#i?.addEventListener("scroll",()=>this.#y(),{passive:!0}),this.#s?.addEventListener("scroll",()=>{if(this.#t!=="pages")return;let t=this.#s;if(!t)return;let e=this.#C(t.scrollLeft);e!==this.#e&&(this.#e=e,this.#x()),!this.#g&&(this.#c!==null&&clearTimeout(this.#c),this.#c=setTimeout(()=>{this.#h(this.#C(t.scrollLeft),!1)},h.SNAP_DELAY))},{passive:!0}),this.#b=this.#R.bind(this)}#R(t){if(this.#t==="pages"&&!t.target?.matches?.("input, textarea, select, button, a, [contenteditable]"))switch(t.key){case"ArrowRight":case"PageDown":case" ":t.preventDefault(),this.#h(this.#e+1);break;case"ArrowLeft":case"PageUp":t.preventDefault(),this.#h(this.#e-1);break;case"Home":t.preventDefault(),this.#h(0,!1);break;case"End":t.preventDefault(),this.#h(this.#a-1,!1);break}}#D(){this.#m=new ResizeObserver(()=>{this.#t==="pages"?requestAnimationFrame(()=>{this.#v(),this.#u(this.#p())}):this.#y()}),this.#s&&this.#m.observe(this.#s)}#W(){this.#b&&this.listen(document,"keydown",this.#b),window.visualViewport&&(this.#f=()=>{this.#t==="pages"&&requestAnimationFrame(()=>this.#u())},this.listen(window.visualViewport,"resize",this.#f),this.listen(window.visualViewport,"scroll",this.#f))}#A(){if(this.getAttribute("persist")==="false")return;let t=this.getAttribute("storage-key")||h.STORAGE_KEY;try{localStorage.setItem(t,JSON.stringify({mode:this.#t,sizeIdx:this.#r,columns:this.#n}))}catch{}}#Z(){if(this.getAttribute("persist")==="false")return;let t=this.getAttribute("storage-key")||h.STORAGE_KEY;try{let e=JSON.parse(localStorage.getItem(t)??"null");if(!e)return;(e.mode==="scroll"||e.mode==="pages")&&(this.#t=e.mode),typeof e.sizeIdx=="number"&&e.sizeIdx>=0&&e.sizeIdx<h.FONT_SIZES.length&&(this.#r=e.sizeIdx),e.columns&&(this.#n=e.columns)}catch{}}#N(){this.querySelectorAll('[data-reader-action="set-mode-scroll"]').forEach(t=>{let e=this.#t==="scroll";t.setAttribute("data-reader-state",e?"active":""),t.setAttribute("aria-pressed",String(e))}),this.querySelectorAll('[data-reader-action="set-mode-pages"]').forEach(t=>{let e=this.#t==="pages";t.setAttribute("data-reader-state",e?"active":""),t.setAttribute("aria-pressed",String(e))}),this.querySelectorAll('[data-reader-action="set-columns"]').forEach(t=>{let e=t.dataset.readerValue===this.#n;t.setAttribute("data-reader-state",e?"active":"")}),this.#M(),this.querySelectorAll('[data-reader-output="mode-label"]').forEach(t=>{t.textContent=this.#t==="scroll"?"Scroll":"Pages"})}#S(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}#K(){return window.matchMedia("(prefers-reduced-motion: reduce)").matches}#V(t){let e=document.createElement("div");return e.textContent=t,e.innerHTML}};customElements.define("reader-view",u);
 //# sourceMappingURL=reader-view.js.map

package/dist/cdn/components/reading-progress.js

@@ -0,0 +1,2 @@
+var l=window.matchMedia("(prefers-reduced-motion: reduce)");var c=new Map;function d(i,e,t={}){let r=t.priority??10,s={impl:e,bundle:t.bundle,contract:t.contract,priority:r},n=c.get(i);if(customElements.get(i)){if(!n||n.priority>=r){n&&n.priority===r&&n.impl!==e&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${n.bundle}" (priority ${n.priority}). Skipping "${t.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${n.bundle}" cannot be replaced (customElements.define is permanent). "${t.bundle}" has higher priority but arrived late.`);return}if(n&&n.priority>=r){n.priority===r&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${n.bundle}". Skipping "${t.bundle}" (first wins at equal priority).`);return}c.set(i,s),customElements.define(i,e)}var o=class extends HTMLElement{#t=[];#e;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let e of this.#t)e();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,t,r,s){e.addEventListener(t,r,s),this.#t.push(()=>e.removeEventListener(t,r,s))}setup(){}teardown(){}setState(e,t){this.#e||(this.#e=this.attachInternals());let r=this.#e.states;try{t?r.add(e):r.delete(e)}catch{let s=`--${e}`;t?r.add(s):r.delete(s)}}_adoptInternals(e){this.#e||(this.#e=e)}};var a=class extends o{setup(){this.bar=this.querySelector("progress"),this.bar||(this.bar=document.createElement("progress"),this.bar.max=100,this.bar.value=0,this.bar.setAttribute("aria-label","Reading progress"),this.appendChild(this.bar));let e=this.dataset.for;if(this.target=e?document.getElementById(e):null,!this.target&&CSS.supports("animation-timeline","scroll(root block)"))return;this.#e();let r=()=>{this.#t||(this.#t=requestAnimationFrame(()=>{this.#t=0,this.#e()}))};this.listen(window,"scroll",r,{passive:!0}),this.listen(window,"resize",r,{passive:!0})}#t=0;#e(){let e=this.target?this.#n():this.#r(),t=Math.min(1,Math.max(0,e));this.style.setProperty("--vb-reading-progress",t.toFixed(4)),this.bar&&(this.bar.value=Math.round(t*100))}#r(){let e=document.documentElement.scrollHeight-window.innerHeight;return e>0?window.scrollY/e:0}#n(){if(!this.target)return 0;let e=this.target.getBoundingClientRect(),t=e.height-window.innerHeight;return t<=0?e.bottom<=window.innerHeight?1:0:-e.top/t}};d("reading-progress",a);export{a as ReadingProgress};
+//# sourceMappingURL=reading-progress.js.map

package/dist/cdn/components/recently-visited.js

@@ -1,13 +1,13 @@
-var $=window.matchMedia("(prefers-reduced-motion: reduce)");var y=new Map;function b(s,e,n={}){let t=n.priority??10,i={impl:e,bundle:n.bundle,contract:n.contract,priority:t},r=y.get(s);if(customElements.get(s)){if(!r||r.priority>=t){r&&r.priority===t&&r.impl!==e&&console.warn(`[VB Bundle] Tag <${s}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${n.bundle}".`);return}console.warn(`[VB Bundle] Tag <${s}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${n.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=t){r.priority===t&&console.warn(`[VB Bundle] Tag <${s}> already registered by "${r.bundle}". Skipping "${n.bundle}" (first wins at equal priority).`);return}y.set(s,i),customElements.define(s,e)}var c=class extends HTMLElement{#e=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let e of this.#e)e();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,n,t,i){e.addEventListener(n,t,i),this.#e.push(()=>e.removeEventListener(n,t,i))}setup(){}teardown(){}};var p=class s extends c{static STORAGE_KEY="vb:recently-visited";static PAUSE_KEY="vb:recently-visited:paused";static SHOW_ANCHORS_KEY="vb:recently-visited:show-anchors";setup(){this.#t(),this.#n()}disconnect(){this.#e&&(window.removeEventListener("storage",this.#e),this.#e=null)}#e=null;#n(){let e=new Set([s.STORAGE_KEY,s.PAUSE_KEY,s.SHOW_ANCHORS_KEY]);this.#e=n=>{e.has(n.key)&&this.#t()},window.addEventListener("storage",this.#e)}#s(){try{return localStorage.getItem(s.PAUSE_KEY)==="1"}catch{return!1}}#i(e){try{e?localStorage.setItem(s.PAUSE_KEY,"1"):localStorage.removeItem(s.PAUSE_KEY)}catch{}}#r(){try{return localStorage.getItem(s.SHOW_ANCHORS_KEY)==="1"}catch{return!1}}#o(e){try{e?localStorage.setItem(s.SHOW_ANCHORS_KEY,"1"):localStorage.removeItem(s.SHOW_ANCHORS_KEY)}catch{}}#a(){try{let e=localStorage.getItem(s.STORAGE_KEY);if(!e)return[];let n=JSON.parse(e);return Array.isArray(n)?n:[]}catch{return[]}}#c(e){try{localStorage.setItem(s.STORAGE_KEY,JSON.stringify(e))}catch{}}#l(){let e=parseInt(this.getAttribute("limit")||"25",10);return Number.isFinite(e)&&e>0?e:25}#u(e){let n=new Map;for(let t of e){let i=t.url,r=n.get(i);r||(r={url:i,title:t.title,ts:t.ts,anchors:[]},n.set(i,r)),t.ts>r.ts&&(r.ts=t.ts,t.title&&(r.title=t.title)),t.hash&&r.anchors.push({hash:t.hash,hashTitle:t.hashTitle||t.hash.slice(1)||t.hash,ts:t.ts})}for(let t of n.values())t.anchors.sort((i,r)=>r.ts-i.ts);return[...n.values()].sort((t,i)=>i.ts-t.ts)}#t(){let e=this.#a(),n=this.#u(e).slice(0,this.#l()),t=this.getAttribute("empty-text")||"No recently visited pages yet.",i=this.#s(),r=this.#r(),f=i?"Resume tracking":"Pause tracking",v=i?"play":"pause",m=r?"Hide anchor visits":"Show anchor visits",E=e.length===0,o=[];if(o.push('<header class="recently-visited-header">'),o.push('<h2 class="recently-visited-heading">Recently visited</h2>'),o.push('<menu class="recently-visited-actions">'),o.push(`<li><button type="button"
+var $=window.matchMedia("(prefers-reduced-motion: reduce)");var y=new Map;function b(r,e,s={}){let t=s.priority??10,i={impl:e,bundle:s.bundle,contract:s.contract,priority:t},n=y.get(r);if(customElements.get(r)){if(!n||n.priority>=t){n&&n.priority===t&&n.impl!==e&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${n.bundle}" (priority ${n.priority}). Skipping "${s.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${n.bundle}" cannot be replaced (customElements.define is permanent). "${s.bundle}" has higher priority but arrived late.`);return}if(n&&n.priority>=t){n.priority===t&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${n.bundle}". Skipping "${s.bundle}" (first wins at equal priority).`);return}y.set(r,i),customElements.define(r,e)}var c=class extends HTMLElement{#e=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let e of this.#e)e();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,s,t,i){e.addEventListener(s,t,i),this.#e.push(()=>e.removeEventListener(s,t,i))}setup(){}teardown(){}setState(e,s){this.#t||(this.#t=this.attachInternals());let t=this.#t.states;try{s?t.add(e):t.delete(e)}catch{let i=`--${e}`;s?t.add(i):t.delete(i)}}_adoptInternals(e){this.#t||(this.#t=e)}};var f=class r extends c{static STORAGE_KEY="vb:recently-visited";static PAUSE_KEY="vb:recently-visited:paused";static SHOW_ANCHORS_KEY="vb:recently-visited:show-anchors";setup(){this.#s(),this.#t()}get entries(){try{let e=localStorage.getItem(r.STORAGE_KEY);return e?JSON.parse(e):[]}catch{return[]}}disconnect(){this.#e&&(window.removeEventListener("storage",this.#e),this.#e=null)}#e=null;#t(){let e=new Set([r.STORAGE_KEY,r.PAUSE_KEY,r.SHOW_ANCHORS_KEY]);this.#e=s=>{s.key&&e.has(s.key)&&this.#s()},window.addEventListener("storage",this.#e)}#r(){try{return localStorage.getItem(r.PAUSE_KEY)==="1"}catch{return!1}}#i(e){try{e?localStorage.setItem(r.PAUSE_KEY,"1"):localStorage.removeItem(r.PAUSE_KEY)}catch{}}#n(){try{return localStorage.getItem(r.SHOW_ANCHORS_KEY)==="1"}catch{return!1}}#o(e){try{e?localStorage.setItem(r.SHOW_ANCHORS_KEY,"1"):localStorage.removeItem(r.SHOW_ANCHORS_KEY)}catch{}}#a(){try{let e=localStorage.getItem(r.STORAGE_KEY);if(!e)return[];let s=JSON.parse(e);return Array.isArray(s)?s:[]}catch{return[]}}#c(e){try{localStorage.setItem(r.STORAGE_KEY,JSON.stringify(e))}catch{}}#l(){let e=parseInt(this.getAttribute("limit")||"25",10);return Number.isFinite(e)&&e>0?e:25}#h(e){let s=new Map;for(let t of e){let i=t.url,n=s.get(i);n||(n={url:i,title:t.title,ts:t.ts,anchors:[]},s.set(i,n)),t.ts>n.ts&&(n.ts=t.ts,t.title&&(n.title=t.title)),t.hash&&n.anchors.push({hash:t.hash,hashTitle:t.hashTitle||t.hash.slice(1)||t.hash,ts:t.ts})}for(let t of s.values())t.anchors.sort((i,n)=>n.ts-i.ts);return[...s.values()].sort((t,i)=>i.ts-t.ts)}#s(){let e=this.#a(),s=this.#h(e).slice(0,this.#l()),t=this.getAttribute("empty-text")||"No recently visited pages yet.",i=this.#r(),n=this.#n(),p=i?"Resume tracking":"Pause tracking",g=i?"play":"pause",m=n?"Hide anchor visits":"Show anchor visits",E=e.length===0,o=[];if(o.push('<header class="recently-visited-header">'),o.push('<h2 class="recently-visited-heading">Recently visited</h2>'),o.push('<menu class="recently-visited-actions">'),o.push(`<li><button type="button"
         data-recently-visited-pause
         class="icon-button"
         aria-pressed="${i}"
-        aria-label="${f}"
-        title="${f}"
-      ><icon-wc name="${v}" size="sm"></icon-wc></button></li>`),o.push(`<li><button type="button"
+        aria-label="${p}"
+        title="${p}"
+      ><icon-wc name="${g}" size="sm"></icon-wc></button></li>`),o.push(`<li><button type="button"
         data-recently-visited-anchors
         class="icon-button"
-        aria-pressed="${r}"
+        aria-pressed="${n}"
         aria-label="${m}"
         title="${m}"
       ><icon-wc name="hash" size="sm"></icon-wc></button></li>`),o.push(`<li><button type="button"
@@ -16,12 +16,12 @@ var $=window.matchMedia("(prefers-reduced-motion: reduce)");var y=new Map;functi
         aria-label="Clear history"
         title="Clear history"
         ${E?"disabled":""}
-      ><icon-wc name="trash-2" size="sm"></icon-wc></button></li>`),o.push("</menu>"),o.push("</header>"),o.push('<p class="recently-visited-explainer"><small>Stored on this device only. Never sent to a server.</small></p>'),n.length===0)o.push(`<p class="recently-visited-empty">${l(t)}</p>`);else{o.push('<ol class="recently-visited-list">');for(let a of n)if(r&&a.anchors.length>0){let g=a.anchors.map(h=>`<li><a href="${u(a.url)}${u(h.hash)}">${l(h.hashTitle)}</a><small>${d(h.ts)}</small></li>`).join(""),S=a.anchors.length===1?"1 anchor":`${a.anchors.length} anchors`;o.push(`<li class="has-anchors"><details>
+      ><icon-wc name="trash-2" size="sm"></icon-wc></button></li>`),o.push("</menu>"),o.push("</header>"),o.push('<p class="recently-visited-explainer"><small>Stored on this device only. Never sent to a server.</small></p>'),s.length===0)o.push(`<p class="recently-visited-empty">${l(t)}</p>`);else{o.push('<ol class="recently-visited-list">');for(let a of s)if(n&&a.anchors.length>0){let v=a.anchors.map(u=>`<li><a href="${h(a.url)}${h(u.hash)}">${l(u.hashTitle)}</a><small>${d(u.ts)}</small></li>`).join(""),S=a.anchors.length===1?"1 anchor":`${a.anchors.length} anchors`;o.push(`<li class="has-anchors"><details>
             <summary>
-              <a href="${u(a.url)}">${l(a.title||a.url)}</a>
+              <a href="${h(a.url)}">${l(a.title||a.url)}</a>
               <small>${S} &middot; ${d(a.ts)}</small>
             </summary>
-            <ul class="recently-visited-anchors">${g}</ul>
-          </details></li>`)}else o.push(`<li><a href="${u(a.url)}">${l(a.title||a.url)}</a><small>${d(a.ts)}</small></li>`);o.push("</ol>")}this.innerHTML=o.join(`
-`),this.#h()}#h(){let e=this.querySelector("[data-recently-visited-clear]");e&&e.addEventListener("click",()=>{this.#c([]),this.#t(),this.dispatchEvent(new CustomEvent("recently-visited:clear",{bubbles:!0}))});let n=this.querySelector("[data-recently-visited-pause]");n&&n.addEventListener("click",()=>{this.#i(!this.#s()),this.#t(),this.dispatchEvent(new CustomEvent("recently-visited:pause-toggle",{bubbles:!0,detail:{paused:this.#s()}}))});let t=this.querySelector("[data-recently-visited-anchors]");t&&t.addEventListener("click",()=>{this.#o(!this.#r()),this.#t(),this.dispatchEvent(new CustomEvent("recently-visited:anchors-toggle",{bubbles:!0,detail:{showAnchors:this.#r()}}))})}};function l(s){return String(s??"").replace(/[&<>]/g,e=>({"&":"&amp;","<":"&lt;",">":"&gt;"})[e])}function u(s){return String(s??"").replace(/[&<>"]/g,e=>({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;"})[e])}function d(s){let e=Date.now()-s;return e<6e4?"just now":e<36e5?`${Math.floor(e/6e4)}m ago`:e<864e5?`${Math.floor(e/36e5)}h ago`:`${Math.floor(e/864e5)}d ago`}b("recently-visited",p);export{p as RecentlyVisited};
+            <ul class="recently-visited-anchors">${v}</ul>
+          </details></li>`)}else o.push(`<li><a href="${h(a.url)}">${l(a.title||a.url)}</a><small>${d(a.ts)}</small></li>`);o.push("</ol>")}this.innerHTML=o.join(`
+`),this.#u()}#u(){let e=this.querySelector("[data-recently-visited-clear]");e&&e.addEventListener("click",()=>{this.#c([]),this.#s(),this.dispatchEvent(new CustomEvent("recently-visited:clear",{bubbles:!0}))});let s=this.querySelector("[data-recently-visited-pause]");s&&s.addEventListener("click",()=>{this.#i(!this.#r()),this.#s(),this.dispatchEvent(new CustomEvent("recently-visited:pause-toggle",{bubbles:!0,detail:{paused:this.#r()}}))});let t=this.querySelector("[data-recently-visited-anchors]");t&&t.addEventListener("click",()=>{this.#o(!this.#n()),this.#s(),this.dispatchEvent(new CustomEvent("recently-visited:anchors-toggle",{bubbles:!0,detail:{showAnchors:this.#n()}}))})}};function l(r){return String(r??"").replace(/[&<>]/g,e=>({"&":"&amp;","<":"&lt;",">":"&gt;"})[e])}function h(r){return String(r??"").replace(/[&<>"]/g,e=>({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;"})[e])}function d(r){let e=Date.now()-r;return e<6e4?"just now":e<36e5?`${Math.floor(e/6e4)}m ago`:e<864e5?`${Math.floor(e/36e5)}h ago`:`${Math.floor(e/864e5)}d ago`}b("recently-visited",f);export{f as RecentlyVisited};
 //# sourceMappingURL=recently-visited.js.map

package/dist/cdn/components/requirement-card.js

@@ -0,0 +1,122 @@
+var c=`
+  :host {
+    --_padding:        var(--requirement-card-padding, var(--size-m, 1rem));
+    --_radius:         var(--requirement-card-radius, var(--radius-m, 0.5rem));
+    --_gap:            var(--requirement-card-gap, var(--size-2xs, 0.25rem));
+    --_surface:        var(--requirement-card-surface, var(--color-surface, #fff));
+    --_border:         var(--requirement-card-border, 1px solid var(--color-border, #e5e7eb));
+    --_text:           var(--requirement-card-text, var(--color-text, #1a1a1a));
+    --_muted:          var(--requirement-card-muted, var(--color-text-muted, #6b7280));
+    --_critical-bg:    var(--requirement-card-critical-bg,    var(--color-error-subtle, oklch(95% 0.05 27)));
+    --_critical-fg:    var(--requirement-card-critical-fg,    var(--color-error, #dc2626));
+    --_important-bg:   var(--requirement-card-important-bg,   var(--color-warning-subtle, oklch(95% 0.05 80)));
+    --_important-fg:   var(--requirement-card-important-fg,   var(--color-warning, #b45309));
+    --_acceptable-bg:  var(--requirement-card-acceptable-bg,  var(--color-success-subtle, oklch(95% 0.05 145)));
+    --_acceptable-fg:  var(--requirement-card-acceptable-fg,  var(--color-success, #15803d));
+    --_skipped-bg:     var(--requirement-card-skipped-bg,     var(--color-surface-raised, var(--color-surface, #f5f5f5)));
+    --_skipped-fg:     var(--requirement-card-skipped-fg,     var(--color-text-muted, #6b7280));
+    --_conflict:       var(--requirement-card-conflict-color, var(--color-error, #dc2626));
+
+    display: block;
+    padding: var(--_padding);
+    border-radius: var(--_radius);
+    background: var(--_surface);
+    border: var(--_border);
+    color: var(--_text);
+    container-type: inline-size;
+  }
+
+  .card {
+    display: grid;
+    gap: var(--_gap);
+  }
+
+  .head {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: var(--size-s, 0.75rem);
+  }
+
+  .name {
+    font-weight: var(--font-weight-semibold, 600);
+    font-size: var(--font-size-md, 1rem);
+  }
+
+  .badge ::slotted([slot="badge"]) {
+    font-size: var(--font-size-xs, 0.75em);
+    color: var(--_muted);
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+  }
+
+  .pill ::slotted([slot="priority-pill"]),
+  .priority-default {
+    display: inline-block;
+    padding: 0.15em 0.6em;
+    border-radius: var(--radius-pill, 999px);
+    font-size: var(--font-size-xs, 0.75em);
+    font-weight: var(--font-weight-semibold, 600);
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+  }
+
+  /* Priority-driven surface tinting on the card itself (when no slotted pill) */
+  :host(:state(priority-critical))     { border-color: var(--_critical-fg); }
+  :host(:state(priority-important))    { border-color: var(--_important-fg); }
+  :host(:state(priority-acceptable))   { border-color: var(--_acceptable-fg); }
+  :host(:state(priority-not-relevant)) { opacity: 0.6; }
+
+  :host(:state(priority-critical))     .priority-default { background: var(--_critical-bg);    color: var(--_critical-fg); }
+  :host(:state(priority-important))    .priority-default { background: var(--_important-bg);   color: var(--_important-fg); }
+  :host(:state(priority-acceptable))   .priority-default { background: var(--_acceptable-bg);  color: var(--_acceptable-fg); }
+  :host(:state(priority-not-relevant)) .priority-default { background: var(--_skipped-bg);     color: var(--_skipped-fg); text-decoration: line-through; }
+
+  /* Hide the default pill when the author supplied one via slot */
+  :host(:state(has-priority-pill)) .priority-default { display: none; }
+
+  .rationale ::slotted([slot="rationale"]) {
+    color: var(--_muted);
+    font-size: var(--font-size-sm, 0.875rem);
+    line-height: 1.45;
+  }
+
+  .conflicts ::slotted([slot="conflicts"]) {
+    color: var(--_conflict);
+    font-size: var(--font-size-sm, 0.875rem);
+    font-weight: var(--font-weight-semibold, 600);
+  }
+
+  /* When no rationale or conflicts content, collapse the slot row */
+  :host(:not(:state(has-rationale))) .rationale,
+  :host(:not(:state(has-conflicts))) .conflicts { display: none; }
+
+  /* Conflict flag */
+  :host([data-conflict]) {
+    border-color: var(--_conflict);
+    box-shadow: inset 0 0 0 1px var(--_conflict);
+  }
+
+  /* Interactive: bubble click event so parents can wire up navigation */
+  :host { cursor: default; }
+  :host(:state(interactive)) { cursor: pointer; }
+  :host(:state(interactive)):hover { background: color-mix(in oklab, var(--_surface) 92%, currentColor 8%); }
+  :host(:focus-visible) {
+    outline: 2px solid var(--color-focus-ring, var(--color-interactive, currentColor));
+    outline-offset: 2px;
+  }
+`;var s=class extends HTMLElement{#e=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#e)t();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,r,a){t.addEventListener(e,r,a),this.#e.push(()=>t.removeEventListener(e,r,a))}setup(){}teardown(){}setState(t,e){this.#t||(this.#t=this.attachInternals());let r=this.#t.states;try{e?r.add(t):r.delete(t)}catch{let a=`--${t}`;e?r.add(a):r.delete(a)}}_adoptInternals(t){this.#t||(this.#t=t)}};var v=window.matchMedia("(prefers-reduced-motion: reduce)");var l=new Map;function d(i,t,e={}){let r=e.priority??10,a={impl:t,bundle:e.bundle,contract:e.contract,priority:r},o=l.get(i);if(customElements.get(i)){if(!o||o.priority>=r){o&&o.priority===r&&o.impl!==t&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${o.bundle}" (priority ${o.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${o.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(o&&o.priority>=r){o.priority===r&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${o.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}l.set(i,a),customElements.define(i,t)}var p=Object.freeze(["critical","important","acceptable","not-relevant"]),f=Object.freeze({critical:"Critical",important:"Important",acceptable:"Acceptable","not-relevant":"Not relevant"}),u=["badge","priority-pill","rationale","conflicts"],h=`
+  <style>${c}</style>
+  <article class="card" part="card">
+    <header class="head" part="head">
+      <span class="name" part="name"><slot name="name"></slot></span>
+      <span class="badge" part="badge"><slot name="badge"></slot></span>
+    </header>
+    <span class="pill" part="pill">
+      <slot name="priority-pill"><span class="priority-default" part="priority-default" data-priority-default></span></slot>
+    </span>
+    <p class="rationale" part="rationale"><slot name="rationale"></slot></p>
+    <p class="conflicts" part="conflicts"><slot name="conflicts"></slot></p>
+  </article>
+`,n=class extends s{static get observedAttributes(){return["data-priority","data-conflict","tabindex"]}setup(){if(this.shadowRoot)for(let t of u){let e=this.shadowRoot.querySelector(`slot[name="${t}"]`);this.#t(t,e)}else{let t=this.attachShadow({mode:"open"});t.innerHTML=h;for(let e of u){let r=t.querySelector(`slot[name="${e}"]`);r?.addEventListener("slotchange",()=>this.#t(e,r)),this.#t(e,r)}}this.#r(),this.#o(),this.#a(),this.listen(this,"click",t=>this.#i(t)),this.listen(this,"keydown",t=>{let e=t;(e.key==="Enter"||e.key===" ")&&this.#e&&(e.preventDefault(),this.#i(e))})}attributeChangedCallback(t){this.isConnected&&(t==="data-priority"?(this.#r(),this.#o()):t==="data-conflict"||t==="tabindex"&&this.#a())}get priority(){return(this.dataset.priority||"").toLowerCase()}set priority(t){let e=String(t||"").toLowerCase();p.includes(e)?this.dataset.priority=e:delete this.dataset.priority}get hasConflict(){return this.hasAttribute("data-conflict")}set hasConflict(t){t?this.setAttribute("data-conflict",""):this.removeAttribute("data-conflict")}get#e(){return this.hasAttribute("tabindex")||this.closest("a[href], button")}#t(t,e){let r=!!e&&e.assignedNodes({flatten:!0}).some(a=>a.nodeType===Node.ELEMENT_NODE||a.nodeType===Node.TEXT_NODE&&a.textContent.trim().length>0);this.setState(`has-${t}`,r)}#r(){let t=(this.dataset.priority||"").toLowerCase();for(let e of p)this.setState(`priority-${e}`,e===t)}#o(){let t=(this.dataset.priority||"").toLowerCase(),e=this.shadowRoot?.querySelector("[data-priority-default]");e&&(e.textContent=f[t]||"")}#a(){this.setState("interactive",!!this.#e)}#i(t){this.#e&&this.dispatchEvent(new CustomEvent("requirement-card:click",{bubbles:!0,composed:!0,detail:{priority:this.priority||null,hasConflict:this.hasConflict,originalEvent:t}}))}};d("requirement-card",n);export{n as RequirementCard};
+//# sourceMappingURL=requirement-card.js.map