vanilla-breeze 0.1.1 → 0.1.2

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

@@ -1,7 +1,7 @@
-var m=window.matchMedia("(prefers-reduced-motion: reduce)");var f=new Map;function g(l,e,i={}){let t=i.priority??10,n={impl:e,bundle:i.bundle,contract:i.contract,priority:t},s=f.get(l);if(customElements.get(l)){if(!s||s.priority>=t){s&&s.priority===t&&s.impl!==e&&console.warn(`[VB Bundle] Tag <${l}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${i.bundle}".`);return}console.warn(`[VB Bundle] Tag <${l}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${i.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=t){s.priority===t&&console.warn(`[VB Bundle] Tag <${l}> already registered by "${s.bundle}". Skipping "${i.bundle}" (first wins at equal priority).`);return}f.set(l,n),customElements.define(l,e)}var u=class extends HTMLElement{#n=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&this.setAttribute("data-upgraded","")}disconnectedCallback(){for(let e of this.#n)e();this.#n=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,i,t,n){e.addEventListener(i,t,n),this.#n.push(()=>e.removeEventListener(i,t,n))}setup(){}teardown(){}};var p=class extends u{#n=null;#w=null;#c=[];#t="";#a=0;#l=null;#f=null;#x=null;#g=null;#s=!1;#i=!1;#A=0;#e=null;#o=null;#h=null;#d=null;#u=null;#m=null;#F=null;static get observedAttributes(){return["speed","voice","for"]}attributeChangedCallback(e,i,t){if(i!==t&&(e==="for"&&(this.stop(),this.#k()),(e==="speed"||e==="voice")&&this.#s&&this.#y(),e==="speed"&&this.#u)){let n=this.#E(parseFloat(t)||1);this.#u.value=String(n),this.#m&&(this.#m.textContent=`${n}\xD7`)}}setup(){if(!("speechSynthesis"in window))return this.style.display="none",!1;this.#I(),this.#k(),this.#H(),this.#g=this.#T(),this.#g.then(e=>this.#j(e)),this.listen(window,"beforeunload",this.#D)}teardown(){this.stop(),this.#q()}play(){if(this.#i){this.resume();return}this.#s||this.#$(0)}pause(){!this.#s||this.#i||(speechSynthesis.pause(),this.#i=!0,this.#V(!0),this.#r("text-reader:pause"))}resume(){this.#i&&(speechSynthesis.resume(),this.#i=!1,this.#V(!1),this.#r("text-reader:resume"))}stop(){speechSynthesis.cancel(),this.#v(),this.#r("text-reader:stop")}get voices(){return this.#g||this.#T()}get speaking(){return this.#s}get paused(){return this.#i}get progress(){return this.#t.length?Math.min(this.#a/this.#t.length,1):0}#I(){let e=document.createElement("div");e.setAttribute("part","controls"),e.setAttribute("role","group"),e.setAttribute("aria-label","Article reader");let i=this.#b("play",this.getAttribute("label-play")||"Play","\u25B6");i.addEventListener("click",()=>this.play());let t=this.#b("pause",this.getAttribute("label-pause")||"Pause","\u23F8");t.hidden=!0,t.addEventListener("click",()=>this.pause());let n=this.#b("stop",this.getAttribute("label-stop")||"Stop","\u23F9");n.disabled=!0,n.addEventListener("click",()=>this.stop());let s=document.createElement("select");s.setAttribute("aria-label","Voice");let r=document.createElement("option");r.textContent="Loading voices\u2026",s.append(r),s.addEventListener("change",()=>{this.#s&&this.#y()});let h=document.createElement("label");h.setAttribute("data-speed-group","");let o=document.createElement("span");o.setAttribute("data-speed-value","");let a=this.#E(parseFloat(this.getAttribute("speed")??"1")||1);o.textContent=`${a}\xD7`;let c=document.createElement("input");c.type="range",c.min="0.5",c.max="2",c.step="0.1",c.value=String(a),c.setAttribute("aria-label","Speed"),c.addEventListener("input",()=>{let d=parseFloat(c.value);o.textContent=`${d}\xD7`,this.#s&&this.#y()}),h.append(o,c),this.#S("icon-play",i),this.#S("icon-pause",t),this.#S("icon-stop",n),e.append(i,t,n,s,h),this.prepend(e),this.#F=e,this.#e=i,this.#o=t,this.#h=n,this.#d=s,this.#u=c,this.#m=o}#b(e,i,t){let n=document.createElement("button");return n.type="button",n.setAttribute("part",`button ${e}`),n.setAttribute("aria-label",i),n.textContent=t,n}#S(e,i){let t=this.querySelector(`[slot="${e}"]`);t&&(t.removeAttribute("slot"),i.textContent="",i.append(t))}#k(){let e=this.getAttribute("for");if(!e){console.warn('<text-reader>: missing "for" attribute'),this.#C();return}if(this.#n=document.getElementById(e),!this.#n){console.warn(`<text-reader>: no element found with id="${e}"`),this.#C();return}this.#P(),this.#N()}#C(){this.#e&&(this.#e.disabled=!0),this.#h&&(this.#h.disabled=!0)}#N(){this.#e&&(this.#e.disabled=!1)}#P(){let e=this.#n;if(!e)return;let i=this.getAttribute("selectors")||"p,li",t=[...e.querySelectorAll(i)],n=r=>r.closest("pre")||r.closest("code")||r.closest('[aria-hidden="true"]');this.#c=[];let s=0;for(let r of t){if(n(r))continue;let h=r.textContent.trim();h&&(this.#c.push({element:r,text:h,speechStart:s,speechEnd:s+h.length}),s+=h.length+1)}this.#t=this.#c.map(r=>r.text).join(" ")}#$(e){if(!this.#t)return;let i=e>0?this.#t.slice(e):this.#t;if(!i.trim())return;let t=new SpeechSynthesisUtterance(i);t.rate=this.#E(parseFloat(this.#u?.value??"1")||1);let n=this.#d?.selectedOptions[0];if(n?.dataset.voiceUri){let s=speechSynthesis.getVoices().find(r=>r.voiceURI===n.dataset.voiceUri);s&&(t.voice=s)}t.onboundary=s=>{if(s.name!=="word")return;let r=e+s.charIndex;this.#a=r;let h=s.charLength;if(!h){let a=this.#t.slice(r).match(/^\S+/);h=a?a[0].length:1}this.#O(r,h),this.#r("text-reader:word",{word:this.#t.slice(r,r+h),charIndex:r,element:this.#L(r)?.element})},t.onend=()=>{let s=Date.now()-this.#A;this.#v(),this.#r("text-reader:end",{duration:s})},t.onerror=s=>{s.error==="interrupted"||s.error==="canceled"||(this.#v(),this.#r("text-reader:error",{error:s.error}))},this.#w=t,this.#s=!0,this.#i=!1,this.#A=Date.now(),this.#a=e,this.#B(!0),speechSynthesis.cancel(),speechSynthesis.speak(t),this.#U(),this.#r("text-reader:play",{voice:t.voice?.name,speed:t.rate})}#y(){let e=this.#a;speechSynthesis.cancel(),this.#p(),requestAnimationFrame(()=>this.#$(e))}#U(){this.#p(),this.#l=setInterval(()=>{if(!speechSynthesis.speaking){this.#p();return}speechSynthesis.pause(),speechSynthesis.resume()},1e4)}#p(){this.#l&&clearInterval(this.#l),this.#l=null}#H(){if(!CSS.highlights)return;let e=new CSSStyleSheet;e.replaceSync(`
+var m=window.matchMedia("(prefers-reduced-motion: reduce)");var f=new Map;function g(c,t,s={}){let e=s.priority??10,i={impl:t,bundle:s.bundle,contract:s.contract,priority:e},r=f.get(c);if(customElements.get(c)){if(!r||r.priority>=e){r&&r.priority===e&&r.impl!==t&&console.warn(`[VB Bundle] Tag <${c}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${s.bundle}".`);return}console.warn(`[VB Bundle] Tag <${c}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${s.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=e){r.priority===e&&console.warn(`[VB Bundle] Tag <${c}> already registered by "${r.bundle}". Skipping "${s.bundle}" (first wins at equal priority).`);return}f.set(c,i),customElements.define(c,t)}var u=class extends HTMLElement{#h=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&this.setAttribute("data-upgraded","")}disconnectedCallback(){for(let t of this.#h)t();this.#h=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,s,e,i){t.addEventListener(s,e,i),this.#h.push(()=>t.removeEventListener(s,e,i))}setup(){}teardown(){}};var p=class extends u{#h=null;#k=null;#f=[];#r="";#u=0;#g=null;#v=null;#C=null;#E=null;#s=!1;#i=!1;#L=0;#e=null;#a=null;#l=null;#m=null;#b=null;#y=null;#H=null;#$=!1;#n=null;#t=null;static get observedAttributes(){return["speed","voice","for"]}attributeChangedCallback(t,s,e){if(s!==e&&(t==="for"&&(this.stop(),this.#B()),(t==="speed"||t==="voice")&&this.#s&&this.#A(),t==="speed")){let i=this.#p(parseFloat(e)||1);this.#b&&(this.#b.value=String(i)),this.#y&&(this.#y.textContent=`${i}\xD7`)}}setup(){if(!("speechSynthesis"in window))return this.style.display="none",!1;this.getAttribute("variant")==="icon"?this.#O():this.#D(),this.#B(),this.#J(),this.#E=this.#U(),this.#E.then(t=>this.#tt(t)),this.listen(window,"beforeunload",this.#et)}teardown(){this.stop(),this.#Q(),this.#t&&(this.#t.remove(),this.#t=null),this.#n&&(this.#n.remove(),this.#n=null)}play(){if(this.#i){this.resume();return}this.#s||this.#V(0)}pause(){!this.#s||this.#i||(speechSynthesis.pause(),this.#i=!0,this.#N(!0),this.#c("text-reader:pause"))}resume(){this.#i&&(speechSynthesis.resume(),this.#i=!1,this.#N(!1),this.#c("text-reader:resume"))}stop(){speechSynthesis.cancel(),this.#x(),this.#c("text-reader:stop")}get voices(){return this.#E||this.#U()}get speaking(){return this.#s}get paused(){return this.#i}get progress(){return this.#r.length?Math.min(this.#u/this.#r.length,1):0}#D(){let t=document.createElement("div");t.setAttribute("part","controls"),t.setAttribute("role","group"),t.setAttribute("aria-label","Article reader");let s=this.#o("play",this.getAttribute("label-play")||"Play","\u25B6");s.addEventListener("click",()=>this.play());let e=this.#o("pause",this.getAttribute("label-pause")||"Pause","\u23F8");e.hidden=!0,e.addEventListener("click",()=>this.pause());let i=this.#o("stop",this.getAttribute("label-stop")||"Stop","\u23F9");i.disabled=!0,i.addEventListener("click",()=>this.stop());let r=document.createElement("select");r.setAttribute("aria-label","Voice");let n=document.createElement("option");n.textContent="Loading voices\u2026",r.append(n),r.addEventListener("change",()=>{this.#s&&this.#A()});let h=document.createElement("label");h.setAttribute("data-speed-group","");let o=document.createElement("span");o.setAttribute("data-speed-value","");let l=this.#p(parseFloat(this.getAttribute("speed")??"1")||1);o.textContent=`${l}\xD7`;let a=document.createElement("input");a.type="range",a.min="0.5",a.max="2",a.step="0.1",a.value=String(l),a.setAttribute("aria-label","Speed"),a.addEventListener("input",()=>{let d=parseFloat(a.value);o.textContent=`${d}\xD7`,this.#s&&this.#A()}),h.append(o,a),this.#d("icon-play",s),this.#d("icon-pause",e),this.#d("icon-stop",i),t.append(s,e,i,r,h),this.prepend(t),this.#H=t,this.#e=s,this.#a=e,this.#l=i,this.#m=r,this.#b=a,this.#y=o}#o(t,s,e){let i=document.createElement("button");return i.type="button",i.setAttribute("part",`button ${t}`),i.setAttribute("aria-label",s),i.textContent=e,i}#d(t,s){let e=this.querySelector(`[slot="${t}"]`);e&&(e.removeAttribute("slot"),s.textContent="",s.append(e))}#O(){this.#$=!0;for(let e of this.querySelectorAll(':scope > [part="trigger"]'))e.remove();let t=document.createElement("button");t.type="button",t.setAttribute("part","trigger"),t.setAttribute("aria-label","Article reader"),t.setAttribute("aria-pressed","false");let s=this.querySelector('[slot="icon-trigger"]');if(s)s.removeAttribute("slot"),t.append(s);else{let e=document.createElement("icon-wc");e.setAttribute("name","volume-2"),e.setAttribute("aria-hidden","true"),t.append(e)}t.addEventListener("click",()=>this.#W()),this.append(t),this.#n=t,this.#R()}#R(){let t=document.createElement("div");t.setAttribute("data-text-reader-toolbar",""),t.setAttribute("role","group"),t.setAttribute("aria-label","Reader controls"),t.hidden=!0;let s=this.#o("play",this.getAttribute("label-play")||"Play","\u25B6");s.addEventListener("click",()=>this.play());let e=this.#o("pause",this.getAttribute("label-pause")||"Pause","\u23F8");e.hidden=!0,e.addEventListener("click",()=>this.pause());let i=this.#o("stop",this.getAttribute("label-stop")||"Stop","\u23F9");i.addEventListener("click",()=>this.stop());let r=this.#o("speed-down","Slower","\u2212");r.addEventListener("click",()=>this.#T(-.1));let n=document.createElement("span");n.setAttribute("data-speed-value","");let h=this.#p(parseFloat(this.getAttribute("speed")??"1")||1);n.textContent=`${h}\xD7`;let o=this.#o("speed-up","Faster","+");o.addEventListener("click",()=>this.#T(.1)),this.#d("icon-play",s),this.#d("icon-pause",e),this.#d("icon-stop",i),t.append(s,e,i,r,n,o),document.body.append(t),this.#e=s,this.#a=e,this.#l=i,this.#y=n,this.#t=t,this.listen(document,"pointerdown",this.#_),this.listen(document,"keydown",this.#G)}#W(){if(!this.#s){this.play();return}this.#t?.hidden&&this.#M(),this.#i?this.resume():this.pause()}#M(){if(!this.#t||!this.#n)return;let t=this.#t;t.hidden=!1,t.style.visibility="hidden",requestAnimationFrame(()=>{this.#j(),t.style.visibility=""})}#w(){this.#t&&(this.#t.hidden=!0)}#j(){let t=this.#t,s=this.#n;if(!t||!s)return;let e=s.getBoundingClientRect(),i=t.offsetWidth,r=t.offsetHeight,n=8,h=8,o=e.top-r-n;o<h&&(o=e.bottom+n);let l=e.left+e.width/2-i/2,a=window.innerWidth-i-h;l=Math.max(h,Math.min(l,a)),t.style.top=`${o}px`,t.style.left=`${l}px`}#T(t){let s=parseFloat(this.getAttribute("speed")??"1")||1,e=this.#p(s+t);this.setAttribute("speed",String(e))}#_=t=>{!this.#t||this.#t.hidden||this.#t.contains(t.target)||this.#n?.contains(t.target)||this.#w()};#G=t=>{t.key==="Escape"&&this.#t&&!this.#t.hidden&&this.#w()};#B(){let t=this.getAttribute("for");if(!t){console.warn('<text-reader>: missing "for" attribute'),this.#F();return}if(this.#h=document.getElementById(t),!this.#h){console.warn(`<text-reader>: no element found with id="${t}"`),this.#F();return}this.#X(),this.#K()}#F(){this.#e&&(this.#e.disabled=!0),this.#l&&(this.#l.disabled=!0)}#K(){this.#e&&(this.#e.disabled=!1)}#X(){let t=this.#h;if(!t)return;let s=this.getAttribute("selectors")||"p,li",e=[...t.querySelectorAll(s)],i=n=>n.closest("pre")||n.closest("code")||n.closest('[aria-hidden="true"]');this.#f=[];let r=0;for(let n of e){if(i(n))continue;let h=n.textContent.trim();h&&(this.#f.push({element:n,text:h,speechStart:r,speechEnd:r+h.length}),r+=h.length+1)}this.#r=this.#f.map(n=>n.text).join(" ")}#V(t){if(!this.#r)return;let s=t>0?this.#r.slice(t):this.#r;if(!s.trim())return;let e=s.replace(/[<>]/g," "),i=new SpeechSynthesisUtterance(e);i.rate=this.#p(parseFloat(this.#b?.value??this.getAttribute("speed")??"1")||1);let r=this.#m?.selectedOptions[0];if(r?.dataset.voiceUri){let n=speechSynthesis.getVoices().find(h=>h.voiceURI===r.dataset.voiceUri);n&&(i.voice=n)}i.onboundary=n=>{if(n.name!=="word")return;let h=t+n.charIndex;this.#u=h;let o=n.charLength;if(!o){let a=this.#r.slice(h).match(/^\S+/);o=a?a[0].length:1}this.#Y(h,o),this.#c("text-reader:word",{word:this.#r.slice(h,h+o),charIndex:h,element:this.#P(h)?.element})},i.onend=()=>{let n=Date.now()-this.#L;this.#x(),this.#c("text-reader:end",{duration:n})},i.onerror=n=>{n.error==="interrupted"||n.error==="canceled"||(console.warn("<text-reader>: SpeechSynthesisUtterance error:",n.error),this.#x(),this.#c("text-reader:error",{error:n.error}))},this.#k=i,this.#s=!0,this.#i=!1,this.#L=Date.now(),this.#u=t,this.#q(!0),speechSynthesis.cancel(),speechSynthesis.speak(i),this.#z(),this.#c("text-reader:play",{voice:i.voice?.name,speed:i.rate})}#A(){let t=this.#u;speechSynthesis.cancel(),this.#S(),requestAnimationFrame(()=>this.#V(t))}#z(){this.#S(),this.#g=setInterval(()=>{if(!speechSynthesis.speaking){this.#S();return}speechSynthesis.pause(),speechSynthesis.resume()},1e4)}#S(){this.#g&&clearInterval(this.#g),this.#g=null}#J(){if(!CSS.highlights)return;let t=new CSSStyleSheet;t.replaceSync(`
       ::highlight(text-reader-word) {
         background-color: var(--text-reader-highlight, Mark);
         color: var(--text-reader-highlight-text, MarkText);
       }
-    `),this.#f=e,document.adoptedStyleSheets=[...document.adoptedStyleSheets,e]}#q(){let e=this.#f;e&&(document.adoptedStyleSheets=document.adoptedStyleSheets.filter(i=>i!==e),this.#f=null),this.#M()}#O(e,i){if(!CSS.highlights||this.getAttribute("highlight")==="false")return;let t=this.#L(e);if(!t)return;let n=e-t.speechStart,s=this.#R(t.element,n,i);if(!s)return;let r=new Highlight(s);if(CSS.highlights.set("text-reader-word",r),this.#x=r,this.getAttribute("scroll")!=="false"){let h=s.getBoundingClientRect(),o=window.innerHeight;(h.top<0||h.bottom>o)&&t.element.scrollIntoView({behavior:"smooth",block:"nearest"})}}#M(){CSS.highlights&&CSS.highlights.delete("text-reader-word"),this.#x=null}#L(e){let i=this.#c,t=0,n=i.length-1;for(;t<=n;){let s=t+n>>>1,r=i[s];if(e<r.speechStart)n=s-1;else if(e>=r.speechEnd)t=s+1;else return r}return null}#R(e,i,t){let n=document.createTreeWalker(e,NodeFilter.SHOW_TEXT),s=0;for(;n.nextNode();){let r=n.currentNode,h=r.textContent??"";if(!h.trim())continue;let o=h.length;if(s+o>i){let a=i-s,c=document.createRange();c.setStart(r,Math.min(a,o));let d=a+t;return d<=o?c.setEnd(r,d):c.setEnd(r,o),c}s+=o}return null}async#T(){let e=speechSynthesis.getVoices();return e.length>0?e:new Promise(i=>{let t=()=>{speechSynthesis.removeEventListener("voiceschanged",t),i(speechSynthesis.getVoices())};speechSynthesis.addEventListener("voiceschanged",t),setTimeout(()=>{speechSynthesis.removeEventListener("voiceschanged",t),i(speechSynthesis.getVoices())},3e3)})}#j(e){if(!this.#d||!e.length)return;let i=this.#d;i.innerHTML="";let t=document.documentElement.lang||"en",n=e.filter(o=>o.lang.startsWith(t)),s=e.filter(o=>!o.lang.startsWith(t)),r=[...n,...s],h=this.getAttribute("voice");for(let o of r){let a=document.createElement("option");a.textContent=`${o.name} (${o.lang})`,a.dataset.voiceUri=o.voiceURI,h&&o.voiceURI===h&&(a.selected=!0),i.append(a)}if(!h){let o=n.find(a=>a.default)||n[0];if(o){let a=[...i.options].find(c=>c.dataset.voiceUri===o.voiceURI);a&&(a.selected=!0)}}}#B(e){!this.#e||!this.#o||!this.#h||(e?(this.#e.hidden=!0,this.#o.hidden=!1,this.#h.disabled=!1):(this.#e.hidden=!1,this.#o.hidden=!0,this.#h.disabled=!0))}#V(e){!this.#e||!this.#o||(this.#e.hidden=!e,this.#o.hidden=e)}#v(){this.#s=!1,this.#i=!1,this.#a=0,this.#w=null,this.#p(),this.#M(),this.#B(!1)}#E(e){return Math.round(Math.max(.5,Math.min(2,e))*10)/10}#r(e,i={}){this.dispatchEvent(new CustomEvent(e,{detail:i,bubbles:!0}))}#D=()=>{speechSynthesis.cancel()}};g("text-reader",p);export{p as TextReader};
+    `),this.#v=t,document.adoptedStyleSheets=[...document.adoptedStyleSheets,t]}#Q(){let t=this.#v;t&&(document.adoptedStyleSheets=document.adoptedStyleSheets.filter(s=>s!==t),this.#v=null),this.#I()}#Y(t,s){if(!CSS.highlights||this.getAttribute("highlight")==="false")return;let e=this.#P(t);if(!e)return;let i=t-e.speechStart,r=this.#Z(e.element,i,s);if(!r)return;let n=new Highlight(r);if(CSS.highlights.set("text-reader-word",n),this.#C=n,this.getAttribute("scroll")!=="false"){let h=r.getBoundingClientRect(),o=window.innerHeight;(h.top<0||h.bottom>o)&&e.element.scrollIntoView({behavior:"smooth",block:"nearest"})}}#I(){CSS.highlights&&CSS.highlights.delete("text-reader-word"),this.#C=null}#P(t){let s=this.#f,e=0,i=s.length-1;for(;e<=i;){let r=e+i>>>1,n=s[r];if(t<n.speechStart)i=r-1;else if(t>=n.speechEnd)e=r+1;else return n}return null}#Z(t,s,e){let i=document.createTreeWalker(t,NodeFilter.SHOW_TEXT),r=0;for(;i.nextNode();){let n=i.currentNode,h=n.textContent??"";if(!h.trim())continue;let o=h.length;if(r+o>s){let l=s-r,a=document.createRange();a.setStart(n,Math.min(l,o));let d=l+e;return d<=o?a.setEnd(n,d):a.setEnd(n,o),a}r+=o}return null}async#U(){let t=speechSynthesis.getVoices();return t.length>0?t:new Promise(s=>{let e=()=>{speechSynthesis.removeEventListener("voiceschanged",e),s(speechSynthesis.getVoices())};speechSynthesis.addEventListener("voiceschanged",e),setTimeout(()=>{speechSynthesis.removeEventListener("voiceschanged",e),s(speechSynthesis.getVoices())},3e3)})}#tt(t){if(!this.#m||!t.length)return;let s=this.#m;s.innerHTML="";let e=document.documentElement.lang||"en",i=t.filter(o=>o.lang.startsWith(e)),r=t.filter(o=>!o.lang.startsWith(e)),n=[...i,...r],h=this.getAttribute("voice");for(let o of n){let l=document.createElement("option");l.textContent=`${o.name} (${o.lang})`,l.dataset.voiceUri=o.voiceURI,h&&o.voiceURI===h&&(l.selected=!0),s.append(l)}if(!h){let o=i.find(l=>l.default)||i[0];if(o){let l=[...s.options].find(a=>a.dataset.voiceUri===o.voiceURI);l&&(l.selected=!0)}}}#q(t){!this.#e||!this.#a||!this.#l||(t?(this.#e.hidden=!0,this.#a.hidden=!1,this.#l.disabled=!1):(this.#e.hidden=!1,this.#a.hidden=!0,this.#l.disabled=!0),this.#$&&(this.#n&&this.#n.setAttribute("aria-pressed",String(t)),t?this.#M():this.#w()))}#N(t){!this.#e||!this.#a||(this.#e.hidden=!t,this.#a.hidden=t)}#x(){this.#s=!1,this.#i=!1,this.#u=0,this.#k=null,this.#S(),this.#I(),this.#q(!1)}#p(t){return Math.round(Math.max(.5,Math.min(2,t))*10)/10}#c(t,s={}){this.dispatchEvent(new CustomEvent(t,{detail:s,bubbles:!0}))}#et=()=>{speechSynthesis.cancel()}};g("text-reader",p);export{p as TextReader};
 //# sourceMappingURL=text-reader.js.map

package/dist/cdn/components/theme-export.js

@@ -0,0 +1,18 @@
+var p=window.matchMedia("(prefers-reduced-motion: reduce)");var u=new Map;function d(i,e,t={}){let r=t.priority??10,n={impl:e,bundle:t.bundle,contract:t.contract,priority:r},o=u.get(i);if(customElements.get(i)){if(!o||o.priority>=r){o&&o.priority===r&&o.impl!==e&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${o.bundle}" (priority ${o.priority}). Skipping "${t.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${o.bundle}" cannot be replaced (customElements.define is permanent). "${t.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 "${t.bundle}" (first wins at equal priority).`);return}u.set(i,n),customElements.define(i,e)}var c=class extends HTMLElement{#e=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&this.setAttribute("data-upgraded","")}disconnectedCallback(){for(let e of this.#e)e();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,t,r,n){e.addEventListener(t,r,n),this.#e.push(()=>e.removeEventListener(t,r,n))}setup(){}teardown(){}};var h="--color-,--hue-,--lightness-,--chroma-,--font-,--size-,--radius-,--shadow-,--border-width-,--ease-,--duration-",m=["type-specimen:change","spacing-specimen:change","token-specimen:change","semantic-palette:change"],a=class extends c{static observedAttributes=["scope","selector","include","format","label","live"];setup(){this.#o(),this.#t(),this.#r(),this.#n()}attributeChangedCallback(){this.isConnected&&this.hasAttribute("data-upgraded")&&(this.#o(),this.#t(),this.#r(),this.#n())}#e(){let e=this.getAttribute("scope")||":root";try{return e===":root"?document.documentElement:document.querySelector(e)}catch{return document.documentElement}}#s(){return(this.getAttribute("include")||h).split(",").map(t=>t.trim()).filter(Boolean)}#i(){let e=this.#e();if(!e)return[];let t=this.#s(),r=e.style,n=[];for(let o=0;o<r.length;o++){let s=r.item(o);if(!s.startsWith("--")||!t.some(f=>s.startsWith(f)))continue;let l=r.getPropertyValue(s).trim();l&&n.push([s,l])}return n}#c(e){if((this.getAttribute("format")||"css")==="json"){let o=Object.fromEntries(e);return JSON.stringify(o,null,2)}let r=this.getAttribute("selector")||":root";if(!e.length)return`${r} {
+  /* No theme overrides detected yet. Edit a specimen to populate. */
+}
+`;let n=e.map(([o,s])=>`  ${o}: ${s};`).join(`
+`);return`${r} {
+${n}
+}
+`}#o(){let e=this.getAttribute("label")||"",t=e?`<p style="font-weight:600;margin:0 0 var(--size-xs,0.5rem)">${e}</p>`:"",r="display:flex;gap:var(--size-2xs,0.375rem);margin-block-end:var(--size-xs,0.5rem)",n="padding:0.375rem 0.75rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);background:var(--color-surface,#fff);color:var(--color-text,#222);cursor:pointer;font:inherit;font-size:var(--font-size-xs,0.75rem)",o="inline-size:100%;block-size:16rem;padding:var(--size-s,0.75rem);border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);background:var(--color-surface-sunken,#f8f8f8);color:var(--color-text,#222);font-family:var(--font-mono,monospace);font-size:var(--font-size-xs,0.75rem);white-space:pre;overflow:auto;tab-size:2;resize:vertical;box-sizing:border-box";this.innerHTML=`
+      ${t}
+      <div class="te-toolbar" style="${r}">
+        <button type="button" class="te-refresh" style="${n}" aria-label="Refresh">Refresh</button>
+        <button type="button" class="te-copy" style="${n}">Copy</button>
+        <button type="button" class="te-download" style="${n}">Download</button>
+        <span class="te-count" style="align-self:center;font-size:var(--font-size-xs,0.75rem);color:var(--color-text-muted,#666);margin-inline-start:auto"></span>
+      </div>
+      <textarea class="te-output" readonly aria-label="Theme output" style="${o}"></textarea>
+    `}#t(){let e=this.#i(),t=this.#c(e),r=this.querySelector(".te-output"),n=this.querySelector(".te-count");r&&(r.value=t),n&&(n.textContent=`${e.length} token${e.length===1?"":"s"}`),this.dispatchEvent(new CustomEvent("theme-export:change",{bubbles:!0,detail:{output:t,format:this.getAttribute("format")||"css",tokens:Object.fromEntries(e)}}))}#r(){let e=this.querySelector(".te-refresh"),t=this.querySelector(".te-copy"),r=this.querySelector(".te-download");e&&this.listen(e,"click",()=>this.#t()),t&&this.listen(t,"click",()=>{let n=this.querySelector(".te-output");if(!n)return;navigator.clipboard?.writeText(n.value);let o=t.textContent;t.textContent="Copied!",setTimeout(()=>{t.textContent=o},1500)}),r&&this.listen(r,"click",()=>this.#a())}#a(){let e=this.querySelector(".te-output");if(!e)return;let t=this.getAttribute("format")||"css",r=t==="json"?"json":"css",n=new Blob([e.value],{type:t==="json"?"application/json":"text/css"}),o=URL.createObjectURL(n),s=document.createElement("a");s.href=o,s.download=`theme.${r}`,s.click(),URL.revokeObjectURL(o)}#n(){if(this.hasAttribute("live"))for(let e of m)this.listen(document,e,()=>this.#t())}};d("theme-export",a);
+//# sourceMappingURL=theme-export.js.map

package/dist/cdn/components/theme-picker.js

@@ -1,6 +1,6 @@
-var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{for(var a in e)ee(t,a,{get:e[a],enumerable:!0})};var W={};ae(W,{SoundManager:()=>le});var K,D,le,X=te(()=>{K="vb-sound",D={enabled:!1,volume:.5},le={_ctx:null,_enabled:!1,_volume:.5,_initialized:!1,init(){if(this._initialized)return this;let t=this._load();return this._enabled=t.enabled,this._volume=t.volume,this._initialized=!0,this},_getContext(){return this._ctx||(this._ctx=new(window.AudioContext||window.webkitAudioContext)),this._ctx.state==="suspended"&&this._ctx.resume(),this._ctx},_load(){try{let t=localStorage.getItem(K);return t?{...D,...JSON.parse(t)}:{...D}}catch{return{...D}}},_save(t){try{let e=this._load();localStorage.setItem(K,JSON.stringify({...e,...t}))}catch{}},_playTone(t,e,a="sine"){if(!this._enabled)return;let i=this._getContext(),r=i.createOscillator(),n=i.createGain();r.connect(n),n.connect(i.destination),r.frequency.value=t,r.type=a,n.gain.value=this._volume*.3,r.start(),n.gain.exponentialRampToValueAtTime(.01,i.currentTime+e),r.stop(i.currentTime+e)},enable(){this._enabled=!0,this._save({enabled:!0}),this.play("click")},disable(){this._enabled=!1,this._save({enabled:!1})},toggle(){return this._enabled?this.disable():this.enable(),this._enabled},isEnabled(){return this._enabled},setVolume(t){this._volume=Math.max(0,Math.min(1,t)),this._save({volume:this._volume})},getVolume(){return this._volume},play(t){if(this._enabled)switch(t){case"click":this._playTone(800,.1);break;case"success":this._playTone(523,.1),setTimeout(()=>this._playTone(659,.1),100),setTimeout(()=>this._playTone(784,.15),200);break;case"error":this._playTone(200,.15,"sawtooth"),setTimeout(()=>this._playTone(180,.2,"sawtooth"),150);break;case"notification":this._playTone(880,.1),setTimeout(()=>this._playTone(1100,.15),100);break;case"soft":this._playTone(600,.05);break;case"tick":this._playTone(1200,.02,"square");break}},getState(){return{enabled:this._enabled,volume:this._volume}}}});var he=window.matchMedia("(prefers-reduced-motion: reduce)");var z=new Map;function G(t,e,a={}){let i=a.priority??10,r={impl:e,bundle:a.bundle,contract:a.contract,priority:i},n=z.get(t);if(customElements.get(t)){if(!n||n.priority>=i){n&&n.priority===i&&n.impl!==e&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${n.bundle}" (priority ${n.priority}). Skipping "${a.bundle}".`);return}console.warn(`[VB Bundle] Tag <${t}> defined by "${n.bundle}" cannot be replaced (customElements.define is permanent). "${a.bundle}" has higher priority but arrived late.`);return}if(n&&n.priority>=i){n.priority===i&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${n.bundle}". Skipping "${a.bundle}" (first wins at equal priority).`);return}z.set(t,r),customElements.define(t,e)}var S=class extends HTMLElement{#n=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&this.setAttribute("data-upgraded","")}disconnectedCallback(){for(let e of this.#n)e();this.#n=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,a,i,r){e.addEventListener(a,i,r),this.#n.push(()=>e.removeEventListener(a,i,r))}setup(){}teardown(){}};var p=new Map,A=new Map;var V=null;function U(){if(typeof window<"u"&&window.__VB_THEME_BASE)return String(window.__VB_THEME_BASE).replace(/\/$/,"");if(V)return V;if(typeof document<"u"){let t=document.querySelectorAll('script[src*="vanilla-breeze"]');for(let e of t){let a=e.getAttribute("src");if(a){let i=a.lastIndexOf("/");if(i!==-1)return a.slice(0,i)}}}return"/cdn"}var se=new Set(["default","a11y-high-contrast","a11y-large-text","a11y-dyslexia","modern","minimal","classic"]),ie=new Set(["kawaii","retro","memphis"]);function B(t){return ie.has(t)}function ne(t,e){return`${e}/themes/${t}.css`}function N(t,e){if(!B(t))return Promise.resolve();if(A.has(t))return A.get(t);let a=import(`${e}/packs/${t}.full.js`).catch(()=>{});return A.set(t,a),a}function re(t,e){let a=U(),i=()=>{(B(e)||t.hasAttribute("data-vb-pack"))&&N(e,a)};return t.getAttribute("data-vb-theme-state")==="error"?Promise.reject(new Error(`Failed to load theme: ${e}`)):t.getAttribute("data-vb-theme-state")==="ready"||t.sheet?(i(),Promise.resolve()):new Promise((r,n)=>{let s=()=>{t.setAttribute("data-vb-theme-state","ready"),l(),i(),r()},c=()=>{t.setAttribute("data-vb-theme-state","error"),p.delete(e),l(),n(new Error(`Failed to load theme: ${e}`))},l=()=>{t.removeEventListener("load",s),t.removeEventListener("error",c)};t.addEventListener("load",s,{once:!0}),t.addEventListener("error",c,{once:!0})})}async function k(t){if(!t||se.has(t))return;if(p.has(t))return p.get(t);if(typeof document<"u"){let i=document.querySelector(`link[data-vb-theme="${t}"]`);if(i){let r=re(i,t);return p.set(t,r),r}}let e=U(),a=B(t)?oe(t,e):ce(t,e);return p.set(t,a),a}async function ce(t,e){let a=ne(t,e);return new Promise((i,r)=>{let n=document.querySelector(`link[data-vb-theme-preload="${t}"]`);n&&n.remove();let s=document.createElement("link");s.rel="stylesheet",s.href=a,s.setAttribute("data-vb-theme",t),s.setAttribute("data-vb-theme-state","loading"),s.onload=()=>{s.setAttribute("data-vb-theme-state","ready"),i()},s.onerror=()=>{s.setAttribute("data-vb-theme-state","error"),s.remove(),p.delete(t),r(new Error(`Failed to load theme: ${t}`))},document.head.appendChild(s)})}function oe(t,e){let a=`${e}/themes/${t}.css`;return new Promise((i,r)=>{let n=document.querySelector(`link[data-vb-theme-preload="${t}"]`);n&&n.remove();let s=document.createElement("link");s.rel="stylesheet",s.href=a,s.setAttribute("data-vb-theme",t),s.setAttribute("data-vb-pack",t),s.setAttribute("data-vb-theme-state","loading"),s.onload=()=>{s.setAttribute("data-vb-theme-state","ready"),N(t,e),i()},s.onerror=()=>{s.setAttribute("data-vb-theme-state","error"),s.remove(),p.delete(t),r(new Error(`Failed to load pack: ${t}`))},document.head.appendChild(s)})}var x=[{id:"auto",name:"Auto",icon:"monitor"},{id:"light",name:"Light",icon:"sun"},{id:"dark",name:"Dark",icon:"moon"}],y=[{id:"default",name:"Default",swatchBg:"#3b82f6",seeds:{}},{id:"ocean",name:"Ocean",swatchBg:"#0891b2",seeds:{"--hue-primary":200,"--hue-secondary":180,"--hue-accent":45,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"45%","--chroma-secondary":.1,"--lightness-accent":"70%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"forest",name:"Forest",swatchBg:"#059669",seeds:{"--hue-primary":145,"--hue-secondary":90,"--hue-accent":30,"--lightness-primary":"45%","--chroma-primary":.15,"--lightness-secondary":"55%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"55%","--chroma-primary":.12}},{id:"sunset",name:"Sunset",swatchBg:"#ea580c",seeds:{"--hue-primary":25,"--hue-secondary":0,"--hue-accent":280,"--lightness-primary":"60%","--chroma-primary":.2,"--lightness-secondary":"55%","--chroma-secondary":.18,"--lightness-accent":"55%","--chroma-accent":.18},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.16}},{id:"rose",name:"Rose",swatchBg:"#e11d48",seeds:{"--hue-primary":350,"--hue-secondary":330,"--hue-accent":200,"--lightness-primary":"55%","--chroma-primary":.18,"--lightness-secondary":"50%","--chroma-secondary":.14,"--lightness-accent":"60%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.14}},{id:"lavender",name:"Lavender",swatchBg:"#a855f7",seeds:{"--hue-primary":280,"--hue-secondary":300,"--hue-accent":60,"--lightness-primary":"55%","--chroma-primary":.14,"--lightness-secondary":"50%","--chroma-secondary":.12,"--lightness-accent":"70%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.12}},{id:"coral",name:"Coral",swatchBg:"#f97316",seeds:{"--hue-primary":15,"--hue-secondary":25,"--hue-accent":180,"--lightness-primary":"60%","--chroma-primary":.18,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"55%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.15}},{id:"slate",name:"Slate",swatchBg:"#64748b",seeds:{"--hue-primary":220,"--hue-secondary":210,"--hue-accent":45,"--lightness-primary":"48%","--chroma-primary":.1,"--lightness-secondary":"45%","--chroma-secondary":.06,"--lightness-accent":"68%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.08}},{id:"emerald",name:"Emerald",swatchBg:"#10b981",seeds:{"--hue-primary":160,"--hue-secondary":140,"--hue-accent":30,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"48%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"amber",name:"Amber",swatchBg:"#f59e0b",seeds:{"--hue-primary":45,"--hue-secondary":30,"--hue-accent":240,"--lightness-primary":"60%","--chroma-primary":.16,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"52%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"68%","--chroma-primary":.14}},{id:"indigo",name:"Indigo",swatchBg:"#6366f1",seeds:{"--hue-primary":250,"--hue-secondary":270,"--hue-accent":35,"--lightness-primary":"48%","--chroma-primary":.18,"--lightness-secondary":"45%","--chroma-secondary":.14,"--lightness-accent":"68%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"62%","--chroma-primary":.14}}],$=[{id:"modern",name:"Modern",hue:270,shape:"rounded",character:"Vibrant & elevated",swatchBg:"#6366f1",tier:"core"},{id:"minimal",name:"Minimal",hue:240,shape:"sharp",character:"Clean & flat",swatchBg:"#71717a",tier:"core"},{id:"classic",name:"Classic",hue:220,shape:"subtle",character:"Serif & elegant",swatchBg:"#92400e",tier:"core"}],_=[{id:"swiss",name:"Swiss",icon:"grid-3x3",character:"Precision grid",swatchBg:"#ff3e00",swatchFg:"white",tier:"showcase",category:"Design"},{id:"brutalist",name:"Brutalist",icon:"square",character:"Raw, industrial",swatchBg:"#1a1a1a",swatchFg:"#f5f5f5",tier:"showcase",category:"Design"},{id:"art-deco",name:"Art Deco",icon:"crown",character:"1920s luxury",swatchBg:"#1A1A1A",swatchFg:"#C9A84C",tier:"showcase",category:"Design"},{id:"editorial",name:"Editorial",icon:"newspaper",character:"Magazine elegance",swatchBg:"#1a1a1a",swatchFg:"#c9a227",tier:"showcase",category:"Content"},{id:"genai",name:"GenAI",icon:"sparkles",character:"AI aesthetic",swatchBg:"#1a0a2e",swatchFg:"#a855f7",tier:"showcase",category:"Modern"},{id:"glassmorphism",name:"Glass",icon:"glass-water",character:"Frosted surfaces",swatchBg:"#667eea",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"startup",name:"Startup",icon:"rocket",character:"SaaS energy",swatchBg:"#4f46e5",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"organic",name:"Organic",icon:"leaf",character:"Natural, handcrafted",swatchBg:"#2d5016",swatchFg:"#faf5e6",tier:"showcase",category:"Creative"},{id:"rough",name:"Rough",icon:"pencil",character:"Hand-drawn sketch",swatchBg:"#f5f0e8",swatchFg:"#3a3a3a",tier:"showcase",category:"Creative"},{id:"cyber",name:"Cyber",icon:"zap",character:"Neon futuristic",swatchBg:"#0a0a1a",swatchFg:"#00ff88",tier:"showcase",category:"Creative"},{id:"vaporwave",name:"Vaporwave",icon:"radio",character:"Neon dreamy",swatchBg:"#2b0040",swatchFg:"#ff6ad5",tier:"showcase",category:"Aesthetic"},{id:"neumorphism",name:"Neumorph",icon:"circle",character:"Soft embossed",swatchBg:"#e0e0e0",swatchFg:"#a0a0a0",tier:"showcase",category:"Aesthetic"},{id:"bauhaus",name:"Bauhaus",icon:"shapes",character:"Geometric",swatchBg:"#F1FAEE",swatchFg:"#E63946",tier:"showcase",category:"Aesthetic"},{id:"claymorphism",name:"Clay",icon:"circle-dot",character:"Puffy 3D",swatchBg:"#f0f0f5",swatchFg:"#FF6B9D",tier:"showcase",category:"Aesthetic"},{id:"alpha1999",name:"Alpha1999",icon:"orbit",character:"Space retro-fi",swatchBg:"#0a0a14",swatchFg:"#d4880f",tier:"showcase",category:"Signature"},{id:"super2026",name:"Super2026",icon:"triangle",character:"Supergraphic bold",swatchBg:"#f5f0e6",swatchFg:"#c23616",tier:"showcase",category:"Signature"},{id:"win9x",name:"Win9x",icon:"monitor",character:"Classic desktop",swatchBg:"#008080",swatchFg:"#c0c0c0",tier:"showcase",category:"OS Styles"},{id:"nes",name:"NES",icon:"joystick",character:"Console pixels",swatchBg:"#bcbcbc",swatchFg:"#e40521",tier:"showcase",category:"OS Styles"},{id:"8bit",name:"8-Bit",icon:"gamepad-2",character:"Retro pixel art",swatchBg:"#000080",swatchFg:"#ffff00",tier:"showcase",category:"OS Styles"},{id:"magna",name:"Magna",icon:"orbit",character:"Odyssey 2 retro",swatchBg:"#0d0b14",swatchFg:"#f97316",tier:"showcase",category:"OS Styles"}],w=[{id:"nord",name:"Nord",icon:"snowflake",character:"Arctic calm",swatchBg:"#2E3440",swatchFg:"#81A1C1",tier:"community",category:"Editor Palettes"},{id:"solarized",name:"Solarized",icon:"sun-dim",character:"Engineered precision",swatchBg:"#002B36",swatchFg:"#268BD2",tier:"community",category:"Editor Palettes"},{id:"dracula",name:"Dracula",icon:"moon-star",character:"Dark elegance",swatchBg:"#282A36",swatchFg:"#BD93F9",tier:"community",category:"Editor Palettes"},{id:"catppuccin-mocha",name:"Catppuccin",icon:"coffee",character:"Warm pastels",swatchBg:"#1E1E2E",swatchFg:"#CBA6F7",tier:"community",category:"Editor Palettes"},{id:"catppuccin-latte",name:"Ctp Latte",icon:"coffee",character:"Cozy daytime",swatchBg:"#eff1f5",swatchFg:"#8839ef",tier:"community",category:"Editor Palettes"},{id:"catppuccin-frappe",name:"Ctp Frapp\xE9",icon:"coffee",character:"Cool twilight",swatchBg:"#303446",swatchFg:"#ca9ee6",tier:"community",category:"Editor Palettes"},{id:"catppuccin-macchiato",name:"Ctp Macchiato",icon:"coffee",character:"Deep blue",swatchBg:"#24273a",swatchFg:"#c6a0f6",tier:"community",category:"Editor Palettes"},{id:"gruvbox",name:"Gruvbox",icon:"palette",character:"Retro warmth",swatchBg:"#282828",swatchFg:"#ebdbb2",tier:"community",category:"Editor Palettes"},{id:"tokyo-night",name:"Tokyo Night",icon:"moon",character:"Night-owl vibes",swatchBg:"#1a1b26",swatchFg:"#7aa2f7",tier:"community",category:"Editor Palettes"},{id:"rose-pine",name:"Ros\xE9 Pine",icon:"flower-2",character:"Muted elegance",swatchBg:"#191724",swatchFg:"#ebbcba",tier:"community",category:"Editor Palettes"},{id:"cottagecore",name:"Cottagecore",icon:"flower-2",character:"Pastoral",swatchBg:"#fdf8f0",swatchFg:"#7d8c6d",tier:"community",category:"Niche"},{id:"terminal",name:"Terminal",icon:"terminal",character:"Retro CRT",swatchBg:"#0d1117",swatchFg:"#00ff00",tier:"community",category:"Niche"},{id:"clinical",name:"Clinical",icon:"heart-pulse",character:"Sterile precision",swatchBg:"#ffffff",swatchFg:"#0077b6",tier:"community",category:"Industry"},{id:"financial",name:"Financial",icon:"landmark",character:"Navy + gold",swatchBg:"#1b2a4a",swatchFg:"#c9a84c",tier:"community",category:"Industry"},{id:"government",name:"Government",icon:"shield",character:"Official",swatchBg:"#002868",swatchFg:"#bf0a30",tier:"community",category:"Industry"},{id:"dawn",name:"Dawn",icon:"sunrise",character:"Golden morning",swatchBg:"#fef3e2",swatchFg:"#d4a574",tier:"community",category:"Mood/Time"},{id:"dusk",name:"Dusk",icon:"sunset",character:"Twilight",swatchBg:"#1a1b2e",swatchFg:"#e5a858",tier:"community",category:"Mood/Time"},{id:"midnight",name:"Midnight",icon:"moon",character:"Deep night",swatchBg:"#0d1117",swatchFg:"#58a6ff",tier:"community",category:"Mood/Time"},{id:"high-noon",name:"High Noon",icon:"sun",character:"Maximum bright",swatchBg:"#ffffff",swatchFg:"#e63946",tier:"community",category:"Mood/Time"}],Y=[{id:"kawaii",name:"Kawaii",icon:"heart",character:"Cute aesthetic",swatchBg:"#ffb7c5",swatchFg:"#ff69b4",tier:"showcase",category:"Packs"},{id:"retro",name:"Retro",icon:"tv",character:"CRT terminal",swatchBg:"#0a0a14",swatchFg:"#00ff66",tier:"showcase",category:"Packs"},{id:"memphis",name:"Memphis",icon:"star",character:"Bold patterns",swatchBg:"#FFF8F0",swatchFg:"#d03040",tier:"showcase",category:"Packs"}],M=[{id:"",name:"Fixed",icon:"ruler",description:"Static token values"},{id:"default",name:"Fluid",icon:"move-diagonal-2",description:"Smooth viewport scaling"},{id:"compact",name:"Compact",icon:"minimize-2",description:"Tighter fluid range"},{id:"spacious",name:"Spacious",icon:"maximize-2",description:"Generous fluid range"}],F=[{id:"a11y-high-contrast",name:"High Contrast",icon:"contrast",description:"AAA contrast (7:1+)"},{id:"a11y-large-text",name:"Large Text",icon:"type",description:"25% larger fonts"},{id:"a11y-dyslexia",name:"Dyslexia",icon:"book-open",description:"Readable typography"}],P=[{id:"motionFx",name:"Motion Effects",icon:"sparkles",description:"Hover & enter animations"},{id:"sounds",name:"Sound Effects",icon:"volume-2",description:"Audio feedback"}],ge=[..._,...w],fe=[...$,..._,...w,...Y],g=t=>_.filter(e=>e.category===t),L=[{label:"Style",themes:$,tier:"core"},{label:"Design",themes:g("Design"),tier:"showcase"},{label:"Content",themes:g("Content"),tier:"showcase"},{label:"Modern",themes:g("Modern"),tier:"showcase"},{label:"Creative",themes:g("Creative"),tier:"showcase"},{label:"Aesthetic",themes:g("Aesthetic"),tier:"showcase"},{label:"Signature",themes:g("Signature"),tier:"showcase"},{label:"OS Styles",themes:g("OS Styles"),tier:"showcase"},{label:"Packs",themes:Y,tier:"showcase"},{label:"More Themes",themes:w,tier:"community"}];var O="vb-theme",T={mode:"auto",brand:"default",accent:"default",borderStyle:"",iconSet:"",fluid:"",backdrop:"",backdropChrome:"",pageBgType:"",pageBgColor:"",pageBgGradStart:"",pageBgGradEnd:"",pageBgGradDir:""},J=["--hue-primary","--hue-secondary","--hue-accent","--lightness-primary","--chroma-primary","--lightness-secondary","--chroma-secondary","--lightness-accent","--chroma-accent"],m={_initPromise:null,async init(){return this._initPromise?this._initPromise:(this._initPromise=(async()=>{let t=this.load();try{await k(t.brand)}catch{t.brand="default"}return this.apply(t),this._watchSystemPreference(),t})(),this._initPromise)},load(){try{let t=localStorage.getItem(O);return t?{...T,...JSON.parse(t)}:{...T}}catch{return{...T}}},save(t){let a={...this.load(),...t};try{localStorage.setItem(O,JSON.stringify(a))}catch{}return a},apply({mode:t="auto",brand:e="default",borderStyle:a="",iconSet:i="",fluid:r="",backdrop:n="",backdropChrome:s="",pageBgType:c="",pageBgColor:l="",pageBgGradStart:u="",pageBgGradEnd:h="",pageBgGradDir:d=""}={}){let o=document.documentElement;o.dataset.mode=t==="auto"?this.getEffectiveMode():t;let H=(o.dataset.theme||"").split(" ").filter(C=>C.startsWith("a11y-")),R=e!=="default"?[e,...H]:[...H];R.length?o.dataset.theme=R.join(" "):delete o.dataset.theme;let v=a||this._readCSSHint("--theme-border-style");v&&v!=="clean"?o.dataset.borderStyle=v:delete o.dataset.borderStyle;let E=i||this._readCSSHint("--theme-icon-set");if(E&&E!=="lucide"?o.dataset.iconSet=E:delete o.dataset.iconSet,r?o.dataset.fluid=r:delete o.dataset.fluid,n?o.dataset.backdrop=n:delete o.dataset.backdrop,s&&s!=="card"?o.dataset.backdropChrome=s:delete o.dataset.backdropChrome,c==="color"&&l)o.style.setProperty("--page-bg-color",l),o.style.removeProperty("--page-bg-gradient");else if(c==="gradient"&&u&&h){let C=d||"to bottom";o.style.setProperty("--page-bg-gradient",`linear-gradient(${C}, ${u}, ${h})`),o.style.removeProperty("--page-bg-color")}else o.style.removeProperty("--page-bg-color"),o.style.removeProperty("--page-bg-gradient");let j=this.load().accent||"default";this._applyAccent(j),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{mode:t,brand:e,accent:j,borderStyle:v,iconSet:E,fluid:r,backdrop:n,backdropChrome:s,pageBgType:c,effectiveMode:this.getEffectiveMode()}}))},setMode(t){let e=this.save({mode:t});this.apply(e)},async setBrand(t){try{await k(t)}catch(a){console.warn(`[VB] Theme "${t}" failed to load, using default`,a),t="default"}let e=this.save({brand:t});this.apply(e)},setAccent(t){let e=this.save({accent:t});this._applyAccent(t),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}}))},setBorderStyle(t){let e=this.save({borderStyle:t});this.apply(e)},setIconSet(t){let e=this.save({iconSet:t});this.apply(e)},setFluid(t){let e=this.save({fluid:t});this.apply(e)},setBackdrop(t){let e=this.save({backdrop:t});this.apply(e)},setBackdropChrome(t){let e=this.save({backdropChrome:t});this.apply(e)},setPageBg({type:t="",color:e="",gradStart:a="",gradEnd:i="",gradDir:r=""}={}){let n=this.save({pageBgType:t,pageBgColor:e,pageBgGradStart:a,pageBgGradEnd:i,pageBgGradDir:r});this.apply(n)},getEffectiveMode(){let{mode:t}=this.load();return t!=="auto"?t:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"},getState(){let{mode:t,brand:e,accent:a,borderStyle:i,iconSet:r,fluid:n,backdrop:s,backdropChrome:c,pageBgType:l,pageBgColor:u,pageBgGradStart:h,pageBgGradEnd:d,pageBgGradDir:o}=this.load();return{mode:t,brand:e,accent:a,borderStyle:i,iconSet:r,fluid:n,backdrop:s,backdropChrome:c,pageBgType:l,pageBgColor:u,pageBgGradStart:h,pageBgGradEnd:d,pageBgGradDir:o,effectiveMode:this.getEffectiveMode()}},toggleMode(){let e=this.getEffectiveMode()==="dark"?"light":"dark";this.setMode(e)},reset(){try{localStorage.removeItem(O)}catch{}let t=document.documentElement;t.style.removeProperty("--page-bg-color"),t.style.removeProperty("--page-bg-gradient");for(let e of J)t.style.removeProperty(e);this.apply(T)},_readCSSHint(t){return getComputedStyle(document.documentElement).getPropertyValue(t).trim()},_applyAccent(t){let e=document.documentElement,a=y.find(i=>i.id===t);for(let i of J)e.style.removeProperty(i);if(!(!a||!a.seeds||Object.keys(a.seeds).length===0)){for(let[i,r]of Object.entries(a.seeds))e.style.setProperty(i,String(r));if(a.seedsDark&&this.getEffectiveMode()==="dark")for(let[i,r]of Object.entries(a.seedsDark))e.style.setProperty(i,String(r))}},_watchSystemPreference(){window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",()=>{let e=this.load();e.mode==="auto"&&this.apply(e)})}};var f=null,Q="vb-extensions",b={motionFx:!0,sounds:!1},Z="vb-a11y-themes",I=class t extends S{static#n=200;#t;#e;#a=!1;#s=!1;#u=!1;#c=null;#p=!1;#i=()=>this.#b();setup(){this.#s=this.getAttribute("variant")==="inline",this.#u=this.hasAttribute("compact"),this.#v(),this.#T(),this.#w(),this.listen(window,"vb:theme-change",this.#O),this.#y(),this.#d()}teardown(){window.removeEventListener("scroll",this.#i,{capture:!0}),window.removeEventListener("resize",this.#i),this.#m()}#v(){this.#s||(this.#t=this.querySelector(":scope > [data-trigger]"),this.#t||(this.#t=this.querySelector(":scope > button")),this.#t||(this.#t=document.createElement("button"),this.#t.setAttribute("data-trigger",""),this.#t.innerHTML=`
+var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{for(var a in e)oe(t,a,{get:e[a],enumerable:!0})};var ie={};le(ie,{SoundManager:()=>ye});var ne,z,ye,re=ce(()=>{ne="vb-sound",z={enabled:!1,volume:.5},ye={_ctx:null,_enabled:!1,_volume:.5,_initialized:!1,init(){if(this._initialized)return this;let t=this._load();return this._enabled=t.enabled,this._volume=t.volume,this._initialized=!0,this},_getContext(){return this._ctx||(this._ctx=new(window.AudioContext||window.webkitAudioContext)),this._ctx.state==="suspended"&&this._ctx.resume(),this._ctx},_load(){try{let t=localStorage.getItem(ne);return t?{...z,...JSON.parse(t)}:{...z}}catch{return{...z}}},_save(t){try{let e=this._load();localStorage.setItem(ne,JSON.stringify({...e,...t}))}catch{}},_playTone(t,e,a="sine"){if(!this._enabled)return;let s=this._getContext(),r=s.createOscillator(),i=s.createGain();r.connect(i),i.connect(s.destination),r.frequency.value=t,r.type=a,i.gain.value=this._volume*.3,r.start(),i.gain.exponentialRampToValueAtTime(.01,s.currentTime+e),r.stop(s.currentTime+e)},enable(){this._enabled=!0,this._save({enabled:!0}),this.play("click")},disable(){this._enabled=!1,this._save({enabled:!1})},toggle(){return this._enabled?this.disable():this.enable(),this._enabled},isEnabled(){return this._enabled},setVolume(t){this._volume=Math.max(0,Math.min(1,t)),this._save({volume:this._volume})},getVolume(){return this._volume},play(t){if(this._enabled)switch(t){case"click":this._playTone(800,.1);break;case"success":this._playTone(523,.1),setTimeout(()=>this._playTone(659,.1),100),setTimeout(()=>this._playTone(784,.15),200);break;case"error":this._playTone(200,.15,"sawtooth"),setTimeout(()=>this._playTone(180,.2,"sawtooth"),150);break;case"notification":this._playTone(880,.1),setTimeout(()=>this._playTone(1100,.15),100);break;case"soft":this._playTone(600,.05);break;case"tick":this._playTone(1200,.02,"square");break}},getState(){return{enabled:this._enabled,volume:this._volume}}}});var be=window.matchMedia("(prefers-reduced-motion: reduce)");var X=new Map;function K(t,e,a={}){let s=a.priority??10,r={impl:e,bundle:a.bundle,contract:a.contract,priority:s},i=X.get(t);if(customElements.get(t)){if(!i||i.priority>=s){i&&i.priority===s&&i.impl!==e&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${a.bundle}".`);return}console.warn(`[VB Bundle] Tag <${t}> defined by "${i.bundle}" cannot be replaced (customElements.define is permanent). "${a.bundle}" has higher priority but arrived late.`);return}if(i&&i.priority>=s){i.priority===s&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${i.bundle}". Skipping "${a.bundle}" (first wins at equal priority).`);return}X.set(t,r),customElements.define(t,e)}var T=class extends HTMLElement{#i=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&this.setAttribute("data-upgraded","")}disconnectedCallback(){for(let e of this.#i)e();this.#i=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,a,s,r){e.addEventListener(a,s,r),this.#i.push(()=>e.removeEventListener(a,s,r))}setup(){}teardown(){}};var y=new Map,F=new Map;var J=null;function Q(){if(typeof window<"u"&&window.__VB_THEME_BASE)return String(window.__VB_THEME_BASE).replace(/\/$/,"");if(J)return J;if(typeof document<"u"){let t=document.querySelectorAll('script[src*="vanilla-breeze"]');for(let e of t){let a=e.getAttribute("src");if(a){let s=a.lastIndexOf("/");if(s!==-1)return a.slice(0,s)}}}return"/cdn"}var de=new Set(["default","a11y-high-contrast","a11y-large-text","a11y-dyslexia","modern","minimal","classic"]),he=new Set(["kawaii","memphis"]);function P(t){return he.has(t)}function me(t,e){return`${e}/themes/${t}.css`}function Z(t,e){if(!P(t))return Promise.resolve();if(F.has(t))return F.get(t);let a=import(`${e}/packs/${t}.full.js`).catch(()=>{});return F.set(t,a),a}function ue(t,e){let a=Q(),s=()=>{(P(e)||t.hasAttribute("data-vb-pack"))&&Z(e,a)};return t.getAttribute("data-vb-theme-state")==="error"?Promise.reject(new Error(`Failed to load theme: ${e}`)):t.getAttribute("data-vb-theme-state")==="ready"||t.sheet?(s(),Promise.resolve()):new Promise((r,i)=>{let n=()=>{t.setAttribute("data-vb-theme-state","ready"),c(),s(),r()},o=()=>{t.setAttribute("data-vb-theme-state","error"),y.delete(e),c(),i(new Error(`Failed to load theme: ${e}`))},c=()=>{t.removeEventListener("load",n),t.removeEventListener("error",o)};t.addEventListener("load",n,{once:!0}),t.addEventListener("error",o,{once:!0})})}async function B(t){if(!t||de.has(t))return;if(y.has(t))return y.get(t);if(typeof document<"u"){let s=document.querySelector(`link[data-vb-theme="${t}"]`);if(s){let r=ue(s,t);return y.set(t,r),r}}let e=Q(),a=P(t)?ge(t,e):pe(t,e);return y.set(t,a),a}async function pe(t,e){let a=me(t,e);return new Promise((s,r)=>{let i=document.querySelector(`link[data-vb-theme-preload="${t}"]`);i&&i.remove();let n=document.createElement("link");n.rel="stylesheet",n.href=a,n.setAttribute("data-vb-theme",t),n.setAttribute("data-vb-theme-state","loading"),n.onload=()=>{n.setAttribute("data-vb-theme-state","ready"),s()},n.onerror=()=>{n.setAttribute("data-vb-theme-state","error"),n.remove(),y.delete(t),r(new Error(`Failed to load theme: ${t}`))},document.head.appendChild(n)})}function ge(t,e){let a=`${e}/packs/${t}.theme.css`,s=`${e}/packs/${t}.effects.css`;return new Promise((r,i)=>{let n=document.querySelector(`link[data-vb-theme-preload="${t}"]`);n&&n.remove();let o=document.createElement("link");o.rel="stylesheet",o.href=a,o.setAttribute("data-vb-theme",t),o.setAttribute("data-vb-pack",t),o.setAttribute("data-vb-theme-state","loading"),o.onload=()=>{o.setAttribute("data-vb-theme-state","ready");let c=document.createElement("link");c.rel="stylesheet",c.href=s,c.setAttribute("data-vb-pack-effects",t),document.head.appendChild(c),Z(t,e),r()},o.onerror=()=>{o.setAttribute("data-vb-theme-state","error"),o.remove(),y.delete(t),i(new Error(`Failed to load pack: ${t}`))},document.head.appendChild(o)})}var D=[{id:"auto",name:"Auto",icon:"monitor"},{id:"light",name:"Light",icon:"sun"},{id:"dark",name:"Dark",icon:"moon"}],E=[{id:"default",name:"Default",swatchBg:"#3b82f6",seeds:{}},{id:"ocean",name:"Ocean",swatchBg:"#0891b2",seeds:{"--hue-primary":200,"--hue-secondary":180,"--hue-accent":45,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"45%","--chroma-secondary":.1,"--lightness-accent":"70%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"forest",name:"Forest",swatchBg:"#059669",seeds:{"--hue-primary":145,"--hue-secondary":90,"--hue-accent":30,"--lightness-primary":"45%","--chroma-primary":.15,"--lightness-secondary":"55%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"55%","--chroma-primary":.12}},{id:"sunset",name:"Sunset",swatchBg:"#ea580c",seeds:{"--hue-primary":25,"--hue-secondary":0,"--hue-accent":280,"--lightness-primary":"60%","--chroma-primary":.2,"--lightness-secondary":"55%","--chroma-secondary":.18,"--lightness-accent":"55%","--chroma-accent":.18},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.16}},{id:"rose",name:"Rose",swatchBg:"#e11d48",seeds:{"--hue-primary":350,"--hue-secondary":330,"--hue-accent":200,"--lightness-primary":"55%","--chroma-primary":.18,"--lightness-secondary":"50%","--chroma-secondary":.14,"--lightness-accent":"60%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.14}},{id:"lavender",name:"Lavender",swatchBg:"#a855f7",seeds:{"--hue-primary":280,"--hue-secondary":300,"--hue-accent":60,"--lightness-primary":"55%","--chroma-primary":.14,"--lightness-secondary":"50%","--chroma-secondary":.12,"--lightness-accent":"70%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.12}},{id:"coral",name:"Coral",swatchBg:"#f97316",seeds:{"--hue-primary":15,"--hue-secondary":25,"--hue-accent":180,"--lightness-primary":"60%","--chroma-primary":.18,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"55%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.15}},{id:"slate",name:"Slate",swatchBg:"#64748b",seeds:{"--hue-primary":220,"--hue-secondary":210,"--hue-accent":45,"--lightness-primary":"48%","--chroma-primary":.1,"--lightness-secondary":"45%","--chroma-secondary":.06,"--lightness-accent":"68%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.08}},{id:"emerald",name:"Emerald",swatchBg:"#10b981",seeds:{"--hue-primary":160,"--hue-secondary":140,"--hue-accent":30,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"48%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"amber",name:"Amber",swatchBg:"#f59e0b",seeds:{"--hue-primary":45,"--hue-secondary":30,"--hue-accent":240,"--lightness-primary":"60%","--chroma-primary":.16,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"52%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"68%","--chroma-primary":.14}},{id:"indigo",name:"Indigo",swatchBg:"#6366f1",seeds:{"--hue-primary":250,"--hue-secondary":270,"--hue-accent":35,"--lightness-primary":"48%","--chroma-primary":.18,"--lightness-secondary":"45%","--chroma-secondary":.14,"--lightness-accent":"68%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"62%","--chroma-primary":.14}}],A=[{id:"default",name:"Default",hue:210,shape:"balanced",character:"The default",swatchBg:"#3b82f6",tier:"core"},{id:"modern",name:"Modern",hue:270,shape:"rounded",character:"Vibrant & elevated",swatchBg:"#6366f1",tier:"core"},{id:"minimal",name:"Minimal",hue:240,shape:"sharp",character:"Clean & flat",swatchBg:"#71717a",tier:"core"},{id:"classic",name:"Classic",hue:220,shape:"subtle",character:"Serif & elegant",swatchBg:"#92400e",tier:"core"}],L=[{id:"swiss",name:"Swiss",icon:"grid-3x3",character:"Precision grid",swatchBg:"#ff3e00",swatchFg:"white",tier:"showcase",category:"Design"},{id:"brutalist",name:"Brutalist",icon:"square",character:"Raw, industrial",swatchBg:"#1a1a1a",swatchFg:"#f5f5f5",tier:"showcase",category:"Design"},{id:"art-deco",name:"Art Deco",icon:"crown",character:"1920s luxury",swatchBg:"#1A1A1A",swatchFg:"#C9A84C",tier:"showcase",category:"Design"},{id:"editorial",name:"Editorial",icon:"newspaper",character:"Magazine elegance",swatchBg:"#1a1a1a",swatchFg:"#c9a227",tier:"showcase",category:"Content"},{id:"genai",name:"GenAI",icon:"sparkles",character:"AI aesthetic",swatchBg:"#1a0a2e",swatchFg:"#a855f7",tier:"showcase",category:"Modern"},{id:"glassmorphism",name:"Glass",icon:"glass-water",character:"Frosted surfaces",swatchBg:"#667eea",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"startup",name:"Startup",icon:"rocket",character:"SaaS energy",swatchBg:"#4f46e5",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"organic",name:"Organic",icon:"leaf",character:"Natural, handcrafted",swatchBg:"#2d5016",swatchFg:"#faf5e6",tier:"showcase",category:"Creative"},{id:"rough",name:"Rough",icon:"pencil",character:"Hand-drawn sketch",swatchBg:"#f5f0e8",swatchFg:"#3a3a3a",tier:"showcase",category:"Creative"},{id:"cyber",name:"Cyber",icon:"zap",character:"Neon futuristic",swatchBg:"#0a0a1a",swatchFg:"#00ff88",tier:"showcase",category:"Creative"},{id:"vaporwave",name:"Vaporwave",icon:"radio",character:"Neon dreamy",swatchBg:"#2b0040",swatchFg:"#ff6ad5",tier:"showcase",category:"Aesthetic"},{id:"neumorphism",name:"Neumorph",icon:"circle",character:"Soft embossed",swatchBg:"#e0e0e0",swatchFg:"#a0a0a0",tier:"showcase",category:"Aesthetic"},{id:"bauhaus",name:"Bauhaus",icon:"shapes",character:"Geometric",swatchBg:"#F1FAEE",swatchFg:"#E63946",tier:"showcase",category:"Aesthetic"},{id:"claymorphism",name:"Clay",icon:"circle-dot",character:"Puffy 3D",swatchBg:"#f0f0f5",swatchFg:"#FF6B9D",tier:"showcase",category:"Aesthetic"},{id:"alpha1999",name:"Alpha1999",icon:"orbit",character:"Space retro-fi",swatchBg:"#0a0a14",swatchFg:"#d4880f",tier:"showcase",category:"Signature"},{id:"super2026",name:"Super2026",icon:"triangle",character:"Supergraphic bold",swatchBg:"#f5f0e6",swatchFg:"#c23616",tier:"showcase",category:"Signature"},{id:"magna",name:"Magna",icon:"orbit",character:"Odyssey 2 retro",swatchBg:"#0d0b14",swatchFg:"#f97316",tier:"showcase",category:"Signature"},{id:"win9x",name:"Win9x",icon:"monitor",character:"Classic desktop",swatchBg:"#008080",swatchFg:"#c0c0c0",tier:"showcase",category:"OS Styles"},{id:"nes",name:"NES",icon:"joystick",character:"Console pixels",swatchBg:"#bcbcbc",swatchFg:"#e40521",tier:"showcase",category:"OS Styles"},{id:"8bit",name:"8-Bit",icon:"gamepad-2",character:"Retro pixel art",swatchBg:"#000080",swatchFg:"#ffff00",tier:"showcase",category:"OS Styles"}],S=[{id:"nord",name:"Nord",icon:"snowflake",character:"Arctic calm",swatchBg:"#2E3440",swatchFg:"#81A1C1",tier:"community",category:"Editor Palettes"},{id:"solarized",name:"Solarized",icon:"sun-dim",character:"Engineered precision",swatchBg:"#002B36",swatchFg:"#268BD2",tier:"community",category:"Editor Palettes"},{id:"dracula",name:"Dracula",icon:"moon-star",character:"Dark elegance",swatchBg:"#282A36",swatchFg:"#BD93F9",tier:"community",category:"Editor Palettes"},{id:"catppuccin-mocha",name:"Catppuccin",icon:"coffee",character:"Warm pastels",swatchBg:"#1E1E2E",swatchFg:"#CBA6F7",tier:"community",category:"Editor Palettes"},{id:"catppuccin-latte",name:"Ctp Latte",icon:"coffee",character:"Cozy daytime",swatchBg:"#eff1f5",swatchFg:"#8839ef",tier:"community",category:"Editor Palettes"},{id:"catppuccin-frappe",name:"Ctp Frapp\xE9",icon:"coffee",character:"Cool twilight",swatchBg:"#303446",swatchFg:"#ca9ee6",tier:"community",category:"Editor Palettes"},{id:"catppuccin-macchiato",name:"Ctp Macchiato",icon:"coffee",character:"Deep blue",swatchBg:"#24273a",swatchFg:"#c6a0f6",tier:"community",category:"Editor Palettes"},{id:"gruvbox",name:"Gruvbox",icon:"palette",character:"Retro warmth",swatchBg:"#282828",swatchFg:"#ebdbb2",tier:"community",category:"Editor Palettes"},{id:"tokyo-night",name:"Tokyo Night",icon:"moon",character:"Night-owl vibes",swatchBg:"#1a1b26",swatchFg:"#7aa2f7",tier:"community",category:"Editor Palettes"},{id:"rose-pine",name:"Ros\xE9 Pine",icon:"flower-2",character:"Muted elegance",swatchBg:"#191724",swatchFg:"#ebbcba",tier:"community",category:"Editor Palettes"},{id:"cottagecore",name:"Cottagecore",icon:"flower-2",character:"Pastoral",swatchBg:"#fdf8f0",swatchFg:"#7d8c6d",tier:"community",category:"Niche"},{id:"terminal",name:"Terminal",icon:"terminal",character:"Retro CRT",swatchBg:"#0d1117",swatchFg:"#00ff00",tier:"community",category:"Niche"},{id:"clinical",name:"Clinical",icon:"heart-pulse",character:"Sterile precision",swatchBg:"#ffffff",swatchFg:"#0077b6",tier:"community",category:"Industry"},{id:"financial",name:"Financial",icon:"landmark",character:"Navy + gold",swatchBg:"#1b2a4a",swatchFg:"#c9a84c",tier:"community",category:"Industry"},{id:"government",name:"Government",icon:"shield",character:"Official",swatchBg:"#002868",swatchFg:"#bf0a30",tier:"community",category:"Industry"},{id:"dawn",name:"Dawn",icon:"sunrise",character:"Golden morning",swatchBg:"#fef3e2",swatchFg:"#d4a574",tier:"community",category:"Mood/Time"},{id:"dusk",name:"Dusk",icon:"sunset",character:"Twilight",swatchBg:"#1a1b2e",swatchFg:"#e5a858",tier:"community",category:"Mood/Time"},{id:"midnight",name:"Midnight",icon:"moon",character:"Deep night",swatchBg:"#0d1117",swatchFg:"#58a6ff",tier:"community",category:"Mood/Time"},{id:"high-noon",name:"High Noon",icon:"sun",character:"Maximum bright",swatchBg:"#ffffff",swatchFg:"#e63946",tier:"community",category:"Mood/Time"}],ee=[{id:"kawaii",name:"Kawaii",icon:"heart",character:"Cute aesthetic",swatchBg:"#ffb7c5",swatchFg:"#ff69b4",tier:"showcase",category:"Packs"},{id:"memphis",name:"Memphis",icon:"star",character:"Bold patterns",swatchBg:"#FFF8F0",swatchFg:"#d03040",tier:"showcase",category:"Packs"}],O=[{id:"",name:"Fixed",icon:"ruler",description:"Static token values"},{id:"default",name:"Fluid",icon:"move-diagonal-2",description:"Smooth viewport scaling"},{id:"compact",name:"Compact",icon:"minimize-2",description:"Tighter fluid range"},{id:"spacious",name:"Spacious",icon:"maximize-2",description:"Generous fluid range"}],R=[{id:"a11y-high-contrast",name:"High Contrast",icon:"contrast",description:"AAA contrast (7:1+)"},{id:"a11y-large-text",name:"Large Text",icon:"type",description:"25% larger fonts"},{id:"a11y-dyslexia",name:"Dyslexia",icon:"book-open",description:"Readable typography"}],I=[{id:"motionFx",name:"Motion Effects",icon:"sparkles",description:"Hover & enter animations"},{id:"sounds",name:"Sound Effects",icon:"volume-2",description:"Audio feedback"}],$e=[...L,...S],ke=[...A,...L,...S,...ee],w=t=>L.filter(e=>e.category===t),q=[{label:"Style",themes:A,tier:"core"},{label:"Design",themes:w("Design"),tier:"showcase"},{label:"Content",themes:w("Content"),tier:"showcase"},{label:"Modern",themes:w("Modern"),tier:"showcase"},{label:"Creative",themes:w("Creative"),tier:"showcase"},{label:"Aesthetic",themes:w("Aesthetic"),tier:"showcase"},{label:"Signature",themes:w("Signature"),tier:"showcase"},{label:"OS Styles",themes:w("OS Styles"),tier:"showcase"},{label:"Packs",themes:ee,tier:"showcase"},{label:"More Themes",themes:S,tier:"community"}];function fe(){let t=globalThis.localStorage;if(!t)throw new Error("VBStore: localStorage is not available in this environment");return{async getRaw(e){return t.getItem(e)},async setRaw(e,a){t.setItem(e,a)},async removeRaw(e){t.removeItem(e)},async keys(e){let a=[];for(let s=0;s<t.length;s++){let r=t.key(s);r&&r.startsWith(e)&&a.push(r)}return a}}}var C=null;function f(){return C||(C=fe()),C}function H(t,e){if(typeof t!="string"||!t)throw new TypeError("VBStore: namespace must be a non-empty string");if(typeof e!="string"||!e)throw new TypeError("VBStore: key must be a non-empty string");return`vb:${t}:${e}`}function te(t){if(typeof t!="string"||!t)throw new TypeError("VBStore: namespace must be a non-empty string");return`vb:${t}:`}function ae(t){try{let e=JSON.parse(t);if(e&&typeof e=="object"&&typeof e.timestamp=="number")return e}catch{}return null}var p={configure(t={}){C=t.backend??null},async set(t,e,a){let s={data:a,timestamp:Date.now()};await f().setRaw(H(t,e),JSON.stringify(s))},async get(t,e,a){let s=await f().getRaw(H(t,e));if(s==null)return null;let r=ae(s);return!r||a?.maxAge!=null&&Date.now()-r.timestamp>a.maxAge?null:r.data},async remove(t,e){await f().removeRaw(H(t,e))},async list(t){let e=te(t),a=await f().keys(e),s=[];for(let r of a){let i=await f().getRaw(r);if(i==null)continue;let n=ae(i);n&&s.push({key:r.slice(e.length),data:n.data,timestamp:n.timestamp})}return s},async clear(t){let e=te(t),a=await f().keys(e);for(let s of a)await f().removeRaw(s)},async clearAll(){let t=await f().keys("vb:");for(let e of t)await f().removeRaw(e)},async setMany(t,e){for(let[a,s]of e)await p.set(t,a,s)}};var j="theme",V="current",b={mode:"auto",brand:"default",accent:"default",borderStyle:"",iconSet:"",fluid:"",backdrop:"",backdropChrome:"",pageBgType:"",pageBgColor:"",pageBgGradStart:"",pageBgGradEnd:"",pageBgGradDir:""},se=["--hue-primary","--hue-secondary","--hue-accent","--lightness-primary","--chroma-primary","--lightness-secondary","--chroma-secondary","--lightness-accent","--chroma-accent"],d=null,m={_initPromise:null,async init(){return this._initPromise?this._initPromise:(this._initPromise=(async()=>{let t=await p.get(j,V);d=t?{...b,...t}:{...b};try{await B(d.brand)}catch{d.brand="default"}return this.apply(d),this._watchSystemPreference(),this._watchRootAttributes(),d})(),this._initPromise)},load(){return d?{...d}:{...b}},save(t){let e={...d??b,...t};return d=e,p.set(j,V,e).catch(()=>{}),e},apply({mode:t="auto",brand:e="default",borderStyle:a="",iconSet:s="",fluid:r="",backdrop:i="",backdropChrome:n="",pageBgType:o="",pageBgColor:c="",pageBgGradStart:g="",pageBgGradEnd:u="",pageBgGradDir:h=""}={}){let l=document.documentElement;l.dataset.mode=t==="auto"?this.getEffectiveMode():t;let N=(l.dataset.theme||"").split(" ").filter(M=>M.startsWith("a11y-")),Y=e!=="default"?[e,...N]:[...N];Y.length?l.dataset.theme=Y.join(" "):delete l.dataset.theme;let $=a||this._readCSSHint("--theme-border-style");$&&$!=="clean"?l.dataset.borderStyle=$:delete l.dataset.borderStyle;let k=s||this._readCSSHint("--theme-icon-set");if(k&&k!=="lucide"?l.dataset.iconSet=k:delete l.dataset.iconSet,r?l.dataset.fluid=r:delete l.dataset.fluid,i?l.dataset.backdrop=i:delete l.dataset.backdrop,n&&n!=="card"?l.dataset.backdropChrome=n:delete l.dataset.backdropChrome,o==="color"&&c)l.style.setProperty("--page-bg-color",c),l.style.removeProperty("--page-bg-gradient");else if(o==="gradient"&&g&&u){let M=h||"to bottom";l.style.setProperty("--page-bg-gradient",`linear-gradient(${M}, ${g}, ${u})`),l.style.removeProperty("--page-bg-color")}else l.style.removeProperty("--page-bg-color"),l.style.removeProperty("--page-bg-gradient");let W=this.load().accent||"default";this._applyAccent(W),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{mode:t,brand:e,accent:W,borderStyle:$,iconSet:k,fluid:r,backdrop:i,backdropChrome:n,pageBgType:o,effectiveMode:this.getEffectiveMode()}}))},setMode(t){let e=this.save({mode:t});this.apply(e)},async setBrand(t){try{await B(t)}catch(a){console.warn(`[VB] Theme "${t}" failed to load, using default`,a),t="default"}let e=this.save({brand:t});this.apply(e)},setAccent(t){this.save({accent:t}),this._applyAccent(t),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}}))},setBorderStyle(t){let e=this.save({borderStyle:t});this.apply(e)},setIconSet(t){let e=this.save({iconSet:t});this.apply(e)},setFluid(t){let e=this.save({fluid:t});this.apply(e)},setBackdrop(t){let e=this.save({backdrop:t});this.apply(e)},setBackdropChrome(t){let e=this.save({backdropChrome:t});this.apply(e)},setPageBg({type:t="",color:e="",gradStart:a="",gradEnd:s="",gradDir:r=""}={}){let i=this.save({pageBgType:t,pageBgColor:e,pageBgGradStart:a,pageBgGradEnd:s,pageBgGradDir:r});this.apply(i)},getEffectiveMode(){let{mode:t}=this.load();return t!=="auto"?t:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"},getState(){let{mode:t,brand:e,accent:a,borderStyle:s,iconSet:r,fluid:i,backdrop:n,backdropChrome:o,pageBgType:c,pageBgColor:g,pageBgGradStart:u,pageBgGradEnd:h,pageBgGradDir:l}=this.load();return{mode:t,brand:e,accent:a,borderStyle:s,iconSet:r,fluid:i,backdrop:n,backdropChrome:o,pageBgType:c,pageBgColor:g,pageBgGradStart:u,pageBgGradEnd:h,pageBgGradDir:l,effectiveMode:this.getEffectiveMode()}},toggleMode(){let e=this.getEffectiveMode()==="dark"?"light":"dark";this.setMode(e)},reset(){d={...b},p.remove(j,V).catch(()=>{});let t=document.documentElement;t.style.removeProperty("--page-bg-color"),t.style.removeProperty("--page-bg-gradient");for(let e of se)t.style.removeProperty(e);this.apply(b)},_readCSSHint(t){return getComputedStyle(document.documentElement).getPropertyValue(t).trim()},_applyAccent(t){let e=document.documentElement,a=E.find(s=>s.id===t);for(let s of se)e.style.removeProperty(s);if(!(!a||!a.seeds||Object.keys(a.seeds).length===0)){for(let[s,r]of Object.entries(a.seeds))e.style.setProperty(s,String(r));if(a.seedsDark&&this.getEffectiveMode()==="dark")for(let[s,r]of Object.entries(a.seedsDark))e.style.setProperty(s,String(r))}},_watchRootAttributes(){this._rootObserver||(this._rootObserver=new MutationObserver(t=>{for(let e of t)e.attributeName==="data-theme"?this._syncFromDataTheme():e.attributeName==="data-mode"&&this._syncFromDataMode()}),this._rootObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme","data-mode"]}))},_syncFromDataTheme(){if(!d)return;let a=(document.documentElement.dataset.theme||"").split(/\s+/).filter(Boolean).find(s=>!s.startsWith("a11y-"))||"default";a!==d.brand&&(d.brand=a,B(a).catch(()=>{}),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}})))},_syncFromDataMode(){if(!d)return;let t=document.documentElement.dataset.mode||"auto",e=d.mode==="auto"?this.getEffectiveMode():d.mode;t!==e&&(d.mode=t,window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}})))},_watchSystemPreference(){window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",()=>{let e=this.load();e.mode==="auto"&&this.apply(e)})}};var v=null,x="settings",_={motionFx:!0,sounds:!1},G=class t extends T{static#i=200;#t;#e;#a=!1;#s=!1;#g=!1;#c=null;#f=!1;#l=[];#r={..._};#n=()=>this.#E();async setup(){this.#s=this.getAttribute("variant")==="inline",this.#g=this.hasAttribute("compact"),await Promise.all([m.init(),this.#S()]),this.#$(),this.#A(),this.#v(),this.listen(window,"vb:theme-change",this.#I),this.#b(),this.#h()}async#S(){let[e,a]=await Promise.all([p.get(x,"a11y"),p.get(x,"extensions")]);this.#l=Array.isArray(e)?e:[],this.#r={..._,...a??{}}}teardown(){window.removeEventListener("scroll",this.#n,{capture:!0}),window.removeEventListener("resize",this.#n),this.#p()}#$(){this.#s||(this.#t=this.querySelector(":scope > [data-trigger]"),this.#t||(this.#t=this.querySelector(":scope > button")),this.#t||(this.#t=document.createElement("button"),this.#t.setAttribute("data-trigger",""),this.#t.innerHTML=`
           <icon-wc name="palette" label="Theme settings"></icon-wc>
-        `,this.prepend(this.#t)),this.#t.setAttribute("aria-haspopup","dialog"),this.#t.setAttribute("aria-expanded","false")),this.#e=document.createElement("div"),this.#e.className="panel",this.#e.setAttribute("role","dialog"),this.#e.setAttribute("aria-label","Theme settings"),this.#s||(this.#e.id=`theme-panel-${crypto.randomUUID().slice(0,8)}`,this.#t.setAttribute("aria-controls",this.#e.id)),this.#e.innerHTML=this.#E(),this.appendChild(this.#e)}#E(){return this.#u?this.#$():this.#S()}#h(e,a){let i=e.swatchBg,r=e.swatchFg||"white",n=e.icon||"";return`
+        `,this.prepend(this.#t)),this.#t.setAttribute("aria-haspopup","dialog"),this.#t.setAttribute("aria-expanded","false")),this.#e=document.createElement("div"),this.#e.className="panel",this.#e.setAttribute("role","dialog"),this.#e.setAttribute("aria-label","Theme settings"),this.#s||(this.#e.id=`theme-panel-${crypto.randomUUID().slice(0,8)}`,this.#t.setAttribute("aria-controls",this.#e.id)),this.#e.innerHTML=this.#k(),this.appendChild(this.#e)}#k(){return this.#g?this.#B():this.#T()}#m(e,a){let s=e.swatchBg,r=e.swatchFg||"white",i=e.icon||"";return`
       <label class="swatch-cell" title="${e.character?`${e.name} \u2014 ${e.character}`:e.name}">
         <input
           type="radio"
@@ -8,26 +8,26 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
           value="${e.id}"
           ${a===e.id?"checked":""}
         />
-        <span class="swatch-visual" style="--swatch-bg: ${i}; --swatch-fg: ${r}">
-          ${n?`<icon-wc name="${n}"></icon-wc>`:""}
+        <span class="swatch-visual" style="--swatch-bg: ${s}; --swatch-fg: ${r}">
+          ${i?`<icon-wc name="${i}"></icon-wc>`:""}
           <span class="sr-only">${e.name}</span>
         </span>
       </label>
-    `}#S(){let{mode:e,brand:a,fluid:i,accent:r}=m.getState(),n=L.filter(s=>s.tier==="showcase");return`
+    `}#T(){let{mode:e,brand:a,fluid:s,accent:r}=m.getState(),i=q.filter(n=>n.tier==="showcase");return`
       <fieldset class="section">
         <legend>Color Mode</legend>
         <div class="options" role="radiogroup" aria-label="Color mode">
-          ${x.map(s=>`
+          ${D.map(n=>`
             <label class="option">
               <input
                 type="radio"
                 name="theme-mode"
-                value="${s.id}"
-                ${e===s.id?"checked":""}
+                value="${n.id}"
+                ${e===n.id?"checked":""}
               />
               <span class="option-content">
-                <icon-wc name="${s.icon}"></icon-wc>
-                <span>${s.name}</span>
+                <icon-wc name="${n.icon}"></icon-wc>
+                <span>${n.name}</span>
               </span>
             </label>
           `).join("")}
@@ -37,11 +37,11 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Color Accent</legend>
         <div class="options options--accent-dots" role="radiogroup" aria-label="Color accent">
-          ${y.map(s=>`
-            <label class="accent-dot" title="${s.name}">
-              <input type="radio" name="theme-accent" value="${s.id}" ${r===s.id?"checked":""} />
-              <span class="accent-dot-visual" style="background: ${s.swatchBg}"></span>
-              <span class="sr-only">${s.name}</span>
+          ${E.map(n=>`
+            <label class="accent-dot" title="${n.name}">
+              <input type="radio" name="theme-accent" value="${n.id}" ${r===n.id?"checked":""} />
+              <span class="accent-dot-visual" style="background: ${n.swatchBg}"></span>
+              <span class="sr-only">${n.name}</span>
             </label>
           `).join("")}
         </div>
@@ -50,17 +50,17 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Style</legend>
         <div class="options options--swatch-grid" role="radiogroup" aria-label="Style">
-          ${$.map(s=>this.#h(s,a)).join("")}
+          ${A.map(n=>this.#m(n,a)).join("")}
         </div>
       </fieldset>
 
       <fieldset class="section">
         <legend>Featured</legend>
-        ${n.map(s=>`
+        ${i.map(n=>`
           <div class="theme-category">
-            <span class="category-label">${s.label}</span>
+            <span class="category-label">${n.label}</span>
             <div class="options options--swatch-grid">
-              ${s.themes.map(c=>this.#h(c,a)).join("")}
+              ${n.themes.map(o=>this.#m(o,a)).join("")}
             </div>
           </div>
         `).join("")}
@@ -72,25 +72,25 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
           <icon-wc name="chevron-down" class="chevron"></icon-wc>
         </summary>
         <div class="options options--swatch-grid">
-          ${w.map(s=>this.#h(s,a)).join("")}
+          ${S.map(n=>this.#m(n,a)).join("")}
         </div>
       </details>
 
       <fieldset class="section section--a11y">
         <legend>Accessibility</legend>
         <div class="options options--a11y" aria-label="Accessibility themes">
-          ${F.map(s=>{let l=this.#l().includes(s.id);return`
+          ${R.map(n=>{let c=this.#d().includes(n.id);return`
             <label class="option option--a11y">
               <input
                 type="checkbox"
                 name="a11y-theme"
-                value="${s.id}"
-                data-a11y-theme="${s.id}"
-                ${l?"checked":""}
+                value="${n.id}"
+                data-a11y-theme="${n.id}"
+                ${c?"checked":""}
               />
               <span class="option-content">
-                <icon-wc name="${s.icon}"></icon-wc>
-                <span class="option-label">${s.name}</span>
+                <icon-wc name="${n.icon}"></icon-wc>
+                <span class="option-label">${n.name}</span>
               </span>
             </label>
           `}).join("")}
@@ -100,19 +100,19 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Sizing</legend>
         <div class="options options--sizing" role="radiogroup" aria-label="Fluid sizing">
-          ${M.map(s=>`
+          ${O.map(n=>`
             <label class="option option--sizing">
               <input
                 type="radio"
                 name="theme-fluid"
-                value="${s.id}"
-                ${i===s.id?"checked":""}
+                value="${n.id}"
+                ${s===n.id?"checked":""}
               />
               <span class="option-content">
-                <icon-wc name="${s.icon}"></icon-wc>
+                <icon-wc name="${n.icon}"></icon-wc>
                 <span class="option-text">
-                  <span>${s.name}</span>
-                  <small>${s.description}</small>
+                  <span>${n.name}</span>
+                  <small>${n.description}</small>
                 </span>
               </span>
             </label>
@@ -120,38 +120,38 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
         </div>
       </fieldset>
 
-      <details class="section section--extensions" ${this.#p?"open":""}>
+      <details class="section section--extensions" ${this.#f?"open":""}>
         <summary class="extensions-toggle">
           <icon-wc name="sliders-horizontal"></icon-wc>
           <span>Extensions</span>
           <icon-wc name="chevron-down" class="chevron"></icon-wc>
         </summary>
         <div class="extensions-content">
-          ${P.map(s=>{let l=this.#o()[s.id]??b[s.id];return`
+          ${I.map(n=>{let c=this.#u()[n.id]??_[n.id];return`
             <label class="extension-toggle">
               <span class="extension-info">
-                <icon-wc name="${s.icon}"></icon-wc>
-                <span class="extension-name">${s.name}</span>
+                <icon-wc name="${n.icon}"></icon-wc>
+                <span class="extension-name">${n.name}</span>
               </span>
               <input
                 type="checkbox"
-                name="ext-${s.id}"
-                data-extension="${s.id}"
+                name="ext-${n.id}"
+                data-extension="${n.id}"
                 data-switch="sm"
-                ${l?"checked":""}
+                ${c?"checked":""}
               />
             </label>
           `}).join("")}
         </div>
       </details>
-    `}#$(){let{mode:e,brand:a,fluid:i,accent:r}=m.getState(),n=this.#l(),s=this.#o();return`
+    `}#B(){let{mode:e,brand:a,fluid:s,accent:r}=m.getState(),i=this.#d(),n=this.#u();return`
       <fieldset class="section">
         <legend>Color Mode</legend>
         <div class="compact-segmented" role="radiogroup" aria-label="Color mode">
-          ${x.map(c=>`
+          ${D.map(o=>`
             <label class="compact-seg">
-              <input type="radio" name="theme-mode" value="${c.id}" ${e===c.id?"checked":""} />
-              <span><icon-wc name="${c.icon}" size="xs"></icon-wc> ${c.name}</span>
+              <input type="radio" name="theme-mode" value="${o.id}" ${e===o.id?"checked":""} />
+              <span><icon-wc name="${o.icon}" size="xs"></icon-wc> ${o.name}</span>
             </label>
           `).join("")}
         </div>
@@ -160,8 +160,8 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Color Accent</legend>
         <select class="compact-select" name="theme-accent-select" aria-label="Color accent">
-          ${y.map(c=>`
-            <option value="${c.id}" ${r===c.id?"selected":""}>${c.name}</option>
+          ${E.map(o=>`
+            <option value="${o.id}" ${r===o.id?"selected":""}>${o.name}</option>
           `).join("")}
         </select>
       </fieldset>
@@ -169,10 +169,10 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Theme</legend>
         <select class="compact-select" name="theme-brand-select" aria-label="Theme">
-          ${L.map(c=>`
-            <optgroup label="${c.label}">
-              ${c.themes.map(l=>`
-                <option value="${l.id}" ${a===l.id?"selected":""}>${l.name}</option>
+          ${q.map(o=>`
+            <optgroup label="${o.label}">
+              ${o.themes.map(c=>`
+                <option value="${c.id}" ${a===c.id?"selected":""}>${c.name}</option>
               `).join("")}
             </optgroup>
           `).join("")}
@@ -182,8 +182,8 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Sizing</legend>
         <select class="compact-select" name="theme-fluid-select" aria-label="Sizing">
-          ${M.map(c=>`
-            <option value="${c.id}" ${i===c.id?"selected":""}>${c.name}</option>
+          ${O.map(o=>`
+            <option value="${o.id}" ${s===o.id?"selected":""}>${o.name}</option>
           `).join("")}
         </select>
       </fieldset>
@@ -191,12 +191,12 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Accessibility</legend>
         <div class="compact-toggles">
-          ${F.map(c=>`
+          ${R.map(o=>`
             <label class="extension-toggle">
               <span class="extension-info">
-                <span class="extension-name">${c.name}</span>
+                <span class="extension-name">${o.name}</span>
               </span>
-              <input type="checkbox" name="a11y-theme" value="${c.id}" data-a11y-theme="${c.id}" data-switch="sm" ${n.includes(c.id)?"checked":""} />
+              <input type="checkbox" name="a11y-theme" value="${o.id}" data-a11y-theme="${o.id}" data-switch="sm" ${i.includes(o.id)?"checked":""} />
             </label>
           `).join("")}
         </div>
@@ -205,15 +205,15 @@ var ee=Object.defineProperty;var te=(t,e)=>()=>(t&&(e=t(t=0)),e);var ae=(t,e)=>{
       <fieldset class="section">
         <legend>Extensions</legend>
         <div class="compact-toggles">
-          ${P.map(c=>`
+          ${I.map(o=>`
             <label class="extension-toggle">
               <span class="extension-info">
-                <span class="extension-name">${c.name}</span>
+                <span class="extension-name">${o.name}</span>
               </span>
-              <input type="checkbox" name="ext-${c.id}" data-extension="${c.id}" data-switch="sm" ${s[c.id]??b[c.id]?"checked":""} />
+              <input type="checkbox" name="ext-${o.id}" data-extension="${o.id}" data-switch="sm" ${n[o.id]??_[o.id]?"checked":""} />
             </label>
           `).join("")}
         </div>
       </fieldset>
-    `}#T(){this.#e.querySelectorAll('input[name="theme-mode"]').forEach(n=>{n.addEventListener("change",this.#k)}),this.#e.querySelectorAll('input[name="theme-brand"]').forEach(n=>{n.addEventListener("change",this.#x)});let e=this.#e.querySelector('select[name="theme-brand-select"]');e&&e.addEventListener("change",this.#_),this.#e.querySelectorAll('input[name="theme-fluid"]').forEach(n=>{n.addEventListener("change",this.#g)});let a=this.#e.querySelector('select[name="theme-fluid-select"]');a&&a.addEventListener("change",this.#g),this.#e.querySelectorAll('input[name="theme-accent"]').forEach(n=>{n.addEventListener("change",this.#f)});let i=this.#e.querySelector('select[name="theme-accent-select"]');i&&i.addEventListener("change",this.#f),this.#e.querySelectorAll("input[data-extension]").forEach(n=>{n.addEventListener("change",this.#M)}),this.#e.querySelectorAll("input[data-a11y-theme]").forEach(n=>{n.addEventListener("change",this.#L)}),this.#e.querySelector(".section--extensions")?.addEventListener("toggle",n=>{this.#p=n.target.open}),this.#s||(this.listen(this.#t,"click",this.#C),this.listen(document,"click",this.#A),this.listen(document,"keydown",this.#B))}#C=e=>{e.stopPropagation(),this.toggle()};#A=e=>{this.#a&&!this.contains(e.target)&&this.close()};#B=e=>{e.key==="Escape"&&this.#a&&(e.preventDefault(),this.close(),this.#t?.focus())};#k=e=>{m.setMode(e.target.value),this.#r()};#x=async e=>{let a=e.target.closest(".swatch-cell");a&&a.setAttribute("aria-busy","true");try{await m.setBrand(e.target.value)}catch{console.warn("[VB] Theme load failed, using default")}finally{a&&a.removeAttribute("aria-busy")}this.#d(),this.#r()};#_=async e=>{let a=e.target;a.disabled=!0;try{await m.setBrand(a.value)}catch{console.warn("[VB] Theme load failed, using default")}finally{a.disabled=!1}this.#d(),this.#r()};#g=e=>{m.setFluid(e.target.value),this.#r()};#f=e=>{m.setAccent(e.target.value),this.#r()};#M=e=>{let a=e.target.dataset.extension,i=e.target.checked;this.#F(a,i),this.#y()};#o(){try{let e=localStorage.getItem(Q);return e?{...b,...JSON.parse(e)}:{...b}}catch{return{...b}}}#F(e,a){try{let i=this.#o();i[e]=a,localStorage.setItem(Q,JSON.stringify(i))}catch{}}async#y(){let e=this.#o(),a=document.documentElement;e.motionFx?delete a.dataset.motionReduced:a.dataset.motionReduced="",e.sounds?(f||(f=(await Promise.resolve().then(()=>(X(),W))).SoundManager),f.init(),f.enable()):f&&f.disable(),window.dispatchEvent(new CustomEvent("vb:extensions-change",{detail:e}))}#l(){try{let e=localStorage.getItem(Z);return e?JSON.parse(e):[]}catch{return[]}}#P(e){try{localStorage.setItem(Z,JSON.stringify(e))}catch{}}#d(){let e=this.#l(),{brand:a}=m.getState(),i=document.documentElement,r=a==="default"?e.join(" "):[a,...e].join(" "),n=i.dataset.theme||"";r!==n&&(r?i.dataset.theme=r:delete i.dataset.theme)}#L=e=>{let a=e.target.dataset.a11yTheme,i=e.target.checked,r=this.#l();if(i&&!r.includes(a))r.push(a);else if(!i&&r.includes(a)){let n=r.indexOf(a);r.splice(n,1)}this.#P(r),this.#d()};#r(){this.#s||(this.#m(),this.#c=setTimeout(()=>{this.close(),this.#t?.focus()},t.#n))}#m(){this.#c&&(clearTimeout(this.#c),this.#c=null)}#O=()=>{this.#w()};#w(){let{mode:e,brand:a,fluid:i,accent:r}=m.getState(),n=this.#e.querySelector(`input[name="theme-mode"][value="${e}"]`);n&&(n.checked=!0);let s=this.#e.querySelector(`input[name="theme-brand"][value="${a}"]`);s&&(s.checked=!0);let c=this.#e.querySelector('select[name="theme-brand-select"]');c&&(c.value=a);let l=this.#e.querySelector(`input[name="theme-fluid"][value="${i}"]`);l&&(l.checked=!0);let u=this.#e.querySelector('select[name="theme-fluid-select"]');u&&(u.value=i);let h=this.#e.querySelector(`input[name="theme-accent"][value="${r||"default"}"]`);h&&(h.checked=!0);let d=this.#e.querySelector('select[name="theme-accent-select"]');d&&(d.value=r||"default")}open(){this.#s||this.#a||(this.#a=!0,this.setAttribute("open",""),this.#t?.setAttribute("aria-expanded","true"),requestAnimationFrame(()=>{this.#b(),window.addEventListener("scroll",this.#i,{capture:!0,passive:!0}),window.addEventListener("resize",this.#i,{passive:!0}),this.#e.querySelector('input[type="radio"]:checked')?.focus()}),this.dispatchEvent(new CustomEvent("theme-picker:open",{bubbles:!0})))}#b(){if(!this.#t||!this.#e)return;let e=this.#t.getBoundingClientRect(),a=this.#e.getBoundingClientRect(),i=window.visualViewport||{width:window.innerWidth,height:window.innerHeight},r=i.height,n=i.width,s=8,c=16,l=r-e.bottom-c,u=e.top-c,h=e.height+s;l<a.height&&u>l?(h=-a.height-s,this.#e.dataset.position="top"):delete this.#e.dataset.position;let d=0,o=e.left+a.width+c,q=e.left+d;o>n&&(d=n-o),q+d<c&&(d=c-e.left),this.#e.style.setProperty("--panel-top",`${h}px`),this.#e.style.setProperty("--panel-left",`${d}px`)}close(){this.#s||!this.#a||(this.#m(),this.#a=!1,this.removeAttribute("open"),this.#t?.setAttribute("aria-expanded","false"),window.removeEventListener("scroll",this.#i,{capture:!0}),window.removeEventListener("resize",this.#i),this.dispatchEvent(new CustomEvent("theme-picker:close",{bubbles:!0})))}toggle(){this.#a?this.close():this.open()}get isOpen(){return this.#a}};G("theme-picker",I);export{I as ThemePicker};
+    `}#A(){this.#e.querySelectorAll('input[name="theme-mode"]').forEach(i=>{i.addEventListener("change",this.#M)}),this.#e.querySelectorAll('input[name="theme-brand"]').forEach(i=>{i.addEventListener("change",this.#F)});let e=this.#e.querySelector('select[name="theme-brand-select"]');e&&e.addEventListener("change",this.#P),this.#e.querySelectorAll('input[name="theme-fluid"]').forEach(i=>{i.addEventListener("change",this.#y)});let a=this.#e.querySelector('select[name="theme-fluid-select"]');a&&a.addEventListener("change",this.#y),this.#e.querySelectorAll('input[name="theme-accent"]').forEach(i=>{i.addEventListener("change",this.#w)});let s=this.#e.querySelector('select[name="theme-accent-select"]');s&&s.addEventListener("change",this.#w),this.#e.querySelectorAll("input[data-extension]").forEach(i=>{i.addEventListener("change",this.#D)}),this.#e.querySelectorAll("input[data-a11y-theme]").forEach(i=>{i.addEventListener("change",this.#R)}),this.#e.querySelector(".section--extensions")?.addEventListener("toggle",i=>{this.#f=i.target.open}),this.#s||(this.listen(this.#t,"click",this.#C),this.listen(document,"click",this.#x),this.listen(document,"keydown",this.#_))}#C=e=>{e.stopPropagation(),this.toggle()};#x=e=>{this.#a&&!this.contains(e.target)&&this.close()};#_=e=>{e.key==="Escape"&&this.#a&&(e.preventDefault(),this.close(),this.#t?.focus())};#M=e=>{m.setMode(e.target.value),this.#o()};#F=async e=>{let a=e.target.closest(".swatch-cell");a&&a.setAttribute("aria-busy","true");try{await m.setBrand(e.target.value)}catch{console.warn("[VB] Theme load failed, using default")}finally{a&&a.removeAttribute("aria-busy")}this.#h(),this.#o()};#P=async e=>{let a=e.target;a.disabled=!0;try{await m.setBrand(a.value)}catch{console.warn("[VB] Theme load failed, using default")}finally{a.disabled=!1}this.#h(),this.#o()};#y=e=>{m.setFluid(e.target.value),this.#o()};#w=e=>{m.setAccent(e.target.value),this.#o()};#D=e=>{let a=e.target.dataset.extension,s=e.target.checked;this.#L(a,s),this.#b()};#u(){return{...this.#r}}#L(e,a){this.#r={...this.#r,[e]:a},p.set(x,"extensions",this.#r).catch(()=>{})}async#b(){let e=this.#u(),a=document.documentElement;e.motionFx?delete a.dataset.motionReduced:a.dataset.motionReduced="",e.sounds?(v||(v=(await Promise.resolve().then(()=>(re(),ie))).SoundManager),v.init(),v.enable()):v&&v.disable(),window.dispatchEvent(new CustomEvent("vb:extensions-change",{detail:e}))}#d(){return[...this.#l]}#O(e){this.#l=[...e],p.set(x,"a11y",this.#l).catch(()=>{})}#h(){let e=this.#d(),{brand:a}=m.getState(),s=document.documentElement,r=a==="default"?e.join(" "):[a,...e].join(" "),i=s.dataset.theme||"";r!==i&&(r?s.dataset.theme=r:delete s.dataset.theme)}#R=e=>{let a=e.target.dataset.a11yTheme,s=e.target.checked,r=this.#d();if(s&&!r.includes(a))r.push(a);else if(!s&&r.includes(a)){let i=r.indexOf(a);r.splice(i,1)}this.#O(r),this.#h()};#o(){this.#s||(this.#p(),this.#c=setTimeout(()=>{this.close(),this.#t?.focus()},t.#i))}#p(){this.#c&&(clearTimeout(this.#c),this.#c=null)}#I=()=>{this.#v()};#v(){let{mode:e,brand:a,fluid:s,accent:r}=m.getState(),i=this.#e.querySelector(`input[name="theme-mode"][value="${e}"]`);i&&(i.checked=!0);let n=this.#e.querySelector(`input[name="theme-brand"][value="${a}"]`);n&&(n.checked=!0);let o=this.#e.querySelector('select[name="theme-brand-select"]');o&&(o.value=a);let c=this.#e.querySelector(`input[name="theme-fluid"][value="${s}"]`);c&&(c.checked=!0);let g=this.#e.querySelector('select[name="theme-fluid-select"]');g&&(g.value=s);let u=this.#e.querySelector(`input[name="theme-accent"][value="${r||"default"}"]`);u&&(u.checked=!0);let h=this.#e.querySelector('select[name="theme-accent-select"]');h&&(h.value=r||"default")}open(){this.#s||this.#a||(this.#a=!0,this.setAttribute("open",""),this.#t?.setAttribute("aria-expanded","true"),requestAnimationFrame(()=>{this.#E(),window.addEventListener("scroll",this.#n,{capture:!0,passive:!0}),window.addEventListener("resize",this.#n,{passive:!0}),this.#e.querySelector('input[type="radio"]:checked')?.focus()}),this.dispatchEvent(new CustomEvent("theme-picker:open",{bubbles:!0})))}#E(){if(!this.#t||!this.#e)return;let e=this.#t.getBoundingClientRect(),a=this.#e.getBoundingClientRect(),s=window.visualViewport||{width:window.innerWidth,height:window.innerHeight},r=s.height,i=s.width,n=8,o=16,c=r-e.bottom-o,g=e.top-o,u=e.height+n;c<a.height&&g>c?(u=-a.height-n,this.#e.dataset.position="top"):delete this.#e.dataset.position;let h=0,l=e.left+a.width+o,U=e.left+h;l>i&&(h=i-l),U+h<o&&(h=o-e.left),this.#e.style.setProperty("--panel-top",`${u}px`),this.#e.style.setProperty("--panel-left",`${h}px`)}close(){this.#s||!this.#a||(this.#p(),this.#a=!1,this.removeAttribute("open"),this.#t?.setAttribute("aria-expanded","false"),window.removeEventListener("scroll",this.#n,{capture:!0}),window.removeEventListener("resize",this.#n),this.dispatchEvent(new CustomEvent("theme-picker:close",{bubbles:!0})))}toggle(){this.#a?this.close():this.open()}get isOpen(){return this.#a}};K("theme-picker",G);export{G as ThemePicker};
 //# sourceMappingURL=theme-picker.js.map