vanilla-breeze 0.1.3 → 0.2.0

package/dist/cdn/components/user-persona.js

@@ -13,6 +13,7 @@ var v=`
     --_goals:       var(--user-persona-goals, #22c55e);
     --_frustrations: var(--user-persona-frustrations, #ef4444);
     --_behaviors:   var(--user-persona-behaviors, #8b5cf6);
+    --_stories:     var(--user-persona-stories, #3b82f6);
     --_shadow:    var(--user-persona-shadow, var(--shadow-md));
     --_space-2xs: var(--user-persona-space-2xs, var(--size-2xs, 0.25rem));
     --_space-xs:  var(--user-persona-space-xs, var(--size-xs, 0.5rem));
@@ -197,6 +198,53 @@ var v=`
   .section-icon.goals { background: var(--_goals); }
   .section-icon.frustrations { background: var(--_frustrations); }
   .section-icon.behaviors { background: var(--_behaviors); }
+  .section-icon.stories { background: var(--_stories); }
+
+  /* Stories section \u2014 auto-rendered list of related <user-story> elements */
+  .section-count {
+    margin-inline-start: var(--_space-2xs);
+    padding: 0.05em 0.5ch;
+    border-radius: 999px;
+    background: var(--color-surface-raised, oklch(95% 0 0));
+    color: var(--color-text-muted);
+    font-size: 0.75em;
+    font-weight: 600;
+  }
+  .story-list {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: grid;
+    gap: var(--_space-2xs);
+  }
+  .story-item {
+    display: flex;
+    align-items: center;
+    gap: var(--_space-s);
+    padding-block: var(--_space-2xs);
+    border-block-end: 1px solid var(--color-border-muted, var(--color-border, #e5e7eb));
+  }
+  .story-item:last-child { border-block-end: none; }
+  .story-item a {
+    color: var(--color-interactive, currentColor);
+    text-decoration: none;
+    flex: 1;
+  }
+  .story-item a:hover { text-decoration: underline; }
+  .story-meta {
+    font-size: var(--_font-xs);
+    color: var(--color-text-muted);
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    padding: 0 0.5ch;
+    border: 1px solid var(--color-border-muted, var(--color-border, #e5e7eb));
+    border-radius: var(--_radius-m);
+  }
+  .empty-stories {
+    margin: 0;
+    color: var(--color-text-muted);
+    font-style: italic;
+  }
 
   .section-title {
     font-size: var(--_font-sm);
@@ -246,43 +294,55 @@ var v=`
       transition: none !important;
     }
   }
-`;var T=window.matchMedia("(prefers-reduced-motion: reduce)");var f=new Map;function g(r,e,a={}){let o=a.priority??10,s={impl:e,bundle:a.bundle,contract:a.contract,priority:o},t=f.get(r);if(customElements.get(r)){if(!t||t.priority>=o){t&&t.priority===o&&t.impl!==e&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${t.bundle}" (priority ${t.priority}). Skipping "${a.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${t.bundle}" cannot be replaced (customElements.define is permanent). "${a.bundle}" has higher priority but arrived late.`);return}if(t&&t.priority>=o){t.priority===o&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${t.bundle}". Skipping "${a.bundle}" (first wins at equal priority).`);return}f.set(r,s),customElements.define(r,e)}function n(r){return String(r).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;")}function b(r){return r.split(" ").map(e=>e[0]).join("").toUpperCase().slice(0,2)}function x(r){let e=0;for(let o=0;o<r.length;o++)e=r.charCodeAt(o)+((e<<5)-e);return`hsl(${(e%360+360)%360}, 65%, 55%)`}var d={user:'<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',pencil:'<path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/><path d="m15 5 4 4"/>',check:'<path d="M20 6 9 17l-5-5"/>',target:'<circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/>',alertTriangle:'<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',messageCircle:'<path d="M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719"/>',lightbulb:'<path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5"/><path d="M9 18h6"/><path d="M10 22h4"/>',wrench:'<path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z"/>',heart:'<path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"/>',mapPin:'<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/>',checkCircle:'<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><path d="m9 11 3 3L22 4"/>',x:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/>',send:'<path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/>'},N={says:{label:"Says",icon:d.messageCircle,color:"#3b82f6"},thinks:{label:"Thinks",icon:d.lightbulb,color:"#8b5cf6"},does:{label:"Does",icon:d.wrench,color:"#f59e0b"},feels:{label:"Feels",icon:d.heart,color:"#ef4444"}};var _="https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait",p=[32,64,128,256,512];function w(r){let e=0;for(let a=0;a<r.length;a++)e=r.charCodeAt(a)+((e<<5)-e);return e}function k(r){let e=p[0],a=Math.abs(r-e);for(let o=1;o<p.length;o++){let s=Math.abs(r-p[o]);s<a&&(e=p[o],a=s)}return e}function y(r,e=128){let a=w(String(r)),o=(a%100+100)%100,s=(a>>>16&1)===0?"female":"male",t=k(e);return`${_}/${s}/${t}/${o}.jpg`}function h(r){let e=0;for(let a=0;a<r.length;a++)e=r.charCodeAt(a)+((e<<5)-e);return e}var S=["Sarah Chen","Marcus Johnson","Aisha Patel","James O'Brien","Yuki Tanaka","Elena Rodriguez","David Kim","Fatima Al-Hassan","Lucas Silva","Priya Sharma","Noah Williams","Mei Lin","Carlos Mendez","Amara Osei","Henrik Larsson","Zara Ahmed"],C=["Product Manager","UX Designer","Frontend Developer","Data Analyst","Marketing Lead","QA Engineer","DevOps Lead","Content Strategist","Startup Founder","IT Director","Customer Success Lead","Research Scientist"],A=["San Francisco, CA","Austin, TX","London, UK","Toronto, CA","Berlin, DE","Tokyo, JP","Sydney, AU","S\xE3o Paulo, BR"],M=["I need tools that help me stay organized without slowing me down.","The dashboard is where I live \u2014 it has to be fast and reliable.","I want to understand the data, not fight the interface.","If it takes more than two clicks, I\u2019ll find another way.","Collaboration shouldn\u2019t mean endless notification noise.","I just want it to work the way I expect it to.","Give me the big picture first, then let me drill into details.","Accessibility isn\u2019t a nice-to-have \u2014 it\u2019s how I use the web."],z=["Streamline daily workflows","Reduce context-switching","Stay aligned with the team","Make data-driven decisions quickly","Ship features on a predictable cadence","Automate repetitive tasks","Improve onboarding experience","Keep documentation up to date"],$=["Too many disconnected tools","Slow page loads break focus","Unclear ownership of tasks","Settings that reset unexpectedly","Notifications that bury important updates","Poor mobile experience","Inconsistent design across features","No offline support"],q=["Checks dashboards every morning","Prefers keyboard shortcuts over mouse","Skims docs, reads deeply only when stuck","Shares screenshots in Slack","Batches email to twice a day","Tests features in incognito first","Bookmarks frequently used reports","Uses dark mode exclusively"],u=class extends HTMLElement{static get observedAttributes(){return["role","age","location","avatar","compact","src"]}#e=new Map;constructor(){super(),this.attachShadow({mode:"open"})}#a(){for(let e of[...this.children]){let a=e.getAttribute("slot");a&&!this.getAttribute(a)&&this.#e.set(a,e.textContent.trim())}}_resolve(e){return this.getAttribute(e)||this.#e.get(e)||""}async _loadSrc(e){if(e)try{let a=await fetch(e);if(!a.ok)throw new Error(`HTTP ${a.status}`);let o=await a.json();for(let s of["role","age","location","avatar"])o[s]&&this.setAttribute(s,o[s]);if(o.name&&!this.querySelector('[slot="name"]')){let s=document.createElement("h2");s.slot="name",s.textContent=o.name,this.appendChild(s)}if(o.quote&&!this.querySelector('[slot="quote"]')){let s=document.createElement("p");s.slot="quote",s.textContent=o.quote,this.appendChild(s)}for(let s of["bio","goals","frustrations","behaviors"])o[s]&&(Array.isArray(o[s])?this.#e.set(s,o[s]):this.#e.set(s,o[s]));this.#t()}catch(a){console.warn(`[user-persona] Failed to load src="${e}":`,a)}}connectedCallback(){this.#a(),this.hasAttribute("data-mock")?this.#o():this.hasAttribute("src")&&this._loadSrc(this.getAttribute("src")),this.#t(),this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent("persona-ready",{bubbles:!0,composed:!0,detail:{name:this.personaName,role:this.personaRole}}))}disconnectedCallback(){this.removeAttribute("data-upgraded")}attributeChangedCallback(e,a,o){a!==o&&this.shadowRoot&&(e==="src"&&this.isConnected?this._loadSrc(o):this.#t())}get personaName(){return this.querySelector('[slot="name"]')?.textContent?.trim()||this.#e.get("name")||"Unnamed Persona"}get personaRole(){return this.getAttribute("role")||""}get age(){return this.getAttribute("age")||""}get location(){return this.getAttribute("location")||""}get avatar(){return this.getAttribute("avatar")||""}get quote(){return this.querySelector('[slot="quote"]')?.textContent?.trim()||this.#e.get("quote")||""}get compact(){return this.hasAttribute("compact")}#o(){let e=this.dataset.seed||this.dataset.mock||String(Date.now()),a=t=>t[(h(e+t.length)%t.length+t.length)%t.length],o=(t,l)=>{let i=[];for(let c=0;c<l;c++)i.push(t[(h(e+c+t.length)%t.length+t.length)%t.length]);return[...new Set(i)]};if(!this.querySelector('[slot="name"]')){let t=document.createElement("h2");t.slot="name",t.textContent=a(S),this.appendChild(t)}if(this.getAttribute("role")||this.setAttribute("role",a(C)),this.getAttribute("age")||this.setAttribute("age",String(25+(h(e)%30+30)%30)),this.getAttribute("location")||this.setAttribute("location",a(A)),!this.getAttribute("avatar")){let t=this.querySelector('[slot="name"]')?.textContent?.trim()||"Persona";this.setAttribute("avatar",y(t,256))}if(!this.querySelector('[slot="quote"]')){let t=document.createElement("p");t.slot="quote",t.textContent=a(M),this.appendChild(t)}let s=(t,l)=>{if(this.querySelector(`[slot="${t}"]`))return;let i=document.createElement("ul");i.setAttribute("slot",t);for(let c of l){let m=document.createElement("li");m.textContent=c,i.appendChild(m)}this.appendChild(i)};s("goals",o(z,3)),s("frustrations",o($,3)),s("behaviors",o(q,3))}#t(){let e=this.personaName,a=this.personaRole,o=this.age,s=this.location,t=this.avatar,l=this.quote,i=x(e),c=t?`background:url(${n(t)}) center/cover`:`background:${i}`;this.shadowRoot.innerHTML=`
+`;var O=window.matchMedia("(prefers-reduced-motion: reduce)");var f=new Map;function g(r,e,t={}){let o=t.priority??10,i={impl:e,bundle:t.bundle,contract:t.contract,priority:o},s=f.get(r);if(customElements.get(r)){if(!s||s.priority>=o){s&&s.priority===o&&s.impl!==e&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${t.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${t.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=o){s.priority===o&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${s.bundle}". Skipping "${t.bundle}" (first wins at equal priority).`);return}f.set(r,i),customElements.define(r,e)}function a(r){return String(r).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;")}function b(r){return r.split(" ").map(e=>e[0]).join("").toUpperCase().slice(0,2)}function y(r){let e=0;for(let o=0;o<r.length;o++)e=r.charCodeAt(o)+((e<<5)-e);return`hsl(${(e%360+360)%360}, 65%, 55%)`}var d={user:'<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',pencil:'<path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/><path d="m15 5 4 4"/>',check:'<path d="M20 6 9 17l-5-5"/>',target:'<circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/>',alertTriangle:'<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',messageCircle:'<path d="M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719"/>',lightbulb:'<path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5"/><path d="M9 18h6"/><path d="M10 22h4"/>',wrench:'<path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z"/>',heart:'<path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"/>',mapPin:'<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/>',checkCircle:'<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><path d="m9 11 3 3L22 4"/>',x:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/>',send:'<path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/>'},L={says:{label:"Says",icon:d.messageCircle,color:"#3b82f6"},thinks:{label:"Thinks",icon:d.lightbulb,color:"#8b5cf6"},does:{label:"Does",icon:d.wrench,color:"#f59e0b"},feels:{label:"Feels",icon:d.heart,color:"#ef4444"}};var _="https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait",p=[32,64,128,256,512];function S(r){let e=0;for(let t=0;t<r.length;t++)e=r.charCodeAt(t)+((e<<5)-e);return e}function w(r){let e=p[0],t=Math.abs(r-e);for(let o=1;o<p.length;o++){let i=Math.abs(r-p[o]);i<t&&(e=p[o],t=i)}return e}function x(r,e=128){let t=S(String(r)),o=(t%100+100)%100,i=(t>>>16&1)===0?"female":"male",s=w(e);return`${_}/${i}/${s}/${o}.jpg`}function u(r){let e=0;for(let t=0;t<r.length;t++)e=r.charCodeAt(t)+((e<<5)-e);return e}var k=["Sarah Chen","Marcus Johnson","Aisha Patel","James O'Brien","Yuki Tanaka","Elena Rodriguez","David Kim","Fatima Al-Hassan","Lucas Silva","Priya Sharma","Noah Williams","Mei Lin","Carlos Mendez","Amara Osei","Henrik Larsson","Zara Ahmed"],C=["Product Manager","UX Designer","Frontend Developer","Data Analyst","Marketing Lead","QA Engineer","DevOps Lead","Content Strategist","Startup Founder","IT Director","Customer Success Lead","Research Scientist"],A=["San Francisco, CA","Austin, TX","London, UK","Toronto, CA","Berlin, DE","Tokyo, JP","Sydney, AU","S\xE3o Paulo, BR"],M=["I need tools that help me stay organized without slowing me down.","The dashboard is where I live \u2014 it has to be fast and reliable.","I want to understand the data, not fight the interface.","If it takes more than two clicks, I\u2019ll find another way.","Collaboration shouldn\u2019t mean endless notification noise.","I just want it to work the way I expect it to.","Give me the big picture first, then let me drill into details.","Accessibility isn\u2019t a nice-to-have \u2014 it\u2019s how I use the web."],$=["Streamline daily workflows","Reduce context-switching","Stay aligned with the team","Make data-driven decisions quickly","Ship features on a predictable cadence","Automate repetitive tasks","Improve onboarding experience","Keep documentation up to date"],z=["Too many disconnected tools","Slow page loads break focus","Unclear ownership of tasks","Settings that reset unexpectedly","Notifications that bury important updates","Poor mobile experience","Inconsistent design across features","No offline support"],q=["Checks dashboards every morning","Prefers keyboard shortcuts over mouse","Skims docs, reads deeply only when stuck","Shares screenshots in Slack","Batches email to twice a day","Tests features in incognito first","Bookmarks frequently used reports","Uses dark mode exclusively"],h=class extends HTMLElement{static get observedAttributes(){return["role","age","location","avatar","compact","src","data-list-stories","id"]}#e=new Map;#t=null;constructor(){super(),this.attachShadow({mode:"open"})}relatedStories(){if(!this.id)return[];let e=this.getRootNode(),t=e.querySelectorAll?e:document;return Array.from(t.querySelectorAll(`user-story[persona-id="${E(this.id)}"]`))}#a(){for(let e of[...this.children]){let t=e.getAttribute("slot");t&&!this.getAttribute(t)&&this.#e.set(t,e.textContent.trim())}}_resolve(e){return this.getAttribute(e)||this.#e.get(e)||""}get data(){return{name:this.personaName,role:this.personaRole||void 0,age:this.age||void 0,location:this.location||void 0,avatar:this.avatar||void 0,quote:this.quote||void 0,bio:this.#e.get("bio")||void 0,goals:this.#e.get("goals")||void 0,frustrations:this.#e.get("frustrations")||void 0,behaviors:this.#e.get("behaviors")||void 0}}set data(e){!e||typeof e!="object"||(this._applyData(e),this.shadowRoot&&this.#s(),this.dispatchEvent(new CustomEvent("user-persona:data-changed",{detail:{data:this.data,source:"property"},bubbles:!0,composed:!0})))}_applyData(e){for(let t of["role","age","location","avatar"])e[t]&&this.setAttribute(t,String(e[t]));if(e.name&&!this.querySelector('[slot="name"]')){let t=document.createElement("h2");t.slot="name",t.textContent=String(e.name),this.appendChild(t)}if(e.quote&&!this.querySelector('[slot="quote"]')){let t=document.createElement("p");t.slot="quote",t.textContent=String(e.quote),this.appendChild(t)}for(let t of["bio","goals","frustrations","behaviors"])e[t]&&this.#e.set(t,String(e[t]))}async _loadSrc(e){if(e)try{let t=await fetch(e);if(!t.ok)throw new Error(`HTTP ${t.status}`);let o=await t.json();this._applyData(o),this.#s()}catch(t){console.warn(`[user-persona] Failed to load src="${e}":`,t)}}connectedCallback(){this.#a(),this.hasAttribute("data-mock")?this.#n():this.hasAttribute("src")&&this._loadSrc(this.getAttribute("src")),this.#s(),this.#o(),this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent("persona-ready",{bubbles:!0,composed:!0,detail:{name:this.personaName,role:this.personaRole}}))}disconnectedCallback(){this.removeAttribute("data-upgraded"),this.#t?.disconnect(),this.#t=null}#o(){if(!this.hasAttribute("data-list-stories")||!this.id){this.#t?.disconnect(),this.#t=null;return}this.#t||(this.#t=new MutationObserver(()=>this.#i()),this.#t.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["persona-id"]}))}#i(){if(!this.shadowRoot)return;let e=this.shadowRoot.querySelector("[data-stories-section]");e&&(e.outerHTML=this.#r())}#r(){if(!this.hasAttribute("data-list-stories")||!this.id)return"";let e=this.relatedStories();return`
+      <section class="section" part="section-stories" data-stories-section>
+        <div class="section-header">
+          <div class="section-icon stories" aria-hidden="true">
+            <svg viewBox="0 0 24 24"><path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z"/></svg>
+          </div>
+          <span class="section-title">Stories <span class="section-count">${e.length}</span></span>
+        </div>
+        <div class="section-content">
+          ${e.length===0?'<p class="empty-stories">No user stories reference this persona yet.</p>':`<ul class="story-list">${e.map(t=>{let o=t.id||t.getAttribute("story-id")||"",i=t.querySelector('[slot="action"]')?.textContent?.trim()||t.getAttribute("action")||t.id||"untitled",s=t.getAttribute("priority")||"",n=t.getAttribute("status")||"";return`<li class="story-item" data-priority="${a(s)}" data-status="${a(n)}">${o?`<a href="#${a(o)}">${a(i)}</a>`:`<span>${a(i)}</span>`}${s?`<span class="story-meta">${a(s)}</span>`:""}${n?`<span class="story-meta">${a(n)}</span>`:""}</li>`}).join("")}</ul>`}
+        </div>
+      </section>
+    `}attributeChangedCallback(e,t,o){if(!(t===o||!this.shadowRoot)){if(e==="src"&&this.isConnected){this._loadSrc(o);return}(e==="data-list-stories"||e==="id")&&this.#o(),this.#s()}}get personaName(){return this.querySelector('[slot="name"]')?.textContent?.trim()||this.#e.get("name")||"Unnamed Persona"}get personaRole(){return this.getAttribute("role")||""}get age(){return this.getAttribute("age")||""}get location(){return this.getAttribute("location")||""}get avatar(){return this.getAttribute("avatar")||""}get quote(){return this.querySelector('[slot="quote"]')?.textContent?.trim()||this.#e.get("quote")||""}get compact(){return this.hasAttribute("compact")}#n(){let e=this.dataset.seed||this.dataset.mock||String(Date.now()),t=s=>s[(u(e+s.length)%s.length+s.length)%s.length],o=(s,n)=>{let c=[];for(let l=0;l<n;l++)c.push(s[(u(e+l+s.length)%s.length+s.length)%s.length]);return[...new Set(c)]};if(!this.querySelector('[slot="name"]')){let s=document.createElement("h2");s.slot="name",s.textContent=t(k),this.appendChild(s)}if(this.getAttribute("role")||this.setAttribute("role",t(C)),this.getAttribute("age")||this.setAttribute("age",String(25+(u(e)%30+30)%30)),this.getAttribute("location")||this.setAttribute("location",t(A)),!this.getAttribute("avatar")){let s=this.querySelector('[slot="name"]')?.textContent?.trim()||"Persona";this.setAttribute("avatar",x(s,256))}if(!this.querySelector('[slot="quote"]')){let s=document.createElement("p");s.slot="quote",s.textContent=t(M),this.appendChild(s)}let i=(s,n)=>{if(this.querySelector(`[slot="${s}"]`))return;let c=document.createElement("ul");c.setAttribute("slot",s);for(let l of n){let m=document.createElement("li");m.textContent=l,c.appendChild(m)}this.appendChild(c)};i("goals",o($,3)),i("frustrations",o(z,3)),i("behaviors",o(q,3))}#s(){let e=this.personaName,t=this.personaRole,o=this.age,i=this.location,s=this.avatar,n=this.quote,c=y(e),l=s?`background:url(${a(s)}) center/cover`:`background:${c}`;this.shadowRoot.innerHTML=`
       <style>${v}</style>
 
       <article class="persona-card" part="card" role="article"
-        aria-label="User persona: ${n(e)}">
+        aria-label="User persona: ${a(e)}">
 
         <header class="persona-header" part="header">
-          <div class="avatar" part="avatar" style="${c}"
-            role="img" aria-label="Avatar for ${n(e)}">
-            ${t?"":n(b(e))}
+          <div class="avatar" part="avatar" style="${l}"
+            role="img" aria-label="Avatar for ${a(e)}">
+            ${s?"":a(b(e))}
           </div>
           <div class="header-info">
             <div class="persona-name-wrap" part="name">
-              <slot name="name"><h2 class="persona-name-fallback">${n(e)}</h2></slot>
+              <slot name="name"><h2 class="persona-name-fallback">${a(e)}</h2></slot>
             </div>
-            ${a?`<p class="persona-role" part="role">${n(a)}</p>`:""}
+            ${t?`<p class="persona-role" part="role">${a(t)}</p>`:""}
             <div class="persona-meta" part="meta">
               ${o?`
                 <span class="meta-item">
                   <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2c-2.5 0-4.71-1.28-6-3.22.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08-1.29 1.94-3.5 3.22-6 3.22z"/></svg>
-                  ${n(o)} years old
+                  ${a(o)} years old
                 </span>
               `:""}
-              ${s?`
+              ${i?`
                 <span class="meta-item">
                   <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/></svg>
-                  ${n(s)}
+                  ${a(i)}
                 </span>
               `:""}
             </div>
           </div>
         </header>
 
-        ${l||this.querySelector('[slot="quote"]')?`
+        ${n||this.querySelector('[slot="quote"]')?`
           <div class="persona-quote" part="quote">
             <span class="quote-mark" aria-hidden="true">&ldquo;</span>
-            <div class="quote-text-wrap"><slot name="quote"><p class="quote-text">${n(l)}</p></slot></div>
+            <div class="quote-text-wrap"><slot name="quote"><p class="quote-text">${a(n)}</p></slot></div>
           </div>
         `:""}
 
@@ -334,7 +394,9 @@ var v=`
               <slot name="behaviors">No behaviors documented.</slot>
             </div>
           </div>
+
+          ${this.#r()}
         </div>
       </article>
-    `}};g("user-persona",u);export{u as UserPersona};
+    `}};function E(r){return typeof CSS<"u"&&CSS.escape?CSS.escape(String(r)):String(r).replace(/["\\]/g,"\\$&")}g("user-persona",h);export{h as UserPersona};
 //# sourceMappingURL=user-persona.js.map

package/dist/cdn/components/user-story.js

@@ -197,10 +197,11 @@ var h=`
   fill: white;
 }
 
-/* Semantic section-icon colors (hardcoded by intent) */
-.section-icon.acceptance { background: #22c55e; }
-.section-icon.notes      { background: #f59e0b; }
-.section-icon.tasks      { background: #8b5cf6; }
+/* Semantic section-icon colors \u2014 driven by VB theme tokens so they shift
+   with the active theme rather than fighting it. */
+.section-icon.acceptance { background: var(--color-success, #22c55e); }
+.section-icon.notes      { background: var(--color-warning, #f59e0b); }
+.section-icon.tasks      { background: var(--color-accent,  #8b5cf6); }
 
 .section-title {
   font-size: var(--_font-xs);
@@ -320,9 +321,9 @@ var h=`
 :host([detail="compact"]) .slot-fallback {
   display: none;
 }
-`;var v=window.matchMedia("(prefers-reduced-motion: reduce)");var m=new Map;function f(r,t,e={}){let s=e.priority??10,a={impl:t,bundle:e.bundle,contract:e.contract,priority:s},o=m.get(r);if(customElements.get(r)){if(!o||o.priority>=s){o&&o.priority===s&&o.impl!==t&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${o.bundle}" (priority ${o.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${o.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(o&&o.priority>=s){o.priority===s&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${o.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}m.set(r,a),customElements.define(r,t)}function c(r){return String(r).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;")}function b(r){return`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${r}</svg>`}var l={user:'<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',pencil:'<path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/><path d="m15 5 4 4"/>',check:'<path d="M20 6 9 17l-5-5"/>',target:'<circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/>',alertTriangle:'<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',messageCircle:'<path d="M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719"/>',lightbulb:'<path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5"/><path d="M9 18h6"/><path d="M10 22h4"/>',wrench:'<path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z"/>',heart:'<path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"/>',mapPin:'<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/>',checkCircle:'<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><path d="m9 11 3 3L22 4"/>',x:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/>',send:'<path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/>'},_={says:{label:"Says",icon:l.messageCircle,color:"#3b82f6"},thinks:{label:"Thinks",icon:l.lightbulb,color:"#8b5cf6"},does:{label:"Does",icon:l.wrench,color:"#f59e0b"},feels:{label:"Feels",icon:l.heart,color:"#ef4444"}};var u=class r extends HTMLElement{static get observedAttributes(){return["persona-id","priority","points","status","epic","story-id","compact","detail","src"]}static PRIORITIES={critical:{label:"Critical",color:"#dc2626",bg:"rgba(220, 38, 38, 0.1)"},high:{label:"High",color:"#ea580c",bg:"rgba(234, 88, 12, 0.1)"},medium:{label:"Medium",color:"#ca8a04",bg:"rgba(202, 138, 4, 0.1)"},low:{label:"Low",color:"#16a34a",bg:"rgba(22, 163, 74, 0.1)"}};static STATUSES={backlog:{label:"Backlog",color:"#6b7280",bg:"rgba(107, 114, 128, 0.1)"},"to-do":{label:"To Do",color:"#3b82f6",bg:"rgba(59, 130, 246, 0.1)"},"in-progress":{label:"In Progress",color:"#8b5cf6",bg:"rgba(139, 92, 246, 0.1)"},review:{label:"Review",color:"#f59e0b",bg:"rgba(245, 158, 11, 0.1)"},done:{label:"Done",color:"#22c55e",bg:"rgba(34, 197, 94, 0.1)"}};#t=new Map;constructor(){super(),this.attachShadow({mode:"open"})}#s(){for(let t of[...this.children]){let e=t.getAttribute("slot");e&&this.#t.set(e,t.textContent.trim())}}_resolve(t){return this.getAttribute(t)||this.#t.get(t)||""}get data(){return{storyId:this.storyId||void 0,personaId:this.personaId||void 0,priority:this.priority,status:this.status,points:this.points||void 0,epic:this.epic||void 0,detail:this.getAttribute("detail")||void 0,persona:this.persona||void 0,action:this.action||void 0,benefit:this.benefit||void 0,title:this.storyTitle||void 0}}set data(t){!t||typeof t!="object"||(this._applyData(t),this.#s(),this.shadowRoot&&this.#e(),this.dispatchEvent(new CustomEvent("user-story:data-changed",{detail:{data:this.data,source:"property"},bubbles:!0,composed:!0})))}_applyData(t){for(let[e,s]of[["storyId","story-id"],["personaId","persona-id"],["priority","priority"],["status","status"],["points","points"],["epic","epic"],["detail","detail"]])t[e]!=null&&this.setAttribute(s,String(t[e]));if(t.persona&&!this.querySelector('[slot="persona"]')){let e=document.createElement("span");e.slot="persona",e.textContent=t.persona,this.appendChild(e)}if(t.action&&!this.querySelector('[slot="action"]')){let e=document.createElement("span");e.slot="action",e.textContent=t.action,this.appendChild(e)}if(t.benefit&&!this.querySelector('[slot="benefit"]')){let e=document.createElement("span");e.slot="benefit",e.textContent=t.benefit,this.appendChild(e)}if(t.title&&!this.querySelector('[slot="title"]')){let e=document.createElement("h3");e.slot="title",e.textContent=t.title,this.appendChild(e)}for(let e of["acceptance-criteria","tasks","notes"]){let s=e==="acceptance-criteria"?"acceptanceCriteria":e;if(t[s]&&!this.querySelector(`[slot="${e}"]`))if(Array.isArray(t[s])){let a=document.createElement("ul");a.slot=e;for(let o of t[s]){let i=document.createElement("li");i.textContent=o,a.appendChild(i)}this.appendChild(a)}else{let a=document.createElement("p");a.slot=e,a.textContent=t[s],this.appendChild(a)}}}async _loadSrc(t){if(t)try{let e=await fetch(t);if(!e.ok)throw new Error(`HTTP ${e.status}`);let s=await e.json();this._applyData(s),this.#s(),this.#e()}catch(e){console.warn(`[user-story] Failed to load src="${t}":`,e)}}connectedCallback(){this.#s(),this.storyId&&!this.id&&(this.id=this.storyId),this.hasAttribute("src")&&this._loadSrc(this.getAttribute("src")),this.#e(),this.setAttribute("data-upgraded","")}disconnectedCallback(){this.removeAttribute("data-upgraded")}attributeChangedCallback(t,e,s){e!==s&&this.shadowRoot&&(t==="src"&&this.isConnected?this._loadSrc(s):this.#e())}get persona(){return this.querySelector('[slot="persona"]')?.textContent?.trim()||this.#t.get("persona")||"user"}get personaId(){return this.getAttribute("persona-id")||""}get action(){return this.querySelector('[slot="action"]')?.textContent?.trim()||this.#t.get("action")||""}get benefit(){return this.querySelector('[slot="benefit"]')?.textContent?.trim()||this.#t.get("benefit")||""}get priority(){return this.getAttribute("priority")||"medium"}get points(){return this.getAttribute("points")||""}get status(){return this.getAttribute("status")||"backlog"}get epic(){return this.getAttribute("epic")||""}get storyId(){return this.getAttribute("story-id")||""}get storyTitle(){return this.querySelector('[slot="title"]')?.textContent?.trim()||this.#t.get("title")||""}get _minimalLabel(){if(this.storyTitle)return this.storyTitle;let t=this.action;return t.length>40?t.slice(0,40)+"\u2026":t}get compact(){return this.hasAttribute("compact")}get _detailLevel(){return this.getAttribute("detail")?this.getAttribute("detail"):this.hasAttribute("compact")?"compact":"full"}updateStatus(t){r.STATUSES[t]&&(this.setAttribute("status",t),this.dispatchEvent(new CustomEvent("status-changed",{detail:{status:t,storyId:this.storyId},bubbles:!0,composed:!0})))}updatePriority(t){r.PRIORITIES[t]&&(this.setAttribute("priority",t),this.dispatchEvent(new CustomEvent("priority-changed",{detail:{priority:t,storyId:this.storyId},bubbles:!0,composed:!0})))}showDetail(){let t=`story-dialog-${this.storyId||this.id||"detail"}`,e=document.getElementById(t);e||(e=document.createElement("dialog"),e.id=t,e.setAttribute("data-size","l"),document.body.appendChild(e));let s=document.createElement("form");s.method="dialog";let a=document.createElement("header"),o=document.createElement("h3");o.textContent=this.storyTitle||this.storyId||"Story Detail";let i=document.createElement("button");i.type="submit",i.setAttribute("aria-label","Close"),i.textContent="\xD7",a.appendChild(o),a.appendChild(i);let d=document.createElement("section"),p=document.createElement("user-story");for(let n of this.getAttributeNames())n==="detail"||n==="compact"||n==="data-upgraded"||n==="draggable"||n==="data-id"||n==="data-quadrant"||p.setAttribute(n,this.getAttribute(n));let y=[...this.children].some(n=>n.getAttribute("slot")&&n.tagName!=="DIALOG");p.setAttribute("detail",y?"full":"compact"),p.removeAttribute("id");for(let n of[...this.children])n.tagName!=="DIALOG"&&p.appendChild(n.cloneNode(!0));d.appendChild(p),s.appendChild(a),s.appendChild(d),e.innerHTML="",e.appendChild(s),e.addEventListener("close",()=>{e.innerHTML=""},{once:!0}),e.showModal()}#e(){let t=r.PRIORITIES[this.priority]||r.PRIORITIES.medium,e=r.STATUSES[this.status]||r.STATUSES.backlog,s=this._detailLevel,a=this.storyId?`User story: ${c(this.storyId)}`:"User story";if(s==="minimal"){this.shadowRoot.innerHTML=`
+`;var v=window.matchMedia("(prefers-reduced-motion: reduce)");var m=new Map;function f(r,t,e={}){let s=e.priority??10,i={impl:t,bundle:e.bundle,contract:e.contract,priority:s},o=m.get(r);if(customElements.get(r)){if(!o||o.priority>=s){o&&o.priority===s&&o.impl!==t&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${o.bundle}" (priority ${o.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${o.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(o&&o.priority>=s){o.priority===s&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${o.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}m.set(r,i),customElements.define(r,t)}function c(r){return String(r).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;")}function b(r){return`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${r}</svg>`}var d={user:'<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',pencil:'<path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/><path d="m15 5 4 4"/>',check:'<path d="M20 6 9 17l-5-5"/>',target:'<circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/>',alertTriangle:'<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',messageCircle:'<path d="M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719"/>',lightbulb:'<path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5"/><path d="M9 18h6"/><path d="M10 22h4"/>',wrench:'<path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z"/>',heart:'<path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"/>',mapPin:'<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/>',checkCircle:'<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><path d="m9 11 3 3L22 4"/>',x:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/>',send:'<path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/>'},w={says:{label:"Says",icon:d.messageCircle,color:"#3b82f6"},thinks:{label:"Thinks",icon:d.lightbulb,color:"#8b5cf6"},does:{label:"Does",icon:d.wrench,color:"#f59e0b"},feels:{label:"Feels",icon:d.heart,color:"#ef4444"}};var u=class r extends HTMLElement{static get observedAttributes(){return["persona-id","priority","points","status","epic","story-id","compact","detail","src"]}static PRIORITIES={critical:{label:"Critical",color:"#dc2626",bg:"rgba(220, 38, 38, 0.1)"},high:{label:"High",color:"#ea580c",bg:"rgba(234, 88, 12, 0.1)"},medium:{label:"Medium",color:"#ca8a04",bg:"rgba(202, 138, 4, 0.1)"},low:{label:"Low",color:"#16a34a",bg:"rgba(22, 163, 74, 0.1)"}};static STATUSES={backlog:{label:"Backlog",color:"#6b7280",bg:"rgba(107, 114, 128, 0.1)"},"to-do":{label:"To Do",color:"#3b82f6",bg:"rgba(59, 130, 246, 0.1)"},"in-progress":{label:"In Progress",color:"#8b5cf6",bg:"rgba(139, 92, 246, 0.1)"},review:{label:"Review",color:"#f59e0b",bg:"rgba(245, 158, 11, 0.1)"},done:{label:"Done",color:"#22c55e",bg:"rgba(34, 197, 94, 0.1)"}};#t=new Map;#e=null;constructor(){super(),this.attachShadow({mode:"open"})}#o(){for(let t of[...this.children]){let e=t.getAttribute("slot");e&&this.#t.set(e,t.textContent.trim())}}_resolve(t){return this.getAttribute(t)||this.#t.get(t)||""}get data(){return{storyId:this.storyId||void 0,personaId:this.personaId||void 0,priority:this.priority,status:this.status,points:this.points||void 0,epic:this.epic||void 0,detail:this.getAttribute("detail")||void 0,persona:this.persona||void 0,action:this.action||void 0,benefit:this.benefit||void 0,title:this.storyTitle||void 0}}set data(t){!t||typeof t!="object"||(this._applyData(t),this.#o(),this.shadowRoot&&this.#s(),this.dispatchEvent(new CustomEvent("user-story:data-changed",{detail:{data:this.data,source:"property"},bubbles:!0,composed:!0})))}_applyData(t){for(let[e,s]of[["storyId","story-id"],["personaId","persona-id"],["priority","priority"],["status","status"],["points","points"],["epic","epic"],["detail","detail"]])t[e]!=null&&this.setAttribute(s,String(t[e]));if(t.persona&&!this.querySelector('[slot="persona"]')){let e=document.createElement("span");e.slot="persona",e.textContent=String(t.persona),this.appendChild(e)}if(t.action&&!this.querySelector('[slot="action"]')){let e=document.createElement("span");e.slot="action",e.textContent=String(t.action),this.appendChild(e)}if(t.benefit&&!this.querySelector('[slot="benefit"]')){let e=document.createElement("span");e.slot="benefit",e.textContent=String(t.benefit),this.appendChild(e)}if(t.title&&!this.querySelector('[slot="title"]')){let e=document.createElement("h3");e.slot="title",e.textContent=String(t.title),this.appendChild(e)}for(let e of["acceptance-criteria","tasks","notes"]){let s=e==="acceptance-criteria"?"acceptanceCriteria":e;if(t[s]&&!this.querySelector(`[slot="${e}"]`))if(Array.isArray(t[s])){let i=document.createElement("ul");i.slot=e;for(let o of t[s]){let n=document.createElement("li");n.textContent=String(o),i.appendChild(n)}this.appendChild(i)}else{let i=document.createElement("p");i.slot=e,i.textContent=String(t[s]),this.appendChild(i)}}}async _loadSrc(t){if(t)try{let e=await fetch(t);if(!e.ok)throw new Error(`HTTP ${e.status}`);let s=await e.json();this._applyData(s),this.#o(),this.#s()}catch(e){console.warn(`[user-story] Failed to load src="${t}":`,e)}}connectedCallback(){this.#o(),this.storyId&&!this.id&&(this.id=this.storyId),this.hasAttribute("src")&&this._loadSrc(this.getAttribute("src")),this.#s(),this.#r(),this.setAttribute("data-upgraded","")}disconnectedCallback(){this.removeAttribute("data-upgraded"),this.#e?.disconnect(),this.#e=null}attributeChangedCallback(t,e,s){e!==s&&this.shadowRoot&&(t==="src"&&this.isConnected?this._loadSrc(s):(this.#s(),t==="persona-id"&&this.#r()))}#r(){if(this.#e?.disconnect(),this.#e=null,!this.personaId||this.#i())return;let t=this.getRootNode(),s=(t&&typeof t.getElementById=="function"?t:document).getElementById(this.personaId);!s||s.tagName!=="USER-PERSONA"||(this.#e=new MutationObserver(()=>this.#s()),this.#e.observe(s,{attributes:!0,attributeFilter:["role"]}))}get persona(){return this.#i()||this.#a()||"user"}get personaId(){return this.getAttribute("persona-id")||""}#i(){return this.querySelector('[slot="persona"]')?.textContent?.trim()||this.#t.get("persona")||""}#a(){if(!this.personaId)return"";let t=this.getRootNode(),s=(t&&typeof t.getElementById=="function"?t:document).getElementById(this.personaId);return!s||s.tagName!=="USER-PERSONA"?"":s.getAttribute("role")?.trim()||""}#n(){return/^[aeio]/i.test(this.persona.trim())?"an":"a"}get action(){return this.querySelector('[slot="action"]')?.textContent?.trim()||this.#t.get("action")||""}get benefit(){return this.querySelector('[slot="benefit"]')?.textContent?.trim()||this.#t.get("benefit")||""}get priority(){return this.getAttribute("priority")||"medium"}get points(){return this.getAttribute("points")||""}get status(){return this.getAttribute("status")||"backlog"}get epic(){return this.getAttribute("epic")||""}get storyId(){return this.getAttribute("story-id")||""}get storyTitle(){return this.querySelector('[slot="title"]')?.textContent?.trim()||this.#t.get("title")||""}get _minimalLabel(){if(this.storyTitle)return this.storyTitle;let t=this.action;return t.length>40?t.slice(0,40)+"\u2026":t}get compact(){return this.hasAttribute("compact")}get _detailLevel(){return this.getAttribute("detail")?this.getAttribute("detail"):this.hasAttribute("compact")?"compact":"full"}updateStatus(t){r.STATUSES[t]&&(this.setAttribute("status",t),this.dispatchEvent(new CustomEvent("status-changed",{detail:{status:t,storyId:this.storyId},bubbles:!0,composed:!0})))}updatePriority(t){r.PRIORITIES[t]&&(this.setAttribute("priority",t),this.dispatchEvent(new CustomEvent("priority-changed",{detail:{priority:t,storyId:this.storyId},bubbles:!0,composed:!0})))}showDetail(){let t=`story-dialog-${this.storyId||this.id||"detail"}`,e=document.getElementById(t);e||(e=document.createElement("dialog"),e.id=t,e.setAttribute("data-size","l"),document.body.appendChild(e));let s=document.createElement("form");s.method="dialog";let i=document.createElement("header"),o=document.createElement("h3");o.textContent=this.storyTitle||this.storyId||"Story Detail";let n=document.createElement("button");n.type="submit",n.setAttribute("aria-label","Close"),n.textContent="\xD7",i.appendChild(o),i.appendChild(n);let l=document.createElement("section"),p=document.createElement("user-story");for(let a of this.getAttributeNames())a==="detail"||a==="compact"||a==="data-upgraded"||a==="draggable"||a==="data-id"||a==="data-quadrant"||p.setAttribute(a,this.getAttribute(a)??"");let y=[...this.children].some(a=>a.getAttribute("slot")&&a.tagName!=="DIALOG");p.setAttribute("detail",y?"full":"compact"),p.removeAttribute("id");for(let a of[...this.children])a.tagName!=="DIALOG"&&p.appendChild(a.cloneNode(!0));l.appendChild(p),s.appendChild(i),s.appendChild(l),e.innerHTML="",e.appendChild(s),e.addEventListener("close",()=>{e.innerHTML=""},{once:!0}),e.showModal()}#s(){let t=r.PRIORITIES[this.priority]||r.PRIORITIES.medium,e=r.STATUSES[this.status]||r.STATUSES.backlog,s=this._detailLevel,i=this.storyId?`User story: ${c(this.storyId)}`:"User story";if(this.shadowRoot){if(s==="minimal"){this.shadowRoot.innerHTML=`
         <style>${h}</style>
-        <article class="story-card story-card--minimal" role="article" aria-label="${a}"
+        <article class="story-card story-card--minimal" role="article" aria-label="${i}"
           tabindex="0">
           <div class="story-body">
             ${this.storyId?`<span class="story-id">${c(this.storyId)}</span>`:""}
@@ -331,10 +332,10 @@ var h=`
             </div>
           </div>
         </article>
-      `;let o=this.shadowRoot.querySelector(".story-card--minimal");o.addEventListener("click",()=>this.showDetail()),o.addEventListener("keydown",i=>{(i.key==="Enter"||i.key===" ")&&(i.preventDefault(),this.showDetail())})}else this.shadowRoot.innerHTML=`
+      `;let o=this.shadowRoot.querySelector(".story-card--minimal");if(!o)return;o.addEventListener("click",()=>this.showDetail()),o.addEventListener("keydown",n=>{let l=n;(l.key==="Enter"||l.key===" ")&&(l.preventDefault(),this.showDetail())})}else this.shadowRoot.innerHTML=`
         <style>${h}</style>
 
-        <article class="story-card story-card--${s}" part="card" role="article" aria-label="${a}">
+        <article class="story-card story-card--${s}" part="card" role="article" aria-label="${i}">
           <header class="story-header" part="header">
             <div class="story-meta">
               ${this.storyId?`<span class="story-id" part="id">${c(this.storyId)}</span>`:""}
@@ -353,8 +354,8 @@ var h=`
 
           <div class="story-body" part="body">
             <p class="story-statement" part="statement">
-              <span class="keyword">As a</span>
-              ${this.personaId?`<a class="persona-text persona-text--link" href="#${c(this.personaId)}">${b(l.user)} <slot name="persona"><span>user</span></slot></a>`:'<span class="persona-text"><slot name="persona"><span>user</span></slot></span>'},
+              <span class="keyword">As ${this.#n()}</span>
+              ${this.personaId?`<a class="persona-text persona-text--link" href="#${c(this.personaId)}">${b(d.user)} <slot name="persona"><span>${c(this.#a()||"user")}</span></slot></a>`:'<span class="persona-text"><slot name="persona"><span>user</span></slot></span>'},
               <span class="keyword">I want</span>
               <span class="action-text"><slot name="action"><span>[describe the action]</span></slot></span>${this.benefit||this.querySelector('[slot="benefit"]')?`
               <span class="keyword">so that</span>
@@ -406,5 +407,5 @@ var h=`
             </div>
           </div>
         </article>
-      `,s==="compact"&&this.shadowRoot.querySelectorAll(".section").forEach(i=>{let d=i.querySelector("slot");d&&d.assignedNodes().length===0&&i.setAttribute("data-empty","")});this.dispatchEvent(new CustomEvent("story-ready",{detail:{id:this.storyId,persona:this.persona,action:this.action,benefit:this.benefit,priority:this.priority,status:this.status,points:this.points},bubbles:!0,composed:!0}))}};f("user-story",u);export{u as UserStory};
+      `,s==="compact"&&this.shadowRoot.querySelectorAll(".section").forEach(n=>{let l=n.querySelector("slot");l&&l.assignedNodes().length===0&&n.setAttribute("data-empty","")});this.dispatchEvent(new CustomEvent("story-ready",{detail:{id:this.storyId,persona:this.persona,action:this.action,benefit:this.benefit,priority:this.priority,status:this.status,points:this.points},bubbles:!0,composed:!0}))}}};f("user-story",u);export{u as UserStory};
 //# sourceMappingURL=user-story.js.map

package/dist/cdn/components/version-switcher.js

@@ -0,0 +1,17 @@
+var $=window.matchMedia("(prefers-reduced-motion: reduce)");var g=new Map;function p(h,t,e={}){let i=e.priority??10,s={impl:t,bundle:e.bundle,contract:e.contract,priority:i},r=g.get(h);if(customElements.get(h)){if(!r||r.priority>=i){r&&r.priority===i&&r.impl!==t&&console.warn(`[VB Bundle] Tag <${h}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${h}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=i){r.priority===i&&console.warn(`[VB Bundle] Tag <${h}> already registered by "${r.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}g.set(h,s),customElements.define(h,t)}var u=class extends HTMLElement{#t=[];#e;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,i,s){t.addEventListener(e,i,s),this.#t.push(()=>t.removeEventListener(e,i,s))}setup(){}teardown(){}setState(t,e){this.#e||(this.#e=this.attachInternals());let i=this.#e.states;try{e?i.add(t):i.delete(t)}catch{let s=`--${t}`;e?i.add(s):i.delete(s)}}_adoptInternals(t){this.#e||(this.#e=t)}};var f=CSS.supports("anchor-name","--x"),A=CSS.supports("position-area","bottom"),y=0,m=class extends u{#t=null;#e=null;#i=null;#s=null;setup(){this.id||(this.id=`pop-over-${++y}`);let t=this.dataset.mode||"auto";this.hasAttribute("popover")||this.setAttribute("popover",t),this.#n(),this.#a(),this.#i=e=>{let i=e.newState==="open"?"show":"hide";this.dispatchEvent(new CustomEvent(`pop-over:${i}`,{detail:{state:e.newState},bubbles:!0,composed:!0})),!f&&e.newState==="open"&&this.#t&&this.#o()},this.listen(this,"beforetoggle",this.#i),f||(this.#s=()=>{this.matches(":popover-open")&&this.#t&&this.#o()},this.listen(window,"resize",this.#s),this.listen(window,"scroll",this.#s,{capture:!0,passive:!0}))}show(){this.matches(":popover-open")||this.showPopover()}hide(){this.matches(":popover-open")&&this.hidePopover()}toggle(){this.matches(":popover-open")?this.hide():this.show()}get open(){return this.matches(":popover-open")}#n(){let t=this.dataset.anchor;t?this.#t=document.getElementById(t)||document.querySelector(t):this.#t=document.querySelector(`[popovertarget="${CSS.escape(this.id)}"]`)}#a(){if(!(!this.#t||!f)&&(this.#e=`--pop-over-anchor-${this.id}`,this.#t.style.setProperty("anchor-name",this.#e),this.style.setProperty("position-anchor",this.#e),this.setAttribute("data-anchor-name",this.#e||""),!A)){let t=this.dataset.position||"bottom";this.#h(t)}}#h(t){let e="var(--_pop-over-offset, var(--size-xs))",i={top:{bottom:`calc(anchor(top) + ${e})`,left:"anchor(left)"},bottom:{top:`calc(anchor(bottom) + ${e})`,left:"anchor(left)"},left:{right:`calc(anchor(left) + ${e})`,top:"anchor(top)"},right:{left:`calc(anchor(right) + ${e})`,top:"anchor(top)"}},s=t.split("-")[0],r=i[s]||i.bottom;Object.entries(r).forEach(([n,a])=>this.style.setProperty(n,a))}#o(){if(!this.#t)return;let t=this.#t.getBoundingClientRect(),e=this.dataset.position||"bottom",i=this.#l(),s,r;switch(e.split("-")[0]){case"top":s=t.top-this.offsetHeight-i,r=t.left;break;case"left":s=t.top,r=t.left-this.offsetWidth-i;break;case"right":s=t.top,r=t.right+i;break;default:s=t.bottom+i,r=t.left;break}e.endsWith("-end")&&(e.startsWith("top")||e.startsWith("bottom")?r=t.right-this.offsetWidth:s=t.bottom-this.offsetHeight),this.style.position="fixed",this.style.top=`${Math.round(s)}px`,this.style.left=`${Math.round(r)}px`,this.style.margin="0"}#l(){let t={none:0,xs:4,s:8,m:16,l:24};return t[this.dataset.offset]??t.xs}};p("pop-over",m);var b=class extends u{setup(){this.querySelector("[data-controls]")||this.#t()}#t(){let t=document.createElement("nav");t.setAttribute("data-controls",""),t.setAttribute("aria-label","Change view controls"),t.innerHTML=`
+      <button type="button" data-action="tracking" aria-pressed="true">
+        Tracking
+      </button>
+      <button type="button" data-action="final" aria-pressed="false">
+        Final
+      </button>
+      <button type="button" data-action="original" aria-pressed="false">
+        Original
+      </button>
+    `,this.prepend(t),t.addEventListener("click",e=>{let s=e.target.closest("[data-action]")?.dataset.action;if(s){s==="tracking"?this.removeAttribute("view"):this.setAttribute("view",s);for(let r of t.querySelectorAll("button"))r.setAttribute("aria-pressed",String(r.dataset.action===s));this.dispatchEvent(new CustomEvent("change-set:view",{detail:{view:s},bubbles:!0}))}})}get view(){return this.getAttribute("view")??"tracking"}set view(t){if(this.view===t)return;t==="tracking"?this.removeAttribute("view"):this.setAttribute("view",t);let i=this.querySelector("[data-controls]");if(i)for(let s of i.querySelectorAll("button"))s.setAttribute("aria-pressed",String(s.dataset.action===t));this.dispatchEvent(new CustomEvent("change-set:view",{detail:{view:t,source:"api"},bubbles:!0}))}};p("change-set",b);function w(h,t){let e=String(h??"").split(`
+`),i=String(t??"").split(`
+`),s=e.length,r=i.length,n=Array.from({length:s+1},()=>new Array(r+1).fill(0));for(let l=1;l<=s;l++)for(let d=1;d<=r;d++)e[l-1]===i[d-1]?n[l][d]=n[l-1][d-1]+1:n[l][d]=Math.max(n[l-1][d],n[l][d-1]);let a=[],c=s,o=r;for(;c>0||o>0;)c>0&&o>0&&e[c-1]===i[o-1]?(a.unshift({type:"eq",text:e[c-1]}),c-=1,o-=1):o>0&&(c===0||n[c][o-1]>=n[c-1][o])?(a.unshift({type:"add",text:i[o-1]}),o-=1):(a.unshift({type:"del",text:e[c-1]}),c-=1);return a}function E(h){let t=document.createDocumentFragment(),e=document.createElement("pre");e.className="text-diff";for(let i of h)if(i.type==="eq")e.appendChild(document.createTextNode(`${i.text}
+`));else if(i.type==="add"){let s=document.createElement("ins");s.textContent=`${i.text}
+`,e.appendChild(s)}else if(i.type==="del"){let s=document.createElement("del");s.textContent=`${i.text}
+`,e.appendChild(s)}return t.appendChild(e),t}var x=0,v=class extends u{static observedAttributes=["data-versions","data-src"];#t=[];#e=null;#i;#s;#n;#a=null;#h=null;#o=null;setup(){this.#l(),this.hasAttribute("aria-label")||this.setAttribute("aria-label","Version"),this.#$(),this.#N(),this.#c(),this.#d(),this.#p(),this.hasAttribute("data-page-info-target")&&this.#x(),this.#t.length===0&&(this.getAttribute("data-src")||this.#g())&&this.#w()}attributeChangedCallback(t,e,i){!this.isConnected||e===i||(t==="data-versions"&&this.refresh(),t==="data-src"&&this.#w())}#l(){let t=null,e=this.getAttribute("data-versions");if(e)try{t=JSON.parse(e)}catch(i){this.#r("Failed to parse data-versions JSON",{error:i})}if(!t){let i=this.querySelector(':scope > script[type="application/json"][data-versions]');if(i?.textContent.trim())try{t=JSON.parse(i.textContent)}catch(s){this.#r("Failed to parse <script data-versions> JSON",{error:s})}}Array.isArray(t)||(t=[]),this.#t=t.filter(i=>i&&typeof i.id=="string"),this.#e=this.#b()}#b(){if(this.#t.length===0)return null;let t=this.#t.find(i=>i.current===!0);if(t)return t.id;let e=document.querySelector('meta[itemprop="version"]')?.getAttribute("content");if(e){let i=this.#t.find(s=>s.id===e);if(i)return i.id}return this.#t[0].id}#v(){let t=this.getAttribute("data-mode");return t==="releases"||t==="history"?t:new Set(this.#t.map(i=>i.url).filter(Boolean)).size>1?"releases":"history"}#g(){return document.querySelector('meta[name="vb:versions-manifest"]')?.getAttribute("content")}async#w(){let t=this.getAttribute("data-src")||this.#g();if(!t)return;this.#o=t,this.#c();let e;try{let i=await fetch(t,{credentials:"same-origin"});if(!i.ok)throw new Error(`Fetch failed (${i.status}) for ${t}`);e=await i.json()}catch(i){this.#o=null,this.#r(`Failed to load versions manifest: ${i.message}`,{error:i}),this.#c();return}if(this.#o===t){if(this.#o=null,!Array.isArray(e)){this.#r(`Manifest is not a JSON array: ${t}`),this.#c();return}this.#t=e.filter(i=>i&&typeof i.id=="string"),this.#e=this.#b(),this.#c(),this.#d(),this.#p(),this.#a&&this.#f()}}#p(){if(!this.hasAttribute("data-banner"))return;let t=this.#t.find(n=>n.id===this.#e),e=this.#t.find(n=>!n.archived&&!n.draft);if(this.#h?.remove(),this.#h=null,!t?.archived||!e||e.id===t.id)return;let i=document.createElement("aside");i.className="version-switcher-banner",i.setAttribute("role","region"),i.setAttribute("aria-live","polite"),i.setAttribute("aria-label","Archived version notice");let s=document.createElement("span");s.className="version-switcher-banner-text",s.textContent=`You're viewing ${t.label||t.id} (archived).`;let r=document.createElement("a");r.className="version-switcher-banner-link",e.url&&(r.href=e.url),r.textContent=`Latest: ${e.label||e.id} \u2192`,i.append(s," ",r),this.prepend(i),this.#h=i}#x(){let t=this.getAttribute("data-page-info-target");if(!t)return;let e=document.getElementById(t);if(!e||e.localName!=="page-info"){this.#r(`data-page-info-target: no <page-info id="${t}"> found.`);return}this.#i.hidden=!0;let i=()=>{let r=e.querySelector(".page-info-panel");return r?(this.#f(r),!0):!1};if(i())return;let s=new MutationObserver(()=>{i()&&s.disconnect()});s.observe(e,{childList:!0,subtree:!0}),setTimeout(()=>{this.#a||(s.disconnect(),this.#r(`<page-info id="${t}"> never rendered .page-info-panel within 5s.`))},5e3)}#f(t){let e=t||this.#a?.parentNode;if(!e)return;let i=this.#a;if(!i){i=document.createElement("section"),i.className="version-switcher-panel-section",i.setAttribute("aria-label",this.getAttribute("aria-label")||"Versions");let r=document.createElement("h3");r.className="version-switcher-panel-heading",r.textContent=this.#v()==="history"?"History":"Versions",i.appendChild(r),e.appendChild(i),this.#a=i}let s=i.querySelector("ul.version-switcher-panel-list");if(s||(s=document.createElement("ul"),s.className="version-switcher-panel-list",i.appendChild(s)),s.replaceChildren(),this.#t.length===0){let r=document.createElement("li");r.className="version-switcher-empty",r.textContent=this.#o?"Loading versions\u2026":"No versions available.",s.appendChild(r);return}for(let r of this.#t)s.appendChild(this.#E(r))}#$(){this.#i=document.createElement("button"),this.#i.type="button",this.#i.className="version-switcher-trigger",this.#i.setAttribute("aria-haspopup","dialog"),this.#i.setAttribute("aria-expanded","false"),this.appendChild(this.#i)}#N(){let t=`version-switcher-${++x}`;this.#i.setAttribute("popovertarget",t),this.#s=document.createElement("pop-over"),this.#s.id=t,this.#s.className="version-switcher-popover",this.#s.dataset.position="bottom-end",this.#s.setAttribute("role","dialog"),this.#s.setAttribute("aria-label",this.getAttribute("aria-label")||"Version");let e=document.createElement("h3");e.className="version-switcher-heading",e.textContent=this.#v()==="history"?"History":"Versions",this.#n=document.createElement("ul"),this.#n.className="version-switcher-list",this.#n.setAttribute("role","list"),this.#s.append(e,this.#n),this.appendChild(this.#s),this.listen(this.#s,"pop-over:show",()=>{this.#i.setAttribute("aria-expanded","true"),this.dispatchEvent(new CustomEvent("version-switcher:open",{bubbles:!0}));let i=this.#n.querySelector('[data-current="true"] button')||this.#n.querySelector("button");requestAnimationFrame(()=>i?.focus())}),this.listen(this.#s,"pop-over:hide",()=>{this.#i.setAttribute("aria-expanded","false"),this.dispatchEvent(new CustomEvent("version-switcher:close",{bubbles:!0}))}),this.listen(this.#n,"keydown",this.#S)}#c(){let t=this.#t.find(n=>n.id===this.#e),e=!!this.#o&&this.#t.length===0,i=e?"Loading\u2026":t?.label||t?.id||"Version";this.#i.replaceChildren();let s=document.createElement("span");s.className="version-switcher-trigger-label",s.textContent=i;let r=document.createElement("span");r.className="version-switcher-trigger-chevron",r.setAttribute("aria-hidden","true"),r.textContent="\u25BE",this.#i.append(s,r),this.#t.length===0?(this.#i.disabled=!0,this.#i.setAttribute("title",e?"Loading versions\u2026":"No versions available")):(this.#i.disabled=!1,this.#i.removeAttribute("title"))}#d(){if(this.#n){if(this.#n.replaceChildren(),this.#t.length===0){let t=document.createElement("li");t.className="version-switcher-empty",t.textContent="No versions available.",this.#n.appendChild(t);return}for(let t of this.#t)this.#n.appendChild(this.#E(t))}}#E(t){let e=document.createElement("li");e.setAttribute("role","listitem"),e.dataset.versionId=t.id,t.id===this.#e&&(e.dataset.current="true"),t.archived&&(e.dataset.archived=""),t.draft&&(e.dataset.draft="");let i=document.createElement("button");i.type="button",i.className="version-switcher-entry",i.setAttribute("aria-current",t.id===this.#e?"true":"false");let s=document.createElement("span");if(s.className="version-switcher-entry-label",s.textContent=t.label||t.id,t.archived){let n=document.createElement("span");n.className="version-switcher-badge version-switcher-badge-archived",n.textContent="archived",s.appendChild(n)}if(t.draft){let n=document.createElement("span");n.className="version-switcher-badge version-switcher-badge-draft",n.textContent="draft",s.appendChild(n)}if(t.id===this.#e){let n=document.createElement("span");n.className="version-switcher-badge version-switcher-badge-current",n.textContent="current",s.appendChild(n)}if(i.appendChild(s),t.date){let n=document.createElement("time");n.className="version-switcher-entry-date",n.setAttribute("datetime",t.date);try{n.title=new Date(t.date).toLocaleString()}catch{}n.textContent=C(t.date)||t.date,i.appendChild(n)}if(t.author){let n=document.createElement("span");n.className="version-switcher-entry-author",n.textContent=`by ${t.author}`,i.appendChild(n)}if(t.summary){let n=document.createElement("span");n.className="version-switcher-entry-summary",n.textContent=t.summary,i.appendChild(n)}if(t.versionUrl){let n=document.createElement("a");n.className="version-switcher-entry-changelog",n.href=t.versionUrl,n.textContent="Changelog \u2192",this.listen(n,"click",a=>a.stopPropagation()),i.appendChild(n)}let r=[t.label||t.id];return t.date&&r.push(`released ${C(t.date)||t.date}`),t.archived&&r.push("archived"),t.draft&&r.push("draft"),t.id===this.#e&&r.push("current"),i.setAttribute("aria-label",r.join(", ")),this.listen(i,"click",()=>this.#k(t)),e.appendChild(i),e}#S=t=>{let e=[...this.#n.querySelectorAll("button.version-switcher-entry")],i=e.indexOf(document.activeElement);if(i===-1)return;let s=i;switch(t.key){case"ArrowDown":t.preventDefault(),s=Math.min(e.length-1,i+1);break;case"ArrowUp":t.preventDefault(),s=Math.max(0,i-1);break;case"Home":t.preventDefault(),s=0;break;case"End":t.preventDefault(),s=e.length-1;break;default:return}e[s]?.focus()};#k(t){this.dispatchEvent(new CustomEvent("version-switcher:select",{bubbles:!0,detail:{entry:t}})),this.#C(t)}#C(t){let e=this.getAttribute("data-action")||"navigate";if(e==="navigate")return this.#A(t);if(e==="swap")return this.#M(t);if(e==="diff")return this.#q(t);this.#r(`Unknown action "${e}"; falling back to navigate.`),this.#A(t)}#A(t){if(!t?.url){this.#r("Cannot navigate: entry has no url.",{entry:t});return}let e=new CustomEvent("version-switcher:before-navigate",{bubbles:!0,cancelable:!0,detail:{entry:t}});this.dispatchEvent(e)&&(this.closePicker(),location.href=t.url)}#u(){return this.getAttribute("data-versioned-region")||"[data-versioned], main"}#m(t){return t.querySelector(this.#u())}async#y(t){let e=await fetch(t,{credentials:"same-origin"});if(!e.ok)throw new Error(`Fetch failed (${e.status}) for ${t}`);let i=await e.text(),s=new DOMParser().parseFromString(i,"text/html"),r=this.#m(s);if(!r)throw new Error(`No versioned region (${this.#u()}) found in ${t}`);return r}async#M(t){if(!t?.url){this.#r("Cannot swap: entry has no url.",{entry:t});return}let e=this.#m(document);if(!e){this.#r(`No versioned region (${this.#u()}) on this page to swap.`,{entry:t});return}let i=new CustomEvent("version-switcher:before-swap",{bubbles:!0,cancelable:!0,detail:{entry:t}});if(!this.dispatchEvent(i))return;this.closePicker();let s=this.#e,r=async()=>{try{let a=await this.#y(t.url);e.replaceChildren(...a.childNodes)}catch(a){throw this.#r(a.message,{entry:t,error:a}),a}};try{"startViewTransition"in document?await document.startViewTransition(r).updateCallbackDone:await r()}catch{return}let n=document.querySelector('meta[itemprop="version"]');n||(n=document.createElement("meta"),n.setAttribute("itemprop","version"),document.head.appendChild(n)),n.setAttribute("content",t.id),this.#e=t.id,this.#c(),this.#d(),this.dispatchEvent(new CustomEvent("version-switcher:swap",{bubbles:!0,detail:{entry:t,previousId:s}}))}async#q(t){if(!t?.url){this.#r("Cannot diff: entry has no url.",{entry:t});return}let e=this.#m(document);if(!e){this.#r(`No versioned region (${this.#u()}) on this page to diff against.`,{entry:t});return}if(t.id===this.#e){this.#r("Cannot diff against the current version.",{entry:t});return}let i=new CustomEvent("version-switcher:before-diff",{bubbles:!0,cancelable:!0,detail:{entry:t}});if(!this.dispatchEvent(i))return;this.closePicker();let s;try{s=await this.#y(t.url)}catch(c){this.#r(c.message,{entry:t,error:c});return}document.querySelectorAll(".version-switcher-diff-host").forEach(c=>c.remove());let r=w(e.textContent.trim(),s.textContent.trim()),n=document.createElement("change-set");n.classList.add("version-switcher-diff-host"),n.dataset.versionFrom=this.#e??"",n.dataset.versionTo=t.id,n.appendChild(E(r)),(this.getAttribute("data-diff-position")||"before")==="after"?e.parentNode.insertBefore(n,e.nextSibling):e.parentNode.insertBefore(n,e),n.setAttribute("tabindex","-1"),n.focus({preventScroll:!1}),this.dispatchEvent(new CustomEvent("version-switcher:diff",{bubbles:!0,detail:{entry:t,previousId:this.#e,diffElement:n,opCount:r.length}}))}get versions(){return this.#t.slice()}get currentId(){return this.#e}openPicker(){this.#s?.show()}closePicker(){this.#s?.hide()}switchTo(t){let e=this.#t.find(i=>i.id===t);if(!e){this.#r(`switchTo: no entry with id "${t}"`);return}this.dispatchEvent(new CustomEvent("version-switcher:select",{bubbles:!0,detail:{entry:e}})),this.#C(e)}refresh(){this.#l(),!(!this.#i||!this.#n)&&(this.#c(),this.#d(),this.#p(),this.#a&&this.#f())}#r(t,e={}){this.dispatchEvent(new CustomEvent("version-switcher:error",{bubbles:!0,detail:{message:t,...e}}))}};function C(h){let t=new Date(h);if(isNaN(t.getTime()))return null;let e=(Date.now()-t.getTime())/1e3;if(e<0)return null;let i=60,s=3600,r=86400,n=2592e3,a=31536e3;if(e<i)return"just now";if(e<s){let o=Math.floor(e/i);return`${o} minute${o!==1?"s":""} ago`}if(e<r){let o=Math.floor(e/s);return`${o} hour${o!==1?"s":""} ago`}if(e<n){let o=Math.floor(e/r);return`${o} day${o!==1?"s":""} ago`}if(e<a){let o=Math.floor(e/n);return`${o} month${o!==1?"s":""} ago`}let c=Math.floor(e/a);return`${c} year${c!==1?"s":""} ago`}p("version-switcher",v);export{v as VersionSwitcher};
+//# sourceMappingURL=version-switcher.js.map

package/dist/cdn/components/video-player.js

@@ -1,4 +1,4 @@
-var v=window.matchMedia("(prefers-reduced-motion: reduce)");var d=new Map;function u(o,t,e={}){let s=e.priority??10,r={impl:t,bundle:e.bundle,contract:e.contract,priority:s},i=d.get(o);if(customElements.get(o)){if(!i||i.priority>=s){i&&i.priority===s&&i.impl!==t&&console.warn(`[VB Bundle] Tag <${o}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${o}> defined by "${i.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(i&&i.priority>=s){i.priority===s&&console.warn(`[VB Bundle] Tag <${o}> already registered by "${i.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}d.set(o,r),customElements.define(o,t)}var l=class extends HTMLElement{#t=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,r){t.addEventListener(e,s,r),this.#t.push(()=>t.removeEventListener(e,s,r))}setup(){}teardown(){}};var h=[.5,.75,1,1.25,1.5,2],p=3e3,c=class extends l{#t=null;#a=null;#s=!1;#p=null;#l=null;#y=null;#c=null;#g=null;#k=null;#e=null;#x=null;#w=null;#d=null;#n=null;#v=null;#_=null;#f=null;#i=null;#m=2;#E=null;#S=null;setup(){if(this.#t=this.querySelector("video"),!this.#t)return!1;this.#a=this.querySelector(".track-list"),this.#t.removeAttribute("controls");let t=!this.shadowRoot;this.#C(),t&&(this.#z(),this.#L(),this.#$(),this.#q()),this.hasAttribute("muted")&&(this.#t.muted=!0,this.setAttribute("muted","")),this.hasAttribute("autoplay")&&this.#t.play().catch(()=>{}),this.#r(),this.#E=()=>{let e=this.shadowRoot?.querySelector(".player");e&&(e.style.display="none",e.offsetHeight,e.style.display="")},this.listen(window,"vb:theme-change",this.#E),this.#S=()=>{let e=!!document.fullscreenElement;this.toggleAttribute("data-fullscreen",e),this.#v.setAttribute("aria-label",e?"Exit fullscreen":"Fullscreen"),this.#o("video-player:fullscreen",{active:e})},this.listen(document,"fullscreenchange",this.#S),this.setAttribute("state","idle")}teardown(){this.#t&&this.#t.setAttribute("controls",""),this.#i!=null&&clearTimeout(this.#i)}#C(){if(this.shadowRoot)return;let t=this.attachShadow({mode:"open"});t.innerHTML=`
+var v=window.matchMedia("(prefers-reduced-motion: reduce)");var u=new Map;function d(n,t,e={}){let s=e.priority??10,r={impl:t,bundle:e.bundle,contract:e.contract,priority:s},i=u.get(n);if(customElements.get(n)){if(!i||i.priority>=s){i&&i.priority===s&&i.impl!==t&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${n}> defined by "${i.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(i&&i.priority>=s){i.priority===s&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${i.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}u.set(n,r),customElements.define(n,t)}var l=class extends HTMLElement{#t=[];#e;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,r){t.addEventListener(e,s,r),this.#t.push(()=>t.removeEventListener(e,s,r))}setup(){}teardown(){}setState(t,e){this.#e||(this.#e=this.attachInternals());let s=this.#e.states;try{e?s.add(t):s.delete(t)}catch{let r=`--${t}`;e?s.add(r):s.delete(r)}}_adoptInternals(t){this.#e||(this.#e=t)}};var h=[.5,.75,1,1.25,1.5,2],p=3e3,c=class extends l{#t=null;#e=null;#a=!1;#p=null;#l=null;#y=null;#c=null;#g=null;#k=null;#i=null;#x=null;#w=null;#u=null;#o=null;#v=null;#_=null;#f=null;#r=null;#m=2;#E=null;#S=null;setup(){if(this.#t=this.querySelector("video"),!this.#t)return!1;this.#e=this.querySelector(".track-list"),this.#t.removeAttribute("controls");let t=!this.shadowRoot;return this.#C(),t&&(this.#z(),this.#L(),this.#$(),this.#q()),this.hasAttribute("muted")&&(this.#t.muted=!0,this.setAttribute("muted","")),this.hasAttribute("autoplay")&&this.#t.play().catch(()=>{}),this.#s(),this.#E=()=>{let e=this.shadowRoot?.querySelector(".player");e&&(e.style.display="none",e.offsetHeight,e.style.display="")},this.listen(window,"vb:theme-change",this.#E),this.#S=()=>{let e=!!document.fullscreenElement;this.toggleAttribute("data-fullscreen",e),this.#v.setAttribute("aria-label",e?"Exit fullscreen":"Fullscreen"),this.#n("video-player:fullscreen",{active:e})},this.listen(document,"fullscreenchange",this.#S),this.setAttribute("state","idle"),!0}teardown(){this.#t&&this.#t.setAttribute("controls",""),this.#r!=null&&clearTimeout(this.#r)}get src(){return this.#t?.getAttribute("src")||this.#t?.currentSrc||""}set src(t){if(!this.#t)return;let e=t==null?"":String(t);this.#t.getAttribute("src")!==e&&(this.#t.setAttribute("src",e),this.#t.load?.(),this.dispatchEvent(new CustomEvent("video-player:src-changed",{detail:{src:e,source:"property"},bubbles:!0})))}get currentTime(){return this.#t?.currentTime??0}set currentTime(t){this.#t&&(this.#t.currentTime=Number(t)||0)}#C(){if(this.shadowRoot)return;let t=this.attachShadow({mode:"open"});t.innerHTML=`
       <style>${this.#M()}</style>
       <div part="player" class="player">
         <slot></slot>
@@ -82,7 +82,7 @@ var v=window.matchMedia("(prefers-reduced-motion: reduce)");var d=new Map;functi
         </div>
         <div class="sr-status" role="status" aria-live="polite"></div>
       </div>
-    `,this.#p=t.querySelector(".controls"),this.#l=t.querySelector(".play-btn"),this.#y=t.querySelector(".play-overlay"),this.#c=t.querySelector(".timeline"),this.#g=t.querySelector(".timeline-fill"),this.#k=t.querySelector(".timeline-buffer"),this.#e=t.querySelector(".volume"),this.#x=t.querySelector(".current-time"),this.#w=t.querySelector(".duration"),this.#d=t.querySelector(".speed-btn"),this.#n=t.querySelector(".captions-btn"),this.#v=t.querySelector(".fullscreen-btn"),this.#_=t.querySelector(".buffer-indicator"),this.#f=t.querySelector(".sr-status"),this.#t.querySelector('track[kind="captions"], track[kind="subtitles"]')||(this.#n.hidden=!0)}#M(){return`
+    `,this.#p=t.querySelector(".controls"),this.#l=t.querySelector(".play-btn"),this.#y=t.querySelector(".play-overlay"),this.#c=t.querySelector(".timeline"),this.#g=t.querySelector(".timeline-fill"),this.#k=t.querySelector(".timeline-buffer"),this.#i=t.querySelector(".volume"),this.#x=t.querySelector(".current-time"),this.#w=t.querySelector(".duration"),this.#u=t.querySelector(".speed-btn"),this.#o=t.querySelector(".captions-btn"),this.#v=t.querySelector(".fullscreen-btn"),this.#_=t.querySelector(".buffer-indicator"),this.#f=t.querySelector(".sr-status"),this.#t.querySelector('track[kind="captions"], track[kind="subtitles"]')||(this.#o.hidden=!0)}#M(){return`
       :host {
         display: block;
         --_accent: var(--video-player-accent, var(--color-primary, oklch(55% 0.2 260)));
@@ -508,5 +508,5 @@ var v=window.matchMedia("(prefers-reduced-motion: reduce)");var d=new Map;functi
           cursor: auto;
         }
       }
-    `}#z(){this.#t.addEventListener("timeupdate",()=>this.#F()),this.#t.addEventListener("loadedmetadata",()=>this.#P()),this.#t.addEventListener("progress",()=>this.#H()),this.#t.addEventListener("play",()=>{this.#s=!0,this.setAttribute("state","playing"),this.#l.setAttribute("aria-label","Pause"),this.#h("Playing"),this.#o("video-player:play",{currentTime:this.#t.currentTime,src:this.#t.currentSrc})}),this.#t.addEventListener("pause",()=>{this.#s=!1,this.setAttribute("state","paused"),this.#l.setAttribute("aria-label","Play"),this.#r(),this.#h("Paused"),this.#o("video-player:pause",{currentTime:this.#t.currentTime})}),this.#t.addEventListener("ended",()=>{this.#s=!1,this.setAttribute("state","ended"),this.#l.setAttribute("aria-label","Play"),this.#r();let t=this.#a?.querySelector("li[data-video-active]");t&&t.setAttribute("data-video-played",""),this.#a&&this.#V(),this.#h("Ended"),this.#o("video-player:ended",{src:this.#t.currentSrc})}),this.#t.addEventListener("waiting",()=>{this.#s&&(this.setAttribute("state","buffering"),this.#h("Buffering"))}),this.#t.addEventListener("playing",()=>{this.getAttribute("state")==="buffering"&&this.setAttribute("state","playing")})}#L(){this.#y.addEventListener("click",i=>{i.stopPropagation(),this.#t.play().catch(()=>{})}),(this.shadowRoot?.querySelector(".player")).addEventListener("click",i=>{i.target.closest(".controls")||i.target.closest(".play-overlay")||(this.#s?this.#t.pause():this.#t.play().catch(()=>{}))}),this.#l.addEventListener("click",()=>{this.#s?this.#t.pause():this.#t.play().catch(()=>{})}),this.#c.addEventListener("input",()=>{this.#t.duration&&(this.#t.currentTime=Number(this.#c.value)/100*this.#t.duration)}),(this.shadowRoot?.querySelector(".skip-back-btn")).addEventListener("click",()=>{this.#t.currentTime=Math.max(0,this.#t.currentTime-10)}),(this.shadowRoot?.querySelector(".skip-forward-btn")).addEventListener("click",()=>{this.#t.currentTime=Math.min(this.#t.duration||0,this.#t.currentTime+10)}),this.#e.addEventListener("input",()=>{this.#t.volume=Number(this.#e.value),this.#t.muted=!1,this.removeAttribute("muted"),this.#e.style.setProperty("--_vol",this.#e.value)}),(this.shadowRoot?.querySelector(".mute-btn")).addEventListener("click",()=>{this.#t.muted=!this.#t.muted,this.toggleAttribute("muted",this.#t.muted),this.#e.style.setProperty("--_vol",this.#t.muted?"0":this.#e.value)}),this.#d.addEventListener("click",()=>{this.#m=(this.#m+1)%h.length;let i=h[this.#m];this.#t.playbackRate=i;let a=this.#d.querySelector("span");a.textContent=`${i}x`,this.#d.setAttribute("aria-label",`Playback speed ${i}x`),this.#o("video-player:speed",{rate:i})}),this.#n.addEventListener("click",()=>{let i=this.#N();if(!i)return;let a=i.mode==="showing";i.mode=a?"hidden":"showing";let n=!a;this.toggleAttribute("captions",n),this.#n.setAttribute("aria-pressed",String(n)),this.#o("video-player:captions",{active:n,label:i.label})}),this.#v.addEventListener("click",()=>this.#A()),this.addEventListener("keydown",i=>this.#R(i)),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0")}#q(){let t=this.shadowRoot?.querySelector(".player"),e=()=>{this.#r(),this.#i!=null&&clearTimeout(this.#i),this.#s&&(this.#i=setTimeout(()=>this.#b(),p))};t.addEventListener("mousemove",e),t.addEventListener("mouseenter",e),t.addEventListener("mouseleave",()=>{this.#s&&(this.#i!=null&&clearTimeout(this.#i),this.#i=setTimeout(()=>this.#b(),500))}),t.addEventListener("touchstart",()=>{this.hasAttribute("controls")?this.#b():e()},{passive:!0}),this.#p.addEventListener("mouseenter",()=>{this.#i!=null&&clearTimeout(this.#i),this.#r()}),this.#p.addEventListener("focusin",()=>{this.#i!=null&&clearTimeout(this.#i),this.#r()})}#r(){this.setAttribute("controls","")}#b(){this.removeAttribute("controls")}#$(){this.#a&&this.#a.addEventListener("click",t=>{let e=t.target.closest("a[href]");e&&(t.preventDefault(),this.#u(e.href,e.closest("li"),e))})}#u(t,e,s){this.#a.querySelectorAll("li").forEach(n=>n.removeAttribute("data-video-active")),e&&e.setAttribute("data-video-active",""),this.#t.src=t;let i=s?.getAttribute("data-poster");i&&(this.#t.poster=i);let a=s?.getAttribute("data-captions");this.#B(a),this.#t.play().catch(()=>{}),this.#o("video-player:track-change",{src:t,title:s?.textContent??""})}#B(t){if(this.#t.querySelectorAll("track[data-dynamic]").forEach(r=>r.remove()),t){let r=document.createElement("track");r.kind="captions",r.src=t,r.default=!0,r.setAttribute("data-dynamic",""),this.#t.appendChild(r),this.hasAttribute("captions")&&(r.track.mode="showing")}let s=this.#t.querySelector('track[kind="captions"], track[kind="subtitles"]');this.#n.hidden=!s}#V(){if(!this.#a)return;let t=[...this.#a.querySelectorAll("li")],e=t.findIndex(r=>r.hasAttribute("data-video-active"));if(this.hasAttribute("shuffle")){let r=t.filter((i,a)=>a!==e);if(r.length){let i=r[Math.floor(Math.random()*r.length)],a=i.querySelector("a[href]");a&&this.#u(a.href,i,a)}return}let s=e+1;if(s<t.length){let r=t[s].querySelector("a[href]");r&&this.#u(r.href,t[s],r)}else if(this.hasAttribute("loop")){let r=t[0]?.querySelector("a[href]");r&&this.#u(r.href,t[0],r)}}#F(){let t=this.#t.currentTime,e=this.#t.duration||0,s=e?t/e*100:0;this.#x.textContent=this.#T(t),this.#c.value=String(s),this.#c.setAttribute("aria-valuetext",this.#D(t)),this.#g.style.width=`${s}%`}#P(){let t=this.#t.duration||0;this.#w.textContent=this.#T(t)}#H(){let t=this.#t.buffered,e=this.#t.duration||0;if(t.length>0&&e){let s=t.end(t.length-1);this.#k.style.width=`${s/e*100}%`}}#A(){document.fullscreenElement?document.exitFullscreen():this.requestFullscreen().catch(()=>{this.#t.requestFullscreen?.().catch(()=>{})})}#N(){let t=this.#t.textTracks;for(let e=0;e<t.length;e++)if(t[e].kind==="captions"||t[e].kind==="subtitles")return t[e];return null}#R(t){if(!(t.target.tagName==="INPUT"||t.target.tagName==="TEXTAREA"))switch(t.key){case" ":case"k":case"K":t.preventDefault(),this.#s?this.#t.pause():this.#t.play().catch(()=>{});break;case"ArrowLeft":t.preventDefault(),this.#t.currentTime=Math.max(0,this.#t.currentTime-10),this.#r();break;case"ArrowRight":t.preventDefault(),this.#t.currentTime=Math.min(this.#t.duration||0,this.#t.currentTime+10),this.#r();break;case"ArrowUp":t.preventDefault(),this.#t.volume=Math.min(1,this.#t.volume+.05),this.#e.value=String(this.#t.volume),this.#e.style.setProperty("--_vol",String(this.#t.volume)),this.#r();break;case"ArrowDown":t.preventDefault(),this.#t.volume=Math.max(0,this.#t.volume-.05),this.#e.value=String(this.#t.volume),this.#e.style.setProperty("--_vol",String(this.#t.volume)),this.#r();break;case"m":case"M":this.#t.muted=!this.#t.muted,this.toggleAttribute("muted",this.#t.muted),this.#e.style.setProperty("--_vol",this.#t.muted?"0":this.#e.value);break;case"f":case"F":this.#A();break;case"c":case"C":this.#n.click();break;case"Escape":document.fullscreenElement&&document.exitFullscreen();break}}#T(t){if(!Number.isFinite(t))return"0:00";let e=Math.floor(t/3600),s=Math.floor(t%3600/60),r=Math.floor(t%60);return e>0?`${e}:${String(s).padStart(2,"0")}:${String(r).padStart(2,"0")}`:`${s}:${String(r).padStart(2,"0")}`}#D(t){if(!Number.isFinite(t))return"0 seconds";let e=Math.floor(t/3600),s=Math.floor(t%3600/60),r=Math.floor(t%60),i=[];return e>0&&i.push(`${e} hour${e!==1?"s":""}`),s>0&&i.push(`${s} minute${s!==1?"s":""}`),i.push(`${r} second${r!==1?"s":""}`),i.join(" ")}#h(t){this.#f&&(this.#f.textContent=t)}#o(t,e){this.dispatchEvent(new CustomEvent(t,{bubbles:!0,composed:!0,detail:e}))}};u("video-player",c);export{c as VideoPlayerElement};
+    `}#z(){this.#t.addEventListener("timeupdate",()=>this.#F()),this.#t.addEventListener("loadedmetadata",()=>this.#P()),this.#t.addEventListener("progress",()=>this.#H()),this.#t.addEventListener("play",()=>{this.#a=!0,this.setAttribute("state","playing"),this.#l.setAttribute("aria-label","Pause"),this.#h("Playing"),this.#n("video-player:play",{currentTime:this.#t.currentTime,src:this.#t.currentSrc})}),this.#t.addEventListener("pause",()=>{this.#a=!1,this.setAttribute("state","paused"),this.#l.setAttribute("aria-label","Play"),this.#s(),this.#h("Paused"),this.#n("video-player:pause",{currentTime:this.#t.currentTime})}),this.#t.addEventListener("ended",()=>{this.#a=!1,this.setAttribute("state","ended"),this.#l.setAttribute("aria-label","Play"),this.#s();let t=this.#e?.querySelector("li[data-video-active]");t&&t.setAttribute("data-video-played",""),this.#e&&this.#V(),this.#h("Ended"),this.#n("video-player:ended",{src:this.#t.currentSrc})}),this.#t.addEventListener("waiting",()=>{this.#a&&(this.setAttribute("state","buffering"),this.#h("Buffering"))}),this.#t.addEventListener("playing",()=>{this.getAttribute("state")==="buffering"&&this.setAttribute("state","playing")})}#L(){this.#y.addEventListener("click",i=>{i.stopPropagation(),this.#t.play().catch(()=>{})}),(this.shadowRoot?.querySelector(".player")).addEventListener("click",i=>{i.target.closest(".controls")||i.target.closest(".play-overlay")||(this.#a?this.#t.pause():this.#t.play().catch(()=>{}))}),this.#l.addEventListener("click",()=>{this.#a?this.#t.pause():this.#t.play().catch(()=>{})}),this.#c.addEventListener("input",()=>{this.#t.duration&&(this.#t.currentTime=Number(this.#c.value)/100*this.#t.duration)}),(this.shadowRoot?.querySelector(".skip-back-btn")).addEventListener("click",()=>{this.#t.currentTime=Math.max(0,this.#t.currentTime-10)}),(this.shadowRoot?.querySelector(".skip-forward-btn")).addEventListener("click",()=>{this.#t.currentTime=Math.min(this.#t.duration||0,this.#t.currentTime+10)}),this.#i.addEventListener("input",()=>{this.#t.volume=Number(this.#i.value),this.#t.muted=!1,this.removeAttribute("muted"),this.#i.style.setProperty("--_vol",this.#i.value)}),(this.shadowRoot?.querySelector(".mute-btn")).addEventListener("click",()=>{this.#t.muted=!this.#t.muted,this.toggleAttribute("muted",this.#t.muted),this.#i.style.setProperty("--_vol",this.#t.muted?"0":this.#i.value)}),this.#u.addEventListener("click",()=>{this.#m=(this.#m+1)%h.length;let i=h[this.#m];this.#t.playbackRate=i;let a=this.#u.querySelector("span");a.textContent=`${i}x`,this.#u.setAttribute("aria-label",`Playback speed ${i}x`),this.#n("video-player:speed",{rate:i})}),this.#o.addEventListener("click",()=>{let i=this.#N();if(!i)return;let a=i.mode==="showing";i.mode=a?"hidden":"showing";let o=!a;this.toggleAttribute("captions",o),this.#o.setAttribute("aria-pressed",String(o)),this.#n("video-player:captions",{active:o,label:i.label})}),this.#v.addEventListener("click",()=>this.#A()),this.addEventListener("keydown",i=>this.#R(i)),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0")}#q(){let t=this.shadowRoot?.querySelector(".player"),e=()=>{this.#s(),this.#r!=null&&clearTimeout(this.#r),this.#a&&(this.#r=setTimeout(()=>this.#b(),p))};t.addEventListener("mousemove",e),t.addEventListener("mouseenter",e),t.addEventListener("mouseleave",()=>{this.#a&&(this.#r!=null&&clearTimeout(this.#r),this.#r=setTimeout(()=>this.#b(),500))}),t.addEventListener("touchstart",()=>{this.hasAttribute("controls")?this.#b():e()},{passive:!0}),this.#p.addEventListener("mouseenter",()=>{this.#r!=null&&clearTimeout(this.#r),this.#s()}),this.#p.addEventListener("focusin",()=>{this.#r!=null&&clearTimeout(this.#r),this.#s()})}#s(){this.setAttribute("controls","")}#b(){this.removeAttribute("controls")}#$(){this.#e&&this.#e.addEventListener("click",t=>{let e=t.target.closest("a[href]");e&&(t.preventDefault(),this.#d(e.href,e.closest("li"),e))})}#d(t,e,s){this.#e.querySelectorAll("li").forEach(o=>o.removeAttribute("data-video-active")),e&&e.setAttribute("data-video-active",""),this.#t.src=t;let i=s?.getAttribute("data-poster");i&&(this.#t.poster=i);let a=s?.getAttribute("data-captions");this.#B(a),this.#t.play().catch(()=>{}),this.#n("video-player:track-change",{src:t,title:s?.textContent??""})}#B(t){if(this.#t.querySelectorAll("track[data-dynamic]").forEach(r=>r.remove()),t){let r=document.createElement("track");r.kind="captions",r.src=t,r.default=!0,r.setAttribute("data-dynamic",""),this.#t.appendChild(r),this.hasAttribute("captions")&&(r.track.mode="showing")}let s=this.#t.querySelector('track[kind="captions"], track[kind="subtitles"]');this.#o.hidden=!s}#V(){if(!this.#e)return;let t=[...this.#e.querySelectorAll("li")],e=t.findIndex(r=>r.hasAttribute("data-video-active"));if(this.hasAttribute("shuffle")){let r=t.filter((i,a)=>a!==e);if(r.length){let i=r[Math.floor(Math.random()*r.length)],a=i.querySelector("a[href]");a&&this.#d(a.href,i,a)}return}let s=e+1;if(s<t.length){let r=t[s].querySelector("a[href]");r&&this.#d(r.href,t[s],r)}else if(this.hasAttribute("loop")){let r=t[0]?.querySelector("a[href]");r&&this.#d(r.href,t[0],r)}}#F(){let t=this.#t.currentTime,e=this.#t.duration||0,s=e?t/e*100:0;this.#x.textContent=this.#T(t),this.#c.value=String(s),this.#c.setAttribute("aria-valuetext",this.#D(t)),this.#g.style.width=`${s}%`}#P(){let t=this.#t.duration||0;this.#w.textContent=this.#T(t)}#H(){let t=this.#t.buffered,e=this.#t.duration||0;if(t.length>0&&e){let s=t.end(t.length-1);this.#k.style.width=`${s/e*100}%`}}#A(){document.fullscreenElement?document.exitFullscreen():this.requestFullscreen().catch(()=>{this.#t.requestFullscreen?.().catch(()=>{})})}#N(){let t=this.#t.textTracks;for(let e=0;e<t.length;e++)if(t[e].kind==="captions"||t[e].kind==="subtitles")return t[e];return null}#R(t){if(!(t.target.tagName==="INPUT"||t.target.tagName==="TEXTAREA"))switch(t.key){case" ":case"k":case"K":t.preventDefault(),this.#a?this.#t.pause():this.#t.play().catch(()=>{});break;case"ArrowLeft":t.preventDefault(),this.#t.currentTime=Math.max(0,this.#t.currentTime-10),this.#s();break;case"ArrowRight":t.preventDefault(),this.#t.currentTime=Math.min(this.#t.duration||0,this.#t.currentTime+10),this.#s();break;case"ArrowUp":t.preventDefault(),this.#t.volume=Math.min(1,this.#t.volume+.05),this.#i.value=String(this.#t.volume),this.#i.style.setProperty("--_vol",String(this.#t.volume)),this.#s();break;case"ArrowDown":t.preventDefault(),this.#t.volume=Math.max(0,this.#t.volume-.05),this.#i.value=String(this.#t.volume),this.#i.style.setProperty("--_vol",String(this.#t.volume)),this.#s();break;case"m":case"M":this.#t.muted=!this.#t.muted,this.toggleAttribute("muted",this.#t.muted),this.#i.style.setProperty("--_vol",this.#t.muted?"0":this.#i.value);break;case"f":case"F":this.#A();break;case"c":case"C":this.#o.click();break;case"Escape":document.fullscreenElement&&document.exitFullscreen();break}}#T(t){if(!Number.isFinite(t))return"0:00";let e=Math.floor(t/3600),s=Math.floor(t%3600/60),r=Math.floor(t%60);return e>0?`${e}:${String(s).padStart(2,"0")}:${String(r).padStart(2,"0")}`:`${s}:${String(r).padStart(2,"0")}`}#D(t){if(!Number.isFinite(t))return"0 seconds";let e=Math.floor(t/3600),s=Math.floor(t%3600/60),r=Math.floor(t%60),i=[];return e>0&&i.push(`${e} hour${e!==1?"s":""}`),s>0&&i.push(`${s} minute${s!==1?"s":""}`),i.push(`${r} second${r!==1?"s":""}`),i.join(" ")}#h(t){this.#f&&(this.#f.textContent=t)}#n(t,e){this.dispatchEvent(new CustomEvent(t,{bubbles:!0,composed:!0,detail:e}))}};d("video-player",c);export{c as VideoPlayerElement};
 //# sourceMappingURL=video-player.js.map

package/dist/cdn/components/watch-wc.js

@@ -1,3 +1,3 @@
-var mt=Object.defineProperty;var O=(n,t)=>()=>(n&&(t=n(n=0)),t);var gt=(n,t)=>{for(var e in t)mt(n,e,{get:t[e],enumerable:!0})};function bt(){let n=globalThis.localStorage;if(!n)throw new Error("VBStore: localStorage is not available in this environment");return{async getRaw(t){return n.getItem(t)},async setRaw(t,e){n.setItem(t,e)},async removeRaw(t){n.removeItem(t)},async keys(t){let e=[];for(let i=0;i<n.length;i++){let o=n.key(i);o&&o.startsWith(t)&&e.push(o)}return e}}}function m(){return L||(L=bt()),L}function M(n,t){if(typeof n!="string"||!n)throw new TypeError("VBStore: namespace must be a non-empty string");if(typeof t!="string"||!t)throw new TypeError("VBStore: key must be a non-empty string");return`vb:${n}:${t}`}function Q(n){if(typeof n!="string"||!n)throw new TypeError("VBStore: namespace must be a non-empty string");return`vb:${n}:`}function Z(n){try{let t=JSON.parse(n);if(t&&typeof t=="object"&&typeof t.timestamp=="number")return t}catch{}return null}var L,b,H=O(()=>{L=null;b={configure(n={}){L=n.backend??null},async set(n,t,e){let i={data:e,timestamp:Date.now()};await m().setRaw(M(n,t),JSON.stringify(i))},async get(n,t,e){let i=await m().getRaw(M(n,t));if(i==null)return null;let o=Z(i);return!o||e?.maxAge!=null&&Date.now()-o.timestamp>e.maxAge?null:o.data},async remove(n,t){await m().removeRaw(M(n,t))},async list(n){let t=Q(n),e=await m().keys(t),i=[];for(let o of e){let s=await m().getRaw(o);if(s==null)continue;let r=Z(s);r&&i.push({key:o.slice(t.length),data:r.data,timestamp:r.timestamp})}return i},async clear(n){let t=Q(n),e=await m().keys(t);for(let i of e)await m().removeRaw(i)},async clearAll(){let n=await m().keys("vb:");for(let t of n)await m().removeRaw(t)},async setMany(n,t){for(let[e,i]of t)await b.set(n,e,i)}}});function yt(n,t){if(!t)return n;let e=n??new URLSearchParams;for(let[i,o]of Object.entries(t))o!=null&&e.set(i,String(o));return e}async function wt(n){if((n.headers.get("content-type")??"").includes("application/json"))try{return await n.json()}catch{return null}try{return await n.text()}catch{return null}}function tt(n){return n.endsWith("/")?n.slice(0,-1):n}var p,S,C,et=O(()=>{p={baseUrl:"/go",headers:{},services:{}},S=class extends Error{constructor(t,e,i,o){super(`VBService(${i}): ${t} ${o}`),this.name="VBServiceError",this.status=t,this.body=e,this.role=i,this.path=o}};C=class n{static configure(t={}){p={baseUrl:t.baseUrl??p.baseUrl,headers:{...p.headers,...t.headers??{}},services:{...p.services,...t.services??{}}}}static resolve(t){if(!t||typeof t!="string")throw new TypeError("VBService: role must be a non-empty string");return p.services[t]?tt(p.services[t]):p.baseUrl?`${tt(p.baseUrl)}/${t}`:`/go/${t}`}static _reset(){p={baseUrl:"/go",headers:{},services:{}}}constructor(t){if(!t||typeof t!="string")throw new TypeError("VBService: role must be a non-empty string");this.role=t}async get(t,e){return this.#t("GET",t,{params:e})}async post(t,e){return this.#t("POST",t,{body:e})}async patch(t,e){return this.#t("PATCH",t,{body:e})}async delete(t){return this.#t("DELETE",t,{})}async#t(t,e,i){let o=n.resolve(this.role),s=e?e.startsWith("/")?e:`/${e}`:"",r=new URL(`${o}${s}`,globalThis.location?.origin??"http://localhost"),d=yt(r.searchParams,i.params);d&&(r.search=d.toString());let a={method:t,headers:{...p.headers}};i.body!==void 0&&(a.body=JSON.stringify(i.body),a.headers["content-type"]="application/json");let c=r.toString(),l=await fetch(c,a),f=await wt(l);if(!l.ok)throw new S(l.status,f,this.role,`${s||"/"}`);return f}}});function $(n){let t=2166136261;for(let e=0;e<n.length;e++)t^=n.charCodeAt(e),t=Math.imul(t,16777619);return(t>>>0).toString(36)}function St(){return"hn-"+crypto.randomUUID().slice(0,8)}function rt(n,t){return getComputedStyle(n).getPropertyValue(`--highlight-${t}`).trim()}function Ct(n){if(E){k++;return}E=new CSSStyleSheet;let t=n.map(e=>`::highlight(hn-${e}) { background-color: var(--highlight-${e}); text-decoration-line: underline; text-decoration-color: var(--highlight-${e}); text-underline-offset: 2px; }`).join(`
-`);E.replaceSync(t),document.adoptedStyleSheets=[...document.adoptedStyleSheets,E],k=1}function At(){k--,k<=0&&E&&(document.adoptedStyleSheets=document.adoptedStyleSheets.filter(n=>n!==E),E=null,k=0)}function kt(){return h||(h=document.createElement("div"),h.className="hn-toolbar",h.setAttribute("role","toolbar"),h.setAttribute("aria-label","Highlight tools"),h.setAttribute("popover","auto"),h.hidden=!0,document.body.appendChild(h),h.addEventListener("toggle",n=>{n.newState==="closed"&&(h.hidden=!0,R=null)}),h)}function I(n,t,e){let i=kt();i.innerHTML="",R=t;let o=t.colors,s=t.element,r=e?.color,d=document.createElement("div");if(d.className="hn-swatches",d.setAttribute("role","group"),d.setAttribute("aria-label","Highlight colors"),o.forEach((a,c)=>{let l=document.createElement("button");l.type="button",l.className="hn-swatch",l.dataset.color=a,l.setAttribute("aria-label",`Highlight ${a}${r===a?" (current)":""}`),l.setAttribute("tabindex",c===0?"0":"-1");let f=rt(s,a);f&&(l.style.backgroundColor=f),r===a&&l.setAttribute("aria-pressed","true"),l.addEventListener("click",()=>{e?t._changeColor(e.id,a):t._createFromSelection(a),A()}),d.appendChild(l)}),i.appendChild(d),e){let a=document.createElement("span");a.className="hn-separator",a.setAttribute("aria-hidden","true"),i.appendChild(a);let c=document.createElement("button");c.type="button",c.className="hn-action",c.textContent=e.note?"Edit Note":"Add Note",c.addEventListener("click",()=>{at(t,e),A()}),i.appendChild(c);let l=document.createElement("button");l.type="button",l.className="hn-action hn-action-remove",l.textContent="Remove",l.addEventListener("click",()=>{t.removeHighlight(e.id),A()}),i.appendChild(l)}d.addEventListener("keydown",a=>{let c=[...d.querySelectorAll("button")],l=c.indexOf(document.activeElement);if(l<0)return;let f=-1;if(a.key==="ArrowRight"||a.key==="ArrowDown")a.preventDefault(),f=(l+1)%c.length;else if(a.key==="ArrowLeft"||a.key==="ArrowUp")a.preventDefault(),f=(l-1+c.length)%c.length;else if(a.key==="Escape"){A();return}f>=0&&(c[l].setAttribute("tabindex","-1"),c[f].setAttribute("tabindex","0"),c[f].focus())}),i.hidden=!1;try{i.showPopover()}catch{}xt(n),requestAnimationFrame(()=>{let a=i.querySelector(".hn-swatch");a&&a.focus()})}function at(n,t){v();let e=n.element,i=w(e,t.startOffset,t.endOffset);if(!i)return;u=document.createElement("div"),u.className="hn-note-panel",u.setAttribute("role","dialog"),u.setAttribute("aria-label","Private note");let o=document.createElement("header");o.className="hn-note-header",o.innerHTML="<small>PRIVATE NOTE</small>",u.appendChild(o);let s=document.createElement("blockquote");s.className="hn-note-quote",s.textContent=t.text.length>80?t.text.slice(0,80)+"\u2026":t.text,u.appendChild(s);let r=document.createElement("textarea");r.className="hn-note-textarea",r.placeholder="Add a note\u2026",r.value=t.note||"",r.rows=3,r.setAttribute("aria-label","Note for highlighted text"),u.appendChild(r);let d=document.createElement("footer");d.className="hn-note-actions";let a=document.createElement("button");a.type="button",a.className="hn-action hn-action-save",a.textContent="Save",a.addEventListener("click",()=>{n._updateNote(t.id,r.value.trim()),v()});let c=document.createElement("button");c.type="button",c.className="hn-action",c.textContent="Cancel",c.addEventListener("click",()=>v()),d.append(a,c),u.appendChild(d),r.addEventListener("keydown",g=>{g.key==="Escape"&&(g.preventDefault(),v()),g.key==="Enter"&&(g.metaKey||g.ctrlKey)&&(g.preventDefault(),n._updateNote(t.id,r.value.trim()),v())}),e.style.position="relative",e.appendChild(u);let l=i.getClientRects()[0],f=e.getBoundingClientRect();if(l){let g=l.top-f.top;u.style.top=`${g}px`}requestAnimationFrame(()=>{r.focus(),document.addEventListener("pointerdown",ct)})}function ct(n){u&&!u.contains(n.target)&&v()}function v(){u&&(document.removeEventListener("pointerdown",ct),u.remove(),u=null)}function xt(n){h&&requestAnimationFrame(()=>{let t=h.getBoundingClientRect(),e=t.width||200,i=t.height||40,o=n.top-i-it,s=n.left+n.width/2-e/2;o<P&&(o=n.bottom+it);let r=window.innerWidth-e-P;s=Math.max(P,Math.min(s,r)),h.style.top=`${o}px`,h.style.left=`${s}px`})}function A(){if(h){try{h.hidePopover()}catch{}h.hidden=!0,R=null}}function q(n){y||(y=document.createElement("div"),y.setAttribute("aria-live","polite"),y.setAttribute("aria-atomic","true"),y.className="hn-sr-only",document.body.appendChild(y)),y.textContent="",requestAnimationFrame(()=>{y.textContent=n})}function ot(n,t,e){let i=document.createTreeWalker(n,NodeFilter.SHOW_TEXT),o=0;for(;i.nextNode();){if(i.currentNode===t)return o+e;o+=(i.currentNode.textContent??"").length}return-1}function w(n,t,e){let i=document.createTreeWalker(n,NodeFilter.SHOW_TEXT),o=0,s=null,r=0,d=null,a=0;for(;i.nextNode();){let c=i.currentNode,l=(c.textContent??"").length;if(!s&&o+l>t&&(s=c,r=t-o),o+l>=e){d=c,a=e-o;break}o+=l}if(!s||!d)return null;try{let c=document.createRange();return c.setStart(s,Math.min(r,(s.textContent??"").length)),c.setEnd(d,Math.min(a,(d.textContent??"").length)),c}catch{return null}}function _(n){if(D.has(n))return D.get(n);let t=new F(n);return D.set(n,t),t}function st(n=document){n.querySelectorAll(W).forEach(t=>{t.hasAttribute("data-highlights-init")||_(t)})}var W,nt,vt,it,P,Et,E,k,h,R,u,y,F,D,Nt,lt=O(()=>{H();W="[data-highlights]",nt="highlights",vt=["yellow","green","blue","pink"],it=8,P=8,Et=typeof CSS<"u"&&"highlights"in CSS;E=null,k=0;h=null,R=null;u=null;y=null;F=class{#t;#s;#n;#r;#e=[];#c=!Et;#l;#d;#h=!1;#u=[];constructor(t){this.#t=t,this.#r=t.hasAttribute("data-highlights-readonly");let e=t.dataset.highlights;this.#s=e&&e!==""?e:location.pathname;let i=t.dataset.highlightsColors;this.#n=i?i.split(",").map(o=>o.trim()).filter(Boolean):[...vt],this.#c||Ct(this.#n),this.#o(),this.#r||(this.#l=this.#m.bind(this),this.#d=this.#g.bind(this),t.addEventListener("pointerup",this.#l),t.addEventListener("click",this.#d)),t.setAttribute("data-highlights-init",""),this.#y().then(()=>{this.#h||this.#o()})}get colors(){return[...this.#n]}get element(){return this.#t}getHighlights(){return this.#e.map(t=>({...t}))}removeHighlight(t){let e=this.#e.findIndex(i=>i.id===t);e<0||(this.#e.splice(e,1),this.#i(),this.#o(),this.#a("highlights:removed",{id:t}),q("Highlight removed"))}clearAll(){this.#e=[],this.#i(),this.#o()}exportHighlights(){return JSON.stringify({version:1,highlights:this.#e})}importHighlights(t){try{let e=typeof t=="string"?JSON.parse(t):t;if(!e.highlights||!Array.isArray(e.highlights))return;this.#e=e.highlights,this.#i(),this.#o()}catch{}}destroy(){if(!this.#h){if(this.#h=!0,this.#l&&this.#t.removeEventListener("pointerup",this.#l),this.#d&&this.#t.removeEventListener("click",this.#d),this.#c)this.#t.querySelectorAll("mark[data-hn-id]").forEach(t=>{let e=t.parentNode;for(;t.firstChild;)e.insertBefore(t.firstChild,t);e.removeChild(t),e.normalize()});else{for(let t of this.#n)CSS.highlights.delete(`hn-${t}`);At()}this.#f(),this.#t.removeAttribute("data-highlights-init"),R===this&&A(),v()}}#m(){requestAnimationFrame(()=>{if(this.#h||this.#t.hasAttribute("data-selection-menu"))return;let t=window.getSelection();if(!t||t.isCollapsed||!t.toString().trim())return;let e=t.getRangeAt(0);if(!this.#t.contains(e.commonAncestorContainer))return;let i=e.getBoundingClientRect();I(i,this,null)})}#g(t){if(this.#t.hasAttribute("data-selection-menu"))return;let e=t.target.closest?.(".hn-margin-annotation");if(e){let o=e.dataset.hnId,s=this.#e.find(r=>r.id===o);if(s){at(this,s);return}}let i=t.target.closest?.("mark[data-hn-id]");if(i){let o=i.dataset.hnId,s=this.#e.find(r=>r.id===o);if(s){this.#a("highlights:clicked",{id:o});let r=i.getBoundingClientRect();I(r,this,s);return}}if(!this.#c){let o=this.#b(t.clientX,t.clientY);if(o){this.#a("highlights:clicked",{id:o.id});let s=w(this.#t,o.startOffset,o.endOffset);s&&I(s.getBoundingClientRect(),this,o)}}}#b(t,e){for(let i of this.#e){let o=w(this.#t,i.startOffset,i.endOffset);if(!o)continue;let s=o.getClientRects();for(let r of s)if(t>=r.left&&t<=r.right&&e>=r.top&&e<=r.bottom)return i}return null}_createFromSelection(t){let e=window.getSelection();if(!e||e.isCollapsed)return;let i=e.getRangeAt(0);if(!this.#t.contains(i.commonAncestorContainer))return;let o=ot(this.#t,i.startContainer,i.startOffset),s=ot(this.#t,i.endContainer,i.endOffset);if(o<0||s<0||o>=s)return;let r=e.toString().trim(),d={id:St(),startOffset:o,endOffset:s,text:r,color:t,note:"",created:Date.now()};this.#e.push(d),this.#i(),this.#o(),e.removeAllRanges(),this.#a("highlights:added",{id:d.id,text:r,color:t,note:""}),q("Highlight added")}_changeColor(t,e){let i=this.#e.find(o=>o.id===t);i&&(i.color=e,this.#i(),this.#o())}_updateNote(t,e){let i=this.#e.find(o=>o.id===t);i&&(i.note=e,this.#i(),this.#p(),this.#a("highlights:note-changed",{id:t,note:e}),q("Note saved"))}async#y(){let t=await b.get(nt,this.#s);if(!t||!Array.isArray(t.highlights))return;let e=$(this.#t.textContent);t.contentHash&&t.contentHash!==e?(this.#e=t.highlights.filter(i=>{let o=w(this.#t,i.startOffset,i.endOffset);return o?o.toString().trim()===i.text:!1}),this.#i()):this.#e=t.highlights}#i(){let t={version:1,contentHash:$(this.#t.textContent),highlights:this.#e};b.set(nt,this.#s,t).catch(()=>{})}#o(){this.#c?this.#v():this.#w(),this.#p()}#w(){let t=new Map;for(let e of this.#n)t.set(e,[]);for(let e of this.#e){let i=w(this.#t,e.startOffset,e.endOffset);i&&t.has(e.color)&&t.get(e.color).push(i)}for(let[e,i]of t){let o=`hn-${e}`;i.length===0?CSS.highlights.delete(o):CSS.highlights.set(o,new Highlight(...i))}}#v(){this.#t.querySelectorAll("mark[data-hn-id]").forEach(e=>{let i=e.parentNode;for(;e.firstChild;)i.insertBefore(e.firstChild,e);i.removeChild(e)}),this.#t.normalize();let t=[...this.#e].sort((e,i)=>i.startOffset-e.startOffset);for(let e of t){let i=w(this.#t,e.startOffset,e.endOffset);if(!i)continue;let o=rt(this.#t,e.color),s=document.createElement("mark");s.dataset.hnId=e.id,s.dataset.hnColor=e.color,o&&(s.style.backgroundColor=o,s.style.textDecorationColor=o);try{i.surroundContents(s)}catch{let r=i.extractContents();s.appendChild(r),i.insertNode(s)}}}#f(){for(let t of this.#u)t.remove();this.#u=[]}#p(){if(this.#f(),this.#e.length===0)return;getComputedStyle(this.#t).position==="static"&&(this.#t.style.position="relative");for(let e of this.#e){let i=w(this.#t,e.startOffset,e.endOffset);if(!i)continue;let o=i.getClientRects();if(o.length===0)continue;let s=o[0],r=this.#t.getBoundingClientRect(),d=s.top-r.top,a=document.createElement("span");a.className="hn-margin-annotation",a.dataset.hnId=e.id,a.setAttribute("aria-hidden","true"),a.style.top=`${d}px`,e.note?(a.innerHTML='<span class="hn-note-indicator">*</span> You highlighted',a.classList.add("hn-has-note")):a.textContent="You highlighted",this.#t.appendChild(a),this.#u.push(a)}}#a(t,e={}){this.#t.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0}))}},D=new WeakMap;document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>st()):st();Nt=new MutationObserver(n=>{for(let t of n)for(let e of t.addedNodes){if(e.nodeType!==Node.ELEMENT_NODE)continue;let i=e;i.matches(W)&&_(i),i.querySelectorAll(W).forEach(o=>{o.hasAttribute("data-highlights-init")||_(o)})}});Nt.observe(document.documentElement,{childList:!0,subtree:!0})});var ut={};gt(ut,{currentHash:()=>z,initPageWatch:()=>X,readWatch:()=>B,removeWatch:()=>ht,writeWatch:()=>x});function dt(){return typeof window<"u"&&window.vbPageWatch?.serverSync===!0?!0:document.querySelector('meta[name="vb-page-watch-server"]')?.getAttribute("content")==="true"}async function Ot(n){if(!dt())return null;try{let t=new C("notify"),e={url:n.url,type:"page-watch",notify:["panel"]},i=await t.post("/subscribe",e);return typeof i?.id=="string"?i.id:null}catch(t){let e=t instanceof S?`${t.status}`:String(t);return console.warn("[page-watch] server subscribe failed; client-only watch in effect.",e),null}}async function Tt(n){if(!(!n||!dt()))try{await new C("notify").delete(`/subscribe/${encodeURIComponent(n)}`)}catch(t){let e=t instanceof S?`${t.status}`:String(t);console.warn("[page-watch] server unsubscribe failed; local state already cleared.",e)}}function Lt(){return document.querySelector("main")||document.querySelector("article")||document.body}function N(){return location.pathname||"/"}function z(){let n=Lt();return n?$(n.textContent||""):""}function $t(){return document.title||N()}async function B(){return await b.get(G,N())}async function x(n){await b.set(G,N(),n)}async function ht(){await b.remove(G,N())}function U(n,t){n.setAttribute("aria-pressed",t?"true":"false"),n.dataset.watching="",t||delete n.dataset.watching;let e=n.querySelector("icon-wc");e&&e.setAttribute("name",t?"bookmark-check":"bookmark");let i=[...n.childNodes].find(o=>o.nodeType===Node.TEXT_NODE&&(o.textContent||"").trim());i&&!n.hasAttribute("data-watch-label-locked")&&(i.textContent=t?"Watching":"Watch for updates"),n.setAttribute("title",t?"Stop watching this page":"Watch this page for content updates")}async function j(n){if(n.hasAttribute("data-watch-page-init"))return;n.setAttribute("data-watch-page-init",""),n.setAttribute("type",n.getAttribute("type")||"button");let t=await B();U(n,!!t),n.addEventListener("click",async e=>{e.preventDefault();let i=await B();if(i)await ht(),U(n,!1),n.dispatchEvent(new CustomEvent("page-watch:remove",{bubbles:!0,composed:!0,detail:{url:i.url,subscriptionId:i.subscriptionId}})),Tt(i.subscriptionId);else{let o={url:N(),title:$t(),contentHash:z(),watchedAt:new Date().toISOString(),lastChecked:new Date().toISOString(),lastChanged:null,subscriptionId:null};await x(o),U(n,!0),n.dispatchEvent(new CustomEvent("page-watch:add",{bubbles:!0,composed:!0,detail:{entry:o}}));let s=await Ot(o);s&&await x({...o,subscriptionId:s})}})}async function Rt(){let n=await B();if(!n)return;let t=z(),e=new Date().toISOString(),i=n.contentHash,o={...n,lastChecked:e};if(t&&t!==i){o.contentHash=t,o.lastChanged=e,await x(o);let s={id:`page-watch:${n.url}:${t}`,type:"watch",title:`Updated: ${n.title}`,body:"Content changed since your last visit.",url:n.url,date:e,read:!1,dismissed:!1,priority:"normal"};document.dispatchEvent(new CustomEvent("notification-wc:new",{bubbles:!0,composed:!0,detail:{notification:s}}))}else await x(o)}function X(n=document){for(let t of n.querySelectorAll(V))j(t);Rt()}var V,G,Bt,ft=O(()=>{H();et();lt();V="[data-watch-page]",G="watches";document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>X()):X();Bt=new MutationObserver(n=>{for(let t of n)for(let e of t.addedNodes){if(e.nodeType!==Node.ELEMENT_NODE)continue;let i=e;i.matches?.(V)&&j(i),i.querySelectorAll?.(V).forEach(o=>j(o))}});Bt.observe(document.documentElement,{childList:!0,subtree:!0})});var Pt=window.matchMedia("(prefers-reduced-motion: reduce)");var K=new Map;function Y(n,t,e={}){let i=e.priority??10,o={impl:t,bundle:e.bundle,contract:e.contract,priority:i},s=K.get(n);if(customElements.get(n)){if(!s||s.priority>=i){s&&s.priority===i&&s.impl!==t&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${n}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=i){s.priority===i&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${s.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}K.set(n,o),customElements.define(n,t)}var T=class extends HTMLElement{#t=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,i,o){t.addEventListener(e,i,o),this.#t.push(()=>t.removeEventListener(e,i,o))}setup(){}teardown(){}};var pt="Watch for updates",Mt="Watching",J=class extends T{#t=null;setup(){if(this.hasAttribute("server-sync")){let e=window;e.vbPageWatch={...e.vbPageWatch??{},serverSync:!0}}let t=this.#s();this.dataset.variant=t;for(let e of Array.from(this.children))e.hasAttribute?.("data-watch-page")&&e.remove();this.#t=this.#n(t),this.appendChild(this.#t),this.listen(document,"page-watch:add",this.#r),this.listen(document,"page-watch:remove",this.#r)}teardown(){this.#t&&(this.#t.remove(),this.#t=null)}#s(){let t=this.getAttribute("variant");return t==="compact"||t==="button"?t:"icon"}#n(t){let e=document.createElement("button");e.type="button",e.setAttribute("data-watch-page",""),e.className="ghost",e.setAttribute("aria-label","Watch this page for updates");let i=t==="icon"?"sm":"xs",o=this.getAttribute("label")??pt;return t==="icon"?e.innerHTML=`<icon-wc name="bookmark" size="${i}"></icon-wc>`:(e.innerHTML=`<icon-wc name="bookmark" size="${i}"></icon-wc><span>${this.#e(o)}</span>`,e.setAttribute("data-watch-label-locked","")),e}#r=async()=>{if(this.#t)try{let{readWatch:t}=await Promise.resolve().then(()=>(ft(),ut)),i=!!await t();this.#t.setAttribute("aria-pressed",i?"true":"false");let o=this.#t.querySelector("icon-wc");o&&o.setAttribute("name",i?"bookmark-check":"bookmark");let s=this.#t.querySelector("span");if(s&&this.#s()!=="icon"){let r=this.getAttribute("label");s.textContent=r||(i?Mt:pt)}this.#t.setAttribute("title",i?"Stop watching this page":"Watch this page for content updates")}catch{}};#e(t){let e=document.createElement("div");return e.textContent=t,e.innerHTML}};Y("watch-wc",J);export{J as WatchWc};
+var it=Object.defineProperty;var E=(n,t)=>()=>(n&&(t=n(n=0)),t);var st=(n,t)=>{for(var e in t)it(n,e,{get:t[e],enumerable:!0})};function rt(){let n=globalThis.localStorage;if(!n)throw new Error("VBStore: localStorage is not available in this environment");return{async getRaw(t){return n.getItem(t)},async setRaw(t,e){n.setItem(t,e)},async removeRaw(t){n.removeItem(t)},async keys(t){let e=[];for(let i=0;i<n.length;i++){let s=n.key(i);s&&s.startsWith(t)&&e.push(s)}return e}}}function d(){return A||(A=rt()),A}function O(n,t){if(typeof n!="string"||!n)throw new TypeError("VBStore: namespace must be a non-empty string");if(typeof t!="string"||!t)throw new TypeError("VBStore: key must be a non-empty string");return`vb:${n}:${t}`}function V(n){if(typeof n!="string"||!n)throw new TypeError("VBStore: namespace must be a non-empty string");return`vb:${n}:`}function j(n){try{let t=JSON.parse(n);if(t&&typeof t=="object"&&typeof t.timestamp=="number")return t}catch{}return null}var A,u,T=E(()=>{A=null;u={configure(n={}){A=n.backend??null},async set(n,t,e){let i={data:e,timestamp:Date.now()};await d().setRaw(O(n,t),JSON.stringify(i))},async get(n,t,e){let i=await d().getRaw(O(n,t));if(i==null)return null;let s=j(i);return!s||e?.maxAge!=null&&Date.now()-s.timestamp>e.maxAge?null:s.data},async remove(n,t){await d().removeRaw(O(n,t))},async list(n){let t=V(n),e=await d().keys(t),i=[];for(let s of e){let r=await d().getRaw(s);if(r==null)continue;let o=j(r);o&&i.push({key:s.slice(t.length),data:o.data,timestamp:o.timestamp})}return i},async clear(n){let t=V(n),e=await d().keys(t);for(let i of e)await d().removeRaw(i)},async clearAll(){let n=await d().keys("vb:");for(let t of n)await d().removeRaw(t)},async setMany(n,t){for(let[e,i]of t)await u.set(n,e,i)}}});function ot(n,t){if(!t)return n;let e=n??new URLSearchParams;for(let[i,s]of Object.entries(t))s!=null&&e.set(i,String(s));return e}async function at(n){if((n.headers.get("content-type")??"").includes("application/json"))try{return await n.json()}catch{return null}try{return await n.text()}catch{return null}}function X(n){return n.endsWith("/")?n.slice(0,-1):n}var h,m,b,G=E(()=>{h={baseUrl:"/go",headers:{},services:{}},m=class extends Error{constructor(t,e,i,s){super(`VBService(${i}): ${t} ${s}`),this.name="VBServiceError",this.status=t,this.body=e,this.role=i,this.path=s}};b=class n{static configure(t={}){h={baseUrl:t.baseUrl??h.baseUrl,headers:{...h.headers,...t.headers??{}},services:{...h.services,...t.services??{}}}}static resolve(t){if(!t||typeof t!="string")throw new TypeError("VBService: role must be a non-empty string");return h.services[t]?X(h.services[t]):h.baseUrl?`${X(h.baseUrl)}/${t}`:`/go/${t}`}static _reset(){h={baseUrl:"/go",headers:{},services:{}}}constructor(t){if(!t||typeof t!="string")throw new TypeError("VBService: role must be a non-empty string");this.role=t}async get(t,e){return this.#t("GET",t,{params:e})}async post(t,e){return this.#t("POST",t,{body:e})}async patch(t,e){return this.#t("PATCH",t,{body:e})}async delete(t){return this.#t("DELETE",t,{})}async#t(t,e,i){let s=n.resolve(this.role),r=e?e.startsWith("/")?e:`/${e}`:"",o=new URL(`${s}${r}`,globalThis.location?.origin??"http://localhost"),c=ot(o.searchParams,i.params);c&&(o.search=c.toString());let a={method:t,headers:{...h.headers}};i.body!==void 0&&(a.body=JSON.stringify(i.body),a.headers["content-type"]="application/json");let l=o.toString(),g=await fetch(l,a),F=await at(g);if(!g.ok)throw new m(g.status,F,this.role,`${r||"/"}`);return F}}});function k(n){let t=2166136261;for(let e=0;e<n.length;e++)t^=n.charCodeAt(e),t=Math.imul(t,16777619);return(t>>>0).toString(36)}function lt(){return"hn-"+crypto.randomUUID().slice(0,8)}function dt(n,t){return getComputedStyle(n).getPropertyValue(`--highlight-${t}`).trim()}function ut(n){if(p){w++;return}p=new CSSStyleSheet;let t=n.map(e=>`::highlight(hn-${e}) { background-color: var(--highlight-${e}); text-decoration-line: underline; text-decoration-color: var(--highlight-${e}); text-underline-offset: 2px; }`).join(`
+`);p.replaceSync(t),document.adoptedStyleSheets=[...document.adoptedStyleSheets,p],w=1}function ft(){w--,w<=0&&p&&(document.adoptedStyleSheets=document.adoptedStyleSheets.filter(n=>n!==p),p=null,w=0)}function $(n){f||(f=document.createElement("div"),f.setAttribute("aria-live","polite"),f.setAttribute("aria-atomic","true"),f.className="hn-sr-only",document.body.appendChild(f)),f.textContent="",requestAnimationFrame(()=>{f.textContent=n})}function J(n,t,e){let i=document.createTreeWalker(n,NodeFilter.SHOW_TEXT),s=0;for(;i.nextNode();){if(i.currentNode===t)return s+e;s+=(i.currentNode.textContent??"").length}return-1}function y(n,t,e){let i=document.createTreeWalker(n,NodeFilter.SHOW_TEXT),s=0,r=null,o=0,c=null,a=0;for(;i.nextNode();){let l=i.currentNode,g=(l.textContent??"").length;if(!r&&s+g>t&&(r=l,o=t-s),s+g>=e){c=l,a=e-s;break}s+=g}if(!r||!c)return null;try{let l=document.createRange();return l.setStart(r,Math.min(o,(r.textContent??"").length)),l.setEnd(c,Math.min(a,(c.textContent??"").length)),l}catch{return null}}function M(n){if(N.has(n))return N.get(n);let t=new R(n);return N.set(n,t),t}function K(n=document){n.querySelectorAll(L).forEach(t=>{t.hasAttribute("data-highlights-init")||M(t)})}var L,z,ct,ht,p,w,f,R,N,gt,Y=E(()=>{T();L="[data-highlights]",z="highlights",ct=["yellow","green","blue","pink"],ht=typeof CSS<"u"&&"highlights"in CSS;p=null,w=0;f=null;R=class{#t;#n;#s;#a;#e=[];#c=!ht;#h;#l;#d=!1;#u=[];constructor(t){this.#t=t,this.#a=t.hasAttribute("data-highlights-readonly");let e=t.dataset.highlights;this.#n=e&&e!==""?e:location.pathname;let i=t.dataset.highlightsColors;this.#s=i?i.split(",").map(s=>s.trim()).filter(Boolean):[...ct],this.#c||ut(this.#s),this.#o(),this.#a||(this.#h=this.#p.bind(this),this.#l=this.#m.bind(this),t.addEventListener("pointerup",this.#h),t.addEventListener("click",this.#l)),t.setAttribute("data-highlights-init",""),this.#b().then(()=>{this.#d||this.#o()})}get colors(){return[...this.#s]}get element(){return this.#t}getHighlights(){return this.#e.map(t=>({...t}))}removeHighlight(t){let e=this.#e.findIndex(i=>i.id===t);e<0||(this.#e.splice(e,1),this.#r(),this.#o(),this.#i("highlights:removed",{id:t}),$("Highlight removed"))}clearAll(){this.#e=[],this.#r(),this.#o()}exportHighlights(){return JSON.stringify({version:1,highlights:this.#e})}importHighlights(t){try{let e=typeof t=="string"?JSON.parse(t):t;if(!e.highlights||!Array.isArray(e.highlights))return;this.#e=e.highlights,this.#r(),this.#o()}catch{}}destroy(){if(!this.#d){if(this.#d=!0,this.#h&&this.#t.removeEventListener("pointerup",this.#h),this.#l&&this.#t.removeEventListener("click",this.#l),this.#c)this.#t.querySelectorAll("mark[data-hn-id]").forEach(t=>{let e=t.parentNode;for(;t.firstChild;)e.insertBefore(t.firstChild,t);e.removeChild(t),e.normalize()});else{for(let t of this.#s)CSS.highlights.delete(`hn-${t}`);ft()}this.#f(),this.#t.removeAttribute("data-highlights-init")}}#p(){requestAnimationFrame(()=>{if(this.#d)return;let t=window.getSelection();if(!t||t.isCollapsed||!t.toString().trim())return;let e=t.getRangeAt(0);this.#t.contains(e.commonAncestorContainer)&&this.#i("highlights:selected",{text:t.toString().trim(),rect:e.getBoundingClientRect()})})}#m(t){let e=t.target.closest?.(".hn-margin-annotation");if(e){let s=e.dataset.hnId,r=this.#e.find(o=>o.id===s);if(r){this.#i("highlights:clicked",{id:s,highlight:{...r}}),this.#i("highlights:request-note",{id:s,highlight:{...r},controller:this});return}}let i=t.target.closest?.("mark[data-hn-id]");if(i){let s=i.dataset.hnId,r=this.#e.find(o=>o.id===s);if(r){this.#i("highlights:clicked",{id:s,highlight:{...r}});return}}if(!this.#c){let s=this.#y(t.clientX,t.clientY);s&&this.#i("highlights:clicked",{id:s.id,highlight:{...s}})}}findHighlightRect(t){let e=this.#e.find(r=>r.id===t);if(!e)return null;let i=y(this.#t,e.startOffset,e.endOffset);if(!i)return null;let s=i.getClientRects();return s.length?s[0]:null}#y(t,e){for(let i of this.#e){let s=y(this.#t,i.startOffset,i.endOffset);if(!s)continue;let r=s.getClientRects();for(let o of r)if(t>=o.left&&t<=o.right&&e>=o.top&&e<=o.bottom)return i}return null}_createFromSelection(t){let e=window.getSelection();if(!e||e.isCollapsed)return;let i=e.getRangeAt(0);if(!this.#t.contains(i.commonAncestorContainer))return;let s=J(this.#t,i.startContainer,i.startOffset),r=J(this.#t,i.endContainer,i.endOffset);if(s<0||r<0||s>=r)return;let o=e.toString().trim(),c={id:lt(),startOffset:s,endOffset:r,text:o,color:t,note:"",created:Date.now()};this.#e.push(c),this.#r(),this.#o(),e.removeAllRanges(),this.#i("highlights:added",{id:c.id,text:o,color:t,note:""}),$("Highlight added")}_changeColor(t,e){let i=this.#e.find(s=>s.id===t);i&&(i.color=e,this.#r(),this.#o())}_updateNote(t,e){let i=this.#e.find(s=>s.id===t);i&&(i.note=e,this.#r(),this.#g(),this.#i("highlights:note-changed",{id:t,note:e}),$("Note saved"))}async#b(){let t=await u.get(z,this.#n);if(!t||!Array.isArray(t.highlights))return;let e=k(this.#t.textContent);t.contentHash&&t.contentHash!==e?(this.#e=t.highlights.filter(i=>{let s=y(this.#t,i.startOffset,i.endOffset);return s?s.toString().trim()===i.text:!1}),this.#r()):this.#e=t.highlights}#r(){let t={version:1,contentHash:k(this.#t.textContent),highlights:this.#e};u.set(z,this.#n,t).catch(()=>{})}#o(){this.#c?this.#v():this.#w(),this.#g()}#w(){let t=new Map;for(let e of this.#s)t.set(e,[]);for(let e of this.#e){let i=y(this.#t,e.startOffset,e.endOffset);i&&t.has(e.color)&&t.get(e.color).push(i)}for(let[e,i]of t){let s=`hn-${e}`;i.length===0?CSS.highlights.delete(s):CSS.highlights.set(s,new Highlight(...i))}}#v(){this.#t.querySelectorAll("mark[data-hn-id]").forEach(e=>{let i=e.parentNode;for(;e.firstChild;)i.insertBefore(e.firstChild,e);i.removeChild(e)}),this.#t.normalize();let t=[...this.#e].sort((e,i)=>i.startOffset-e.startOffset);for(let e of t){let i=y(this.#t,e.startOffset,e.endOffset);if(!i)continue;let s=dt(this.#t,e.color),r=document.createElement("mark");r.dataset.hnId=e.id,r.dataset.hnColor=e.color,s&&(r.style.backgroundColor=s,r.style.textDecorationColor=s);try{i.surroundContents(r)}catch{let o=i.extractContents();r.appendChild(o),i.insertNode(r)}}}#f(){for(let t of this.#u)t.remove();this.#u=[]}#g(){if(this.#f(),this.#e.length===0)return;getComputedStyle(this.#t).position==="static"&&(this.#t.style.position="relative");for(let e of this.#e){let i=y(this.#t,e.startOffset,e.endOffset);if(!i)continue;let s=i.getClientRects();if(s.length===0)continue;let r=s[0],o=this.#t.getBoundingClientRect(),c=r.top-o.top,a=document.createElement("span");a.className="hn-margin-annotation",a.dataset.hnId=e.id,a.setAttribute("aria-hidden","true"),a.style.top=`${c}px`,e.note?(a.innerHTML='<span class="hn-note-indicator">*</span> You highlighted',a.classList.add("hn-has-note")):a.textContent="You highlighted",this.#t.appendChild(a),this.#u.push(a)}}#i(t,e={}){this.#t.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0}))}},N=new WeakMap;document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>K()):K();gt=new MutationObserver(n=>{for(let t of n)for(let e of t.addedNodes){if(e.nodeType!==Node.ELEMENT_NODE)continue;let i=e;i.matches(L)&&M(i),i.querySelectorAll(L).forEach(s=>{s.hasAttribute("data-highlights-init")||M(s)})}});gt.observe(document.documentElement,{childList:!0,subtree:!0})});var tt={};st(tt,{currentHash:()=>q,initPageWatch:()=>P,readWatch:()=>x,removeWatch:()=>Z,writeWatch:()=>v});function Q(){return typeof window<"u"&&window.vbPageWatch?.serverSync===!0?!0:document.querySelector('meta[name="vb-page-watch-server"]')?.getAttribute("content")==="true"}async function pt(n){if(!Q())return null;try{let t=new b("notify"),e={url:n.url,type:"page-watch",notify:["panel"]},i=await t.post("/subscribe",e);return typeof i?.id=="string"?i.id:null}catch(t){let e=t instanceof m?`${t.status}`:String(t);return console.warn("[page-watch] server subscribe failed; client-only watch in effect.",e),null}}async function mt(n){if(!(!n||!Q()))try{await new b("notify").delete(`/subscribe/${encodeURIComponent(n)}`)}catch(t){let e=t instanceof m?`${t.status}`:String(t);console.warn("[page-watch] server unsubscribe failed; local state already cleared.",e)}}function yt(){return document.querySelector("main")||document.querySelector("article")||document.body}function S(){return location.pathname||"/"}function q(){let n=yt();return n?k(n.textContent||""):""}function bt(){return document.title||S()}async function x(){return await u.get(W,S())}async function v(n){await u.set(W,S(),n)}async function Z(){await u.remove(W,S())}function B(n,t){n.setAttribute("aria-pressed",t?"true":"false"),n.dataset.watching="",t||delete n.dataset.watching;let e=n.querySelector("icon-wc");e&&e.setAttribute("name",t?"bookmark-check":"bookmark");let i=[...n.childNodes].find(s=>s.nodeType===Node.TEXT_NODE&&(s.textContent||"").trim());i&&!n.hasAttribute("data-watch-label-locked")&&(i.textContent=t?"Watching":"Watch for updates"),n.setAttribute("title",t?"Stop watching this page":"Watch this page for content updates")}async function I(n){if(n.hasAttribute("data-watch-page-init"))return;n.setAttribute("data-watch-page-init",""),n.setAttribute("type",n.getAttribute("type")||"button");let t=await x();B(n,!!t),n.addEventListener("click",async e=>{e.preventDefault();let i=await x();if(i)await Z(),B(n,!1),n.dispatchEvent(new CustomEvent("page-watch:remove",{bubbles:!0,composed:!0,detail:{url:i.url,subscriptionId:i.subscriptionId}})),mt(i.subscriptionId);else{let s={url:S(),title:bt(),contentHash:q(),watchedAt:new Date().toISOString(),lastChecked:new Date().toISOString(),lastChanged:null,subscriptionId:null};await v(s),B(n,!0),n.dispatchEvent(new CustomEvent("page-watch:add",{bubbles:!0,composed:!0,detail:{entry:s}}));let r=await pt(s);r&&await v({...s,subscriptionId:r})}})}async function wt(){let n=await x();if(!n)return;let t=q(),e=new Date().toISOString(),i=n.contentHash,s={...n,lastChecked:e};if(t&&t!==i){s.contentHash=t,s.lastChanged=e,await v(s);let r={id:`page-watch:${n.url}:${t}`,type:"watch",title:`Updated: ${n.title}`,body:"Content changed since your last visit.",url:n.url,date:e,read:!1,dismissed:!1,priority:"normal"};document.dispatchEvent(new CustomEvent("notification-wc:new",{bubbles:!0,composed:!0,detail:{notification:r}}))}else await v(s)}function P(n=document){for(let t of n.querySelectorAll(H))I(t);wt()}var H,W,vt,et=E(()=>{T();G();Y();H="[data-watch-page]",W="watches";document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>P()):P();vt=new MutationObserver(n=>{for(let t of n)for(let e of t.addedNodes){if(e.nodeType!==Node.ELEMENT_NODE)continue;let i=e;i.matches?.(H)&&I(i),i.querySelectorAll?.(H).forEach(s=>I(s))}});vt.observe(document.documentElement,{childList:!0,subtree:!0})});var Ct=window.matchMedia("(prefers-reduced-motion: reduce)");var U=new Map;function _(n,t,e={}){let i=e.priority??10,s={impl:t,bundle:e.bundle,contract:e.contract,priority:i},r=U.get(n);if(customElements.get(n)){if(!r||r.priority>=i){r&&r.priority===i&&r.impl!==t&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${n}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=i){r.priority===i&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${r.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}U.set(n,s),customElements.define(n,t)}var C=class extends HTMLElement{#t=[];#n;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,i,s){t.addEventListener(e,i,s),this.#t.push(()=>t.removeEventListener(e,i,s))}setup(){}teardown(){}setState(t,e){this.#n||(this.#n=this.attachInternals());let i=this.#n.states;try{e?i.add(t):i.delete(t)}catch{let s=`--${t}`;e?i.add(s):i.delete(s)}}_adoptInternals(t){this.#n||(this.#n=t)}};var nt="Watch for updates",St="Watching",D=class extends C{#t=null;setup(){if(this.hasAttribute("server-sync")){let e=window;e.vbPageWatch={...e.vbPageWatch??{},serverSync:!0}}let t=this.#n();this.dataset.variant=t;for(let e of Array.from(this.children))e.hasAttribute?.("data-watch-page")&&e.remove();this.#t=this.#s(t),this.appendChild(this.#t),this.listen(document,"page-watch:add",this.#a),this.listen(document,"page-watch:remove",this.#a)}teardown(){this.#t&&(this.#t.remove(),this.#t=null)}#n(){let t=this.getAttribute("variant");return t==="compact"||t==="button"?t:"icon"}#s(t){let e=document.createElement("button");e.type="button",e.setAttribute("data-watch-page",""),e.className="ghost",e.setAttribute("aria-label","Watch this page for updates");let i=t==="icon"?"sm":"xs",s=this.getAttribute("label")??nt;return t==="icon"?e.innerHTML=`<icon-wc name="bookmark" size="${i}"></icon-wc>`:(e.innerHTML=`<icon-wc name="bookmark" size="${i}"></icon-wc><span>${this.#e(s)}</span>`,e.setAttribute("data-watch-label-locked","")),e}#a=async()=>{if(this.#t)try{let{readWatch:t}=await Promise.resolve().then(()=>(et(),tt)),i=!!await t();this.#t.setAttribute("aria-pressed",i?"true":"false");let s=this.#t.querySelector("icon-wc");s&&s.setAttribute("name",i?"bookmark-check":"bookmark");let r=this.#t.querySelector("span");if(r&&this.#n()!=="icon"){let o=this.getAttribute("label");r.textContent=o||(i?St:nt)}this.#t.setAttribute("title",i?"Stop watching this page":"Watch this page for content updates")}catch{}};#e(t){let e=document.createElement("div");return e.textContent=t,e.innerHTML}};_("watch-wc",D);export{D as WatchWc};
 //# sourceMappingURL=watch-wc.js.map