vanilla-breeze 0.4.1 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (238) hide show
  1. package/custom-elements.json +13966 -11505
  2. package/dist/cdn/components/accordion-wc.js +1 -1
  3. package/dist/cdn/components/activity-feed.js +1 -1
  4. package/dist/cdn/components/ai-chat.js +9 -6
  5. package/dist/cdn/components/ai-summary.js +4 -2
  6. package/dist/cdn/components/analytics-panel.js +19 -21
  7. package/dist/cdn/components/audio-player.js +17 -7
  8. package/dist/cdn/components/audio-visualizer.js +3 -3
  9. package/dist/cdn/components/author-index.js +2 -2
  10. package/dist/cdn/components/brand-mark.js +1 -1
  11. package/dist/cdn/components/bread-crumb.js +1 -1
  12. package/dist/cdn/components/calendar-wc.js +2 -2
  13. package/dist/cdn/components/card-list.js +1 -1
  14. package/dist/cdn/components/carousel-wc.js +1 -1
  15. package/dist/cdn/components/change-set.js +1 -11
  16. package/dist/cdn/components/chart-wc.js +32 -32
  17. package/dist/cdn/components/chat-input.js +1 -1
  18. package/dist/cdn/components/chat-window.js +1 -1
  19. package/dist/cdn/components/color-picker.js +1 -1
  20. package/dist/cdn/components/combo-box.js +1 -1
  21. package/dist/cdn/components/command-palette.js +1 -1
  22. package/dist/cdn/components/comment-box.js +49 -49
  23. package/dist/cdn/components/comment-thread.js +32 -32
  24. package/dist/cdn/components/comment-wc.js +1 -1
  25. package/dist/cdn/components/compare-surface.js +1 -1
  26. package/dist/cdn/components/consent-banner.js +1 -1
  27. package/dist/cdn/components/content-lens.js +1 -1
  28. package/dist/cdn/components/content-swap.js +1 -1
  29. package/dist/cdn/components/context-menu.js +1 -1
  30. package/dist/cdn/components/data-table.js +1 -1
  31. package/dist/cdn/components/date-picker.js +1 -1
  32. package/dist/cdn/components/day-view.js +1 -1
  33. package/dist/cdn/components/diagram-wc.js +2 -2
  34. package/dist/cdn/components/drag-surface.js +1 -1
  35. package/dist/cdn/components/drop-down.js +1 -1
  36. package/dist/cdn/components/emoji-picker.js +1 -1
  37. package/dist/cdn/components/flow-diagram.js +1 -1
  38. package/dist/cdn/components/foot-notes.js +1 -1
  39. package/dist/cdn/components/form-field.js +1 -1
  40. package/dist/cdn/components/geo-map.js +4 -4
  41. package/dist/cdn/components/glossary-index.js +1 -1
  42. package/dist/cdn/components/glossary-wc.js +1 -1
  43. package/dist/cdn/components/heading-links.js +1 -1
  44. package/dist/cdn/components/highlight-wc.js +2 -2
  45. package/dist/cdn/components/image-gallery.js +1 -1
  46. package/dist/cdn/components/image-map.js +1 -1
  47. package/dist/cdn/components/include-file.js +1 -1
  48. package/dist/cdn/components/manifest.json +100 -100
  49. package/dist/cdn/components/markdown-editor.js +1 -1
  50. package/dist/cdn/components/markdown-viewer.js +11 -11
  51. package/dist/cdn/components/nav-bar.js +1 -1
  52. package/dist/cdn/components/note-wc.js +2 -2
  53. package/dist/cdn/components/notification-wc.js +4 -4
  54. package/dist/cdn/components/page-info.js +2 -2
  55. package/dist/cdn/components/page-stats.js +1 -1
  56. package/dist/cdn/components/page-toc.js +1 -1
  57. package/dist/cdn/components/page-tools.js +1 -1
  58. package/dist/cdn/components/page-tour.js +5 -5
  59. package/dist/cdn/components/pager-wc.js +1 -1
  60. package/dist/cdn/components/poll-wc.js +1 -1
  61. package/dist/cdn/components/pop-over.js +1 -1
  62. package/dist/cdn/components/popularity-index.js +4 -4
  63. package/dist/cdn/components/print-page.js +1 -1
  64. package/dist/cdn/components/progress-tracker.js +1 -1
  65. package/dist/cdn/components/qr-code.js +1 -1
  66. package/dist/cdn/components/reaction-bar.js +1 -1
  67. package/dist/cdn/components/reader-view.js +3 -3
  68. package/dist/cdn/components/reading-progress.js +1 -1
  69. package/dist/cdn/components/recently-visited.js +7 -7
  70. package/dist/cdn/components/score-card.js +2 -2
  71. package/dist/cdn/components/selection-menu.js +1 -1
  72. package/dist/cdn/components/settings-panel.js +4 -4
  73. package/dist/cdn/components/share-wc.js +2 -2
  74. package/dist/cdn/components/short-cuts.js +1 -1
  75. package/dist/cdn/components/site-index.js +6 -6
  76. package/dist/cdn/components/site-map.js +1 -1
  77. package/dist/cdn/components/site-search.js +3 -3
  78. package/dist/cdn/components/slide-accept.js +1 -1
  79. package/dist/cdn/components/social-embed.js +1 -1
  80. package/dist/cdn/components/split-surface.js +1 -1
  81. package/dist/cdn/components/star-rating.js +1 -1
  82. package/dist/cdn/components/status-wc.js +1 -1
  83. package/dist/cdn/components/stepper-wc.js +1 -1
  84. package/dist/cdn/components/tab-set.js +1 -1
  85. package/dist/cdn/components/text-reader.js +2 -2
  86. package/dist/cdn/components/theme-picker.js +44 -44
  87. package/dist/cdn/components/time-index.js +2 -2
  88. package/dist/cdn/components/time-picker.js +1 -1
  89. package/dist/cdn/components/toast-msg.js +1 -1
  90. package/dist/cdn/components/tool-tip.js +1 -1
  91. package/dist/cdn/components/topic-map.js +3 -3
  92. package/dist/cdn/components/trust-filter.js +3 -3
  93. package/dist/cdn/components/version-switcher.js +3 -13
  94. package/dist/cdn/components/video-player.js +1 -1
  95. package/dist/cdn/components/watch-wc.js +2 -2
  96. package/dist/cdn/components/week-view.js +1 -1
  97. package/dist/cdn/components/youtube-player.js +1 -1
  98. package/dist/cdn/packs/effects.full.js +1 -1
  99. package/dist/cdn/packs/kawaii.effects.css +1 -1
  100. package/dist/cdn/packs/kawaii.full.css +1 -1
  101. package/dist/cdn/packs/kawaii.full.js +4 -4
  102. package/dist/cdn/packs/manifest.json +7 -7
  103. package/dist/cdn/packs/memphis.full.css +1 -1
  104. package/dist/cdn/packs/memphis.theme.css +1 -1
  105. package/dist/cdn/packs/ui.full.js +46 -46
  106. package/dist/cdn/themes/8bit.css +1 -1
  107. package/dist/cdn/themes/8bit.tokens.json +1 -1
  108. package/dist/cdn/themes/alpha1999-dark.tokens.json +1 -1
  109. package/dist/cdn/themes/alpha1999.tokens.json +1 -1
  110. package/dist/cdn/themes/art-deco-dark.tokens.json +33 -1
  111. package/dist/cdn/themes/art-deco.css +1 -1
  112. package/dist/cdn/themes/art-deco.tokens.json +23 -1
  113. package/dist/cdn/themes/bauhaus-dark.tokens.json +23 -1
  114. package/dist/cdn/themes/bauhaus.css +1 -1
  115. package/dist/cdn/themes/bauhaus.tokens.json +1 -1
  116. package/dist/cdn/themes/brutalist-dark.tokens.json +33 -1
  117. package/dist/cdn/themes/brutalist.css +1 -1
  118. package/dist/cdn/themes/brutalist.tokens.json +23 -1
  119. package/dist/cdn/themes/catppuccin-frappe.tokens.json +1 -1
  120. package/dist/cdn/themes/catppuccin-latte-dark.tokens.json +1 -1
  121. package/dist/cdn/themes/catppuccin-latte.tokens.json +1 -1
  122. package/dist/cdn/themes/catppuccin-macchiato.tokens.json +1 -1
  123. package/dist/cdn/themes/catppuccin-mocha.tokens.json +1 -1
  124. package/dist/cdn/themes/classic-dark.tokens.json +1 -1
  125. package/dist/cdn/themes/classic.tokens.json +1 -1
  126. package/dist/cdn/themes/claymorphism-dark.tokens.json +33 -1
  127. package/dist/cdn/themes/claymorphism.css +1 -1
  128. package/dist/cdn/themes/claymorphism.tokens.json +23 -1
  129. package/dist/cdn/themes/clinical-dark.tokens.json +1 -1
  130. package/dist/cdn/themes/clinical.tokens.json +1 -1
  131. package/dist/cdn/themes/cottagecore-dark.tokens.json +1 -1
  132. package/dist/cdn/themes/cottagecore.css +1 -1
  133. package/dist/cdn/themes/cottagecore.tokens.json +1 -1
  134. package/dist/cdn/themes/cyber.css +1 -1
  135. package/dist/cdn/themes/cyber.tokens.json +1 -1
  136. package/dist/cdn/themes/dawn-dark.tokens.json +33 -1
  137. package/dist/cdn/themes/dawn.css +1 -1
  138. package/dist/cdn/themes/dawn.tokens.json +23 -1
  139. package/dist/cdn/themes/dracula.tokens.json +1 -1
  140. package/dist/cdn/themes/dusk.css +1 -1
  141. package/dist/cdn/themes/dusk.tokens.json +1 -1
  142. package/dist/cdn/themes/editorial-dark.tokens.json +1 -1
  143. package/dist/cdn/themes/editorial.css +1 -1
  144. package/dist/cdn/themes/editorial.tokens.json +1 -1
  145. package/dist/cdn/themes/financial-dark.tokens.json +1 -1
  146. package/dist/cdn/themes/financial.tokens.json +1 -1
  147. package/dist/cdn/themes/genai.css +1 -1
  148. package/dist/cdn/themes/genai.tokens.json +1 -1
  149. package/dist/cdn/themes/glassmorphism-dark.tokens.json +1 -1
  150. package/dist/cdn/themes/glassmorphism.tokens.json +1 -1
  151. package/dist/cdn/themes/government-dark.tokens.json +1 -1
  152. package/dist/cdn/themes/government.tokens.json +1 -1
  153. package/dist/cdn/themes/gruvbox-dark.tokens.json +1 -1
  154. package/dist/cdn/themes/gruvbox.tokens.json +1 -1
  155. package/dist/cdn/themes/high-noon-dark.tokens.json +23 -1
  156. package/dist/cdn/themes/high-noon.css +1 -1
  157. package/dist/cdn/themes/high-noon.tokens.json +1 -1
  158. package/dist/cdn/themes/journal-dark.tokens.json +33 -1
  159. package/dist/cdn/themes/journal.css +1 -1
  160. package/dist/cdn/themes/journal.tokens.json +23 -1
  161. package/dist/cdn/themes/kawaii-dark.tokens.json +1 -1
  162. package/dist/cdn/themes/kawaii.css +1 -1
  163. package/dist/cdn/themes/kawaii.tokens.json +1 -1
  164. package/dist/cdn/themes/magna-dark.tokens.json +1 -1
  165. package/dist/cdn/themes/magna.tokens.json +1 -1
  166. package/dist/cdn/themes/manifest.json +26 -50
  167. package/dist/cdn/themes/midnight.tokens.json +1 -1
  168. package/dist/cdn/themes/minimal-dark.tokens.json +1 -1
  169. package/dist/cdn/themes/minimal.tokens.json +1 -1
  170. package/dist/cdn/themes/modern-dark.tokens.json +1 -1
  171. package/dist/cdn/themes/modern.tokens.json +1 -1
  172. package/dist/cdn/themes/nes-dark.tokens.json +1 -1
  173. package/dist/cdn/themes/nes.css +1 -1
  174. package/dist/cdn/themes/nes.tokens.json +1 -1
  175. package/dist/cdn/themes/neumorphism-dark.tokens.json +1 -1
  176. package/dist/cdn/themes/neumorphism.css +1 -1
  177. package/dist/cdn/themes/neumorphism.tokens.json +1 -1
  178. package/dist/cdn/themes/nord-dark.tokens.json +33 -1
  179. package/dist/cdn/themes/nord.css +1 -1
  180. package/dist/cdn/themes/nord.tokens.json +23 -1
  181. package/dist/cdn/themes/organic-dark.tokens.json +1 -1
  182. package/dist/cdn/themes/organic.css +1 -1
  183. package/dist/cdn/themes/organic.tokens.json +1 -1
  184. package/dist/cdn/themes/rose-pine-dark.tokens.json +1 -1
  185. package/dist/cdn/themes/rose-pine.tokens.json +1 -1
  186. package/dist/cdn/themes/rough-dark.tokens.json +1 -1
  187. package/dist/cdn/themes/rough.css +1 -1
  188. package/dist/cdn/themes/rough.tokens.json +1 -1
  189. package/dist/cdn/themes/solarized-dark.tokens.json +23 -1
  190. package/dist/cdn/themes/solarized.css +1 -1
  191. package/dist/cdn/themes/solarized.tokens.json +23 -1
  192. package/dist/cdn/themes/startup-dark.tokens.json +1 -1
  193. package/dist/cdn/themes/startup.tokens.json +1 -1
  194. package/dist/cdn/themes/super2026-dark.tokens.json +33 -1
  195. package/dist/cdn/themes/super2026.css +1 -1
  196. package/dist/cdn/themes/super2026.tokens.json +23 -1
  197. package/dist/cdn/themes/swiss-dark.tokens.json +1 -1
  198. package/dist/cdn/themes/swiss.css +1 -1
  199. package/dist/cdn/themes/swiss.tokens.json +1 -1
  200. package/dist/cdn/themes/terminal.css +1 -1
  201. package/dist/cdn/themes/terminal.tokens.json +1 -1
  202. package/dist/cdn/themes/tokyo-night-dark.tokens.json +33 -1
  203. package/dist/cdn/themes/tokyo-night.css +1 -1
  204. package/dist/cdn/themes/tokyo-night.tokens.json +23 -1
  205. package/dist/cdn/themes/vaporwave-dark.tokens.json +33 -1
  206. package/dist/cdn/themes/vaporwave.css +1 -1
  207. package/dist/cdn/themes/vaporwave.tokens.json +23 -1
  208. package/dist/cdn/themes/win9x-dark.tokens.json +15 -4
  209. package/dist/cdn/themes/win9x.css +1 -1
  210. package/dist/cdn/themes/win9x.tokens.json +1 -1
  211. package/dist/cdn/vanilla-breeze-autoload.js +663 -0
  212. package/dist/cdn/vanilla-breeze-charts.css +1 -1
  213. package/dist/cdn/vanilla-breeze-charts.js +32 -32
  214. package/dist/cdn/vanilla-breeze-core.css +1 -1
  215. package/dist/cdn/vanilla-breeze-core.js +78 -80
  216. package/dist/cdn/vanilla-breeze-dev.css +1 -1
  217. package/dist/cdn/vanilla-breeze-extras.js +47 -37
  218. package/dist/cdn/vanilla-breeze.css +1 -1
  219. package/dist/cdn/vanilla-breeze.js +180 -177
  220. package/package.json +3 -3
  221. package/dist/cdn/themes/amber.css +0 -2
  222. package/dist/cdn/themes/anthropic.css +0 -2
  223. package/dist/cdn/themes/anthropic.tokens.json +0 -564
  224. package/dist/cdn/themes/coral.css +0 -2
  225. package/dist/cdn/themes/emerald.css +0 -2
  226. package/dist/cdn/themes/forest.css +0 -2
  227. package/dist/cdn/themes/ibm.css +0 -2
  228. package/dist/cdn/themes/ibm.tokens.json +0 -568
  229. package/dist/cdn/themes/indigo.css +0 -2
  230. package/dist/cdn/themes/lavender.css +0 -2
  231. package/dist/cdn/themes/mcdonalds.css +0 -2
  232. package/dist/cdn/themes/mcdonalds.tokens.json +0 -533
  233. package/dist/cdn/themes/ocean.css +0 -2
  234. package/dist/cdn/themes/rose.css +0 -2
  235. package/dist/cdn/themes/slate.css +0 -2
  236. package/dist/cdn/themes/starbucks.css +0 -2
  237. package/dist/cdn/themes/starbucks.tokens.json +0 -593
  238. package/dist/cdn/themes/sunset.css +0 -2
@@ -1,2 +1,2 @@
1
- function b(o){if(!o||typeof o!="string")return"";let t=document.createElement("template");return t.innerHTML=o,t.content.querySelectorAll("script, iframe, object, embed, form, base, link, meta, noscript").forEach(n=>n.remove()),t.content.querySelectorAll("*").forEach(n=>{for(let i of[...n.attributes]){if(i.name.startsWith("on")){n.removeAttribute(i.name);continue}if(["href","src","action","formaction","xlink:href"].includes(i.name)){let r=i.value.trim().toLowerCase();(r.startsWith("javascript:")||r.startsWith("data:text/html"))&&n.removeAttribute(i.name);continue}(i.name==="srcdoc"||i.name==="data"&&n.tagName==="OBJECT")&&n.removeAttribute(i.name)}}),t.innerHTML}var C=window.matchMedia("(prefers-reduced-motion: reduce)");var E=new Map;function A(o,t,e={}){let s=e.priority??10,n={impl:t,bundle:e.bundle,contract:e.contract,priority:s},i=E.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}E.set(o,n),customElements.define(o,t)}var m=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,n){t.addEventListener(e,s,n),this.#t.push(()=>t.removeEventListener(e,s,n))}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 n=`--${t}`;e?s.add(n):s.delete(n)}}_adoptInternals(t){this.#e||(this.#e=t)}};function v({newItems:o,nodes:t,keyOf:e,renderItem:s,containerFor:n}){let i=[],r=[],l=[],y=new Set;for(let a of o)y.add(e(a));for(let[a,d]of[...t])y.has(a)||(d.remove(),t.delete(a),l.push(a));let f=new Map;for(let a of o){let d=e(a),c=t.get(d)||null,h=n(a,c);f.has(h)||f.set(h,[]),f.get(h)?.push({item:a,key:d,existing:c})}for(let[a,d]of f)for(let c=0;c<d.length;c++){let{item:h,key:p,existing:M}=d[c],u=M;u?(u.parentElement!==a||a.children[c]!==u)&&r.push(p):(u=s(h),t.set(p,u),i.push(p));let w=a.children[c];w!==u&&a.insertBefore(u,w||null)}return{added:i,moved:r,removed:l}}var g=class extends m{#t=null;#e=null;#s=null;#n=new Map;#i=null;#u=new Map;setup(){this.#h(),this.#f(),this.#p(),this.#l(),this.#o(),this.#m()}teardown(){}#h(){this.#t=this.querySelector(":scope > chat-thread"),this.#e=this.querySelector(":scope > chat-input"),this.#s=this.querySelector(":scope > header select[data-model-select]")}#f(){let t=this.querySelector(":scope > script[data-participants]");if(t)try{let e=JSON.parse(t.textContent);this.#n=new Map(Object.entries(e))}catch{console.warn("[chat-window] Invalid participant JSON")}}#l(){if(this.#t)for(let t of this.#t.querySelectorAll("chat-message[data-from]"))this.#a(t)}#a(t){let e=t.getAttribute("data-from");if(!e)return;let s=this.#n.get(e);s?.name?t.setAttribute("data-from-label",s.name):t.hasAttribute("data-from-label")||t.setAttribute("data-from-label",e)}#p(){if(!this.#s)return;let t=this.getAttribute("model");t?this.#s.value=t:this.#s.value&&this.setAttribute("model",this.#s.value)}#m(){this.listen(this,"chat-input:send",this.#b),this.#s&&this.listen(this.#s,"change",this.#g)}#b=async t=>{t.stopPropagation();let{message:e}=t.detail;if(!e||!this.#t)return;let s=this.#c("user",e,"user");this.#t.appendChild(s),this.#r(),this.#o();let n=this.#w(),i=this.#y(n);this.#t.appendChild(i),this.#r(),this.#e&&(this.#e.disabled=!0);let r=this.getAttribute("endpoint");if(r)try{let l=await this.#E(r,e);this.#d(i,l)}catch(l){this.#d(i,"<p>Sorry, something went wrong.</p>"),i.setAttribute("data-status","error"),this.dispatchEvent(new CustomEvent("chat-window:error",{bubbles:!0,detail:{error:l.message,status:l.status??0}}))}else this.dispatchEvent(new CustomEvent("chat-window:send",{bubbles:!0,detail:{message:e,typingElement:i}}));this.#e&&(this.#e.disabled=!1,this.#e.focus()),this.#r()};#g=()=>{let t=this.#s.value;this.setAttribute("model",t),this.dispatchEvent(new CustomEvent("chat-window:model-change",{bubbles:!0,detail:{model:t}}))};#c(t,e,s){let n=document.createElement("chat-message");n.setAttribute("data-role",t),s&&(n.setAttribute("data-from",s),this.#a(n));let i=document.createElement("chat-bubble");if(e.includes("<"))i.innerHTML=b(e);else{let r=document.createElement("p");r.textContent=e,i.appendChild(r)}return n.appendChild(i),n}#y(t){let e=document.createElement("chat-message");if(e.setAttribute("data-role","agent"),e.setAttribute("data-status","typing"),t){e.setAttribute("data-from",t),this.#a(e);let r=this.#n.get(t)?.name??t;e.setAttribute("aria-label",`${r} is typing`)}else e.setAttribute("aria-label","Agent is typing");let s=this.getAttribute("model");s&&e.setAttribute("data-model",s);let n=document.createElement("chat-bubble");return e.appendChild(n),e}#d(t,e){let s=t.querySelector("chat-bubble");s&&(s.innerHTML=b(e)),t.removeAttribute("data-status"),t.removeAttribute("aria-label")}#w(){for(let[t,e]of this.#n)if(e.role==="agent")return t;return null}#o(){if(!this.#t)return;this.#t.querySelector("chat-message")!==null?(this.#i&&(this.#i.remove(),this.#i=null),this.#t.hidden=!1):(this.#t.hidden=!0,this.#i||(this.#i=document.createElement("p"),this.#i.setAttribute("data-chat-empty",""),this.#i.textContent=this.getAttribute("empty-message")||"Send a message to start.",this.#t.insertAdjacentElement("afterend",this.#i)))}#r(){this.#t&&requestAnimationFrame(()=>{this.#t.scrollTop=this.#t.scrollHeight})}scrollToBottom(){this.#r()}async#E(t,e){let s={message:e,model:this.getAttribute("model")||void 0},n=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(s)});if(!n.ok){let r=new Error(`Chat request failed: ${n.status}`);throw r.status=n.status,r}let i=await n.json();return i.html??i.message??i.content??""}get model(){return this.getAttribute("model")??""}set model(t){this.setAttribute("model",t),this.#s&&(this.#s.value=t)}get participants(){return this.#n}set participants(t){this.#n=t instanceof Map?t:new Map(Object.entries(t)),this.#l()}clearThread(){if(this.#t){for(;this.#t.firstChild;)this.#t.removeChild(this.#t.firstChild);this.#o()}}appendMessage(t,e,s){if(!this.#t)return;let n=this.#c(t,e,s);this.#t.appendChild(n),this.#r(),this.#o()}get messages(){return this.#t?[...this.#t.querySelectorAll(':scope > chat-message:not([data-status="typing"])')].map(t=>({id:t.id||t.getAttribute("data-id")||void 0,role:t.getAttribute("data-role")||"user",content:t.querySelector("chat-bubble")?.innerHTML||"",from:t.getAttribute("data-from")||void 0})):[]}set messages(t){if(!this.#t)return;let e=Array.isArray(t)?t:[];v({newItems:e,nodes:this.#u,keyOf:s=>s.id??s.role+":"+s.content,renderItem:s=>{let n=this.#c(s.role||"user",s.content||"",s.from);return s.id&&(n.id=s.id),n},containerFor:()=>this.#t}),this.#o(),this.#r(),this.dispatchEvent(new CustomEvent("chat-window:messages-changed",{detail:{messages:e,source:"property"},bubbles:!0}))}};A("chat-window",g);export{g as ChatWindow};
1
+ function w(o){if(!o||typeof o!="string")return"";let t=document.createElement("template");return t.innerHTML=o,t.content.querySelectorAll("script, iframe, object, embed, form, base, link, meta, noscript").forEach(e=>e.remove()),t.content.querySelectorAll("*").forEach(e=>{for(let i of[...e.attributes]){if(i.name.startsWith("on")){e.removeAttribute(i.name);continue}if(["href","src","action","formaction","xlink:href"].includes(i.name)){let r=i.value.trim().toLowerCase();(r.startsWith("javascript:")||r.startsWith("data:text/html"))&&e.removeAttribute(i.name);continue}(i.name==="srcdoc"||i.name==="data"&&e.tagName==="OBJECT")&&e.removeAttribute(i.name)}}),t.innerHTML}var S=window.matchMedia("(prefers-reduced-motion: reduce)");var v=new Map;function A(o,t,s={}){let n=s.priority??10,e={impl:t,bundle:s.bundle,contract:s.contract,priority:n},i=v.get(o);if(customElements.get(o)){if(!i||i.priority>=n){i&&i.priority===n&&i.impl!==t&&console.warn(`[VB Bundle] Tag <${o}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${s.bundle}".`);return}console.warn(`[VB Bundle] Tag <${o}> defined by "${i.bundle}" cannot be replaced (customElements.define is permanent). "${s.bundle}" has higher priority but arrived late.`);return}if(i&&i.priority>=n){i.priority===n&&console.warn(`[VB Bundle] Tag <${o}> already registered by "${i.bundle}". Skipping "${s.bundle}" (first wins at equal priority).`);return}v.set(o,e),customElements.define(o,t)}var b=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,s,n,e){t.addEventListener(s,n,e),this.#t.push(()=>t.removeEventListener(s,n,e))}_reinit(){for(let t of this.#t)t();this.#t=[],this.teardown(),this.removeAttribute("data-upgraded"),this.isConnected&&this.setup()!==!1&&this.setAttribute("data-upgraded","")}setup(){}teardown(){}setState(t,s){this.#e||(this.#e=this.attachInternals());let n=this.#e.states;try{s?n.add(t):n.delete(t)}catch{let e=`--${t}`;s?n.add(e):n.delete(e)}}_adoptInternals(t){this.#e||(this.#e=t)}};function E({newItems:o,nodes:t,keyOf:s,renderItem:n,containerFor:e}){let i=[],r=[],c=[],d=new Set;for(let a of o)d.add(s(a));for(let[a,h]of[...t])d.has(a)||(h.remove(),t.delete(a),c.push(a));let p=new Map;for(let a of o){let h=s(a),l=t.get(h)||null,f=e(a,l);p.has(f)||p.set(f,[]),p.get(f)?.push({item:a,key:h,existing:l})}for(let[a,h]of p)for(let l=0;l<h.length;l++){let{item:f,key:m,existing:C}=h[l],u=C;u?(u.parentElement!==a||a.children[l]!==u)&&r.push(m):(u=n(f),t.set(m,u),i.push(m));let y=a.children[l];y!==u&&a.insertBefore(u,y||null)}return{added:i,moved:r,removed:c}}var g=class extends b{#t=null;#e=null;#i=null;#r=new Map;#s=null;#o=new Map;#c=new Set;setup(){this.#f(),this.#p(),this.#m(),this.#h(),this.#a(),this.#b()}teardown(){for(let t of this.#c)t.abort();this.#c.clear()}#f(){this.#t=this.querySelector(":scope > chat-thread"),this.#e=this.querySelector(":scope > chat-input"),this.#i=this.querySelector(":scope > header select[data-model-select]")}#p(){let t=this.querySelector(":scope > script[data-participants]");if(t)try{let s=JSON.parse(t.textContent);this.#r=new Map(Object.entries(s))}catch{console.warn("[chat-window] Invalid participant JSON")}}#h(){if(this.#t)for(let t of this.#t.querySelectorAll("chat-message[data-from]"))this.#l(t)}#l(t){let s=t.getAttribute("data-from");if(!s)return;let n=this.#r.get(s);n?.name?t.setAttribute("data-from-label",n.name):t.hasAttribute("data-from-label")||t.setAttribute("data-from-label",s)}#m(){if(!this.#i)return;let t=this.getAttribute("model");t?this.#i.value=t:this.#i.value&&this.setAttribute("model",this.#i.value)}#b(){this.listen(this,"chat-input:send",this.#g),this.#i&&this.listen(this.#i,"change",this.#y)}#g=async t=>{t.stopPropagation();let{message:s}=t.detail;if(!s||!this.#t)return;let n=this.#d("user",s,"user");this.#t.appendChild(n),this.#n(),this.#a();let e=this.#v(),i=this.#w(e);this.#t.appendChild(i),this.#n(),this.#e&&(this.#e.disabled=!0);let r=this.getAttribute("endpoint");if(r){let c=new AbortController;this.#c.add(c);try{let d=await this.#A(r,s,c.signal);this.resolveTyping(i,d)}catch(d){c.signal.aborted?i.remove():(this.resolveTyping(i,"<p>Sorry, something went wrong.</p>",{error:!0}),this.dispatchEvent(new CustomEvent("chat-window:error",{bubbles:!0,detail:{error:d.message,status:d.status??0}})))}finally{this.#c.delete(c)}}else this.dispatchEvent(new CustomEvent("chat-window:send",{bubbles:!0,detail:{message:s,typingElement:i}}));this.#e&&(this.#e.disabled=!1,this.isConnected&&this.#e.focus()),this.#n(),this.#a()};#y=()=>{let t=this.#i.value;this.setAttribute("model",t),this.dispatchEvent(new CustomEvent("chat-window:model-change",{bubbles:!0,detail:{model:t}}))};#d(t,s,n){let e=document.createElement("chat-message");e.setAttribute("data-role",t),n&&(e.setAttribute("data-from",n),this.#l(e));let i=document.createElement("chat-bubble");return this.#u(i,s,{asText:t==="user"}),e.appendChild(i),e}#u(t,s,{asText:n=!1}={}){let e=s==null?"":String(s);if(n||!e.includes("<")){let i=document.createElement("p");i.textContent=e,t.replaceChildren(i)}else t.innerHTML=w(e)}#w(t){let s=document.createElement("chat-message");s.setAttribute("data-role","agent"),s.setAttribute("data-status","typing");let n="Agent";t&&(s.setAttribute("data-from",t),this.#l(s),n=this.#r.get(t)?.name??t);let e=this.getAttribute("model");e&&s.setAttribute("data-model",e);let i=document.createElement("chat-bubble"),r=document.createElement("span");return r.className="visually-hidden",r.setAttribute("data-chat-typing",""),r.textContent=`${n} is typing`,i.appendChild(r),s.appendChild(i),s}#v(){for(let[t,s]of this.#r)if(s.role==="agent")return t;return null}#a(){if(!this.#t)return;if(this.#t.querySelector(":scope > chat-message")!==null){this.#s?.remove(),this.#s=null;return}this.#s||(this.#s=this.#t.querySelector(":scope > [data-chat-empty]")),this.#s||(this.#s=document.createElement("p"),this.#s.setAttribute("data-chat-empty",""),this.#s.textContent=this.getAttribute("empty-message")||"Send a message to start."),this.#s.parentNode!==this.#t&&this.#t.prepend(this.#s)}#n(){this.#t&&requestAnimationFrame(()=>{this.#t.scrollTop=this.#t.scrollHeight})}scrollToBottom(){this.#n()}async#A(t,s,n){let e={message:s,model:this.getAttribute("model")||void 0},i=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e),signal:n});if(!i.ok){let c=new Error(`Chat request failed: ${i.status}`);throw c.status=i.status,c}let r=await i.json();return r.html??r.message??r.content??""}get model(){return this.getAttribute("model")??""}set model(t){this.setAttribute("model",t),this.#i&&(this.#i.value=t)}get participants(){return this.#r}set participants(t){this.#r=t instanceof Map?t:new Map(Object.entries(t)),this.#h()}clearThread(){if(this.#t){for(;this.#t.firstChild;)this.#t.removeChild(this.#t.firstChild);this.#a()}}appendMessage(t,s,n){if(!this.#t)return;let e=this.#d(t,s,n);return this.#t.appendChild(e),this.#n(),this.#a(),e}resolveTyping(t,s,{error:n=!1}={}){if(!t)return;let e=t.querySelector(":scope > chat-bubble");e||(e=document.createElement("chat-bubble"),t.appendChild(e)),this.#u(e,s),t.removeAttribute("aria-label"),n?t.setAttribute("data-status","error"):t.removeAttribute("data-status"),this.#n()}get messages(){return this.#t?[...this.#t.querySelectorAll(':scope > chat-message:not([data-status="typing"])')].map(t=>{let s=t.getAttribute("data-role")||"user",n=t.querySelector("chat-bubble");return{id:t.id||t.getAttribute("data-id")||void 0,role:s,content:(s==="user"?n?.textContent?.trim():n?.innerHTML)||"",from:t.getAttribute("data-from")||void 0}}):[]}set messages(t){if(!this.#t)return;let s=Array.isArray(t)?t:[];for(let[e,i]of this.#o)i.parentNode!==this.#t&&this.#o.delete(e);let n=new Set(this.#o.values());for(let e of[...this.#t.children])if(!n.has(e)){if(e.localName==="chat-message"&&e.id&&!e.matches('[data-status="typing"]')&&!this.#o.has(e.id)){this.#o.set(e.id,e);continue}e===this.#s&&(this.#s=null),e.remove()}E({newItems:s,nodes:this.#o,keyOf:e=>e.id??e.role+":"+e.content,renderItem:e=>{let i=this.#d(e.role||"user",e.content||"",e.from);return e.id&&(i.id=e.id),i},containerFor:()=>this.#t}),this.#a(),this.#n(),this.dispatchEvent(new CustomEvent("chat-window:messages-changed",{detail:{messages:s,source:"property"},bubbles:!0}))}};A("chat-window",g);export{g as ChatWindow};
2
2
  //# sourceMappingURL=chat-window.js.map
@@ -1,2 +1,2 @@
1
- var tt=window.matchMedia("(prefers-reduced-motion: reduce)");var $=new Map;function D(i,t,e={}){let s=e.priority??10,n={impl:t,bundle:e.bundle,contract:e.contract,priority:s},o=$.get(i);if(customElements.get(i)){if(!o||o.priority>=s){o&&o.priority===s&&o.impl!==t&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${o.bundle}" (priority ${o.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${o.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(o&&o.priority>=s){o.priority===s&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${o.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}$.set(i,n),customElements.define(i,t)}var y=class extends HTMLElement{#d=[];#r;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.#d)t();this.#d=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,n){t.addEventListener(e,s,n),this.#d.push(()=>t.removeEventListener(e,s,n))}setup(){}teardown(){}setState(t,e){this.#r||(this.#r=this.attachInternals());let s=this.#r.states;try{e?s.add(t):s.delete(t)}catch{let n=`--${t}`;e?s.add(n):s.delete(n)}}_adoptInternals(t){this.#r||(this.#r=t)}};var F="popover"in HTMLElement.prototype;var A="[data-copy], [data-copy-target], [data-paste-target]",_="Copied to clipboard",B="Pasted from clipboard",C=new WeakMap;async function T(i,t={}){if(i==null||i==="")return!1;let{button:e,announceMessage:s=_,duration:n=1500}=t;try{await navigator.clipboard.writeText(i)}catch{return!1}return P({button:e,duration:n,announceMessage:s,eventDetail:{text:i}}),!0}function P({button:i,duration:t,announceMessage:e,eventDetail:s,state:n="copied",eventName:o="copy"}){if(i){i.dataset.state=n;let a=C.get(i);a&&clearTimeout(a),C.set(i,setTimeout(()=>{delete i.dataset.state,C.delete(i)},t)),i.dispatchEvent(new CustomEvent(o,{bubbles:!0,detail:s}))}V(e,i??document.body)}async function U(i,t={}){let{button:e,announceMessage:s=B,duration:n=1500}=t,o;try{o=await navigator.clipboard.readText()}catch{return null}return i&&("value"in i&&(i instanceof HTMLInputElement||i instanceof HTMLTextAreaElement||i instanceof HTMLSelectElement)?i.value=o:i.textContent=o,i.dispatchEvent(new Event("input",{bubbles:!0}))),P({button:e,duration:n,announceMessage:s,eventDetail:{text:o},state:"pasted",eventName:"paste"}),o}function O(i=document){i.querySelectorAll(A).forEach(k)}function k(i){i.hasAttribute("data-copy-init")||(i.setAttribute("data-copy-init",""),i.addEventListener("click",()=>{if(i.dataset.pasteTarget){let e=document.querySelector(i.dataset.pasteTarget);if(!e)return;U(e,{button:i});return}let t=q(i);t&&T(t,{button:i})}))}function q(i){if(i.dataset.copy)return i.dataset.copy;if(i.dataset.copyTarget){let t=document.querySelector(i.dataset.copyTarget);if(!t)return"";let e=i.dataset.copyAttr;return e?t.getAttribute(e)??"":t.textContent??""}return""}function V(i,t){let e=document.createElement("div");e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),e.className="visually-hidden",e.textContent=i,t.appendChild(e),setTimeout(()=>e.remove(),1e3)}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>O()):O();var j=new MutationObserver(i=>{for(let t of i)for(let e of t.addedNodes){if(e.nodeType!==Node.ELEMENT_NODE)continue;let s=e;s.matches(A)&&k(s),s.querySelectorAll(A).forEach(n=>k(n))}});j.observe(document.documentElement,{childList:!0,subtree:!0});function b(i,t,e){t/=100,e/=100;let s=a=>(a+i/30)%12,n=t*Math.min(e,1-e),o=a=>e-n*Math.max(-1,Math.min(s(a)-3,9-s(a),1));return{r:Math.round(o(0)*255),g:Math.round(o(8)*255),b:Math.round(o(4)*255)}}function E(i,t,e){i/=255,t/=255,e/=255;let s=Math.max(i,t,e),n=Math.min(i,t,e),o=(s+n)/2,a=0,h=0;if(s!==n){let r=s-n;switch(h=o>.5?r/(2-s-n):r/(s+n),s){case i:a=((t-e)/r+(t<e?6:0))/6;break;case t:a=((e-i)/r+2)/6;break;case e:a=((i-t)/r+4)/6;break}}return{h:Math.round(a*360),s:Math.round(h*100),l:Math.round(o*100)}}function G(i){i=i.replace(/^#/,""),i.length===3&&(i=i[0]+i[0]+i[1]+i[1]+i[2]+i[2]);let t=parseInt(i,16);return{r:t>>16&255,g:t>>8&255,b:t&255}}function K(i,t,e){return"#"+[i,t,e].map(s=>Math.max(0,Math.min(255,Math.round(s))).toString(16).padStart(2,"0")).join("")}function u(i){let{r:t,g:e,b:s}=G(i);return E(t,e,s)}function d(i,t,e){let{r:s,g:n,b:o}=b(i,t,e);return K(s,n,o)}function c(i,t,e){return Math.max(t,Math.min(e,i))}function M(i){return i/=255,i<=.04045?i/12.92:Math.pow((i+.055)/1.055,2.4)}function N(i){let t=i<=.0031308?i*12.92:1.055*Math.pow(i,.4166666666666667)-.055;return Math.round(c(t,0,1)*255)}function z(i,t,e){let s=M(i),n=M(t),o=M(e),a=.4122214708*s+.5363325363*n+.0514459929*o,h=.2119034982*s+.6806995451*n+.1073969566*o,r=.0883024619*s+.2817188376*n+.6299787005*o,l=Math.cbrt(a),p=Math.cbrt(h),m=Math.cbrt(r),w=.2104542553*l+.793617785*p-.0040720468*m,v=1.9779984951*l-2.428592205*p+.4505937099*m,g=.0259040371*l+.7827717662*p-.808675766*m,H=Math.sqrt(v*v+g*g),x=Math.atan2(g,v)*180/Math.PI;return x<0&&(x+=360),H<1e-4&&(x=0),{L:w,C:H,H:x}}function W(i,t,e){let s=e*Math.PI/180,n=t*Math.cos(s),o=t*Math.sin(s),a=i+.3963377774*n+.2158037573*o,h=i-.1055613458*n-.0638541728*o,r=i-.0894841775*n-1.291485548*o,l=a**3,p=h**3,m=r**3,w=4.0767416621*l-3.3077115913*p+.2309699292*m,v=-1.2684380046*l+2.6097574011*p-.3413193965*m,g=-.0041960863*l-.7034186147*p+1.707614701*m;return{r:N(w),g:N(v),b:N(g)}}function L(i,t,e){let s=b(i,t,e);return z(s.r,s.g,s.b)}function I(i,t,e){let{r:s,g:n,b:o}=W(i,t,e);return E(s,n,o)}function X(i,t,e){return d(i,t,e)}function Y(i,t,e){let{r:s,g:n,b:o}=b(i,t,e);return`rgb(${s} ${n} ${o})`}function J(i,t,e){return`hsl(${i}deg ${t}% ${e}%)`}function Q(i,t,e){let{L:s,C:n,H:o}=L(i,t,e);return`oklch(${(s*100).toFixed(1)}% ${n.toFixed(3)} ${o.toFixed(1)}deg)`}function R(i,t,e,s){switch(i){case"rgb":return Y(t,e,s);case"hsl":return J(t,e,s);case"oklch":return Q(t,e,s);default:return X(t,e,s)}}var f=["hex","rgb","hsl","oklch"],Z="hex",S=class extends y{static formAssociated=!0;#d;#r;#a;#w;#C;#o;#n;#v;#i;#A;#p;#u={};#g=Z;#m;#b;#l;#f=!1;#y=!1;#t=0;#e=100;#s=50;#M;constructor(){super(),this.#d=this.attachInternals(),this._adoptInternals(this.#d)}setup(){if(this.#r=this.querySelector(':scope > input[type="color"]'),!this.#r)return!1;let t=this.getAttribute("format");t&&f.includes(t)&&(this.#g=t);let e=this.#r.value||"#000000";this.#M=e;let s=u(e);return this.#t=s.h,this.#e=s.s,this.#s=s.l,this.#r.setAttribute("tabindex","-1"),this.#r.setAttribute("aria-hidden","true"),this.#r.style.cssText="position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;overflow:hidden;",this.#D(),this.#F(),this.#E(),this.#T(),this.#y=F,this.#y&&this.#o.setAttribute("popover","manual"),this.listen(document,"click",this.#W),(this.#r.disabled||this.hasAttribute("disabled"))&&this.setAttribute("data-disabled",""),!0}teardown(){window.removeEventListener("scroll",this.#x,{capture:!0}),window.removeEventListener("resize",this.#x)}#D(){this.#a=document.createElement("button"),this.#a.type="button",this.#a.className="color-trigger",this.#a.setAttribute("aria-haspopup","dialog"),this.#a.setAttribute("aria-expanded","false"),this.#w=document.createElement("span"),this.#w.className="color-swatch",this.#C=document.createElement("span"),this.#C.className="color-hex",this.#a.appendChild(this.#w),this.#a.appendChild(this.#C),this.appendChild(this.#a),this.listen(this.#a,"click",()=>{this.#f?this.#H():this.#z()})}#F(){this.#o=document.createElement("div"),this.#o.className="color-panel",this.#o.setAttribute("role","dialog"),this.#o.setAttribute("aria-label","Color picker"),this.#n=document.createElement("div"),this.#n.className="color-area",this.#n.setAttribute("role","slider"),this.#n.setAttribute("aria-label","Saturation and lightness"),this.#n.setAttribute("tabindex","0"),this.#v=document.createElement("div"),this.#v.className="color-area-thumb",this.#n.appendChild(this.#v),this.#o.appendChild(this.#n);let t=document.createElement("div");t.className="color-hue-wrap",this.#i=document.createElement("div"),this.#i.className="color-hue",this.#i.setAttribute("role","slider"),this.#i.setAttribute("aria-label","Hue"),this.#i.setAttribute("aria-valuemin","0"),this.#i.setAttribute("aria-valuemax","360"),this.#i.setAttribute("tabindex","0"),this.#A=document.createElement("div"),this.#A.className="color-hue-thumb",this.#i.appendChild(this.#A),t.appendChild(this.#i),this.#o.appendChild(t);let e=document.createElement("div");e.className="color-format-row";let s=document.createElement("label");s.className="color-format-label";let n=document.createElement("span");n.textContent="Format",this.#p=document.createElement("select"),this.#p.className="color-format-select";for(let h of f){let r=document.createElement("option");r.value=h,r.textContent=h.toUpperCase(),this.#p.appendChild(r)}this.#p.value=this.#g,s.appendChild(n),s.appendChild(this.#p),e.appendChild(s),this.#o.appendChild(e),this.listen(this.#p,"change",this.#O),this.#u.hex=this.#k("hex",[{label:"Hex",channel:"hex",kind:"text",maxLength:7}]),this.#u.rgb=this.#k("rgb",[{label:"R",channel:"r",kind:"number",min:0,max:255,step:1},{label:"G",channel:"g",kind:"number",min:0,max:255,step:1},{label:"B",channel:"b",kind:"number",min:0,max:255,step:1}]),this.#u.hsl=this.#k("hsl",[{label:"H",channel:"h",kind:"number",min:0,max:360,step:1},{label:"S",channel:"s",kind:"number",min:0,max:100,step:1},{label:"L",channel:"l",kind:"number",min:0,max:100,step:1}]),this.#u.oklch=this.#k("oklch",[{label:"L%",channel:"oL",kind:"number",min:0,max:100,step:.1},{label:"C",channel:"oC",kind:"number",min:0,max:.4,step:.001},{label:"H\xB0",channel:"oH",kind:"number",min:0,max:360,step:.1}]);for(let h of f)this.#o.appendChild(this.#u[h].wrapper);this.#N();let o=this.querySelector(":scope > datalist");if(o){this.#m=document.createElement("div"),this.#m.className="color-swatches",this.#m.setAttribute("role","listbox"),this.#m.setAttribute("aria-label","Preset colors");for(let h of o.querySelectorAll("option[value]")){let r=document.createElement("button");r.type="button",r.setAttribute("role","option"),r.style.background=h.value,r.setAttribute("aria-label",h.textContent||h.value),r.setAttribute("data-color",h.value),this.#m.appendChild(r)}this.#o.appendChild(this.#m),this.listen(this.#m,"click",this.#j)}let a=document.createElement("div");a.className="color-actions","EyeDropper"in window&&(this.#b=document.createElement("button"),this.#b.type="button",this.#b.className="color-eyedropper",this.#b.setAttribute("aria-label","Pick color from screen"),this.#b.textContent="\u{1F4A7}",a.appendChild(this.#b),this.listen(this.#b,"click",this.#G)),this.#l=document.createElement("button"),this.#l.type="button",this.#l.className="color-copy",this.#l.setAttribute("aria-label","Copy hex value"),this.#l.textContent="Copy",a.appendChild(this.#l),this.listen(this.#l,"click",this.#K),this.#o.appendChild(a),this.appendChild(this.#o),this.listen(this.#n,"pointerdown",this.#P),this.listen(this.#n,"keydown",this.#I),this.listen(this.#i,"pointerdown",this.#R),this.listen(this.#i,"keydown",this.#_);for(let h of f){let r=h==="hex"?this.#B:h==="rgb"?this.#U:h==="hsl"?this.#q:this.#V;for(let{el:l}of this.#u[h].inputs)this.listen(l,"change",r)}}#k(t,e){let s=document.createElement("div");s.className=`color-inputs color-inputs-${t}`,s.setAttribute("data-format",t);let n=[];for(let o of e){let a=document.createElement("label");a.className="color-input-label";let h=document.createElement("span");h.textContent=o.label;let r=document.createElement("input");r.type=o.kind,r.setAttribute("data-channel",o.channel),r.setAttribute("autocomplete","off"),r.setAttribute("spellcheck","false"),o.kind==="text"&&o.maxLength&&r.setAttribute("maxlength",String(o.maxLength)),o.kind==="number"&&(r.min=String(o.min),r.max=String(o.max),o.step!=null&&(r.step=String(o.step))),a.appendChild(h),a.appendChild(r),s.appendChild(a),n.push({el:r,channel:o.channel})}return{wrapper:s,inputs:n}}#N(){for(let t of f)this.#u[t].wrapper.hidden=t!==this.#g;this.#l&&this.#l.setAttribute("aria-label",`Copy ${this.#g.toUpperCase()} value`)}#O=()=>{let t=this.#p.value;f.includes(t)&&(this.#g=t,this.#N(),this.#E())};#P=t=>{t.preventDefault(),this.#n.setPointerCapture(t.pointerId),this.#L(t);let e=n=>this.#L(n),s=n=>{this.#n.releasePointerCapture(n.pointerId),this.#n.removeEventListener("pointermove",e),this.#n.removeEventListener("pointerup",s)};this.#n.addEventListener("pointermove",e),this.#n.addEventListener("pointerup",s)};#L(t){let e=this.#n.getBoundingClientRect(),s=c((t.clientX-e.left)/e.width,0,1),n=c((t.clientY-e.top)/e.height,0,1);this.#e=Math.round(s*100),this.#s=Math.round((1-n)*100),this.#c()}#I=t=>{let e=t.shiftKey?10:1;switch(t.key){case"ArrowRight":t.preventDefault(),this.#e=c(this.#e+e,0,100);break;case"ArrowLeft":t.preventDefault(),this.#e=c(this.#e-e,0,100);break;case"ArrowUp":t.preventDefault(),this.#s=c(this.#s+e,0,100);break;case"ArrowDown":t.preventDefault(),this.#s=c(this.#s-e,0,100);break;default:return}this.#c()};#R=t=>{t.preventDefault(),this.#i.setPointerCapture(t.pointerId),this.#S(t);let e=n=>this.#S(n),s=n=>{this.#i.releasePointerCapture(n.pointerId),this.#i.removeEventListener("pointermove",e),this.#i.removeEventListener("pointerup",s)};this.#i.addEventListener("pointermove",e),this.#i.addEventListener("pointerup",s)};#S(t){let e=this.#i.getBoundingClientRect(),s=c((t.clientX-e.left)/e.width,0,1);this.#t=Math.round(s*360),this.#c()}#_=t=>{let e=t.shiftKey?10:1;switch(t.key){case"ArrowRight":case"ArrowUp":t.preventDefault(),this.#t=(this.#t+e)%361;break;case"ArrowLeft":case"ArrowDown":t.preventDefault(),this.#t=(this.#t-e+361)%361;break;default:return}this.#c()};#h(t,e){return this.#u[t].inputs.find(s=>s.channel===e)?.el}#B=()=>{let t=this.#h("hex","hex");if(!t)return;let e=t.value.trim();if(e.startsWith("#")||(e="#"+e),/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(e)){let s=u(e);this.#t=s.h,this.#e=s.s,this.#s=s.l,this.#c()}};#U=()=>{let t=c(Number(this.#h("rgb","r").value)||0,0,255),e=c(Number(this.#h("rgb","g").value)||0,0,255),s=c(Number(this.#h("rgb","b").value)||0,0,255),n=E(t,e,s);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#c()};#q=()=>{let t=c(Number(this.#h("hsl","h").value)||0,0,360)%361,e=c(Number(this.#h("hsl","s").value)||0,0,100),s=c(Number(this.#h("hsl","l").value)||0,0,100);this.#t=t,this.#e=e,this.#s=s,this.#c()};#V=()=>{let t=c(Number(this.#h("oklch","oL").value)||0,0,100)/100,e=c(Number(this.#h("oklch","oC").value)||0,0,.4),s=c(Number(this.#h("oklch","oH").value)||0,0,360),n=I(t,e,s);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#c()};#j=t=>{let e=t.target.closest("button[data-color]");if(!e)return;let s=e.getAttribute("data-color"),n=u(s);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#c()};#G=async()=>{try{let e=await new window.EyeDropper().open(),s=u(e.sRGBHex);this.#t=s.h,this.#e=s.s,this.#s=s.l,this.#c()}catch{}};#K=()=>{let t=R(this.#g,this.#t,this.#e,this.#s);T(t,{button:this.#l,announceMessage:"Color copied"})};#c(t="internal"){this.#E(),this.#T();let e=d(this.#t,this.#e,this.#s),s=b(this.#t,this.#e,this.#s);this.dispatchEvent(new CustomEvent("color-picker:change",{bubbles:!0,detail:{hex:e,rgb:{r:s.r,g:s.g,b:s.b},hsl:{h:this.#t,s:this.#e,l:this.#s},source:t}}))}#E(){let t=d(this.#t,this.#e,this.#s),e=b(this.#t,this.#e,this.#s),s=d(this.#t,100,50);this.#w.style.background=t,this.#C.textContent=t,this.#n.style.setProperty("--area-hue",s),this.#v.style.insetInlineStart=`${this.#e}%`,this.#v.style.insetBlockStart=`${100-this.#s}%`,this.#v.style.background=t,this.#n.setAttribute("aria-valuetext",`Saturation ${this.#e}%, Lightness ${this.#s}%`),this.#A.style.insetInlineStart=`${this.#t/360*100}%`,this.#i.setAttribute("aria-valuenow",String(this.#t)),this.#i.setAttribute("aria-valuetext",`Hue ${this.#t}\xB0`);let n=(a,h,r)=>{let l=this.#h(a,h);l&&(l.value=String(r))};n("hex","hex",t),n("rgb","r",e.r),n("rgb","g",e.g),n("rgb","b",e.b),n("hsl","h",this.#t),n("hsl","s",this.#e),n("hsl","l",this.#s);let o=L(this.#t,this.#e,this.#s);n("oklch","oL",(o.L*100).toFixed(1)),n("oklch","oC",o.C.toFixed(3)),n("oklch","oH",o.H.toFixed(1))}#z(){if(!this.#f){if(this.#f=!0,this.setAttribute("open",""),this.#a.setAttribute("aria-expanded","true"),this.#y){this.#$();try{this.#o.showPopover()}catch{}window.addEventListener("scroll",this.#x,{capture:!0,passive:!0}),window.addEventListener("resize",this.#x,{passive:!0})}requestAnimationFrame(()=>this.#n.focus()),this.dispatchEvent(new CustomEvent("color-picker:open",{bubbles:!0}))}}#H(){if(this.#f){if(this.#f=!1,this.removeAttribute("open"),this.#a.setAttribute("aria-expanded","false"),this.#y){try{this.#o.hidePopover()}catch{}window.removeEventListener("scroll",this.#x,{capture:!0}),window.removeEventListener("resize",this.#x)}this.dispatchEvent(new CustomEvent("color-picker:close",{bubbles:!0}))}}#$(){if(!this.#y)return;let t=this.#a.getBoundingClientRect();this.#o.style.setProperty("--panel-top",`${t.bottom+4}px`),this.#o.style.setProperty("--panel-left",`${t.left}px`)}#x=()=>{this.#f&&this.#$()};#W=t=>{this.#f&&!this.contains(t.target)&&this.#H()};#T(){let t=d(this.#t,this.#e,this.#s);this.#d.setFormValue(t),this.#r.value=t,this.#r.dispatchEvent(new Event("input",{bubbles:!0}))}formResetCallback(){let t=u(this.#M);this.#t=t.h,this.#e=t.s,this.#s=t.l,this.#E(),this.#T()}formStateRestoreCallback(t){if(!t)return;let e=u(t);this.#t=e.h,this.#e=e.s,this.#s=e.l,this.#E(),this.#T()}get value(){return d(this.#t,this.#e,this.#s)}set value(t){if(!/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(t))return;let e=d(this.#t,this.#e,this.#s).toLowerCase(),s=t.toLowerCase();if(e===s||e===s.toLowerCase())return;let n=u(t);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#c("api")}};D("color-picker",S);export{S as ColorPicker};
1
+ var it=window.matchMedia("(prefers-reduced-motion: reduce)");var D=new Map;function F(i,t,e={}){let s=e.priority??10,n={impl:t,bundle:e.bundle,contract:e.contract,priority:s},r=D.get(i);if(customElements.get(i)){if(!r||r.priority>=s){r&&r.priority===s&&r.impl!==t&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=s){r.priority===s&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${r.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}D.set(i,n),customElements.define(i,t)}var E=class extends HTMLElement{#d=[];#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.#d)t();this.#d=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,n){t.addEventListener(e,s,n),this.#d.push(()=>t.removeEventListener(e,s,n))}_reinit(){for(let t of this.#d)t();this.#d=[],this.teardown(),this.removeAttribute("data-upgraded"),this.isConnected&&this.setup()!==!1&&this.setAttribute("data-upgraded","")}setup(){}teardown(){}setState(t,e){this.#n||(this.#n=this.attachInternals());let s=this.#n.states;try{e?s.add(t):s.delete(t)}catch{let n=`--${t}`;e?s.add(n):s.delete(n)}}_adoptInternals(t){this.#n||(this.#n=t)}};var O="popover"in HTMLElement.prototype;var k="[data-copy], [data-copy-target], [data-paste-target]",B="Copied to clipboard",q="Pasted from clipboard",w=new WeakMap;async function T(i,t={}){if(i==null||i==="")return!1;let{button:e,announceMessage:s=B,duration:n=1500}=t;try{await navigator.clipboard.writeText(i)}catch{return!1}return I({button:e,duration:n,announceMessage:s,eventDetail:{text:i}}),!0}function I({button:i,duration:t,announceMessage:e,eventDetail:s,state:n="copied",eventName:r="copy"}){if(i){i.dataset.state=n;let h=w.get(i);h&&clearTimeout(h),w.set(i,setTimeout(()=>{delete i.dataset.state,w.delete(i)},t)),i.dispatchEvent(new CustomEvent(r,{bubbles:!0,detail:s}))}W(e,i??document.body)}async function U(i,t={}){let{button:e,announceMessage:s=q,duration:n=1500}=t,r;try{r=await navigator.clipboard.readText()}catch{return null}return i&&("value"in i&&(i instanceof HTMLInputElement||i instanceof HTMLTextAreaElement||i instanceof HTMLSelectElement)?i.value=r:i.textContent=r,i.dispatchEvent(new Event("input",{bubbles:!0}))),I({button:e,duration:n,announceMessage:s,eventDetail:{text:r},state:"pasted",eventName:"paste"}),r}function P(i=document){i.querySelectorAll(k).forEach(M)}function M(i){i.hasAttribute("data-copy-init")||(i.setAttribute("data-copy-init",""),i.addEventListener("click",()=>{if(i.dataset.pasteTarget){let e=document.querySelector(i.dataset.pasteTarget);if(!e)return;U(e,{button:i});return}let t=V(i);t&&T(t,{button:i})}))}function V(i){if(i.dataset.copy)return i.dataset.copy;if(i.dataset.copyTarget){let t=document.querySelector(i.dataset.copyTarget);if(!t)return"";let e=i.dataset.copyAttr;return e?t.getAttribute(e)??"":t.textContent??""}return""}function W(i,t){let e=document.createElement("div");e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),e.className="visually-hidden",e.textContent=i,t.appendChild(e),setTimeout(()=>e.remove(),1e3)}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>P()):P();var j=new MutationObserver(i=>{for(let t of i)for(let e of t.addedNodes){if(e.nodeType!==Node.ELEMENT_NODE)continue;let s=e;s.matches(k)&&M(s),s.querySelectorAll(k).forEach(n=>M(n))}});j.observe(document.documentElement,{childList:!0,subtree:!0});function b(i,t,e){t/=100,e/=100;let s=h=>(h+i/30)%12,n=t*Math.min(e,1-e),r=h=>e-n*Math.max(-1,Math.min(s(h)-3,9-s(h),1));return{r:Math.round(r(0)*255),g:Math.round(r(8)*255),b:Math.round(r(4)*255)}}function C(i,t,e,s=!1){i/=255,t/=255,e/=255;let n=Math.max(i,t,e),r=Math.min(i,t,e),h=(n+r)/2,o=0,a=0;if(n!==r){let l=n-r;switch(a=h>.5?l/(2-n-r):l/(n+r),n){case i:o=((t-e)/l+(t<e?6:0))/6;break;case t:o=((e-i)/l+2)/6;break;case e:o=((i-t)/l+4)/6;break}}return s?{h:o*360,s:a*100,l:h*100}:{h:Math.round(o*360),s:Math.round(a*100),l:Math.round(h*100)}}function G(i){i=i.replace(/^#/,""),i.length===3&&(i=i[0]+i[0]+i[1]+i[1]+i[2]+i[2]);let t=parseInt(i,16);return{r:t>>16&255,g:t>>8&255,b:t&255}}function K(i,t,e){return"#"+[i,t,e].map(s=>Math.max(0,Math.min(255,Math.round(s))).toString(16).padStart(2,"0")).join("")}function p(i,t=!1){let{r:e,g:s,b:n}=G(i);return C(e,s,n,t)}function m(i,t,e){let{r:s,g:n,b:r}=b(i,t,e);return K(s,n,r)}function c(i,t,e){return Math.max(t,Math.min(e,i))}function N(i){return i/=255,i<=.04045?i/12.92:Math.pow((i+.055)/1.055,2.4)}function L(i){let t=i<=.0031308?i*12.92:1.055*Math.pow(i,.4166666666666667)-.055;return Math.round(c(t,0,1)*255)}function z(i,t,e){let s=N(i),n=N(t),r=N(e),h=.4122214708*s+.5363325363*n+.0514459929*r,o=.2119034982*s+.6806995451*n+.1073969566*r,a=.0883024619*s+.2817188376*n+.6299787005*r,l=Math.cbrt(h),u=Math.cbrt(o),d=Math.cbrt(a),f=.2104542553*l+.793617785*u-.0040720468*d,y=1.9779984951*l-2.428592205*u+.4505937099*d,x=.0259040371*l+.7827717662*u-.808675766*d,H=Math.sqrt(y*y+x*x),A=Math.atan2(x,y)*180/Math.PI;return A<0&&(A+=360),H<1e-4&&(A=0),{L:f,C:H,H:A}}function X(i,t,e){let s=e*Math.PI/180,n=t*Math.cos(s),r=t*Math.sin(s),h=i+.3963377774*n+.2158037573*r,o=i-.1055613458*n-.0638541728*r,a=i-.0894841775*n-1.291485548*r,l=h**3,u=o**3,d=a**3,f=4.0767416621*l-3.3077115913*u+.2309699292*d,y=-1.2684380046*l+2.6097574011*u-.3413193965*d,x=-.0041960863*l-.7034186147*u+1.707614701*d;return{r:L(f),g:L(y),b:L(x)}}function S(i,t,e){let s=b(i,t,e);return z(s.r,s.g,s.b)}function R(i,t,e,s=!1){let{r:n,g:r,b:h}=X(i,t,e);return C(n,r,h,s)}function Y(i,t,e){return m(i,t,e)}function J(i,t,e){let{r:s,g:n,b:r}=b(i,t,e);return`rgb(${s} ${n} ${r})`}function Q(i,t,e){return`hsl(${Math.round(i)}deg ${Math.round(t)}% ${Math.round(e)}%)`}function Z(i,t,e){let{L:s,C:n,H:r}=S(i,t,e);return`oklch(${(s*100).toFixed(1)}% ${n.toFixed(3)} ${r.toFixed(1)}deg)`}function _(i,t,e,s){switch(i){case"rgb":return J(t,e,s);case"hsl":return Q(t,e,s);case"oklch":return Z(t,e,s);default:return Y(t,e,s)}}var v=["hex","rgb","hsl","oklch"],tt="hex",et=/^#[0-9a-fA-F]{6}$/,g=8,st=0,$=class extends E{static formAssociated=!0;#d;#n;#i;#w;#v;#g;#a;#r;#y;#o;#k;#b;#m={};#x=tt;#c;#f;#u;#p=!1;#E=!1;#H=!1;#S=`cp${++st}`;#t=0;#e=100;#s=50;#M;static get observedAttributes(){return["disabled"]}constructor(){super(),this.#d=this.attachInternals(),this._adoptInternals(this.#d)}setup(){if(this.#n=this.querySelector(':scope > input[type="color"]'),!this.#n)return!1;if(!this.#H){let s=this.getAttribute("format");s&&v.includes(s)&&(this.#x=s),this.#H=!0}if(this.#M===void 0){let s=this.#n.defaultValue;this.#M=et.test(s)?s.toLowerCase():this.#n.value||"#000000"}let t=p(this.#n.value||this.#M,!0);this.#t=t.h,this.#e=t.s,this.#s=t.l;let e=this.#n.getAttribute("name");return e&&(this.hasAttribute("name")||this.setAttribute("name",e),this.#n.removeAttribute("name")),this.#n.hasAttribute("disabled")&&(this.#n.removeAttribute("disabled"),this.hasAttribute("disabled")||this.setAttribute("disabled","")),this.#n.setAttribute("tabindex","-1"),this.#n.setAttribute("aria-hidden","true"),this.#n.style.cssText="position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;overflow:hidden;",this.listen(this.#n,"click",this.#I),this.#_(),this.#B(),this.#C(),this.#L(),this.#E=O,this.#E&&this.#a.setAttribute("popover","manual"),this.listen(document,"click",this.#tt),this.listen(this,"keydown",this.#R),this.#$(this.matches(":disabled")),!0}teardown(){this.#p=!1,this.removeAttribute("open"),window.removeEventListener("scroll",this.#A,{capture:!0}),window.removeEventListener("resize",this.#A),this.#i?.remove(),this.#a?.remove()}attributeChangedCallback(t){t==="disabled"&&this.#i&&this.#$(this.matches(":disabled"))}formDisabledCallback(t){this.#i&&this.#$(t)}#$(t){this.#i.disabled=t,t&&this.#N()}#I=t=>{t.preventDefault(),this.#i.disabled||this.#i.focus()};#R=t=>{t.key!=="Escape"||!this.#p||(t.preventDefault(),t.stopPropagation(),this.#N(),this.#i.focus())};#_(){this.#i=document.createElement("button"),this.#i.type="button",this.#i.className="color-trigger",this.#i.setAttribute("aria-haspopup","dialog"),this.#i.setAttribute("aria-expanded","false"),this.#w=document.createElement("span"),this.#w.className="color-swatch",this.#v=document.createElement("span"),this.#v.className="color-hex",this.#v.id=`${this.#S}-value`,this.#i.appendChild(this.#w),this.#i.appendChild(this.#v);let t=[];for(let e of Array.from(this.#n.labels||[]))e.id||(e.id=`${this.#S}-label-${t.length}`),t.push(e.id);t.length===0&&(this.#g=document.createElement("span"),this.#g.className="visually-hidden",this.#g.id=`${this.#S}-name`,this.#g.textContent=this.#n.getAttribute("aria-label")||this.getAttribute("aria-label")||"Color",this.#i.prepend(this.#g),t.push(this.#g.id)),this.#i.setAttribute("aria-labelledby",[...t,this.#v.id].join(" ")),this.appendChild(this.#i),this.listen(this.#i,"click",()=>{this.#p?this.#N():this.#Z()})}#B(){this.#c=void 0,this.#f=void 0,this.#a=document.createElement("div"),this.#a.className="color-panel",this.#a.setAttribute("role","dialog"),this.#a.setAttribute("aria-label","Color picker"),this.#r=document.createElement("div"),this.#r.className="color-area",this.#r.setAttribute("role","slider"),this.#r.setAttribute("aria-label","Saturation and lightness"),this.#r.setAttribute("aria-valuemin","0"),this.#r.setAttribute("aria-valuemax","100"),this.#r.setAttribute("tabindex","0"),this.#y=document.createElement("div"),this.#y.className="color-area-thumb",this.#r.appendChild(this.#y),this.#a.appendChild(this.#r);let t=document.createElement("div");t.className="color-hue-wrap",this.#o=document.createElement("div"),this.#o.className="color-hue",this.#o.setAttribute("role","slider"),this.#o.setAttribute("aria-label","Hue"),this.#o.setAttribute("aria-valuemin","0"),this.#o.setAttribute("aria-valuemax","360"),this.#o.setAttribute("tabindex","0"),this.#k=document.createElement("div"),this.#k.className="color-hue-thumb",this.#o.appendChild(this.#k),t.appendChild(this.#o),this.#a.appendChild(t);let e=document.createElement("div");e.className="color-format-row";let s=document.createElement("label");s.className="color-format-label";let n=document.createElement("span");n.textContent="Format",this.#b=document.createElement("select"),this.#b.className="color-format-select";for(let o of v){let a=document.createElement("option");a.value=o,a.textContent=o.toUpperCase(),this.#b.appendChild(a)}this.#b.value=this.#x,s.appendChild(n),s.appendChild(this.#b),e.appendChild(s),this.#a.appendChild(e),this.listen(this.#b,"change",this.#q),this.#m.hex=this.#T("hex",[{label:"Hex",channel:"hex",kind:"text",maxLength:7}]),this.#m.rgb=this.#T("rgb",[{label:"R",channel:"r",kind:"number",min:0,max:255,step:1},{label:"G",channel:"g",kind:"number",min:0,max:255,step:1},{label:"B",channel:"b",kind:"number",min:0,max:255,step:1}]),this.#m.hsl=this.#T("hsl",[{label:"H",channel:"h",kind:"number",min:0,max:360,step:1},{label:"S",channel:"s",kind:"number",min:0,max:100,step:1},{label:"L",channel:"l",kind:"number",min:0,max:100,step:1}]),this.#m.oklch=this.#T("oklch",[{label:"L%",channel:"oL",kind:"number",min:0,max:100,step:.1},{label:"C",channel:"oC",kind:"number",min:0,max:.4,step:.001},{label:"H\xB0",channel:"oH",kind:"number",min:0,max:360,step:.1}]);for(let o of v)this.#a.appendChild(this.#m[o].wrapper);this.#D();let r=this.querySelector(":scope > datalist");if(r){this.#c=document.createElement("div"),this.#c.className="color-swatches",this.#c.setAttribute("role","group"),this.#c.setAttribute("aria-label","Preset colors");for(let o of r.querySelectorAll("option[value]")){let a=document.createElement("button");a.type="button",a.setAttribute("aria-pressed","false"),a.style.background=o.value,a.setAttribute("aria-label",o.textContent||o.value),a.setAttribute("data-color",o.value),this.#c.appendChild(a)}this.#a.appendChild(this.#c),this.listen(this.#c,"click",this.#Y)}let h=document.createElement("div");h.className="color-actions","EyeDropper"in window&&(this.#f=document.createElement("button"),this.#f.type="button",this.#f.className="color-eyedropper",this.#f.setAttribute("aria-label","Pick color from screen"),this.#f.textContent="\u{1F4A7}",h.appendChild(this.#f),this.listen(this.#f,"click",this.#J)),this.#u=document.createElement("button"),this.#u.type="button",this.#u.className="color-copy",this.#u.setAttribute("aria-label","Copy hex value"),this.#u.textContent="Copy",h.appendChild(this.#u),this.listen(this.#u,"click",this.#Q),this.#a.appendChild(h),this.appendChild(this.#a),this.listen(this.#r,"pointerdown",this.#U),this.listen(this.#r,"keydown",this.#V),this.listen(this.#o,"pointerdown",this.#W),this.listen(this.#o,"keydown",this.#j);for(let o of v){let a=o==="hex"?this.#G:o==="rgb"?this.#K:o==="hsl"?this.#z:this.#X;for(let{el:l}of this.#m[o].inputs)this.listen(l,"change",a)}}#T(t,e){let s=document.createElement("div");s.className=`color-inputs color-inputs-${t}`,s.setAttribute("data-format",t);let n=[];for(let r of e){let h=document.createElement("label");h.className="color-input-label";let o=document.createElement("span");o.textContent=r.label;let a=document.createElement("input");a.type=r.kind,a.setAttribute("data-channel",r.channel),a.setAttribute("autocomplete","off"),a.setAttribute("spellcheck","false"),r.kind==="text"&&r.maxLength&&a.setAttribute("maxlength",String(r.maxLength)),r.kind==="number"&&(a.min=String(r.min),a.max=String(r.max),r.step!=null&&(a.step=String(r.step))),h.appendChild(o),h.appendChild(a),s.appendChild(h),n.push({el:a,channel:r.channel})}return{wrapper:s,inputs:n}}#D(){for(let t of v)this.#m[t].wrapper.hidden=t!==this.#x;this.#u&&this.#u.setAttribute("aria-label",`Copy ${this.#x.toUpperCase()} value`)}#q=()=>{let t=this.#b.value;v.includes(t)&&(this.#x=t,this.#D(),this.#C())};#U=t=>{t.preventDefault(),this.#r.setPointerCapture(t.pointerId),this.#F(t);let e=n=>this.#F(n),s=n=>{this.#r.releasePointerCapture(n.pointerId),this.#r.removeEventListener("pointermove",e),this.#r.removeEventListener("pointerup",s)};this.#r.addEventListener("pointermove",e),this.#r.addEventListener("pointerup",s)};#F(t){let e=this.#r.getBoundingClientRect(),s=c((t.clientX-e.left)/e.width,0,1),n=c((t.clientY-e.top)/e.height,0,1);this.#e=Math.round(s*100),this.#s=Math.round((1-n)*100),this.#l("pointer")}#V=t=>{let e=t.shiftKey?10:1;switch(this.#e=Math.round(this.#e),this.#s=Math.round(this.#s),t.key){case"ArrowRight":t.preventDefault(),this.#e=c(this.#e+e,0,100);break;case"ArrowLeft":t.preventDefault(),this.#e=c(this.#e-e,0,100);break;case"ArrowUp":t.preventDefault(),this.#s=c(this.#s+e,0,100);break;case"ArrowDown":t.preventDefault(),this.#s=c(this.#s-e,0,100);break;default:return}this.#l("keyboard")};#W=t=>{t.preventDefault(),this.#o.setPointerCapture(t.pointerId),this.#O(t);let e=n=>this.#O(n),s=n=>{this.#o.releasePointerCapture(n.pointerId),this.#o.removeEventListener("pointermove",e),this.#o.removeEventListener("pointerup",s)};this.#o.addEventListener("pointermove",e),this.#o.addEventListener("pointerup",s)};#O(t){let e=this.#o.getBoundingClientRect(),s=c((t.clientX-e.left)/e.width,0,1);this.#t=Math.round(s*360),this.#l("pointer")}#j=t=>{let e=t.shiftKey?10:1;switch(this.#t=Math.round(this.#t),t.key){case"ArrowRight":case"ArrowUp":t.preventDefault(),this.#t=(this.#t+e)%361;break;case"ArrowLeft":case"ArrowDown":t.preventDefault(),this.#t=(this.#t-e+361)%361;break;default:return}this.#l("keyboard")};#h(t,e){return this.#m[t].inputs.find(s=>s.channel===e)?.el}#G=()=>{let t=this.#h("hex","hex");if(!t)return;let e=t.value.trim();if(e.startsWith("#")||(e="#"+e),/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(e)){let s=p(e,!0);this.#t=s.h,this.#e=s.s,this.#s=s.l,this.#l()}};#K=()=>{let t=c(Number(this.#h("rgb","r").value)||0,0,255),e=c(Number(this.#h("rgb","g").value)||0,0,255),s=c(Number(this.#h("rgb","b").value)||0,0,255),n=C(t,e,s,!0);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#l()};#z=()=>{let t=c(Number(this.#h("hsl","h").value)||0,0,360)%361,e=c(Number(this.#h("hsl","s").value)||0,0,100),s=c(Number(this.#h("hsl","l").value)||0,0,100);this.#t=t,this.#e=e,this.#s=s,this.#l()};#X=()=>{let t=c(Number(this.#h("oklch","oL").value)||0,0,100)/100,e=c(Number(this.#h("oklch","oC").value)||0,0,.4),s=c(Number(this.#h("oklch","oH").value)||0,0,360),n=R(t,e,s,!0);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#l()};#Y=t=>{let e=t.target.closest("button[data-color]");if(!e)return;let s=e.getAttribute("data-color"),n=p(s,!0);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#l()};#J=async()=>{try{let e=await new window.EyeDropper().open(),s=p(e.sRGBHex,!0);this.#t=s.h,this.#e=s.s,this.#s=s.l,this.#l()}catch{}};#Q=()=>{let t=_(this.#x,this.#t,this.#e,this.#s);T(t,{button:this.#u,announceMessage:"Color copied"})};#l(t="internal"){this.#C(),this.#L();let e=m(this.#t,this.#e,this.#s),s=b(this.#t,this.#e,this.#s);this.dispatchEvent(new CustomEvent("color-picker:change",{bubbles:!0,detail:{hex:e,rgb:{r:s.r,g:s.g,b:s.b},hsl:{h:Math.round(this.#t),s:Math.round(this.#e),l:Math.round(this.#s)},source:t}}))}#C(){let t=m(this.#t,this.#e,this.#s),e=b(this.#t,this.#e,this.#s),s=m(this.#t,100,50);this.#w.style.background=t,this.#v.textContent=t,this.#r.style.setProperty("--area-hue",s),this.#y.style.left=`${this.#e}%`,this.#y.style.top=`${100-this.#s}%`,this.#y.style.background=t;let n=Math.round(this.#t),r=Math.round(this.#e),h=Math.round(this.#s);this.#r.setAttribute("aria-valuenow",String(r)),this.#r.setAttribute("aria-valuetext",`Saturation ${r}%, lightness ${h}%`),this.#k.style.left=`${this.#t/360*100}%`,this.#o.setAttribute("aria-valuenow",String(n)),this.#o.setAttribute("aria-valuetext",`Hue ${n}\xB0`);let o=(l,u,d)=>{let f=this.#h(l,u);f&&(f.value=String(d))};o("hex","hex",t),o("rgb","r",e.r),o("rgb","g",e.g),o("rgb","b",e.b),o("hsl","h",n),o("hsl","s",r),o("hsl","l",h);let a=S(this.#t,this.#e,this.#s);if(o("oklch","oL",(a.L*100).toFixed(1)),o("oklch","oC",a.C.toFixed(3)),o("oklch","oH",a.H.toFixed(1)),this.#c)for(let l of this.#c.querySelectorAll("button[data-color]")){let u=(l.getAttribute("data-color")||"").toLowerCase()===t.toLowerCase();l.setAttribute("aria-pressed",String(u))}}#Z(){if(!(this.#p||this.#i.disabled)){if(this.#p=!0,this.setAttribute("open",""),this.#i.setAttribute("aria-expanded","true"),this.#E){try{this.#a.showPopover()}catch{}this.#P(),window.addEventListener("scroll",this.#A,{capture:!0,passive:!0}),window.addEventListener("resize",this.#A,{passive:!0})}requestAnimationFrame(()=>this.#r.focus()),this.dispatchEvent(new CustomEvent("color-picker:open",{bubbles:!0}))}}#N(){if(this.#p){if(this.#p=!1,this.removeAttribute("open"),this.#i.setAttribute("aria-expanded","false"),this.#E){try{this.#a.hidePopover()}catch{}window.removeEventListener("scroll",this.#A,{capture:!0}),window.removeEventListener("resize",this.#A)}this.dispatchEvent(new CustomEvent("color-picker:close",{bubbles:!0}))}}#P(){if(!this.#E)return;let t=this.#i.getBoundingClientRect(),e=this.#a.offsetWidth,s=this.#a.offsetHeight,n=document.documentElement.clientWidth,r=document.documentElement.clientHeight,o=getComputedStyle(this).direction==="rtl"?t.right-e:t.left;o=Math.min(o,n-e-g),o=Math.max(o,g);let a=t.bottom+4;a+s>r-g&&t.top-s-4>=g&&(a=t.top-s-4),a=Math.max(g,Math.min(a,r-s-g)),this.#a.style.setProperty("--panel-top",`${Math.round(a)}px`),this.#a.style.setProperty("--panel-left",`${Math.round(o)}px`)}#A=()=>{this.#p&&this.#P()};#tt=t=>{this.#p&&!this.contains(t.target)&&this.#N()};#L(){let t=m(this.#t,this.#e,this.#s);this.#d.setFormValue(t),this.#n.value=t,this.#n.dispatchEvent(new Event("input",{bubbles:!0}))}formResetCallback(){if(!this.#i)return;let t=p(this.#M,!0);this.#t=t.h,this.#e=t.s,this.#s=t.l,this.#C(),this.#L()}formStateRestoreCallback(t){if(!t||!this.#i)return;let e=p(t,!0);this.#t=e.h,this.#e=e.s,this.#s=e.l,this.#C(),this.#L()}get value(){return m(this.#t,this.#e,this.#s)}set value(t){if(!/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(t))return;let e=m(this.#t,this.#e,this.#s).toLowerCase(),s=t.toLowerCase();if(e===s||e===s.toLowerCase())return;let n=p(t,!0);this.#t=n.h,this.#e=n.s,this.#s=n.l,this.#l("api")}};F("color-picker",$);export{$ as ColorPicker};
2
2
  //# sourceMappingURL=color-picker.js.map
@@ -1,2 +1,2 @@
1
- var y=window.matchMedia("(prefers-reduced-motion: reduce)");var p=new Map;function c(h,t,e={}){let s=e.priority??10,o={impl:t,bundle:e.bundle,contract:e.contract,priority:s},i=p.get(h);if(customElements.get(h)){if(!i||i.priority>=s){i&&i.priority===s&&i.impl!==t&&console.warn(`[VB Bundle] Tag <${h}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${h}> 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 <${h}> already registered by "${i.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}p.set(h,o),customElements.define(h,t)}var l=class extends HTMLElement{#e=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#e)t();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,o){t.addEventListener(e,s,o),this.#e.push(()=>t.removeEventListener(e,s,o))}setup(){}teardown(){}setState(t,e){this.#t||(this.#t=this.attachInternals());let s=this.#t.states;try{e?s.add(t):s.delete(t)}catch{let o=`--${t}`;e?s.add(o):s.delete(o)}}_adoptInternals(t){this.#t||(this.#t=t)}};function b(h,t,e){"role"in ElementInternals.prototype?t.role=e:h.setAttribute("role",e)}var u=CSS.supports("anchor-name","--x"),v=CSS.supports("position-area","bottom"),g=0,d=class extends l{#e=null;#t=null;#i=null;#s=null;setup(){this.id||(this.id=`pop-over-${++g}`);let t=this.dataset.mode||"auto";this.hasAttribute("popover")||this.setAttribute("popover",t),this.#c(),this.#a(),this.#i=e=>{let s=e.newState==="open"?"show":"hide";this.dispatchEvent(new CustomEvent(`pop-over:${s}`,{detail:{state:e.newState},bubbles:!0,composed:!0})),!u&&e.newState==="open"&&this.#e&&this.#o()},this.listen(this,"beforetoggle",this.#i),u||(this.#s=()=>{this.matches(":popover-open")&&this.#e&&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")}#c(){let t=this.dataset.anchor;t?this.#e=document.getElementById(t)||document.querySelector(t):this.#e=document.querySelector(`[popovertarget="${CSS.escape(this.id)}"]`)}#a(){if(!(!this.#e||!u)&&(this.#t=`--pop-over-anchor-${this.id}`,this.#e.style.setProperty("anchor-name",this.#t),this.style.setProperty("position-anchor",this.#t),this.setAttribute("data-anchor-name",this.#t||""),!v)){let t=this.dataset.position||"bottom";this.#l(t)}}#l(t){let e="var(--_pop-over-offset, var(--size-xs))",s={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)"}},o=t.split("-")[0],i=s[o]||s.bottom;Object.entries(i).forEach(([n,r])=>this.style.setProperty(n,r))}#o(){if(!this.#e)return;let t=this.#e.getBoundingClientRect(),e=this.dataset.position||"bottom",s=this.#n(),o,i;switch(e.split("-")[0]){case"top":o=t.top-this.offsetHeight-s,i=t.left;break;case"left":o=t.top,i=t.left-this.offsetWidth-s;break;case"right":o=t.top,i=t.right+s;break;default:o=t.bottom+s,i=t.left;break}e.endsWith("-end")&&(e.startsWith("top")||e.startsWith("bottom")?i=t.right-this.offsetWidth:o=t.bottom-this.offsetHeight),this.style.position="fixed",this.style.top=`${Math.round(o)}px`,this.style.left=`${Math.round(i)}px`,this.style.margin="0"}#n(){let t={none:0,xs:4,s:8,m:16,l:24};return t[this.dataset.offset]??t.xs}};c("pop-over",d);var A=0,f=class extends l{static formAssociated=!0;#e;#t;#i;#s;#c=[];#a=[];#l=-1;#o=!1;#n="";#f="";#w="";#p;#A;#r=[];constructor(){super(),this.#e=this.attachInternals(),this._adoptInternals(this.#e)}get#h(){return this.hasAttribute("multiple")}setup(){let t=this.querySelector(":scope > input")||this.querySelector(":scope > .tags-input-area > input");if(!t)return!1;this.#t=t;let e=this.querySelector("ul, ol");if(!e)return!1;if(this.#i=e,this.#h){let r=this.querySelector(":scope > .tags-input-area");if(!r){r=document.createElement("div"),r.className="tags-input-area";let m=this.querySelector(":scope > pop-over[data-combobox-host]")||this.#i;this.insertBefore(r,m)}this.#p=r,this.#t.parentNode!==this.#p&&this.#p.appendChild(this.#t);let a=this.querySelector(":scope > [data-combobox-live]");a||(a=document.createElement("div"),a.setAttribute("aria-live","polite"),a.setAttribute("aria-atomic","true"),a.setAttribute("data-combobox-live",""),a.className="visually-hidden",this.appendChild(a)),this.#A=a}let s=this.getAttribute("placeholder");s&&!this.#t.getAttribute("placeholder")&&this.#t.setAttribute("placeholder",s);let o=`cb${++A}`;this.#i.id||(this.#i.id=`combobox-listbox-${o}`),b(this.#t,this.#e,"combobox"),this.#t.setAttribute("aria-expanded","false"),this.#t.setAttribute("aria-autocomplete","list"),this.#t.setAttribute("aria-controls",this.#i.id),this.#t.setAttribute("autocomplete","off"),this.#i.setAttribute("role","listbox"),this.#h&&this.#i.setAttribute("aria-multiselectable","true");let i=this.#h?this.#p:this.#t;i.id||(i.id=`combobox-anchor-${o}`);let n=this.querySelector(":scope > pop-over[data-combobox-host]");if(n?this.#s=n:(this.#s=document.createElement("pop-over"),this.#s.setAttribute("data-combobox-host",""),this.#s.id=`combobox-pop-${o}`,this.#s.dataset.mode="manual",this.#s.dataset.position="bottom-start",this.#s.dataset.anchor=i.id,this.#s.appendChild(this.#i),this.appendChild(this.#s)),this.#s.dataset.anchor=i.id,this.#i.parentElement!==this.#s&&this.#s.appendChild(this.#i),this.#M(),!this.#h){let r=this.getAttribute("value");r&&this.#g(r,!1),this.#w=this.#n}return this.listen(this.#t,"input",this.#V),this.listen(this.#t,"keydown",this.#D),this.listen(this.#t,"focus",this.#P),this.listen(this.#t,"click",this.#B),this.listen(this.#i,"click",this.#T),this.listen(this.#i,"pointerdown",this.#F),this.listen(document,"click",this.#I),this.listen(this.#s,"pop-over:hide",this.#N),this.#u(),this.#d(),this.#b(),!0}teardown(){}#M(){this.#c=Array.from(this.#i.querySelectorAll(":scope > li[data-value]")),this.#c.forEach((t,e)=>{t.setAttribute("role","option"),t.setAttribute("aria-selected","false"),t.id||(t.id=`${this.#i.id}-option-${e}`)}),this.#a=[...this.#c]}#y(t,e){if(this.#r.some(r=>r.value===t))return;let s=this.#$();if(s&&this.#r.length>=s)return;this.#r.push({value:t,label:e});let o=document.createElement("span");o.className="tag",o.dataset.value=t,o.textContent=e+" ";let i=document.createElement("button");i.type="button",i.setAttribute("aria-label",`Remove ${e}`),i.innerHTML="&times;",i.addEventListener("click",r=>{r.stopPropagation(),this.#k(t)}),o.appendChild(i),this.#p.insertBefore(o,this.#t);let n=this.#c.find(r=>r.getAttribute("data-value")===t);n&&n.setAttribute("aria-selected","true"),this.#S(`${e} added`),this.#t.value="",this.#m(""),this.#u(),this.#d(),this.#q(),s&&this.#r.length>=s&&(this.#t.disabled=!0,this.#b())}#k(t){let e=this.#r.findIndex(r=>r.value===t);if(e===-1)return;let s=this.#r.splice(e,1)[0],o=this.#p.querySelector(`.tag[data-value="${CSS.escape(t)}"]`);o&&o.remove();let i=this.#c.find(r=>r.getAttribute("data-value")===t);i&&i.setAttribute("aria-selected","false"),this.#S(`${s.label} removed`),this.#$()&&this.#t.disabled&&(this.#t.disabled=!1),this.#m(this.#t.value.trim()),this.#u(),this.#d(),this.#q(),this.#t.focus()}#$(){let t=this.getAttribute("max");return t?parseInt(t,10):0}#S(t){this.#A&&(this.#A.textContent="",requestAnimationFrame(()=>{this.#A.textContent=t}))}#V=()=>{let t=this.#t.value.trim();if(!this.#h&&this.#n){let e=this.#i.querySelector('[aria-selected="true"]');e&&e.setAttribute("aria-selected","false"),this.#n="",this.#f="",this.removeAttribute("value"),this.#u(),this.#d()}this.#m(t),this.#v()};#D=t=>{switch(t.key){case"ArrowDown":t.preventDefault(),this.#o||this.#v(),this.#E(this.#l+1);break;case"ArrowUp":t.preventDefault(),this.#o||this.#v(),this.#E(this.#l-1);break;case"Home":this.#o&&(t.preventDefault(),this.#E(0));break;case"End":this.#o&&(t.preventDefault(),this.#E(this.#a.length-1));break;case"Enter":if(t.preventDefault(),this.#o&&this.#l>=0&&this.#a[this.#l]){let e=this.#a[this.#l];this.#h?this.#y(e.getAttribute("data-value"),e.textContent.trim()):this.#C(e)}else if(this.#h&&this.hasAttribute("custom")&&this.#t.value.trim()){let e=this.#t.value.trim();this.#y(e,e)}break;case"Backspace":if(this.#h&&!this.#t.value&&this.#r.length>0){let e=this.#r[this.#r.length-1];this.#k(e.value)}break;case",":if(this.#h&&this.hasAttribute("custom")&&this.#t.value.trim()){t.preventDefault();let e=this.#t.value.trim();this.#y(e,e)}break;case"Escape":this.#o&&(t.preventDefault(),t.stopPropagation(),this.#b(),this.#t.focus());break;case"Tab":this.#o&&this.#b();break}};#P=()=>{this.#h?(this.#m(this.#t.value.trim()),this.#v()):(this.#t.value||!this.#n)&&(this.#m(this.#t.value.trim()),this.#v())};#B=()=>{this.#o||(this.#m(this.#t.value.trim()),this.#v())};#T=t=>{let e=t.target.closest("li[data-value]");e&&this.#a.includes(e)&&(this.#h?this.#y(e.getAttribute("data-value"),e.textContent.trim()):this.#C(e))};#F=t=>{t.preventDefault()};#I=t=>{this.#o&&!this.contains(t.target)&&this.#b()};#m(t){let e=this.getAttribute("filter")||"contains",s=t.toLowerCase(),o=this.#h?new Set(this.#r.map(i=>i.value)):null;this.#a=[],this.#c.forEach(i=>{let n=i.getAttribute("data-value"),r=i.textContent.trim().toLowerCase();if(o&&o.has(n)){i.hidden=!0;return}let a;t?e==="startsWith"?a=r.startsWith(s):a=r.includes(s):a=!0,i.hidden=!a,a&&this.#a.push(i)}),this.#l=-1,this.#x(),this.setState("no-matches",this.#a.length===0)}#E(t){if(this.#a.length===0)return;t<0&&(t=this.#a.length-1),t>=this.#a.length&&(t=0),this.#l>=0&&this.#a[this.#l]&&this.#a[this.#l].removeAttribute("data-active"),this.#l=t;let e=this.#a[t];e.setAttribute("data-active",""),e.scrollIntoView({block:"nearest"}),this.#t.setAttribute("aria-activedescendant",e.id)}#x(){this.#c.forEach(t=>t.removeAttribute("data-active")),this.#t.removeAttribute("aria-activedescendant")}#C(t,e="internal"){let s=t.getAttribute("data-value")||"",o=t.textContent.trim();this.#n!==s&&(this.#c.forEach(i=>i.setAttribute("aria-selected","false")),t.setAttribute("aria-selected","true"),this.#n=s,this.#f=o,this.#t.value=o,this.setAttribute("value",s),this.#u(),this.#d(),this.#b(),this.#t.focus(),this.dispatchEvent(new CustomEvent("combo-box:change",{bubbles:!0,detail:{value:s,label:o,source:e}})))}#g(t,e=!0,s="api"){let o=this.#c.find(i=>i.getAttribute("data-value")===t);o&&(e?this.#C(o,s):(o.setAttribute("aria-selected","true"),this.#n=t,this.#f=o.textContent.trim(),this.#t.value=this.#f,this.setAttribute("value",t)))}#v(){this.#o||(this.#o=!0,this.setAttribute("open",""),this.#t.setAttribute("aria-expanded","true"),this.#s?.show(),this.dispatchEvent(new CustomEvent("combo-box:open",{bubbles:!0})))}#b(){this.#o&&(this.#o=!1,this.removeAttribute("open"),this.#t.setAttribute("aria-expanded","false"),this.#l=-1,this.#x(),this.#s?.hide(),this.dispatchEvent(new CustomEvent("combo-box:close",{bubbles:!0})))}#N=()=>{this.#o&&(this.#o=!1,this.removeAttribute("open"),this.#t.setAttribute("aria-expanded","false"),this.#l=-1,this.#x(),this.dispatchEvent(new CustomEvent("combo-box:close",{bubbles:!0})))};#u(){if(this.#h)if(this.#r.length>0){let t=new FormData,e=this.getAttribute("name")||"";for(let s of this.#r)t.append(e,s.value);this.#e.setFormValue(t)}else this.#e.setFormValue(null);else this.#n?this.#e.setFormValue(this.#n,this.#f):this.#e.setFormValue(null)}#d(){this.hasAttribute("required")?this.#h?this.#r.length===0?this.#e.setValidity({valueMissing:!0},"Please select at least one option",this.#t):this.#e.setValidity({}):this.#n?this.#e.setValidity({}):this.#e.setValidity({valueMissing:!0},"Please select an option",this.#t):this.#e.setValidity({})}#q(){this.dispatchEvent(new CustomEvent("combo-box:change",{bubbles:!0,detail:{values:this.#r.map(t=>t.value),labels:this.#r.map(t=>t.label)}}))}formResetCallback(){this.#h?(this.#p.querySelectorAll(".tag").forEach(t=>t.remove()),this.#r=[],this.#t.value="",this.#t.disabled=!1):(this.#n="",this.#f="",this.#t.value="",this.removeAttribute("value")),this.#c.forEach(t=>{t.setAttribute("aria-selected","false"),t.hidden=!1}),this.#a=[...this.#c],this.#l=-1,this.#x(),this.#b(),!this.#h&&this.#w&&this.#g(this.#w,!1),this.#u(),this.#d()}formStateRestoreCallback(t){t&&(this.#h||(this.#g(t,!1),this.#u(),this.#d()))}get value(){return this.#n}set value(t){t?this.#g(t):(this.#c.forEach(e=>e.setAttribute("aria-selected","false")),this.#n="",this.#f="",this.#t.value="",this.removeAttribute("value"),this.#u(),this.#d())}get label(){return this.#f}get values(){return this.#r.map(t=>t.value)}get labels(){return this.#r.map(t=>t.label)}static get observedAttributes(){return["value"]}attributeChangedCallback(t,e,s){t==="value"&&this.#t&&s!==this.#n&&s&&(this.#g(s,!1),this.#u(),this.#d())}};c("combo-box",f);export{f as ComboBox};
1
+ var y=window.matchMedia("(prefers-reduced-motion: reduce)");var b=new Map;function u(n,t,e={}){let i=e.priority??10,o={impl:t,bundle:e.bundle,contract:e.contract,priority:i},s=b.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}b.set(n,o),customElements.define(n,t)}var c=class extends HTMLElement{#e=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#e)t();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,i,o){t.addEventListener(e,i,o),this.#e.push(()=>t.removeEventListener(e,i,o))}_reinit(){for(let t of this.#e)t();this.#e=[],this.teardown(),this.removeAttribute("data-upgraded"),this.isConnected&&this.setup()!==!1&&this.setAttribute("data-upgraded","")}setup(){}teardown(){}setState(t,e){this.#t||(this.#t=this.attachInternals());let i=this.#t.states;try{e?i.add(t):i.delete(t)}catch{let o=`--${t}`;e?i.add(o):i.delete(o)}}_adoptInternals(t){this.#t||(this.#t=t)}};var d=CSS.supports("anchor-name","--x"),v=CSS.supports("position-area","bottom"),g=0,f=class extends c{#e=null;#t=null;#o=null;#i=null;setup(){this.id||(this.id=`pop-over-${++g}`);let t=this.dataset.mode||"auto";this.hasAttribute("popover")||this.setAttribute("popover",t),this.#l(),this.#r(),this.#o=e=>{let i=e.newState==="open"?"show":"hide";this.dispatchEvent(new CustomEvent(`pop-over:${i}`,{detail:{state:e.newState},bubbles:!0,composed:!0})),!d&&e.newState==="open"&&this.#e&&this.#a()},this.listen(this,"beforetoggle",this.#o),d||(this.#i=()=>{this.matches(":popover-open")&&this.#e&&this.#a()},this.listen(window,"resize",this.#i),this.listen(window,"scroll",this.#i,{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")}#l(){let t=this.dataset.anchor;t?this.#e=document.getElementById(t)||document.querySelector(t):this.#e=document.querySelector(`[popovertarget="${CSS.escape(this.id)}"]`)}#r(){if(!(!this.#e||!d)&&(this.#t=`--pop-over-anchor-${this.id}`,this.#e.style.setProperty("anchor-name",this.#t),this.style.setProperty("position-anchor",this.#t),this.setAttribute("data-anchor-name",this.#t||""),!v)){let t=this.dataset.position||"bottom";this.#c(t)}}#c(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)"}},o=t.split("-")[0],s=i[o]||i.bottom;Object.entries(s).forEach(([r,a])=>this.style.setProperty(r,a))}#a(){if(!this.#e)return;let t=this.#e.getBoundingClientRect(),e=this.dataset.position||"bottom",i=this.#n(),o,s;switch(e.split("-")[0]){case"top":o=t.top-this.offsetHeight-i,s=t.left;break;case"left":o=t.top,s=t.left-this.offsetWidth-i;break;case"right":o=t.top,s=t.right+i;break;default:o=t.bottom+i,s=t.left;break}e.endsWith("-end")&&(e.startsWith("top")||e.startsWith("bottom")?s=t.right-this.offsetWidth:o=t.bottom-this.offsetHeight),this.style.position="fixed",this.style.top=`${Math.round(o)}px`,this.style.left=`${Math.round(s)}px`,this.style.margin="0"}#n(){let t={none:0,xs:4,s:8,m:16,l:24};return t[this.dataset.offset]??t.xs}};u("pop-over",f);var A=0,p=class extends c{static formAssociated=!0;#e;#t;#o;#i;#l=[];#r=[];#c=-1;#a=!1;#n="";#b="";#y;#g=!1;#u;#E;#s=[];constructor(){super(),this.#e=this.attachInternals(),this._adoptInternals(this.#e)}get#h(){return this.hasAttribute("multiple")}setup(){let t=this.querySelector(":scope > input")||this.querySelector(":scope > .tags-input-area > input");if(!t)return!1;this.#t=t;let e=this.#t.getAttribute("name");e&&(this.hasAttribute("name")||this.setAttribute("name",e),this.#t.removeAttribute("name"));let i=this.querySelector("ul, ol");if(!i)return!1;if(this.#o=i,this.#h){let h=this.querySelector(":scope > .tags-input-area");if(!h){h=document.createElement("div"),h.className="tags-input-area";let m=this.querySelector(":scope > pop-over[data-combobox-host]")||this.#o;this.insertBefore(h,m)}this.#u=h,this.#t.parentNode!==this.#u&&this.#u.appendChild(this.#t);let l=this.querySelector(":scope > [data-combobox-live]");l||(l=document.createElement("div"),l.setAttribute("aria-live","polite"),l.setAttribute("aria-atomic","true"),l.setAttribute("data-combobox-live",""),l.className="visually-hidden",this.appendChild(l)),this.#E=l}let o=this.getAttribute("placeholder");o&&!this.#t.getAttribute("placeholder")&&this.#t.setAttribute("placeholder",o);let s=`cb${++A}`;this.#o.id||(this.#o.id=`combobox-listbox-${s}`),this.#t.setAttribute("role","combobox"),this.#t.setAttribute("aria-expanded","false"),this.#t.setAttribute("aria-autocomplete","list"),this.#t.setAttribute("aria-controls",this.#o.id),this.#t.setAttribute("autocomplete","off"),this.#o.setAttribute("role","listbox"),this.#h&&this.#o.setAttribute("aria-multiselectable","true");let r=this.#h?this.#u:this.#t;r.id||(r.id=`combobox-anchor-${s}`);let a=this.querySelector(":scope > pop-over[data-combobox-host]");if(a?this.#i=a:(this.#i=document.createElement("pop-over"),this.#i.setAttribute("data-combobox-host",""),this.#i.id=`combobox-pop-${s}`,this.#i.dataset.mode="manual",this.#i.dataset.position="bottom-start",this.#i.dataset.anchor=r.id,this.#i.appendChild(this.#o),this.appendChild(this.#i)),this.#i.dataset.anchor=r.id,this.#o.parentElement!==this.#i&&this.#i.appendChild(this.#o),this.#N(),!this.#h){let h=this.getAttribute("value");h&&this.#A(h,!1),this.#y===void 0&&(this.#y=this.#n)}return this.listen(this.#t,"input",this.#P),this.listen(this.#t,"keydown",this.#T),this.listen(this.#t,"focus",this.#F),this.listen(this.#t,"click",this.#O),this.listen(this.#o,"click",this.#I),this.listen(this.#o,"pointerdown",this.#L),this.listen(document,"click",this.#W),this.listen(this.#i,"pop-over:hide",this.#H),this.listen(this,"invalid",this.#B),this.#f(),this.#p(),this.#d(),this.#k(this.matches(":disabled")),!0}teardown(){}#B=()=>{this.#t.setAttribute("aria-invalid","true")};formDisabledCallback(t){this.#t&&this.#k(t)}#k(t){this.#g=t,t&&this.#d();let e=this.#S(),i=this.#h&&e>0&&this.#s.length>=e;if(this.#t.disabled=t||i,this.#u)for(let o of this.#u.querySelectorAll(".tag button"))o.disabled=t}#N(){this.#l=Array.from(this.#o.querySelectorAll(":scope > li[data-value]")),this.#l.forEach((t,e)=>{t.setAttribute("role","option"),t.setAttribute("aria-selected","false"),t.id||(t.id=`${this.#o.id}-option-${e}`)}),this.#r=[...this.#l]}#x(t,e){if(this.#s.some(a=>a.value===t))return;let i=this.#S();if(i&&this.#s.length>=i)return;this.#s.push({value:t,label:e});let o=document.createElement("span");o.className="tag",o.dataset.value=t,o.textContent=e+" ";let s=document.createElement("button");s.type="button",s.setAttribute("aria-label",`Remove ${e}`),s.innerHTML="&times;",s.disabled=this.#g,s.addEventListener("click",a=>{a.stopPropagation(),this.#q(t)}),o.appendChild(s),this.#u.insertBefore(o,this.#t);let r=this.#l.find(a=>a.getAttribute("data-value")===t);r&&r.setAttribute("aria-selected","true"),this.#M(`${e} added`),this.#t.value="",this.#m(""),this.#f(),this.#p(),this.#V(),i&&this.#s.length>=i&&(this.#t.disabled=!0,this.#d())}#q(t){let e=this.#s.findIndex(a=>a.value===t);if(e===-1)return;let i=this.#s.splice(e,1)[0],o=this.#u.querySelector(`.tag[data-value="${CSS.escape(t)}"]`);o&&o.remove();let s=this.#l.find(a=>a.getAttribute("data-value")===t);s&&s.setAttribute("aria-selected","false"),this.#M(`${i.label} removed`),this.#S()&&this.#t.disabled&&(this.#t.disabled=this.#g),this.#m(this.#t.value.trim()),this.#f(),this.#p(),this.#V(),this.#t.focus()}#S(){let t=this.getAttribute("max");return t?parseInt(t,10):0}#M(t){this.#E&&(this.#E.textContent="",requestAnimationFrame(()=>{this.#E.textContent=t}))}#P=()=>{let t=this.#t.value.trim();if(!this.#h&&this.#n){let e=this.#o.querySelector('[aria-selected="true"]');e&&e.setAttribute("aria-selected","false"),this.#n="",this.#b="",this.removeAttribute("value"),this.#f(),this.#p()}this.#m(t),this.#v()};#T=t=>{switch(t.key){case"ArrowDown":t.preventDefault(),this.#a||this.#v(),this.#w(this.#c+1);break;case"ArrowUp":t.preventDefault(),this.#a||this.#v(),this.#w(this.#c-1);break;case"Home":this.#a&&(t.preventDefault(),this.#w(0));break;case"End":this.#a&&(t.preventDefault(),this.#w(this.#r.length-1));break;case"Enter":if(t.preventDefault(),this.#a&&this.#c>=0&&this.#r[this.#c]){let e=this.#r[this.#c];this.#h?this.#x(e.getAttribute("data-value"),e.textContent.trim()):this.#$(e)}else if(this.#h&&this.hasAttribute("custom")&&this.#t.value.trim()){let e=this.#t.value.trim();this.#x(e,e)}break;case"Backspace":if(this.#h&&!this.#t.value&&this.#s.length>0){let e=this.#s[this.#s.length-1];this.#q(e.value)}break;case",":if(this.#h&&this.hasAttribute("custom")&&this.#t.value.trim()){t.preventDefault();let e=this.#t.value.trim();this.#x(e,e)}break;case"Escape":this.#a&&(t.preventDefault(),t.stopPropagation(),this.#d(),this.#t.focus());break;case"Tab":this.#a&&this.#d();break}};#F=()=>{this.#h?(this.#m(this.#t.value.trim()),this.#v()):(this.#t.value||!this.#n)&&(this.#m(this.#t.value.trim()),this.#v())};#O=()=>{this.#a||(this.#m(this.#t.value.trim()),this.#v())};#I=t=>{let e=t.target.closest("li[data-value]");e&&this.#r.includes(e)&&(this.#h?this.#x(e.getAttribute("data-value"),e.textContent.trim()):this.#$(e))};#L=t=>{t.preventDefault()};#W=t=>{this.#a&&!this.contains(t.target)&&this.#d()};#m(t){let e=this.getAttribute("filter")||"contains",i=t.toLowerCase(),o=this.#h?new Set(this.#s.map(s=>s.value)):null;this.#r=[],this.#l.forEach(s=>{let r=s.getAttribute("data-value"),a=s.textContent.trim().toLowerCase();if(o&&o.has(r)){s.hidden=!0;return}let h;t?e==="startsWith"?h=a.startsWith(i):h=a.includes(i):h=!0,s.hidden=!h,h&&this.#r.push(s)}),this.#c=-1,this.#C(),this.setState("no-matches",this.#r.length===0)}#w(t){if(this.#r.length===0)return;t<0&&(t=this.#r.length-1),t>=this.#r.length&&(t=0),this.#c>=0&&this.#r[this.#c]&&this.#r[this.#c].removeAttribute("data-active"),this.#c=t;let e=this.#r[t];e.setAttribute("data-active",""),e.scrollIntoView({block:"nearest"}),this.#t.setAttribute("aria-activedescendant",e.id)}#C(){this.#l.forEach(t=>t.removeAttribute("data-active")),this.#t.removeAttribute("aria-activedescendant")}#$(t,e="internal"){let i=t.getAttribute("data-value")||"",o=t.textContent.trim();if(this.#n===i){this.#t.value=o,this.#d(),this.#t.focus();return}this.#l.forEach(s=>s.setAttribute("aria-selected","false")),t.setAttribute("aria-selected","true"),this.#n=i,this.#b=o,this.#t.value=o,this.setAttribute("value",i),this.#f(),this.#p(),this.#d(),this.#t.focus(),this.dispatchEvent(new CustomEvent("combo-box:change",{bubbles:!0,detail:{value:i,label:o,source:e}}))}#A(t,e=!0,i="api"){let o=this.#l.find(s=>s.getAttribute("data-value")===t);o&&(e?this.#$(o,i):(this.#l.forEach(s=>s.setAttribute("aria-selected","false")),o.setAttribute("aria-selected","true"),this.#n=t,this.#b=o.textContent.trim(),this.#t.value=this.#b,this.setAttribute("value",t)))}#v(){this.#a||this.#g||(this.#a=!0,this.setAttribute("open",""),this.#t.setAttribute("aria-expanded","true"),this.#i?.show(),this.dispatchEvent(new CustomEvent("combo-box:open",{bubbles:!0})))}#d(){this.#a&&(this.#a=!1,this.removeAttribute("open"),this.#t.setAttribute("aria-expanded","false"),this.#c=-1,this.#C(),this.#i?.hide(),this.dispatchEvent(new CustomEvent("combo-box:close",{bubbles:!0})))}#H=()=>{this.#a&&(this.#a=!1,this.removeAttribute("open"),this.#t.setAttribute("aria-expanded","false"),this.#c=-1,this.#C(),this.dispatchEvent(new CustomEvent("combo-box:close",{bubbles:!0})))};#f(){if(this.#h)if(this.#s.length>0){let t=new FormData,e=this.getAttribute("name")||"";for(let i of this.#s)t.append(e,i.value);this.#e.setFormValue(t)}else this.#e.setFormValue(null);else this.#n?this.#e.setFormValue(this.#n,this.#b):this.#e.setFormValue(null)}#p(){this.hasAttribute("required")?this.#h?this.#s.length===0?this.#e.setValidity({valueMissing:!0},"Please select at least one option",this.#t):this.#e.setValidity({}):this.#n?this.#e.setValidity({}):this.#e.setValidity({valueMissing:!0},"Please select an option",this.#t):this.#e.setValidity({}),this.#e.validity.valid&&this.#t.removeAttribute("aria-invalid")}#V(){this.dispatchEvent(new CustomEvent("combo-box:change",{bubbles:!0,detail:{values:this.#s.map(t=>t.value),labels:this.#s.map(t=>t.label),source:"internal"}}))}formResetCallback(){this.#h?(this.#u.querySelectorAll(".tag").forEach(t=>t.remove()),this.#s=[],this.#t.value="",this.#t.disabled=this.#g):(this.#n="",this.#b="",this.#t.value="",this.removeAttribute("value")),this.#l.forEach(t=>{t.setAttribute("aria-selected","false"),t.hidden=!1}),this.#r=[...this.#l],this.#c=-1,this.#C(),this.#d(),this.#t.removeAttribute("aria-invalid"),!this.#h&&this.#y&&this.#A(this.#y,!1),this.#f(),this.#p()}formStateRestoreCallback(t){t&&(this.#h||(this.#A(t,!1),this.#f(),this.#p()))}get value(){return this.#n}set value(t){t?this.#A(t):this.#D()}#D(){this.#l.forEach(t=>t.setAttribute("aria-selected","false")),this.#n="",this.#b="",this.#t&&(this.#t.value=""),this.removeAttribute("value"),this.#f(),this.#p()}get label(){return this.#b}get values(){return this.#s.map(t=>t.value)}get labels(){return this.#s.map(t=>t.label)}static get observedAttributes(){return["value","disabled"]}attributeChangedCallback(t,e,i){if(!this.#t)return;if(t==="disabled"){this.#k(this.matches(":disabled"));return}let o=i??"";t==="value"&&o!==this.#n&&(o?(this.#A(o,!1),this.#f(),this.#p()):this.#D())}};u("combo-box",p);export{p as ComboBox};
2
2
  //# sourceMappingURL=combo-box.js.map
@@ -1,2 +1,2 @@
1
- var f=/Mac|iPhone|iPad|iPod/.test(navigator.platform??""),v={mac:{meta:"\u2318",cmd:"\u2318",alt:"\u2325",shift:"\u21E7",ctrl:"\u2303"},other:{meta:"Ctrl",cmd:"Ctrl",alt:"Alt",shift:"Shift",ctrl:"Ctrl"}};function b(r){let e=f?v.mac:v.other;return r.split("+").map(t=>{let n=t.trim().toLowerCase();return e[n]??n.toUpperCase()}).join(f?"":"+")}function k(r){let e=r.toLowerCase().split("+").map(n=>n.trim());return{key:e.pop()??"",meta:e.includes("meta")||e.includes("cmd"),ctrl:e.includes("ctrl"),shift:e.includes("shift"),alt:e.includes("alt")}}function C(r,e){if(r.key.toLowerCase()!==e.key)return!1;let t,n;return f?(t=e.meta,n=e.ctrl):(t=!1,n=e.meta||e.ctrl),!(t!==r.metaKey||n!==r.ctrlKey||e.shift!==r.shiftKey||e.alt!==r.altKey)}var x=new Set(["INPUT","TEXTAREA","SELECT"]),h=[],A=!1;function L(r){let e=x.has(r.target.tagName)||r.target.isContentEditable;for(let t of h)if(!(e&&!t.global)&&C(r,t.descriptor)){r.preventDefault(),t.callback(r);return}}function M(){A||(document.addEventListener("keydown",L),A=!0)}function w(r,e,t={}){M();let n=k(r),s={combo:r,descriptor:n,callback:e,global:t.global===!0};return h.find(a=>a.combo===r)&&console.warn(`[hotkey-bind] Shortcut "${r}" already bound. Last-connected-wins.`),h.unshift(s),function(){let o=h.indexOf(s);o!==-1&&h.splice(o,1)}}var H=window.matchMedia("(prefers-reduced-motion: reduce)");var N=new Map;function m(r,e,t={}){let n=t.priority??10,s={impl:e,bundle:t.bundle,contract:t.contract,priority:n},i=N.get(r);if(customElements.get(r)){if(!i||i.priority>=n){i&&i.priority===n&&i.impl!==e&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${t.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${i.bundle}" cannot be replaced (customElements.define is permanent). "${t.bundle}" has higher priority but arrived late.`);return}if(i&&i.priority>=n){i.priority===n&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${i.bundle}". Skipping "${t.bundle}" (first wins at equal priority).`);return}N.set(r,s),customElements.define(r,e)}var p=class extends HTMLElement{#e=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let e of this.#e)e();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,t,n,s){e.addEventListener(t,n,s),this.#e.push(()=>e.removeEventListener(t,n,s))}setup(){}teardown(){}setState(e,t){this.#t||(this.#t=this.attachInternals());let n=this.#t.states;try{t?n.add(e):n.delete(e)}catch{let s=`--${e}`;t?n.add(s):n.delete(s)}}_adoptInternals(e){this.#t||(this.#t=e)}};var y=class extends p{#e;#t;#n;#s=[];#o=-1;#r=[];#l=null;#i=[];setup(){this.#m(),this.#p(),this.hasAttribute("discover")&&this.#y()}teardown(){this.#l?.()}get commands(){let e=[];for(let t of this.#r){let n=t.getAttribute("label")||"";for(let s of t.querySelectorAll("command-item"))e.push({value:s.getAttribute("value")||"",label:s.textContent.trim(),hotkey:s.getAttribute("data-hotkey")||void 0,group:n||void 0})}return e}set commands(e){let t=Array.isArray(e)?e:[],n=new Map;for(let s of t){let i=s.group||"";n.has(i)||n.set(i,[]),n.get(i).push(s)}for(let s of[...this.children])(s.tagName==="COMMAND-GROUP"||s.tagName==="COMMAND-ITEM")&&s.remove();for(let[s,i]of n){let a=document.createElement("command-group");s&&a.setAttribute("label",s);for(let o of i){let c=document.createElement("command-item");if(o.value&&c.setAttribute("value",o.value),o.hotkey&&c.setAttribute("data-hotkey",o.hotkey),o.icon){let l=document.createElement("span");l.setAttribute("slot","icon"),l.innerHTML=o.icon,c.appendChild(l)}c.appendChild(document.createTextNode(o.label||o.value||"")),a.appendChild(c)}this.appendChild(a)}this.teardown(),this.removeAttribute("data-upgraded"),this.setup(),this.dispatchEvent(new CustomEvent("command-palette:commands-changed",{detail:{commands:t,source:"property"},bubbles:!0}))}#m(){this.#e=document.createElement("dialog"),this.#e.className="command-dialog",this.#e.addEventListener("click",n=>{n.target===this.#e&&this.close()});let e=document.createElement("div");e.className="command-search",this.#t=document.createElement("input"),this.#t.type="search",this.#t.placeholder=this.getAttribute("placeholder")||"Type a command...",this.#t.setAttribute("aria-label","Search commands"),this.#t.autocomplete="off",this.#t.addEventListener("input",this.#a),this.#t.addEventListener("keydown",this.#f),e.appendChild(this.#t),this.#n=document.createElement("div"),this.#n.className="command-list",this.#n.setAttribute("role","listbox"),this.#r=Array.from(this.querySelectorAll("command-group")),this.#r.forEach(n=>{let s=document.createElement("div");s.className="command-group-header",s.textContent=n.getAttribute("label")||"",s.setAttribute("role","presentation");let i=Array.from(n.querySelectorAll("command-item"));this.#n.appendChild(s),i.forEach(a=>{let o=document.createElement("button");o.className="command-option",o.setAttribute("role","option"),o.dataset.value=a.getAttribute("value")||"",o.dataset.searchText=a.textContent.toLowerCase().trim();let c=a.querySelector('[slot="icon"]');if(c){let d=document.createElement("span");d.className="command-icon",d.appendChild(c.cloneNode(!0)),o.appendChild(d)}let l=document.createElement("span");l.className="command-label",l.textContent=a.textContent.trim(),o.appendChild(l);let u=a.getAttribute("data-hotkey");if(u){let d=document.createElement("kbd");d.className="command-kbd",d.textContent=b(u),o.appendChild(d)}o.addEventListener("click",()=>{this.#b(o.dataset.value)}),this.#n.appendChild(o),this.#s.push({btn:o,header:s,group:n})})});let t=document.createElement("div");t.className="command-empty",t.textContent="No results found.",t.hidden=!0,this.#n.appendChild(t),this.#e.appendChild(e),this.#e.appendChild(this.#n),this.appendChild(this.#e)}#p(){let e=this.getAttribute("hotkey")||"meta+k";this.#l=w(e,()=>{this.#e.open?this.close():this.open()},{global:!0})}#a=()=>{let e=this.#t.value.toLowerCase().trim(),t=0,n=new Set;this.#s.forEach(({btn:i,header:a})=>{let o=!e||i.dataset.searchText.includes(e);i.hidden=!o,o&&(t++,n.add(a))}),this.#n.querySelectorAll(".command-group-header").forEach(i=>{i.hidden=!n.has(i)});let s=this.#n.querySelector(".command-empty");s&&(s.hidden=t>0),this.#o=-1,t>0&&this.#c(0)};#f=e=>{let t=this.#d();switch(e.key){case"ArrowDown":e.preventDefault(),this.#c(this.#o+1);break;case"ArrowUp":e.preventDefault(),this.#c(this.#o-1);break;case"Enter":e.preventDefault(),this.#o>=0&&t[this.#o]&&t[this.#o].btn.click();break;case"Escape":e.preventDefault(),this.close();break}};#d(){return this.#s.filter(({btn:e})=>!e.hidden)}#c(e){let t=this.#d();if(t.length===0)return;t.forEach(({btn:s})=>s.removeAttribute("data-active")),e<0&&(e=t.length-1),e>=t.length&&(e=0),this.#o=e;let{btn:n}=t[e];n.setAttribute("data-active",""),n.scrollIntoView({block:"nearest"})}#b(e){this.close(),this.dispatchEvent(new CustomEvent("command-palette:select",{bubbles:!0,detail:{value:e}}))}#y(){this.listen(document,"vb:command-registry-change",this.#g)}#g=()=>{this.#e?.open&&(this.#u(),this.#a())};#u(){if(!this.hasAttribute("discover"))return;let{getRegisteredCommands:e,scanAutoDiscoverable:t}=window.__commandRegistry||{};if(!e)return;this.#s=this.#s.filter(i=>!i.discovered),this.#i.forEach(i=>i.remove()),this.#i=[];let n=this.#n.querySelector(".command-empty"),s=e();for(let[i,a]of s){let o=document.createElement("div");o.className="command-group-header",o.textContent=i,o.setAttribute("role","presentation"),this.#n.insertBefore(o,n),this.#i.push(o);for(let c of a){if(this.contains(c.element))continue;let l=this.#h(c.label,c.icon,c.shortcut);l.dataset.value=`__discovered:${c.label}`,l.addEventListener("click",()=>{this.close(),c.element.click()}),this.#n.insertBefore(l,n),this.#s.push({btn:l,header:o,group:null,discovered:!0})}}if(this.getAttribute("discover")==="auto"&&t){let i=t(),a=new Map;for(let o of i){let c=a.get(o.group)||[];c.push(o),a.set(o.group,c)}for(let[o,c]of a){let l=document.createElement("div");l.className="command-group-header",l.textContent=o,l.setAttribute("role","presentation"),this.#n.insertBefore(l,n),this.#i.push(l);for(let u of c){if(this.contains(u.element))continue;let d=this.#h(u.label,u.icon,u.shortcut);d.dataset.value=`__auto:${u.label}`,d.dataset.auto="",d.addEventListener("click",()=>{this.close(),u.action?u.action():u.element.click()}),this.#n.insertBefore(d,n),this.#s.push({btn:d,header:l,group:null,discovered:!0})}}}}#h(e,t,n){let s=document.createElement("button");if(s.className="command-option",s.setAttribute("role","option"),s.dataset.searchText=e.toLowerCase(),t){let a=document.createElement("span");a.className="command-icon";let o=document.createElement("icon-wc");o.setAttribute("name",t),a.appendChild(o),s.appendChild(a)}let i=document.createElement("span");if(i.className="command-label",i.textContent=e,s.appendChild(i),n){let a=document.createElement("kbd");a.className="command-kbd",a.textContent=b(n),s.appendChild(a)}return s}open(){this.#e.open||(this.#u(),this.#e.showModal(),this.#t.value="",this.#a(),this.#t.focus(),this.dispatchEvent(new CustomEvent("command-palette:open",{bubbles:!0})))}close(){this.#e.open&&(this.#e.close(),this.dispatchEvent(new CustomEvent("command-palette:close",{bubbles:!0})))}get isOpen(){return this.#e?.open??!1}},g=class extends HTMLElement{},E=class extends HTMLElement{};m("command-palette",y);m("command-group",g);m("command-item",E);export{y as CommandPalette};
1
+ var f=/Mac|iPhone|iPad|iPod/.test(navigator.platform??""),E={mac:{meta:"\u2318",cmd:"\u2318",alt:"\u2325",shift:"\u21E7",ctrl:"\u2303"},other:{meta:"Ctrl",cmd:"Ctrl",alt:"Alt",shift:"Shift",ctrl:"Ctrl"}};function A(r){let t=f?E.mac:E.other;return r.split("+").map(e=>{let s=e.trim().toLowerCase();return t[s]??s.toUpperCase()}).join(f?"":"+")}function k(r){let t=r.toLowerCase().split("+").map(s=>s.trim());return{key:t.pop()??"",meta:t.includes("meta")||t.includes("cmd"),ctrl:t.includes("ctrl"),shift:t.includes("shift"),alt:t.includes("alt")}}function C(r,t){if(r.key.toLowerCase()!==t.key)return!1;let e,s;return f?(e=t.meta,s=t.ctrl):(e=!1,s=t.meta||t.ctrl),!(e!==r.metaKey||s!==r.ctrlKey||t.shift!==r.shiftKey||t.alt!==r.altKey)}var M=new Set(["INPUT","TEXTAREA","SELECT"]),h=[],w=!1;function N(r){let t=M.has(r.target.tagName)||r.target.isContentEditable;for(let e of h)if(!(t&&!e.global)&&C(r,e.descriptor)){r.preventDefault(),e.callback(r);return}}function S(){w||(document.addEventListener("keydown",N),w=!0)}function b(r,t,e={}){S();let s=k(r),i={combo:r,descriptor:s,callback:t,global:e.global===!0};return h.find(a=>a.combo===r)&&console.warn(`[hotkey-bind] Shortcut "${r}" already bound. Last-connected-wins.`),h.unshift(i),function(){let o=h.indexOf(i);o!==-1&&h.splice(o,1)}}var D=window.matchMedia("(prefers-reduced-motion: reduce)");var L=new Map;function m(r,t,e={}){let s=e.priority??10,i={impl:t,bundle:e.bundle,contract:e.contract,priority:s},n=L.get(r);if(customElements.get(r)){if(!n||n.priority>=s){n&&n.priority===s&&n.impl!==t&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${n.bundle}" (priority ${n.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${r}> defined by "${n.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(n&&n.priority>=s){n.priority===s&&console.warn(`[VB Bundle] Tag <${r}> already registered by "${n.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}L.set(r,i),customElements.define(r,t)}var p=class extends HTMLElement{#e=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let t of this.#e)t();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,i){t.addEventListener(e,s,i),this.#e.push(()=>t.removeEventListener(e,s,i))}_reinit(){for(let t of this.#e)t();this.#e=[],this.teardown(),this.removeAttribute("data-upgraded"),this.isConnected&&this.setup()!==!1&&this.setAttribute("data-upgraded","")}setup(){}teardown(){}setState(t,e){this.#t||(this.#t=this.attachInternals());let s=this.#t.states;try{e?s.add(t):s.delete(t)}catch{let i=`--${t}`;e?s.add(i):s.delete(i)}}_adoptInternals(t){this.#t||(this.#t=t)}};var x=0,y=class extends p{#e=null;#t;#s;#i=[];#n=-1;#c=[];#r=[];#o=[];#a="";#l=0;setup(){this.#a=`cmdp-${++x}`,this.#l=0,this.#y(),this.#g(),this.hasAttribute("discover")&&this.#E()}teardown(){this.#r.forEach(t=>t()),this.#r=[],this.#e?.remove(),this.#e=null,this.#i=[],this.#c=[],this.#o=[],this.#n=-1}get commands(){let t=[];for(let e of this.querySelectorAll("command-group")){let s=e.getAttribute("label")||"";for(let i of e.querySelectorAll("command-item"))t.push({value:i.getAttribute("value")||"",label:i.textContent.trim(),hotkey:i.getAttribute("data-hotkey")||void 0,group:s||void 0})}return t}set commands(t){let e=Array.isArray(t)?t:[],s=new Map;for(let i of e){let n=i.group||"";s.has(n)||s.set(n,[]),s.get(n).push(i)}for(let i of[...this.children])(i.tagName==="COMMAND-GROUP"||i.tagName==="COMMAND-ITEM")&&i.remove();for(let[i,n]of s){let a=document.createElement("command-group");i&&a.setAttribute("label",i);for(let o of n){let c=document.createElement("command-item");if(o.value&&c.setAttribute("value",o.value),o.hotkey&&c.setAttribute("data-hotkey",o.hotkey),o.icon){let l=document.createElement("span");l.setAttribute("slot","icon"),l.innerHTML=o.icon,c.appendChild(l)}c.appendChild(document.createTextNode(o.label||o.value||"")),a.appendChild(c)}this.appendChild(a)}this._reinit(),this.dispatchEvent(new CustomEvent("command-palette:commands-changed",{detail:{commands:e,source:"property"},bubbles:!0}))}#y(){this.#e=document.createElement("dialog"),this.#e.className="command-dialog",this.#e.setAttribute("aria-label",this.getAttribute("label")||"Command palette"),this.#e.addEventListener("click",s=>{s.target===this.#e&&this.close()}),this.#e.addEventListener("close",()=>{this.#t?.setAttribute("aria-expanded","false"),this.#t?.removeAttribute("aria-activedescendant"),this.dispatchEvent(new CustomEvent("command-palette:close",{bubbles:!0}))});let t=document.createElement("div");t.className="command-search",this.#s=document.createElement("div"),this.#s.className="command-list",this.#s.id=`${this.#a}-list`,this.#s.setAttribute("role","listbox"),this.#s.setAttribute("aria-label","Commands"),this.#t=document.createElement("input"),this.#t.type="search",this.#t.placeholder=this.getAttribute("placeholder")||"Type a command...",this.#t.setAttribute("aria-label","Search commands"),this.#t.autocomplete="off",this.#t.setAttribute("role","combobox"),this.#t.setAttribute("aria-autocomplete","list"),this.#t.setAttribute("aria-controls",this.#s.id),this.#t.setAttribute("aria-expanded","false"),this.#t.addEventListener("input",this.#u),this.#t.addEventListener("keydown",this.#v),t.appendChild(this.#t),this.#c=Array.from(this.querySelectorAll("command-group")),this.#c.forEach(s=>{let i=this.#d(s.getAttribute("label")||"");this.#s.appendChild(i),s.querySelectorAll("command-item").forEach(n=>{let a=n.querySelector('[slot="icon"]'),o=this.#m(n.textContent.trim(),a?a.cloneNode(!0):null,n.getAttribute("data-hotkey"));o.dataset.value=n.getAttribute("value")||"",o.addEventListener("click",()=>{this.#f(o.dataset.value)}),i.appendChild(o),this.#i.push({btn:o,group:i,source:n})})});let e=document.createElement("div");e.className="command-empty",e.textContent="No results found.",e.hidden=!0,this.#s.appendChild(e),this.#e.appendChild(t),this.#e.appendChild(this.#s),this.appendChild(this.#e)}#d(t){let e=document.createElement("div");e.className="command-group",e.setAttribute("role","group");let s=document.createElement("div");return s.className="command-group-header",s.id=`${this.#a}-g${++this.#l}`,s.setAttribute("aria-hidden","true"),s.textContent=t,t?e.setAttribute("aria-labelledby",s.id):s.hidden=!0,e.appendChild(s),e}#g(){let t=this.getAttribute("hotkey")||"meta+k";this.#r.push(b(t,()=>{this.#e?.open?this.close():this.open()},{global:!0}));for(let{btn:e,source:s}of this.#i){let i=s?.getAttribute("data-hotkey");if(!i||i.toLowerCase()===t.toLowerCase())continue;let n=e.dataset.value;this.#r.push(b(i,()=>this.#f(n)))}}#u=()=>{let t=this.#t.value.toLowerCase().trim(),e=0,s=new Set;this.#i.forEach(({btn:n,group:a})=>{let o=!t||(n.dataset.searchText??"").includes(t);n.hidden=!o,o&&(e++,s.add(a))}),this.#s.querySelectorAll(":scope > .command-group").forEach(n=>{n.hidden=!s.has(n)});let i=this.#s.querySelector(".command-empty");i&&(i.hidden=e>0),this.#n=-1,this.#i.forEach(({btn:n})=>{n.removeAttribute("data-active"),n.setAttribute("aria-selected","false")}),this.#t.removeAttribute("aria-activedescendant"),e>0&&this.#h(0)};#v=t=>{let e=this.#p();switch(t.key){case"ArrowDown":t.preventDefault(),this.#h(this.#n+1);break;case"ArrowUp":t.preventDefault(),this.#h(this.#n-1);break;case"Enter":t.preventDefault(),this.#n>=0&&e[this.#n]&&e[this.#n].btn.click();break;case"Escape":t.preventDefault(),this.close();break}};#p(){return this.#i.filter(({btn:t})=>!t.hidden)}#h(t){let e=this.#p();if(e.length===0)return;e.forEach(({btn:i})=>{i.removeAttribute("data-active"),i.setAttribute("aria-selected","false")}),t<0&&(t=e.length-1),t>=e.length&&(t=0),this.#n=t;let{btn:s}=e[t];s.setAttribute("data-active",""),s.setAttribute("aria-selected","true"),this.#t.setAttribute("aria-activedescendant",s.id),s.scrollIntoView({block:"nearest"})}#f(t){this.close(),this.dispatchEvent(new CustomEvent("command-palette:select",{bubbles:!0,detail:{value:t}}))}#E(){this.listen(document,"vb:command-registry-change",this.#A)}#A=()=>{this.#e?.open&&(this.#b(),this.#u())};#b(){if(!this.hasAttribute("discover"))return;let{getRegisteredCommands:t,scanAutoDiscoverable:e}=window.__commandRegistry||{};if(!t)return;this.#i=this.#i.filter(n=>!n.discovered),this.#o.forEach(n=>n.remove()),this.#o=[];let s=this.#s.querySelector(".command-empty"),i=t();for(let[n,a]of i){let o=this.#d(n);this.#s.insertBefore(o,s),this.#o.push(o);for(let c of a){if(this.contains(c.element))continue;let l=this.#m(c.label,c.icon,c.shortcut);l.dataset.value=`__discovered:${c.label}`,l.addEventListener("click",()=>{this.close(),c.element.click()}),o.appendChild(l),this.#i.push({btn:l,group:o,source:null,discovered:!0})}}if(this.getAttribute("discover")==="auto"&&e){let n=e(),a=new Map;for(let o of n){let c=a.get(o.group)||[];c.push(o),a.set(o.group,c)}for(let[o,c]of a){let l=this.#d(o);this.#s.insertBefore(l,s),this.#o.push(l);for(let d of c){if(this.contains(d.element))continue;let u=this.#m(d.label,d.icon,d.shortcut);u.dataset.value=`__auto:${d.label}`,u.dataset.auto="",u.addEventListener("click",()=>{this.close(),d.action?d.action():d.element.click()}),l.appendChild(u),this.#i.push({btn:u,group:l,source:null,discovered:!0})}}}}#m(t,e,s){let i=document.createElement("button");if(i.type="button",i.className="command-option",i.id=`${this.#a}-opt-${++this.#l}`,i.setAttribute("role","option"),i.setAttribute("aria-selected","false"),i.tabIndex=-1,i.dataset.searchText=t.toLowerCase(),e){let a=document.createElement("span");if(a.className="command-icon",typeof e=="string"){let o=document.createElement("icon-wc");o.setAttribute("name",e),a.appendChild(o)}else a.appendChild(e);i.appendChild(a)}let n=document.createElement("span");if(n.className="command-label",n.textContent=t,i.appendChild(n),s){let a=document.createElement("kbd");a.className="command-kbd",a.setAttribute("aria-hidden","true"),a.textContent=A(s),i.appendChild(a),i.setAttribute("aria-keyshortcuts",s)}return i}open(){!this.#e||this.#e.open||(this.#b(),this.#e.showModal(),this.#t.setAttribute("aria-expanded","true"),this.#t.value="",this.#u(),this.#t.focus(),this.dispatchEvent(new CustomEvent("command-palette:open",{bubbles:!0})))}close(){this.#e?.open&&this.#e.close()}get isOpen(){return this.#e?.open??!1}},g=class extends HTMLElement{},v=class extends HTMLElement{};m("command-palette",y);m("command-group",g);m("command-item",v);export{y as CommandPalette};
2
2
  //# sourceMappingURL=command-palette.js.map