vanilla-breeze 0.1.3 → 0.2.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.
- package/custom-elements.json +25084 -6649
- package/dist/cdn/components/accessibility-specimen.js +11 -0
- package/dist/cdn/components/accordion-wc.js +1 -1
- package/dist/cdn/components/activity-feed.js +2 -0
- package/dist/cdn/components/adr-wc.js +17 -17
- package/dist/cdn/components/ai-chat.js +28 -0
- package/dist/cdn/components/ai-summary.js +10 -0
- package/dist/cdn/components/analytics-panel.js +5 -5
- package/dist/cdn/components/audio-player.js +3 -3
- package/dist/cdn/components/audio-visualizer.js +2 -2
- package/dist/cdn/components/author-index.js +2 -2
- package/dist/cdn/components/brand-mark.js +1 -1
- package/dist/cdn/components/bread-crumb.js +2 -0
- package/dist/cdn/components/breakpoint-specimen.js +26 -0
- package/dist/cdn/components/burndown-chart.js +2 -0
- package/dist/cdn/components/calendar-wc.js +2 -2
- package/dist/cdn/components/capacity-plan.js +25 -0
- package/dist/cdn/components/card-list.js +1 -1
- package/dist/cdn/components/carousel-wc.js +1 -1
- package/dist/cdn/components/change-set.js +2 -2
- package/dist/cdn/components/chart-wc.js +58 -36
- package/dist/cdn/components/chat-input.js +1 -1
- package/dist/cdn/components/chat-window.js +1 -1
- package/dist/cdn/components/color-palette.js +9 -9
- package/dist/cdn/components/color-picker.js +1 -1
- package/dist/cdn/components/combo-box.js +1 -1
- package/dist/cdn/components/command-palette.js +1 -1
- package/dist/cdn/components/comment-box.js +60 -0
- package/dist/cdn/components/comment-thread.js +60 -0
- package/dist/cdn/components/comment-wc.js +1 -1
- package/dist/cdn/components/compare-surface.js +1 -1
- package/dist/cdn/components/component-sampler.js +2 -2
- package/dist/cdn/components/consent-banner.js +1 -1
- package/dist/cdn/components/content-lens.js +1 -1
- package/dist/cdn/components/content-swap.js +1 -1
- package/dist/cdn/components/context-menu.js +1 -1
- package/dist/cdn/components/data-table.js +1 -1
- package/dist/cdn/components/date-picker.js +1 -1
- package/dist/cdn/components/day-view.js +1 -1
- package/dist/cdn/components/diagram-wc.js +3 -0
- package/dist/cdn/components/drag-surface.js +1 -1
- package/dist/cdn/components/drop-down.js +1 -1
- package/dist/cdn/components/emoji-picker.js +1 -1
- package/dist/cdn/components/empathy-map.js +41 -43
- package/dist/cdn/components/flow-diagram.js +1 -1
- package/dist/cdn/components/font-pairer.js +81 -81
- package/dist/cdn/components/foot-notes.js +1 -1
- package/dist/cdn/components/form-field.js +1 -1
- package/dist/cdn/components/gantt-chart.js +1 -1
- package/dist/cdn/components/geo-map.js +25 -23
- package/dist/cdn/components/glossary-index.js +1 -1
- package/dist/cdn/components/glossary-wc.js +1 -1
- package/dist/cdn/components/gradient-builder.js +29 -29
- package/dist/cdn/components/heading-links.js +1 -1
- package/dist/cdn/components/highlight-wc.js +2 -2
- package/dist/cdn/components/icon-wc.js +4 -4
- package/dist/cdn/components/image-gallery.js +1 -1
- package/dist/cdn/components/image-map.js +1 -1
- package/dist/cdn/components/impact-effort.js +1 -1
- package/dist/cdn/components/include-file.js +1 -1
- package/dist/cdn/components/iron-triangle.js +2 -0
- package/dist/cdn/components/kanban-board.js +1 -1
- package/dist/cdn/components/layout-specimen.js +35 -0
- package/dist/cdn/components/manifest.json +227 -103
- package/dist/cdn/components/markdown-editor.js +1 -1
- package/dist/cdn/components/markdown-viewer.js +12 -12
- package/dist/cdn/components/motion-specimen.js +12 -12
- package/dist/cdn/components/nav-bar.js +2 -0
- package/dist/cdn/components/note-wc.js +2 -2
- package/dist/cdn/components/notification-wc.js +4 -4
- package/dist/cdn/components/page-info.js +4 -4
- package/dist/cdn/components/page-stats.js +1 -1
- package/dist/cdn/components/page-toc.js +1 -1
- package/dist/cdn/components/page-tools.js +1 -1
- package/dist/cdn/components/page-tour.js +6 -6
- package/dist/cdn/components/pager-wc.js +2 -0
- package/dist/cdn/components/palette-generator.js +11 -11
- package/dist/cdn/components/poll-wc.js +2 -0
- package/dist/cdn/components/pop-over.js +2 -0
- package/dist/cdn/components/popularity-index.js +2 -2
- package/dist/cdn/components/print-page.js +1 -1
- package/dist/cdn/components/product-roadmap.js +3 -0
- package/dist/cdn/components/progress-tracker.js +2 -0
- package/dist/cdn/components/qr-code.js +1 -1
- package/dist/cdn/components/quadrant-grid.js +3 -0
- package/dist/cdn/components/quality-target.js +12 -0
- package/dist/cdn/components/reaction-bar.js +2 -0
- package/dist/cdn/components/reader-view.js +3 -3
- package/dist/cdn/components/reading-progress.js +2 -0
- package/dist/cdn/components/recently-visited.js +10 -10
- package/dist/cdn/components/requirement-card.js +122 -0
- package/dist/cdn/components/review-surface.js +34 -40
- package/dist/cdn/components/risk-register.js +25 -0
- package/dist/cdn/components/roadmap.js +3 -0
- package/dist/cdn/components/score-card.js +197 -0
- package/dist/cdn/components/selection-menu.js +1 -1
- package/dist/cdn/components/semantic-palette.js +15 -15
- package/dist/cdn/components/settings-panel.js +12 -12
- package/dist/cdn/components/share-wc.js +2 -2
- package/dist/cdn/components/short-cuts.js +1 -1
- package/dist/cdn/components/site-index.js +4 -4
- package/dist/cdn/components/site-map-wc.js +1 -1
- package/dist/cdn/components/site-map.js +1 -1
- package/dist/cdn/components/site-search.js +9 -9
- package/dist/cdn/components/slide-accept.js +1 -1
- package/dist/cdn/components/social-embed.js +1 -1
- package/dist/cdn/components/spacing-specimen.js +5 -5
- package/dist/cdn/components/split-surface.js +1 -1
- package/dist/cdn/components/star-rating.js +1 -1
- package/dist/cdn/components/status-wc.js +2 -0
- package/dist/cdn/components/stepper-wc.js +2 -0
- package/dist/cdn/components/story-map.js +1 -1
- package/dist/cdn/components/tab-set.js +1 -1
- package/dist/cdn/components/text-reader.js +2 -2
- package/dist/cdn/components/theme-catalog.js +28 -0
- package/dist/cdn/components/theme-export.js +20 -12
- package/dist/cdn/components/theme-import.js +44 -0
- package/dist/cdn/components/theme-picker.js +29 -26
- package/dist/cdn/components/time-index.js +2 -2
- package/dist/cdn/components/time-picker.js +1 -1
- package/dist/cdn/components/toast-msg.js +3 -3
- package/dist/cdn/components/token-specimen.js +14 -14
- package/dist/cdn/components/tool-tip.js +1 -1
- package/dist/cdn/components/topic-map.js +3 -3
- package/dist/cdn/components/traceability-matrix.js +3 -0
- package/dist/cdn/components/trust-filter.js +3 -3
- package/dist/cdn/components/type-specimen.js +15 -15
- package/dist/cdn/components/user-journey.js +63 -70
- package/dist/cdn/components/user-persona.js +75 -13
- package/dist/cdn/components/user-story.js +12 -11
- package/dist/cdn/components/version-switcher.js +17 -0
- package/dist/cdn/components/video-player.js +3 -3
- package/dist/cdn/components/watch-wc.js +2 -2
- package/dist/cdn/components/week-view.js +1 -1
- package/dist/cdn/components/work-item.js +29 -28
- package/dist/cdn/components/youtube-player.js +1 -1
- package/dist/cdn/icons/bold.css +17 -0
- package/dist/cdn/icons/bold.json +1 -0
- package/dist/cdn/icons/custom.css +6 -0
- package/dist/cdn/icons/custom.json +1 -0
- package/dist/cdn/icons/lucide.css +1914 -0
- package/dist/cdn/icons/lucide.json +1 -0
- package/dist/cdn/icons/mage.css +17 -0
- package/dist/cdn/icons/mage.json +1 -0
- package/dist/cdn/icons/phosphor.css +17 -0
- package/dist/cdn/icons/phosphor.json +1 -0
- package/dist/cdn/icons/tabler.css +17 -0
- package/dist/cdn/icons/tabler.json +1 -0
- package/dist/cdn/packs/design-system.full.js +59 -51
- package/dist/cdn/packs/effects.full.js +1 -1
- package/dist/cdn/packs/icons.effects.js +1 -1
- package/dist/cdn/packs/icons.full.js +1 -1
- package/dist/cdn/packs/kawaii.full.css +1 -1
- package/dist/cdn/packs/kawaii.full.js +6 -6
- package/dist/cdn/packs/kawaii.theme.css +1 -1
- package/dist/cdn/packs/manifest.json +11 -11
- package/dist/cdn/packs/ui.full.css +1 -1
- package/dist/cdn/packs/ui.full.js +54 -51
- package/dist/cdn/packs/ux-planning.full.css +1 -1
- package/dist/cdn/packs/ux-planning.full.js +318 -243
- package/dist/cdn/themes/8bit.css +1 -1
- package/dist/cdn/themes/8bit.tokens.json +662 -0
- package/dist/cdn/themes/alpha1999-dark.tokens.json +693 -0
- package/dist/cdn/themes/alpha1999.css +1 -1
- package/dist/cdn/themes/alpha1999.tokens.json +869 -0
- package/dist/cdn/themes/anthropic.css +2 -0
- package/dist/cdn/themes/anthropic.tokens.json +564 -0
- package/dist/cdn/themes/art-deco-dark.tokens.json +407 -0
- package/dist/cdn/themes/art-deco.css +1 -1
- package/dist/cdn/themes/art-deco.tokens.json +581 -0
- package/dist/cdn/themes/bauhaus-dark.tokens.json +260 -0
- package/dist/cdn/themes/bauhaus.css +1 -1
- package/dist/cdn/themes/bauhaus.tokens.json +589 -0
- package/dist/cdn/themes/brutalist-dark.tokens.json +503 -0
- package/dist/cdn/themes/brutalist.tokens.json +677 -0
- package/dist/cdn/themes/catalog/atlassian.tokens.json +303 -0
- package/dist/cdn/themes/catalog/bootstrap.tokens.json +304 -0
- package/dist/cdn/themes/catalog/carbon.tokens.json +301 -0
- package/dist/cdn/themes/catalog/catppuccin-mocha.tokens.json +301 -0
- package/dist/cdn/themes/catalog/govuk.tokens.json +301 -0
- package/dist/cdn/themes/catalog/manifest.json +132 -0
- package/dist/cdn/themes/catalog/material.tokens.json +289 -0
- package/dist/cdn/themes/catalog/salesforce.tokens.json +301 -0
- package/dist/cdn/themes/catalog/tailwind.tokens.json +302 -0
- package/dist/cdn/themes/catppuccin-frappe.css +1 -1
- package/dist/cdn/themes/catppuccin-frappe.tokens.json +608 -0
- package/dist/cdn/themes/catppuccin-latte-dark.tokens.json +472 -0
- package/dist/cdn/themes/catppuccin-latte.css +1 -1
- package/dist/cdn/themes/catppuccin-latte.tokens.json +608 -0
- package/dist/cdn/themes/catppuccin-macchiato.css +1 -1
- package/dist/cdn/themes/catppuccin-macchiato.tokens.json +608 -0
- package/dist/cdn/themes/catppuccin-mocha.tokens.json +608 -0
- package/dist/cdn/themes/classic-dark.tokens.json +503 -0
- package/dist/cdn/themes/classic.tokens.json +640 -0
- package/dist/cdn/themes/claymorphism-dark.tokens.json +493 -0
- package/dist/cdn/themes/claymorphism.css +1 -1
- package/dist/cdn/themes/claymorphism.tokens.json +626 -0
- package/dist/cdn/themes/clinical-dark.tokens.json +472 -0
- package/dist/cdn/themes/clinical.tokens.json +608 -0
- package/dist/cdn/themes/cottagecore-dark.tokens.json +412 -0
- package/dist/cdn/themes/cottagecore.css +1 -1
- package/dist/cdn/themes/cottagecore.tokens.json +544 -0
- package/dist/cdn/themes/cyber.tokens.json +668 -0
- package/dist/cdn/themes/dawn-dark.tokens.json +472 -0
- package/dist/cdn/themes/dawn.css +1 -1
- package/dist/cdn/themes/dawn.tokens.json +608 -0
- package/dist/cdn/themes/dracula.tokens.json +534 -0
- package/dist/cdn/themes/dusk.tokens.json +533 -0
- package/dist/cdn/themes/editorial-dark.tokens.json +400 -0
- package/dist/cdn/themes/editorial.tokens.json +690 -0
- package/dist/cdn/themes/financial-dark.tokens.json +472 -0
- package/dist/cdn/themes/financial.css +1 -1
- package/dist/cdn/themes/financial.tokens.json +607 -0
- package/dist/cdn/themes/genai.tokens.json +534 -0
- package/dist/cdn/themes/glassmorphism-dark.tokens.json +489 -0
- package/dist/cdn/themes/glassmorphism.css +1 -1
- package/dist/cdn/themes/glassmorphism.tokens.json +632 -0
- package/dist/cdn/themes/government-dark.tokens.json +472 -0
- package/dist/cdn/themes/government.tokens.json +608 -0
- package/dist/cdn/themes/gruvbox-dark.tokens.json +472 -0
- package/dist/cdn/themes/gruvbox.tokens.json +608 -0
- package/dist/cdn/themes/high-noon-dark.tokens.json +397 -0
- package/dist/cdn/themes/high-noon.tokens.json +533 -0
- package/dist/cdn/themes/ibm.css +2 -0
- package/dist/cdn/themes/ibm.tokens.json +568 -0
- package/dist/cdn/themes/kawaii-dark.tokens.json +549 -0
- package/dist/cdn/themes/kawaii.css +1 -1
- package/dist/cdn/themes/kawaii.tokens.json +641 -0
- package/dist/cdn/themes/magna-dark.tokens.json +482 -0
- package/dist/cdn/themes/magna.css +1 -1
- package/dist/cdn/themes/magna.tokens.json +632 -0
- package/dist/cdn/themes/manifest.json +162 -62
- package/dist/cdn/themes/mcdonalds.css +2 -0
- package/dist/cdn/themes/mcdonalds.tokens.json +533 -0
- package/dist/cdn/themes/midnight.tokens.json +534 -0
- package/dist/cdn/themes/minimal-dark.tokens.json +294 -0
- package/dist/cdn/themes/minimal.tokens.json +494 -0
- package/dist/cdn/themes/modern-dark.tokens.json +490 -0
- package/dist/cdn/themes/modern.tokens.json +573 -0
- package/dist/cdn/themes/nes-dark.tokens.json +564 -0
- package/dist/cdn/themes/nes.css +1 -1
- package/dist/cdn/themes/nes.tokens.json +687 -0
- package/dist/cdn/themes/neumorphism-dark.tokens.json +471 -0
- package/dist/cdn/themes/neumorphism.css +1 -1
- package/dist/cdn/themes/neumorphism.tokens.json +589 -0
- package/dist/cdn/themes/nord-dark.tokens.json +484 -0
- package/dist/cdn/themes/nord.tokens.json +619 -0
- package/dist/cdn/themes/organic-dark.tokens.json +532 -0
- package/dist/cdn/themes/organic.tokens.json +685 -0
- package/dist/cdn/themes/rose-pine-dark.tokens.json +472 -0
- package/dist/cdn/themes/rose-pine.tokens.json +608 -0
- package/dist/cdn/themes/rough-dark.tokens.json +515 -0
- package/dist/cdn/themes/rough.css +1 -1
- package/dist/cdn/themes/rough.tokens.json +650 -0
- package/dist/cdn/themes/solarized-dark.tokens.json +397 -0
- package/dist/cdn/themes/solarized.tokens.json +532 -0
- package/dist/cdn/themes/starbucks.css +2 -0
- package/dist/cdn/themes/starbucks.tokens.json +593 -0
- package/dist/cdn/themes/startup-dark.tokens.json +522 -0
- package/dist/cdn/themes/startup.css +1 -1
- package/dist/cdn/themes/startup.tokens.json +607 -0
- package/dist/cdn/themes/super2026-dark.tokens.json +667 -0
- package/dist/cdn/themes/super2026.tokens.json +863 -0
- package/dist/cdn/themes/swiss-dark.tokens.json +390 -0
- package/dist/cdn/themes/swiss.tokens.json +750 -0
- package/dist/cdn/themes/terminal.css +1 -1
- package/dist/cdn/themes/terminal.tokens.json +689 -0
- package/dist/cdn/themes/tokyo-night-dark.tokens.json +472 -0
- package/dist/cdn/themes/tokyo-night.tokens.json +608 -0
- package/dist/cdn/themes/vaporwave-dark.tokens.json +413 -0
- package/dist/cdn/themes/vaporwave.tokens.json +549 -0
- package/dist/cdn/themes/win9x-dark.tokens.json +563 -0
- package/dist/cdn/themes/win9x.tokens.json +700 -0
- package/dist/cdn/vanilla-breeze-charts.css +1 -1
- package/dist/cdn/vanilla-breeze-charts.js +58 -36
- package/dist/cdn/vanilla-breeze-core.css +1 -1
- package/dist/cdn/vanilla-breeze-core.js +246 -51
- package/dist/cdn/vanilla-breeze-dev.js +1 -1
- package/dist/cdn/vanilla-breeze-extras.js +90 -80
- package/dist/cdn/vanilla-breeze.css +1 -1
- package/dist/cdn/vanilla-breeze.js +1370 -405
- package/package.json +12 -4
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{for(var a in e)oe(t,a,{get:e[a],enumerable:!0})};var ie={};le(ie,{SoundManager:()=>ye});var ne,z,ye,re=ce(()=>{ne="vb-sound",z={enabled:!1,volume:.5},ye={_ctx:null,_enabled:!1,_volume:.5,_initialized:!1,init(){if(this._initialized)return this;let t=this._load();return this._enabled=t.enabled,this._volume=t.volume,this._initialized=!0,this},_getContext(){return this._ctx||(this._ctx=new(window.AudioContext||window.webkitAudioContext)),this._ctx.state==="suspended"&&this._ctx.resume(),this._ctx},_load(){try{let t=localStorage.getItem(ne);return t?{...z,...JSON.parse(t)}:{...z}}catch{return{...z}}},_save(t){try{let e=this._load();localStorage.setItem(ne,JSON.stringify({...e,...t}))}catch{}},_playTone(t,e,a="sine"){if(!this._enabled)return;let s=this._getContext(),r=s.createOscillator(),i=s.createGain();r.connect(i),i.connect(s.destination),r.frequency.value=t,r.type=a,i.gain.value=this._volume*.3,r.start(),i.gain.exponentialRampToValueAtTime(.01,s.currentTime+e),r.stop(s.currentTime+e)},enable(){this._enabled=!0,this._save({enabled:!0}),this.play("click")},disable(){this._enabled=!1,this._save({enabled:!1})},toggle(){return this._enabled?this.disable():this.enable(),this._enabled},isEnabled(){return this._enabled},setVolume(t){this._volume=Math.max(0,Math.min(1,t)),this._save({volume:this._volume})},getVolume(){return this._volume},play(t){if(this._enabled)switch(t){case"click":this._playTone(800,.1);break;case"success":this._playTone(523,.1),setTimeout(()=>this._playTone(659,.1),100),setTimeout(()=>this._playTone(784,.15),200);break;case"error":this._playTone(200,.15,"sawtooth"),setTimeout(()=>this._playTone(180,.2,"sawtooth"),150);break;case"notification":this._playTone(880,.1),setTimeout(()=>this._playTone(1100,.15),100);break;case"soft":this._playTone(600,.05);break;case"tick":this._playTone(1200,.02,"square");break}},getState(){return{enabled:this._enabled,volume:this._volume}}}});var be=window.matchMedia("(prefers-reduced-motion: reduce)");var X=new Map;function K(t,e,a={}){let s=a.priority??10,r={impl:e,bundle:a.bundle,contract:a.contract,priority:s},i=X.get(t);if(customElements.get(t)){if(!i||i.priority>=s){i&&i.priority===s&&i.impl!==e&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${i.bundle}" (priority ${i.priority}). Skipping "${a.bundle}".`);return}console.warn(`[VB Bundle] Tag <${t}> defined by "${i.bundle}" cannot be replaced (customElements.define is permanent). "${a.bundle}" has higher priority but arrived late.`);return}if(i&&i.priority>=s){i.priority===s&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${i.bundle}". Skipping "${a.bundle}" (first wins at equal priority).`);return}X.set(t,r),customElements.define(t,e)}var T=class extends HTMLElement{#i=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let e of this.#i)e();this.#i=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,a,s,r){e.addEventListener(a,s,r),this.#i.push(()=>e.removeEventListener(a,s,r))}setup(){}teardown(){}};var y=new Map,F=new Map;var J=null;function Q(){if(typeof window<"u"&&window.__VB_THEME_BASE)return String(window.__VB_THEME_BASE).replace(/\/$/,"");if(J)return J;if(typeof document<"u"){let t=document.querySelectorAll('script[src*="vanilla-breeze"]');for(let e of t){let a=e.getAttribute("src");if(a){let s=a.lastIndexOf("/");if(s!==-1)return a.slice(0,s)}}}return"/cdn"}var de=new Set(["default","a11y-high-contrast","a11y-large-text","a11y-dyslexia","modern","minimal","classic"]),he=new Set(["kawaii","memphis"]);function P(t){return he.has(t)}function me(t,e){return`${e}/themes/${t}.css`}function Z(t,e){if(!P(t))return Promise.resolve();if(F.has(t))return F.get(t);let a=import(`${e}/packs/${t}.full.js`).catch(()=>{});return F.set(t,a),a}function ue(t,e){let a=Q(),s=()=>{(P(e)||t.hasAttribute("data-vb-pack"))&&Z(e,a)};return t.getAttribute("data-vb-theme-state")==="error"?Promise.reject(new Error(`Failed to load theme: ${e}`)):t.getAttribute("data-vb-theme-state")==="ready"||t.sheet?(s(),Promise.resolve()):new Promise((r,i)=>{let n=()=>{t.setAttribute("data-vb-theme-state","ready"),c(),s(),r()},o=()=>{t.setAttribute("data-vb-theme-state","error"),y.delete(e),c(),i(new Error(`Failed to load theme: ${e}`))},c=()=>{t.removeEventListener("load",n),t.removeEventListener("error",o)};t.addEventListener("load",n,{once:!0}),t.addEventListener("error",o,{once:!0})})}async function B(t){if(!t||de.has(t))return;if(y.has(t))return y.get(t);if(typeof document<"u"){let s=document.querySelector(`link[data-vb-theme="${t}"]`);if(s){let r=ue(s,t);return y.set(t,r),r}}let e=Q(),a=P(t)?ge(t,e):pe(t,e);return y.set(t,a),a}async function pe(t,e){let a=me(t,e);return new Promise((s,r)=>{let i=document.querySelector(`link[data-vb-theme-preload="${t}"]`);i&&i.remove();let n=document.createElement("link");n.rel="stylesheet",n.href=a,n.setAttribute("data-vb-theme",t),n.setAttribute("data-vb-theme-state","loading"),n.onload=()=>{n.setAttribute("data-vb-theme-state","ready"),s()},n.onerror=()=>{n.setAttribute("data-vb-theme-state","error"),n.remove(),y.delete(t),r(new Error(`Failed to load theme: ${t}`))},document.head.appendChild(n)})}function ge(t,e){let a=`${e}/packs/${t}.theme.css`,s=`${e}/packs/${t}.effects.css`;return new Promise((r,i)=>{let n=document.querySelector(`link[data-vb-theme-preload="${t}"]`);n&&n.remove();let o=document.createElement("link");o.rel="stylesheet",o.href=a,o.setAttribute("data-vb-theme",t),o.setAttribute("data-vb-pack",t),o.setAttribute("data-vb-theme-state","loading"),o.onload=()=>{o.setAttribute("data-vb-theme-state","ready");let c=document.createElement("link");c.rel="stylesheet",c.href=s,c.setAttribute("data-vb-pack-effects",t),document.head.appendChild(c),Z(t,e),r()},o.onerror=()=>{o.setAttribute("data-vb-theme-state","error"),o.remove(),y.delete(t),i(new Error(`Failed to load pack: ${t}`))},document.head.appendChild(o)})}var D=[{id:"auto",name:"Auto",icon:"monitor"},{id:"light",name:"Light",icon:"sun"},{id:"dark",name:"Dark",icon:"moon"}],E=[{id:"default",name:"Default",swatchBg:"#3b82f6",seeds:{}},{id:"ocean",name:"Ocean",swatchBg:"#0891b2",seeds:{"--hue-primary":200,"--hue-secondary":180,"--hue-accent":45,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"45%","--chroma-secondary":.1,"--lightness-accent":"70%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"forest",name:"Forest",swatchBg:"#059669",seeds:{"--hue-primary":145,"--hue-secondary":90,"--hue-accent":30,"--lightness-primary":"45%","--chroma-primary":.15,"--lightness-secondary":"55%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"55%","--chroma-primary":.12}},{id:"sunset",name:"Sunset",swatchBg:"#ea580c",seeds:{"--hue-primary":25,"--hue-secondary":0,"--hue-accent":280,"--lightness-primary":"60%","--chroma-primary":.2,"--lightness-secondary":"55%","--chroma-secondary":.18,"--lightness-accent":"55%","--chroma-accent":.18},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.16}},{id:"rose",name:"Rose",swatchBg:"#e11d48",seeds:{"--hue-primary":350,"--hue-secondary":330,"--hue-accent":200,"--lightness-primary":"55%","--chroma-primary":.18,"--lightness-secondary":"50%","--chroma-secondary":.14,"--lightness-accent":"60%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.14}},{id:"lavender",name:"Lavender",swatchBg:"#a855f7",seeds:{"--hue-primary":280,"--hue-secondary":300,"--hue-accent":60,"--lightness-primary":"55%","--chroma-primary":.14,"--lightness-secondary":"50%","--chroma-secondary":.12,"--lightness-accent":"70%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.12}},{id:"coral",name:"Coral",swatchBg:"#f97316",seeds:{"--hue-primary":15,"--hue-secondary":25,"--hue-accent":180,"--lightness-primary":"60%","--chroma-primary":.18,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"55%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.15}},{id:"slate",name:"Slate",swatchBg:"#64748b",seeds:{"--hue-primary":220,"--hue-secondary":210,"--hue-accent":45,"--lightness-primary":"48%","--chroma-primary":.1,"--lightness-secondary":"45%","--chroma-secondary":.06,"--lightness-accent":"68%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.08}},{id:"emerald",name:"Emerald",swatchBg:"#10b981",seeds:{"--hue-primary":160,"--hue-secondary":140,"--hue-accent":30,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"48%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"amber",name:"Amber",swatchBg:"#f59e0b",seeds:{"--hue-primary":45,"--hue-secondary":30,"--hue-accent":240,"--lightness-primary":"60%","--chroma-primary":.16,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"52%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"68%","--chroma-primary":.14}},{id:"indigo",name:"Indigo",swatchBg:"#6366f1",seeds:{"--hue-primary":250,"--hue-secondary":270,"--hue-accent":35,"--lightness-primary":"48%","--chroma-primary":.18,"--lightness-secondary":"45%","--chroma-secondary":.14,"--lightness-accent":"68%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"62%","--chroma-primary":.14}}],A=[{id:"default",name:"Default",hue:210,shape:"balanced",character:"The default",swatchBg:"#3b82f6",tier:"core"},{id:"modern",name:"Modern",hue:270,shape:"rounded",character:"Vibrant & elevated",swatchBg:"#6366f1",tier:"core"},{id:"minimal",name:"Minimal",hue:240,shape:"sharp",character:"Clean & flat",swatchBg:"#71717a",tier:"core"},{id:"classic",name:"Classic",hue:220,shape:"subtle",character:"Serif & elegant",swatchBg:"#92400e",tier:"core"}],L=[{id:"swiss",name:"Swiss",icon:"grid-3x3",character:"Precision grid",swatchBg:"#ff3e00",swatchFg:"white",tier:"showcase",category:"Design"},{id:"brutalist",name:"Brutalist",icon:"square",character:"Raw, industrial",swatchBg:"#1a1a1a",swatchFg:"#f5f5f5",tier:"showcase",category:"Design"},{id:"art-deco",name:"Art Deco",icon:"crown",character:"1920s luxury",swatchBg:"#1A1A1A",swatchFg:"#C9A84C",tier:"showcase",category:"Design"},{id:"editorial",name:"Editorial",icon:"newspaper",character:"Magazine elegance",swatchBg:"#1a1a1a",swatchFg:"#c9a227",tier:"showcase",category:"Content"},{id:"genai",name:"GenAI",icon:"sparkles",character:"AI aesthetic",swatchBg:"#1a0a2e",swatchFg:"#a855f7",tier:"showcase",category:"Modern"},{id:"glassmorphism",name:"Glass",icon:"glass-water",character:"Frosted surfaces",swatchBg:"#667eea",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"startup",name:"Startup",icon:"rocket",character:"SaaS energy",swatchBg:"#4f46e5",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"organic",name:"Organic",icon:"leaf",character:"Natural, handcrafted",swatchBg:"#2d5016",swatchFg:"#faf5e6",tier:"showcase",category:"Creative"},{id:"rough",name:"Rough",icon:"pencil",character:"Hand-drawn sketch",swatchBg:"#f5f0e8",swatchFg:"#3a3a3a",tier:"showcase",category:"Creative"},{id:"cyber",name:"Cyber",icon:"zap",character:"Neon futuristic",swatchBg:"#0a0a1a",swatchFg:"#00ff88",tier:"showcase",category:"Creative"},{id:"vaporwave",name:"Vaporwave",icon:"radio",character:"Neon dreamy",swatchBg:"#2b0040",swatchFg:"#ff6ad5",tier:"showcase",category:"Aesthetic"},{id:"neumorphism",name:"Neumorph",icon:"circle",character:"Soft embossed",swatchBg:"#e0e0e0",swatchFg:"#a0a0a0",tier:"showcase",category:"Aesthetic"},{id:"bauhaus",name:"Bauhaus",icon:"shapes",character:"Geometric",swatchBg:"#F1FAEE",swatchFg:"#E63946",tier:"showcase",category:"Aesthetic"},{id:"claymorphism",name:"Clay",icon:"circle-dot",character:"Puffy 3D",swatchBg:"#f0f0f5",swatchFg:"#FF6B9D",tier:"showcase",category:"Aesthetic"},{id:"alpha1999",name:"Alpha1999",icon:"orbit",character:"Space retro-fi",swatchBg:"#0a0a14",swatchFg:"#d4880f",tier:"showcase",category:"Signature"},{id:"super2026",name:"Super2026",icon:"triangle",character:"Supergraphic bold",swatchBg:"#f5f0e6",swatchFg:"#c23616",tier:"showcase",category:"Signature"},{id:"magna",name:"Magna",icon:"orbit",character:"Odyssey 2 retro",swatchBg:"#0d0b14",swatchFg:"#f97316",tier:"showcase",category:"Signature"},{id:"win9x",name:"Win9x",icon:"monitor",character:"Classic desktop",swatchBg:"#008080",swatchFg:"#c0c0c0",tier:"showcase",category:"OS Styles"},{id:"nes",name:"NES",icon:"joystick",character:"Console pixels",swatchBg:"#bcbcbc",swatchFg:"#e40521",tier:"showcase",category:"OS Styles"},{id:"8bit",name:"8-Bit",icon:"gamepad-2",character:"Retro pixel art",swatchBg:"#000080",swatchFg:"#ffff00",tier:"showcase",category:"OS Styles"}],S=[{id:"nord",name:"Nord",icon:"snowflake",character:"Arctic calm",swatchBg:"#2E3440",swatchFg:"#81A1C1",tier:"community",category:"Editor Palettes"},{id:"solarized",name:"Solarized",icon:"sun-dim",character:"Engineered precision",swatchBg:"#002B36",swatchFg:"#268BD2",tier:"community",category:"Editor Palettes"},{id:"dracula",name:"Dracula",icon:"moon-star",character:"Dark elegance",swatchBg:"#282A36",swatchFg:"#BD93F9",tier:"community",category:"Editor Palettes"},{id:"catppuccin-mocha",name:"Catppuccin",icon:"coffee",character:"Warm pastels",swatchBg:"#1E1E2E",swatchFg:"#CBA6F7",tier:"community",category:"Editor Palettes"},{id:"catppuccin-latte",name:"Ctp Latte",icon:"coffee",character:"Cozy daytime",swatchBg:"#eff1f5",swatchFg:"#8839ef",tier:"community",category:"Editor Palettes"},{id:"catppuccin-frappe",name:"Ctp Frapp\xE9",icon:"coffee",character:"Cool twilight",swatchBg:"#303446",swatchFg:"#ca9ee6",tier:"community",category:"Editor Palettes"},{id:"catppuccin-macchiato",name:"Ctp Macchiato",icon:"coffee",character:"Deep blue",swatchBg:"#24273a",swatchFg:"#c6a0f6",tier:"community",category:"Editor Palettes"},{id:"gruvbox",name:"Gruvbox",icon:"palette",character:"Retro warmth",swatchBg:"#282828",swatchFg:"#ebdbb2",tier:"community",category:"Editor Palettes"},{id:"tokyo-night",name:"Tokyo Night",icon:"moon",character:"Night-owl vibes",swatchBg:"#1a1b26",swatchFg:"#7aa2f7",tier:"community",category:"Editor Palettes"},{id:"rose-pine",name:"Ros\xE9 Pine",icon:"flower-2",character:"Muted elegance",swatchBg:"#191724",swatchFg:"#ebbcba",tier:"community",category:"Editor Palettes"},{id:"cottagecore",name:"Cottagecore",icon:"flower-2",character:"Pastoral",swatchBg:"#fdf8f0",swatchFg:"#7d8c6d",tier:"community",category:"Niche"},{id:"terminal",name:"Terminal",icon:"terminal",character:"Retro CRT",swatchBg:"#0d1117",swatchFg:"#00ff00",tier:"community",category:"Niche"},{id:"clinical",name:"Clinical",icon:"heart-pulse",character:"Sterile precision",swatchBg:"#ffffff",swatchFg:"#0077b6",tier:"community",category:"Industry"},{id:"financial",name:"Financial",icon:"landmark",character:"Navy + gold",swatchBg:"#1b2a4a",swatchFg:"#c9a84c",tier:"community",category:"Industry"},{id:"government",name:"Government",icon:"shield",character:"Official",swatchBg:"#002868",swatchFg:"#bf0a30",tier:"community",category:"Industry"},{id:"dawn",name:"Dawn",icon:"sunrise",character:"Golden morning",swatchBg:"#fef3e2",swatchFg:"#d4a574",tier:"community",category:"Mood/Time"},{id:"dusk",name:"Dusk",icon:"sunset",character:"Twilight",swatchBg:"#1a1b2e",swatchFg:"#e5a858",tier:"community",category:"Mood/Time"},{id:"midnight",name:"Midnight",icon:"moon",character:"Deep night",swatchBg:"#0d1117",swatchFg:"#58a6ff",tier:"community",category:"Mood/Time"},{id:"high-noon",name:"High Noon",icon:"sun",character:"Maximum bright",swatchBg:"#ffffff",swatchFg:"#e63946",tier:"community",category:"Mood/Time"}],ee=[{id:"kawaii",name:"Kawaii",icon:"heart",character:"Cute aesthetic",swatchBg:"#ffb7c5",swatchFg:"#ff69b4",tier:"showcase",category:"Packs"},{id:"memphis",name:"Memphis",icon:"star",character:"Bold patterns",swatchBg:"#FFF8F0",swatchFg:"#d03040",tier:"showcase",category:"Packs"}],O=[{id:"",name:"Fixed",icon:"ruler",description:"Static token values"},{id:"default",name:"Fluid",icon:"move-diagonal-2",description:"Smooth viewport scaling"},{id:"compact",name:"Compact",icon:"minimize-2",description:"Tighter fluid range"},{id:"spacious",name:"Spacious",icon:"maximize-2",description:"Generous fluid range"}],R=[{id:"a11y-high-contrast",name:"High Contrast",icon:"contrast",description:"AAA contrast (7:1+)"},{id:"a11y-large-text",name:"Large Text",icon:"type",description:"25% larger fonts"},{id:"a11y-dyslexia",name:"Dyslexia",icon:"book-open",description:"Readable typography"}],I=[{id:"motionFx",name:"Motion Effects",icon:"sparkles",description:"Hover & enter animations"},{id:"sounds",name:"Sound Effects",icon:"volume-2",description:"Audio feedback"}],$e=[...L,...S],ke=[...A,...L,...S,...ee],w=t=>L.filter(e=>e.category===t),q=[{label:"Style",themes:A,tier:"core"},{label:"Design",themes:w("Design"),tier:"showcase"},{label:"Content",themes:w("Content"),tier:"showcase"},{label:"Modern",themes:w("Modern"),tier:"showcase"},{label:"Creative",themes:w("Creative"),tier:"showcase"},{label:"Aesthetic",themes:w("Aesthetic"),tier:"showcase"},{label:"Signature",themes:w("Signature"),tier:"showcase"},{label:"OS Styles",themes:w("OS Styles"),tier:"showcase"},{label:"Packs",themes:ee,tier:"showcase"},{label:"More Themes",themes:S,tier:"community"}];function fe(){let t=globalThis.localStorage;if(!t)throw new Error("VBStore: localStorage is not available in this environment");return{async getRaw(e){return t.getItem(e)},async setRaw(e,a){t.setItem(e,a)},async removeRaw(e){t.removeItem(e)},async keys(e){let a=[];for(let s=0;s<t.length;s++){let r=t.key(s);r&&r.startsWith(e)&&a.push(r)}return a}}}var C=null;function f(){return C||(C=fe()),C}function H(t,e){if(typeof t!="string"||!t)throw new TypeError("VBStore: namespace must be a non-empty string");if(typeof e!="string"||!e)throw new TypeError("VBStore: key must be a non-empty string");return`vb:${t}:${e}`}function te(t){if(typeof t!="string"||!t)throw new TypeError("VBStore: namespace must be a non-empty string");return`vb:${t}:`}function ae(t){try{let e=JSON.parse(t);if(e&&typeof e=="object"&&typeof e.timestamp=="number")return e}catch{}return null}var p={configure(t={}){C=t.backend??null},async set(t,e,a){let s={data:a,timestamp:Date.now()};await f().setRaw(H(t,e),JSON.stringify(s))},async get(t,e,a){let s=await f().getRaw(H(t,e));if(s==null)return null;let r=ae(s);return!r||a?.maxAge!=null&&Date.now()-r.timestamp>a.maxAge?null:r.data},async remove(t,e){await f().removeRaw(H(t,e))},async list(t){let e=te(t),a=await f().keys(e),s=[];for(let r of a){let i=await f().getRaw(r);if(i==null)continue;let n=ae(i);n&&s.push({key:r.slice(e.length),data:n.data,timestamp:n.timestamp})}return s},async clear(t){let e=te(t),a=await f().keys(e);for(let s of a)await f().removeRaw(s)},async clearAll(){let t=await f().keys("vb:");for(let e of t)await f().removeRaw(e)},async setMany(t,e){for(let[a,s]of e)await p.set(t,a,s)}};var j="theme",V="current",b={mode:"auto",brand:"default",accent:"default",borderStyle:"",iconSet:"",fluid:"",backdrop:"",backdropChrome:"",pageBgType:"",pageBgColor:"",pageBgGradStart:"",pageBgGradEnd:"",pageBgGradDir:""},se=["--hue-primary","--hue-secondary","--hue-accent","--lightness-primary","--chroma-primary","--lightness-secondary","--chroma-secondary","--lightness-accent","--chroma-accent"],d=null,m={_initPromise:null,async init(){return this._initPromise?this._initPromise:(this._initPromise=(async()=>{let t=await p.get(j,V);d=t?{...b,...t}:{...b};try{await B(d.brand)}catch{d.brand="default"}return this.apply(d),this._watchSystemPreference(),this._watchRootAttributes(),d})(),this._initPromise)},load(){return d?{...d}:{...b}},save(t){let e={...d??b,...t};return d=e,p.set(j,V,e).catch(()=>{}),e},apply({mode:t="auto",brand:e="default",borderStyle:a="",iconSet:s="",fluid:r="",backdrop:i="",backdropChrome:n="",pageBgType:o="",pageBgColor:c="",pageBgGradStart:g="",pageBgGradEnd:u="",pageBgGradDir:h=""}={}){let l=document.documentElement;l.dataset.mode=t==="auto"?this.getEffectiveMode():t;let N=(l.dataset.theme||"").split(" ").filter(M=>M.startsWith("a11y-")),Y=e!=="default"?[e,...N]:[...N];Y.length?l.dataset.theme=Y.join(" "):delete l.dataset.theme;let $=a||this._readCSSHint("--theme-border-style");$&&$!=="clean"?l.dataset.borderStyle=$:delete l.dataset.borderStyle;let k=s||this._readCSSHint("--theme-icon-set");if(k&&k!=="lucide"?l.dataset.iconSet=k:delete l.dataset.iconSet,r?l.dataset.fluid=r:delete l.dataset.fluid,i?l.dataset.backdrop=i:delete l.dataset.backdrop,n&&n!=="card"?l.dataset.backdropChrome=n:delete l.dataset.backdropChrome,o==="color"&&c)l.style.setProperty("--page-bg-color",c),l.style.removeProperty("--page-bg-gradient");else if(o==="gradient"&&g&&u){let M=h||"to bottom";l.style.setProperty("--page-bg-gradient",`linear-gradient(${M}, ${g}, ${u})`),l.style.removeProperty("--page-bg-color")}else l.style.removeProperty("--page-bg-color"),l.style.removeProperty("--page-bg-gradient");let W=this.load().accent||"default";this._applyAccent(W),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{mode:t,brand:e,accent:W,borderStyle:$,iconSet:k,fluid:r,backdrop:i,backdropChrome:n,pageBgType:o,effectiveMode:this.getEffectiveMode()}}))},setMode(t){let e=this.save({mode:t});this.apply(e)},async setBrand(t){try{await B(t)}catch(a){console.warn(`[VB] Theme "${t}" failed to load, using default`,a),t="default"}let e=this.save({brand:t});this.apply(e)},setAccent(t){this.save({accent:t}),this._applyAccent(t),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}}))},setBorderStyle(t){let e=this.save({borderStyle:t});this.apply(e)},setIconSet(t){let e=this.save({iconSet:t});this.apply(e)},setFluid(t){let e=this.save({fluid:t});this.apply(e)},setBackdrop(t){let e=this.save({backdrop:t});this.apply(e)},setBackdropChrome(t){let e=this.save({backdropChrome:t});this.apply(e)},setPageBg({type:t="",color:e="",gradStart:a="",gradEnd:s="",gradDir:r=""}={}){let i=this.save({pageBgType:t,pageBgColor:e,pageBgGradStart:a,pageBgGradEnd:s,pageBgGradDir:r});this.apply(i)},getEffectiveMode(){let{mode:t}=this.load();return t!=="auto"?t:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"},getState(){let{mode:t,brand:e,accent:a,borderStyle:s,iconSet:r,fluid:i,backdrop:n,backdropChrome:o,pageBgType:c,pageBgColor:g,pageBgGradStart:u,pageBgGradEnd:h,pageBgGradDir:l}=this.load();return{mode:t,brand:e,accent:a,borderStyle:s,iconSet:r,fluid:i,backdrop:n,backdropChrome:o,pageBgType:c,pageBgColor:g,pageBgGradStart:u,pageBgGradEnd:h,pageBgGradDir:l,effectiveMode:this.getEffectiveMode()}},toggleMode(){let e=this.getEffectiveMode()==="dark"?"light":"dark";this.setMode(e)},reset(){d={...b},p.remove(j,V).catch(()=>{});let t=document.documentElement;t.style.removeProperty("--page-bg-color"),t.style.removeProperty("--page-bg-gradient");for(let e of se)t.style.removeProperty(e);this.apply(b)},_readCSSHint(t){return getComputedStyle(document.documentElement).getPropertyValue(t).trim()},_applyAccent(t){let e=document.documentElement,a=E.find(s=>s.id===t);for(let s of se)e.style.removeProperty(s);if(!(!a||!a.seeds||Object.keys(a.seeds).length===0)){for(let[s,r]of Object.entries(a.seeds))e.style.setProperty(s,String(r));if(a.seedsDark&&this.getEffectiveMode()==="dark")for(let[s,r]of Object.entries(a.seedsDark))e.style.setProperty(s,String(r))}},_watchRootAttributes(){this._rootObserver||(this._rootObserver=new MutationObserver(t=>{for(let e of t)e.attributeName==="data-theme"?this._syncFromDataTheme():e.attributeName==="data-mode"&&this._syncFromDataMode()}),this._rootObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme","data-mode"]}))},_syncFromDataTheme(){if(!d)return;let a=(document.documentElement.dataset.theme||"").split(/\s+/).filter(Boolean).find(s=>!s.startsWith("a11y-"))||"default";a!==d.brand&&(d.brand=a,B(a).catch(()=>{}),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}})))},_syncFromDataMode(){if(!d)return;let t=document.documentElement.dataset.mode||"auto",e=d.mode==="auto"?this.getEffectiveMode():d.mode;t!==e&&(d.mode=t,window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}})))},_watchSystemPreference(){window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",()=>{let e=this.load();e.mode==="auto"&&this.apply(e)})}};var v=null,x="settings",_={motionFx:!0,sounds:!1},G=class t extends T{static#i=200;#t;#e;#a=!1;#s=!1;#g=!1;#c=null;#f=!1;#l=[];#r={..._};#n=()=>this.#E();async setup(){this.#s=this.getAttribute("variant")==="inline",this.#g=this.hasAttribute("compact"),await Promise.all([m.init(),this.#S()]),this.#$(),this.#A(),this.#v(),this.listen(window,"vb:theme-change",this.#I),this.#b(),this.#h()}async#S(){let[e,a]=await Promise.all([p.get(x,"a11y"),p.get(x,"extensions")]);this.#l=Array.isArray(e)?e:[],this.#r={..._,...a??{}}}teardown(){window.removeEventListener("scroll",this.#n,{capture:!0}),window.removeEventListener("resize",this.#n),this.#p()}#$(){this.#s||(this.#t=this.querySelector(":scope > [data-trigger]"),this.#t||(this.#t=this.querySelector(":scope > button")),this.#t||(this.#t=document.createElement("button"),this.#t.setAttribute("data-trigger",""),this.#t.innerHTML=`
|
|
1
|
+
var ce=Object.defineProperty;var le=(t,e)=>()=>(t&&(e=t(t=0)),e);var de=(t,e)=>{for(var a in e)ce(t,a,{get:e[a],enumerable:!0})};var re={};de(re,{SoundManager:()=>we});var ie,N,we,oe=le(()=>{ie="vb-sound",N={enabled:!1,volume:.5},we={_ctx:null,_enabled:!1,_volume:.5,_initialized:!1,init(){if(this._initialized)return this;let t=this._load();return this._enabled=t.enabled,this._volume=t.volume,this._initialized=!0,this},_getContext(){return this._ctx||(this._ctx=new(window.AudioContext||window.webkitAudioContext)),this._ctx.state==="suspended"&&this._ctx.resume(),this._ctx},_load(){try{let t=localStorage.getItem(ie);return t?{...N,...JSON.parse(t)}:{...N}}catch{return{...N}}},_save(t){try{let e=this._load();localStorage.setItem(ie,JSON.stringify({...e,...t}))}catch{}},_playTone(t,e,a="sine"){if(!this._enabled)return;let s=this._getContext(),i=s.createOscillator(),r=s.createGain();i.connect(r),r.connect(s.destination),i.frequency.value=t,i.type=a,r.gain.value=this._volume*.3,i.start(),r.gain.exponentialRampToValueAtTime(.01,s.currentTime+e),i.stop(s.currentTime+e)},enable(){this._enabled=!0,this._save({enabled:!0}),this.play("click")},disable(){this._enabled=!1,this._save({enabled:!1})},toggle(){return this._enabled?this.disable():this.enable(),this._enabled},isEnabled(){return this._enabled},setVolume(t){this._volume=Math.max(0,Math.min(1,t)),this._save({volume:this._volume})},getVolume(){return this._volume},play(t){if(this._enabled)switch(t){case"click":this._playTone(800,.1);break;case"success":this._playTone(523,.1),setTimeout(()=>this._playTone(659,.1),100),setTimeout(()=>this._playTone(784,.15),200);break;case"error":this._playTone(200,.15,"sawtooth"),setTimeout(()=>this._playTone(180,.2,"sawtooth"),150);break;case"notification":this._playTone(880,.1),setTimeout(()=>this._playTone(1100,.15),100);break;case"soft":this._playTone(600,.05);break;case"tick":this._playTone(1200,.02,"square");break}},getState(){return{enabled:this._enabled,volume:this._volume}}}});var Ee=window.matchMedia("(prefers-reduced-motion: reduce)");var J=new Map;function K(t,e,a={}){let s=a.priority??10,i={impl:e,bundle:a.bundle,contract:a.contract,priority:s},r=J.get(t);if(customElements.get(t)){if(!r||r.priority>=s){r&&r.priority===s&&r.impl!==e&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${a.bundle}".`);return}console.warn(`[VB Bundle] Tag <${t}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${a.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=s){r.priority===s&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${r.bundle}". Skipping "${a.bundle}" (first wins at equal priority).`);return}J.set(t,i),customElements.define(t,e)}var B=class extends HTMLElement{#i=[];#t;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let e of this.#i)e();this.#i=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,a,s,i){e.addEventListener(a,s,i),this.#i.push(()=>e.removeEventListener(a,s,i))}setup(){}teardown(){}setState(e,a){this.#t||(this.#t=this.attachInternals());let s=this.#t.states;try{a?s.add(e):s.delete(e)}catch{let i=`--${e}`;a?s.add(i):s.delete(i)}}_adoptInternals(e){this.#t||(this.#t=e)}};var w=new Map,O=new Map;var Q=null;function Z(){if(typeof window<"u"&&window.__VB_THEME_BASE)return String(window.__VB_THEME_BASE).replace(/\/$/,"");if(Q)return Q;if(typeof document<"u"){let t=document.querySelectorAll('script[src*="vanilla-breeze"]');for(let e of t){let a=e.getAttribute("src");if(a){let s=a.lastIndexOf("/");if(s!==-1)return a.slice(0,s)}}}return"/cdn"}var he=new Set(["default","a11y-high-contrast","a11y-large-text","a11y-dyslexia","modern","minimal","classic"]),me=new Set(["kawaii","memphis"]);function I(t){return me.has(t)}function ue(t,e){return`${e}/themes/${t}.css`}function ee(t,e){if(!I(t))return Promise.resolve();if(O.has(t))return O.get(t);let a=import(`${e}/packs/${t}.full.js`).catch(()=>{});return O.set(t,a),a}function pe(t,e){let a=Z(),s=()=>{(I(e)||t.hasAttribute("data-vb-pack"))&&ee(e,a)};return t.getAttribute("data-vb-theme-state")==="error"?Promise.reject(new Error(`Failed to load theme: ${e}`)):t.getAttribute("data-vb-theme-state")==="ready"||t.sheet?(s(),Promise.resolve()):new Promise((i,r)=>{let n=()=>{t.setAttribute("data-vb-theme-state","ready"),c(),s(),i(void 0)},o=()=>{t.setAttribute("data-vb-theme-state","error"),w.delete(e),c(),r(new Error(`Failed to load theme: ${e}`))},c=()=>{t.removeEventListener("load",n),t.removeEventListener("error",o)};t.addEventListener("load",n,{once:!0}),t.addEventListener("error",o,{once:!0})})}async function k(t){if(!t||he.has(t))return;if(w.has(t))return w.get(t);if(typeof document<"u"){let s=document.querySelector(`link[data-vb-theme="${t}"]`);if(s){let i=pe(s,t);return w.set(t,i),i}}let e=Z(),a=I(t)?fe(t,e):ge(t,e);return w.set(t,a),a}async function ge(t,e){let a=ue(t,e);return new Promise((s,i)=>{let r=document.querySelector(`link[data-vb-theme-preload="${t}"]`);r&&r.remove();let n=document.createElement("link");n.rel="stylesheet",n.href=a,n.setAttribute("data-vb-theme",t),n.setAttribute("data-vb-theme-state","loading"),n.onload=()=>{n.setAttribute("data-vb-theme-state","ready"),s()},n.onerror=()=>{n.setAttribute("data-vb-theme-state","error"),n.remove(),w.delete(t),i(new Error(`Failed to load theme: ${t}`))},document.head.appendChild(n)})}function fe(t,e){let a=`${e}/packs/${t}.theme.css`,s=`${e}/packs/${t}.effects.css`;return new Promise((i,r)=>{let n=document.querySelector(`link[data-vb-theme-preload="${t}"]`);n&&n.remove();let o=document.createElement("link");o.rel="stylesheet",o.href=a,o.setAttribute("data-vb-theme",t),o.setAttribute("data-vb-pack",t),o.setAttribute("data-vb-theme-state","loading"),o.onload=()=>{o.setAttribute("data-vb-theme-state","ready");let c=document.createElement("link");c.rel="stylesheet",c.href=s,c.setAttribute("data-vb-pack-effects",t),document.head.appendChild(c),ee(t,e),i()},o.onerror=()=>{o.setAttribute("data-vb-theme-state","error"),o.remove(),w.delete(t),r(new Error(`Failed to load pack: ${t}`))},document.head.appendChild(o)})}var R=[{id:"auto",name:"Auto",icon:"monitor"},{id:"light",name:"Light",icon:"sun"},{id:"dark",name:"Dark",icon:"moon"}],$=[{id:"default",name:"Default",swatchBg:"#3b82f6",seeds:{}},{id:"ocean",name:"Ocean",swatchBg:"#0891b2",seeds:{"--hue-primary":200,"--hue-secondary":180,"--hue-accent":45,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"45%","--chroma-secondary":.1,"--lightness-accent":"70%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"forest",name:"Forest",swatchBg:"#059669",seeds:{"--hue-primary":145,"--hue-secondary":90,"--hue-accent":30,"--lightness-primary":"45%","--chroma-primary":.15,"--lightness-secondary":"55%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"55%","--chroma-primary":.12}},{id:"sunset",name:"Sunset",swatchBg:"#ea580c",seeds:{"--hue-primary":25,"--hue-secondary":0,"--hue-accent":280,"--lightness-primary":"60%","--chroma-primary":.2,"--lightness-secondary":"55%","--chroma-secondary":.18,"--lightness-accent":"55%","--chroma-accent":.18},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.16}},{id:"rose",name:"Rose",swatchBg:"#e11d48",seeds:{"--hue-primary":350,"--hue-secondary":330,"--hue-accent":200,"--lightness-primary":"55%","--chroma-primary":.18,"--lightness-secondary":"50%","--chroma-secondary":.14,"--lightness-accent":"60%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.14}},{id:"lavender",name:"Lavender",swatchBg:"#a855f7",seeds:{"--hue-primary":280,"--hue-secondary":300,"--hue-accent":60,"--lightness-primary":"55%","--chroma-primary":.14,"--lightness-secondary":"50%","--chroma-secondary":.12,"--lightness-accent":"70%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.12}},{id:"coral",name:"Coral",swatchBg:"#f97316",seeds:{"--hue-primary":15,"--hue-secondary":25,"--hue-accent":180,"--lightness-primary":"60%","--chroma-primary":.18,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"55%","--chroma-accent":.12},seedsDark:{"--lightness-primary":"65%","--chroma-primary":.15}},{id:"slate",name:"Slate",swatchBg:"#64748b",seeds:{"--hue-primary":220,"--hue-secondary":210,"--hue-accent":45,"--lightness-primary":"48%","--chroma-primary":.1,"--lightness-secondary":"45%","--chroma-secondary":.06,"--lightness-accent":"68%","--chroma-accent":.15},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.08}},{id:"emerald",name:"Emerald",swatchBg:"#10b981",seeds:{"--hue-primary":160,"--hue-secondary":140,"--hue-accent":30,"--lightness-primary":"50%","--chroma-primary":.15,"--lightness-secondary":"48%","--chroma-secondary":.12,"--lightness-accent":"65%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"60%","--chroma-primary":.12}},{id:"amber",name:"Amber",swatchBg:"#f59e0b",seeds:{"--hue-primary":45,"--hue-secondary":30,"--hue-accent":240,"--lightness-primary":"60%","--chroma-primary":.16,"--lightness-secondary":"55%","--chroma-secondary":.15,"--lightness-accent":"52%","--chroma-accent":.14},seedsDark:{"--lightness-primary":"68%","--chroma-primary":.14}},{id:"indigo",name:"Indigo",swatchBg:"#6366f1",seeds:{"--hue-primary":250,"--hue-secondary":270,"--hue-accent":35,"--lightness-primary":"48%","--chroma-primary":.18,"--lightness-secondary":"45%","--chroma-secondary":.14,"--lightness-accent":"68%","--chroma-accent":.16},seedsDark:{"--lightness-primary":"62%","--chroma-primary":.14}}],x=[{id:"default",name:"Default",hue:210,shape:"balanced",character:"The default",swatchBg:"#3b82f6",tier:"core"},{id:"modern",name:"Modern",hue:270,shape:"rounded",character:"Vibrant & elevated",swatchBg:"#6366f1",tier:"core"},{id:"minimal",name:"Minimal",hue:240,shape:"sharp",character:"Clean & flat",swatchBg:"#71717a",tier:"core"},{id:"classic",name:"Classic",hue:220,shape:"subtle",character:"Serif & elegant",swatchBg:"#92400e",tier:"core"}],q=[{id:"swiss",name:"Swiss",icon:"grid-3x3",character:"Precision grid",swatchBg:"#ff3e00",swatchFg:"white",tier:"showcase",category:"Design"},{id:"brutalist",name:"Brutalist",icon:"square",character:"Raw, industrial",swatchBg:"#1a1a1a",swatchFg:"#f5f5f5",tier:"showcase",category:"Design"},{id:"art-deco",name:"Art Deco",icon:"crown",character:"1920s luxury",swatchBg:"#1A1A1A",swatchFg:"#C9A84C",tier:"showcase",category:"Design"},{id:"editorial",name:"Editorial",icon:"newspaper",character:"Magazine elegance",swatchBg:"#1a1a1a",swatchFg:"#c9a227",tier:"showcase",category:"Content"},{id:"genai",name:"GenAI",icon:"sparkles",character:"AI aesthetic",swatchBg:"#1a0a2e",swatchFg:"#a855f7",tier:"showcase",category:"Modern"},{id:"glassmorphism",name:"Glass",icon:"glass-water",character:"Frosted surfaces",swatchBg:"#667eea",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"startup",name:"Startup",icon:"rocket",character:"SaaS energy",swatchBg:"#4f46e5",swatchFg:"#ffffff",tier:"showcase",category:"Modern"},{id:"organic",name:"Organic",icon:"leaf",character:"Natural, handcrafted",swatchBg:"#2d5016",swatchFg:"#faf5e6",tier:"showcase",category:"Creative"},{id:"rough",name:"Rough",icon:"pencil",character:"Hand-drawn sketch",swatchBg:"#f5f0e8",swatchFg:"#3a3a3a",tier:"showcase",category:"Creative"},{id:"cyber",name:"Cyber",icon:"zap",character:"Neon futuristic",swatchBg:"#0a0a1a",swatchFg:"#00ff88",tier:"showcase",category:"Creative"},{id:"vaporwave",name:"Vaporwave",icon:"radio",character:"Neon dreamy",swatchBg:"#2b0040",swatchFg:"#ff6ad5",tier:"showcase",category:"Aesthetic"},{id:"neumorphism",name:"Neumorph",icon:"circle",character:"Soft embossed",swatchBg:"#e0e0e0",swatchFg:"#a0a0a0",tier:"showcase",category:"Aesthetic"},{id:"bauhaus",name:"Bauhaus",icon:"shapes",character:"Geometric",swatchBg:"#F1FAEE",swatchFg:"#E63946",tier:"showcase",category:"Aesthetic"},{id:"claymorphism",name:"Clay",icon:"circle-dot",character:"Puffy 3D",swatchBg:"#f0f0f5",swatchFg:"#FF6B9D",tier:"showcase",category:"Aesthetic"},{id:"alpha1999",name:"Alpha1999",icon:"orbit",character:"Space retro-fi",swatchBg:"#0a0a14",swatchFg:"#d4880f",tier:"showcase",category:"Signature"},{id:"super2026",name:"Super2026",icon:"triangle",character:"Supergraphic bold",swatchBg:"#f5f0e6",swatchFg:"#c23616",tier:"showcase",category:"Signature"},{id:"magna",name:"Magna",icon:"orbit",character:"Odyssey 2 retro",swatchBg:"#0d0b14",swatchFg:"#f97316",tier:"showcase",category:"Signature"},{id:"win9x",name:"Win9x",icon:"monitor",character:"Classic desktop",swatchBg:"#008080",swatchFg:"#c0c0c0",tier:"showcase",category:"OS Styles"},{id:"nes",name:"NES",icon:"joystick",character:"Console pixels",swatchBg:"#bcbcbc",swatchFg:"#e40521",tier:"showcase",category:"OS Styles"},{id:"8bit",name:"8-Bit",icon:"gamepad-2",character:"Retro pixel art",swatchBg:"#000080",swatchFg:"#ffff00",tier:"showcase",category:"OS Styles"}],T=[{id:"nord",name:"Nord",icon:"snowflake",character:"Arctic calm",swatchBg:"#2E3440",swatchFg:"#81A1C1",tier:"community",category:"Editor Palettes"},{id:"solarized",name:"Solarized",icon:"sun-dim",character:"Engineered precision",swatchBg:"#002B36",swatchFg:"#268BD2",tier:"community",category:"Editor Palettes"},{id:"dracula",name:"Dracula",icon:"moon-star",character:"Dark elegance",swatchBg:"#282A36",swatchFg:"#BD93F9",tier:"community",category:"Editor Palettes"},{id:"catppuccin-mocha",name:"Catppuccin",icon:"coffee",character:"Warm pastels",swatchBg:"#1E1E2E",swatchFg:"#CBA6F7",tier:"community",category:"Editor Palettes"},{id:"catppuccin-latte",name:"Ctp Latte",icon:"coffee",character:"Cozy daytime",swatchBg:"#eff1f5",swatchFg:"#8839ef",tier:"community",category:"Editor Palettes"},{id:"catppuccin-frappe",name:"Ctp Frapp\xE9",icon:"coffee",character:"Cool twilight",swatchBg:"#303446",swatchFg:"#ca9ee6",tier:"community",category:"Editor Palettes"},{id:"catppuccin-macchiato",name:"Ctp Macchiato",icon:"coffee",character:"Deep blue",swatchBg:"#24273a",swatchFg:"#c6a0f6",tier:"community",category:"Editor Palettes"},{id:"gruvbox",name:"Gruvbox",icon:"palette",character:"Retro warmth",swatchBg:"#282828",swatchFg:"#ebdbb2",tier:"community",category:"Editor Palettes"},{id:"tokyo-night",name:"Tokyo Night",icon:"moon",character:"Night-owl vibes",swatchBg:"#1a1b26",swatchFg:"#7aa2f7",tier:"community",category:"Editor Palettes"},{id:"rose-pine",name:"Ros\xE9 Pine",icon:"flower-2",character:"Muted elegance",swatchBg:"#191724",swatchFg:"#ebbcba",tier:"community",category:"Editor Palettes"},{id:"cottagecore",name:"Cottagecore",icon:"flower-2",character:"Pastoral",swatchBg:"#fdf8f0",swatchFg:"#7d8c6d",tier:"community",category:"Niche"},{id:"terminal",name:"Terminal",icon:"terminal",character:"Retro CRT",swatchBg:"#0d1117",swatchFg:"#00ff00",tier:"community",category:"Niche"},{id:"clinical",name:"Clinical",icon:"heart-pulse",character:"Sterile precision",swatchBg:"#ffffff",swatchFg:"#0077b6",tier:"community",category:"Industry"},{id:"financial",name:"Financial",icon:"landmark",character:"Navy + gold",swatchBg:"#1b2a4a",swatchFg:"#c9a84c",tier:"community",category:"Industry"},{id:"government",name:"Government",icon:"shield",character:"Official",swatchBg:"#002868",swatchFg:"#bf0a30",tier:"community",category:"Industry"},{id:"dawn",name:"Dawn",icon:"sunrise",character:"Golden morning",swatchBg:"#fef3e2",swatchFg:"#d4a574",tier:"community",category:"Mood/Time"},{id:"dusk",name:"Dusk",icon:"sunset",character:"Twilight",swatchBg:"#1a1b2e",swatchFg:"#e5a858",tier:"community",category:"Mood/Time"},{id:"midnight",name:"Midnight",icon:"moon",character:"Deep night",swatchBg:"#0d1117",swatchFg:"#58a6ff",tier:"community",category:"Mood/Time"},{id:"high-noon",name:"High Noon",icon:"sun",character:"Maximum bright",swatchBg:"#ffffff",swatchFg:"#e63946",tier:"community",category:"Mood/Time"}],te=[{id:"kawaii",name:"Kawaii",icon:"heart",character:"Cute aesthetic",swatchBg:"#ffb7c5",swatchFg:"#ff69b4",tier:"showcase",category:"Packs"},{id:"memphis",name:"Memphis",icon:"star",character:"Bold patterns",swatchBg:"#FFF8F0",swatchFg:"#d03040",tier:"showcase",category:"Packs"}],j=[{id:"",name:"Fixed",icon:"ruler",description:"Static token values"},{id:"default",name:"Fluid",icon:"move-diagonal-2",description:"Smooth viewport scaling"},{id:"compact",name:"Compact",icon:"minimize-2",description:"Tighter fluid range"},{id:"spacious",name:"Spacious",icon:"maximize-2",description:"Generous fluid range"}],H=[{id:"a11y-high-contrast",name:"High Contrast",icon:"contrast",description:"AAA contrast (7:1+)"},{id:"a11y-large-text",name:"Large Text",icon:"type",description:"25% larger fonts"},{id:"a11y-dyslexia",name:"Dyslexia",icon:"book-open",description:"Readable typography"}],V=[{id:"motionFx",name:"Motion Effects",icon:"sparkles",description:"Hover & enter animations"},{id:"sounds",name:"Sound Effects",icon:"volume-2",description:"Audio feedback"}],Te=[...q,...T],Ae=[...x,...q,...T,...te],b=t=>q.filter(e=>e.category===t),z=[{label:"Style",themes:x,tier:"core"},{label:"Design",themes:b("Design"),tier:"showcase"},{label:"Content",themes:b("Content"),tier:"showcase"},{label:"Modern",themes:b("Modern"),tier:"showcase"},{label:"Creative",themes:b("Creative"),tier:"showcase"},{label:"Aesthetic",themes:b("Aesthetic"),tier:"showcase"},{label:"Signature",themes:b("Signature"),tier:"showcase"},{label:"OS Styles",themes:b("OS Styles"),tier:"showcase"},{label:"Packs",themes:te,tier:"showcase"},{label:"More Themes",themes:T,tier:"community"}];function ye(){let t=globalThis.localStorage;if(!t)throw new Error("VBStore: localStorage is not available in this environment");return{async getRaw(e){return t.getItem(e)},async setRaw(e,a){t.setItem(e,a)},async removeRaw(e){t.removeItem(e)},async keys(e){let a=[];for(let s=0;s<t.length;s++){let i=t.key(s);i&&i.startsWith(e)&&a.push(i)}return a}}}var _=null;function g(){return _||(_=ye()),_}function G(t,e){if(typeof t!="string"||!t)throw new TypeError("VBStore: namespace must be a non-empty string");if(typeof e!="string"||!e)throw new TypeError("VBStore: key must be a non-empty string");return`vb:${t}:${e}`}function ae(t){if(typeof t!="string"||!t)throw new TypeError("VBStore: namespace must be a non-empty string");return`vb:${t}:`}function se(t){try{let e=JSON.parse(t);if(e&&typeof e=="object"&&typeof e.timestamp=="number")return e}catch{}return null}var u={configure(t={}){_=t.backend??null},async set(t,e,a){let s={data:a,timestamp:Date.now()};await g().setRaw(G(t,e),JSON.stringify(s))},async get(t,e,a){let s=await g().getRaw(G(t,e));if(s==null)return null;let i=se(s);return!i||a?.maxAge!=null&&Date.now()-i.timestamp>a.maxAge?null:i.data},async remove(t,e){await g().removeRaw(G(t,e))},async list(t){let e=ae(t),a=await g().keys(e),s=[];for(let i of a){let r=await g().getRaw(i);if(r==null)continue;let n=se(r);n&&s.push({key:i.slice(e.length),data:n.data,timestamp:n.timestamp})}return s},async clear(t){let e=ae(t),a=await g().keys(e);for(let s of a)await g().removeRaw(s)},async clearAll(){let t=await g().keys("vb:");for(let e of t)await g().removeRaw(e)},async setMany(t,e){for(let[a,s]of e)await u.set(t,a,s)}};var M="theme",F="current",v={mode:"auto",brand:"default",accent:"default",borderStyle:"",iconSet:"",fluid:"",backdrop:"",backdropChrome:"",pageBgType:"",pageBgColor:"",pageBgGradStart:"",pageBgGradEnd:"",pageBgGradDir:""},ne=["--hue-primary","--hue-secondary","--hue-accent","--lightness-primary","--chroma-primary","--lightness-secondary","--chroma-secondary","--lightness-accent","--chroma-accent"],d=null,h={_initPromise:null,async init(){return this._initPromise?this._initPromise:(this._initPromise=(async()=>{let t=await u.get(M,F);d=t?{...v,...t}:{...v};try{await k(d.brand)}catch{d.brand="default"}return this.apply(d),this._watchSystemPreference(),this._watchRootAttributes(),this._watchCrossDocumentStorage(),d})(),this._initPromise)},_watchCrossDocumentStorage(){typeof window>"u"||window.addEventListener("storage",async t=>{if(t.key!==`vb:${M}:${F}`||!t.newValue)return;let e;try{e=JSON.parse(t.newValue)?.data}catch{return}if(!e||typeof e!="object")return;let a={...v,...d,...e};if(a.brand&&a.brand!==d?.brand)try{await k(a.brand)}catch{a.brand="default"}d=a,this.apply(d||{})})},load(){return d?{...d}:{...v}},save(t){let e={...d??v,...t};return d=e,u.set(M,F,e).catch(()=>{}),e},apply({mode:t="auto",brand:e="default",borderStyle:a="",iconSet:s="",fluid:i="",backdrop:r="",backdropChrome:n="",pageBgType:o="",pageBgColor:c="",pageBgGradStart:p="",pageBgGradEnd:m="",pageBgGradDir:f=""}={}){let l=document.documentElement;l.dataset.mode=t==="auto"?this.getEffectiveMode():t;let S=(l.dataset.theme||"").split(" ").filter(L=>L.startsWith("a11y-")),Y=e!=="default"?[e,...S]:[...S];Y.length?l.dataset.theme=Y.join(" "):delete l.dataset.theme;let A=a||this._readCSSHint("--theme-border-style");A&&A!=="clean"?l.dataset.borderStyle=A:delete l.dataset.borderStyle;let C=s||this._readCSSHint("--theme-icon-set");if(C&&C!=="lucide"?l.dataset.iconSet=C:delete l.dataset.iconSet,i?l.dataset.fluid=i:delete l.dataset.fluid,r?l.dataset.backdrop=r:delete l.dataset.backdrop,n&&n!=="card"?l.dataset.backdropChrome=n:delete l.dataset.backdropChrome,o==="color"&&c)l.style.setProperty("--page-bg-color",c),l.style.removeProperty("--page-bg-gradient");else if(o==="gradient"&&p&&m){let L=f||"to bottom";l.style.setProperty("--page-bg-gradient",`linear-gradient(${L}, ${p}, ${m})`),l.style.removeProperty("--page-bg-color")}else l.style.removeProperty("--page-bg-color"),l.style.removeProperty("--page-bg-gradient");let X=this.load().accent||"default";this._applyAccent(X),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{mode:t,brand:e,accent:X,borderStyle:A,iconSet:C,fluid:i,backdrop:r,backdropChrome:n,pageBgType:o,effectiveMode:this.getEffectiveMode()}}))},setMode(t){let e=this.save({mode:t});this.apply(e)},async setBrand(t){try{await k(t)}catch(a){console.warn(`[VB] Theme "${t}" failed to load, using default`,a),t="default"}let e=this.save({brand:t});this.apply(e)},setAccent(t){this.save({accent:t}),this._applyAccent(t),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}}))},setBorderStyle(t){let e=this.save({borderStyle:t});this.apply(e)},setIconSet(t){let e=this.save({iconSet:t});this.apply(e)},setFluid(t){let e=this.save({fluid:t});this.apply(e)},setBackdrop(t){let e=this.save({backdrop:t});this.apply(e)},setBackdropChrome(t){let e=this.save({backdropChrome:t});this.apply(e)},setPageBg({type:t="",color:e="",gradStart:a="",gradEnd:s="",gradDir:i=""}={}){let r=this.save({pageBgType:t,pageBgColor:e,pageBgGradStart:a,pageBgGradEnd:s,pageBgGradDir:i});this.apply(r)},getEffectiveMode(){let{mode:t}=this.load();return t!=="auto"?t:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"},getState(){let{mode:t,brand:e,accent:a,borderStyle:s,iconSet:i,fluid:r,backdrop:n,backdropChrome:o,pageBgType:c,pageBgColor:p,pageBgGradStart:m,pageBgGradEnd:f,pageBgGradDir:l}=this.load();return{mode:t,brand:e,accent:a,borderStyle:s,iconSet:i,fluid:r,backdrop:n,backdropChrome:o,pageBgType:c,pageBgColor:p,pageBgGradStart:m,pageBgGradEnd:f,pageBgGradDir:l,effectiveMode:this.getEffectiveMode()}},toggleMode(){let e=this.getEffectiveMode()==="dark"?"light":"dark";this.setMode(e)},reset(){d={...v},u.remove(M,F).catch(()=>{});let t=document.documentElement;t.style.removeProperty("--page-bg-color"),t.style.removeProperty("--page-bg-gradient");for(let e of ne)t.style.removeProperty(e);this.apply(v)},_readCSSHint(t){return getComputedStyle(document.documentElement).getPropertyValue(t).trim()},_applyAccent(t){let e=document.documentElement,a=$.find(s=>s.id===t);for(let s of ne)e.style.removeProperty(s);if(!(!a||!a.seeds||Object.keys(a.seeds).length===0)){for(let[s,i]of Object.entries(a.seeds))e.style.setProperty(s,String(i));if(a.seedsDark&&this.getEffectiveMode()==="dark")for(let[s,i]of Object.entries(a.seedsDark))e.style.setProperty(s,String(i))}},_watchRootAttributes(){this._rootObserver||(this._rootObserver=new MutationObserver(t=>{for(let e of t)e.attributeName==="data-theme"?this._syncFromDataTheme():e.attributeName==="data-mode"&&this._syncFromDataMode()}),this._rootObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme","data-mode"]}))},_syncFromDataTheme(){if(!d)return;let a=(document.documentElement.dataset.theme||"").split(/\s+/).filter(Boolean).find(s=>!s.startsWith("a11y-"))||"default";a!==d.brand&&(d.brand=a,k(a).catch(()=>{}),window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}})))},_syncFromDataMode(){if(!d)return;let t=document.documentElement.dataset.mode||"auto",e=d.mode==="auto"?this.getEffectiveMode():d.mode;t!==e&&(d.mode=t,window.dispatchEvent(new CustomEvent("vb:theme-change",{detail:{...this.getState()}})))},_watchSystemPreference(){window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",()=>{let e=this.load();e.mode==="auto"&&this.apply(e)})}};var E=null,P="settings",D={motionFx:!0,sounds:!1},U=null;function be(){return U||(U=fetch("/cdn/themes/manifest.json",{credentials:"same-origin"}).then(t=>t.ok?t.json():null).catch(()=>null)),U}var W=class t extends B{static#i=200;#t;#e;#a=!1;#s=!1;#g=!1;#c=null;#f=!1;#l=[];#r={...D};#n=()=>this.#S();setup(){return this.#s=this.getAttribute("variant")==="inline",this.#g=this.hasAttribute("compact"),this.#k(),!0}async#k(){await Promise.all([h.init(),this.#$()]),this.#T(),this.#x(),this.#v(),this.#H(),this.listen(window,"vb:theme-change",this.#j),this.#b(),this.#h()}async#$(){let[e,a]=await Promise.all([u.get(P,"a11y"),u.get(P,"extensions")]);this.#l=Array.isArray(e)?e:[],this.#r={...D,...a??{}}}teardown(){window.removeEventListener("scroll",this.#n,{capture:!0}),window.removeEventListener("resize",this.#n),this.#p()}#T(){this.#s||(this.#t=this.querySelector(":scope > [data-trigger]"),this.#t||(this.#t=this.querySelector(":scope > button")),this.#t||(this.#t=document.createElement("button"),this.#t.setAttribute("data-trigger",""),this.#t.innerHTML=`
|
|
2
2
|
<icon-wc name="palette" label="Theme settings"></icon-wc>
|
|
3
|
-
`,this.prepend(this.#t)),this.#t.setAttribute("aria-haspopup","dialog"),this.#t.setAttribute("aria-expanded","false")),this.#e=document.createElement("div"),this.#e.className="panel",this.#e.setAttribute("role","dialog"),this.#e.setAttribute("aria-label","Theme settings"),this.#s||(this.#e.id=`theme-panel-${crypto.randomUUID().slice(0,8)}`,this.#t.setAttribute("aria-controls",this.#e.id)),this.#e.innerHTML=this.#
|
|
3
|
+
`,this.prepend(this.#t)),this.#t.setAttribute("aria-haspopup","dialog"),this.#t.setAttribute("aria-expanded","false")),this.#e=document.createElement("div"),this.#e.className="panel",this.#e.setAttribute("role","dialog"),this.#e.setAttribute("aria-label","Theme settings"),this.#s||(this.#e.id=`theme-panel-${crypto.randomUUID().slice(0,8)}`,this.#t.setAttribute("aria-controls",this.#e.id)),this.#e.innerHTML=this.#A(),this.appendChild(this.#e)}#A(){return this.#g?this.#B():this.#C()}#m(e,a){let s=e.swatchBg,i=e.swatchFg||"white",r=e.icon||"";return`
|
|
4
4
|
<label class="swatch-cell" title="${e.character?`${e.name} \u2014 ${e.character}`:e.name}">
|
|
5
5
|
<input
|
|
6
6
|
type="radio"
|
|
@@ -8,16 +8,16 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
8
8
|
value="${e.id}"
|
|
9
9
|
${a===e.id?"checked":""}
|
|
10
10
|
/>
|
|
11
|
-
<span class="swatch-visual" style="--swatch-bg: ${s}; --swatch-fg: ${
|
|
12
|
-
${
|
|
11
|
+
<span class="swatch-visual" style="--swatch-bg: ${s}; --swatch-fg: ${i}">
|
|
12
|
+
${r?`<icon-wc name="${r}"></icon-wc>`:""}
|
|
13
13
|
<span class="visually-hidden">${e.name}</span>
|
|
14
14
|
</span>
|
|
15
15
|
</label>
|
|
16
|
-
`}#
|
|
16
|
+
`}#C(){let{mode:e,brand:a,fluid:s,accent:i}=h.getState(),r=z.filter(n=>n.tier==="showcase");return`
|
|
17
17
|
<fieldset class="section">
|
|
18
18
|
<legend>Color Mode</legend>
|
|
19
19
|
<div class="options" role="radiogroup" aria-label="Color mode">
|
|
20
|
-
${
|
|
20
|
+
${R.map(n=>`
|
|
21
21
|
<label class="option">
|
|
22
22
|
<input
|
|
23
23
|
type="radio"
|
|
@@ -37,9 +37,9 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
37
37
|
<fieldset class="section">
|
|
38
38
|
<legend>Color Accent</legend>
|
|
39
39
|
<div class="options options--accent-dots" role="radiogroup" aria-label="Color accent">
|
|
40
|
-
${
|
|
40
|
+
${$.map(n=>`
|
|
41
41
|
<label class="accent-dot" title="${n.name}">
|
|
42
|
-
<input type="radio" name="theme-accent" value="${n.id}" ${
|
|
42
|
+
<input type="radio" name="theme-accent" value="${n.id}" ${i===n.id?"checked":""} />
|
|
43
43
|
<span class="accent-dot-visual" style="background: ${n.swatchBg}"></span>
|
|
44
44
|
<span class="visually-hidden">${n.name}</span>
|
|
45
45
|
</label>
|
|
@@ -50,13 +50,13 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
50
50
|
<fieldset class="section">
|
|
51
51
|
<legend>Style</legend>
|
|
52
52
|
<div class="options options--swatch-grid" role="radiogroup" aria-label="Style">
|
|
53
|
-
${
|
|
53
|
+
${x.map(n=>this.#m(n,a)).join("")}
|
|
54
54
|
</div>
|
|
55
55
|
</fieldset>
|
|
56
56
|
|
|
57
57
|
<fieldset class="section">
|
|
58
58
|
<legend>Featured</legend>
|
|
59
|
-
${
|
|
59
|
+
${r.map(n=>`
|
|
60
60
|
<div class="theme-category">
|
|
61
61
|
<span class="category-label">${n.label}</span>
|
|
62
62
|
<div class="options options--swatch-grid">
|
|
@@ -72,14 +72,14 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
72
72
|
<icon-wc name="chevron-down" class="chevron"></icon-wc>
|
|
73
73
|
</summary>
|
|
74
74
|
<div class="options options--swatch-grid">
|
|
75
|
-
${
|
|
75
|
+
${T.map(n=>this.#m(n,a)).join("")}
|
|
76
76
|
</div>
|
|
77
77
|
</details>
|
|
78
78
|
|
|
79
79
|
<fieldset class="section section--a11y">
|
|
80
80
|
<legend>Accessibility</legend>
|
|
81
81
|
<div class="options options--a11y" aria-label="Accessibility themes">
|
|
82
|
-
${
|
|
82
|
+
${H.map(n=>{let c=this.#d().includes(n.id);return`
|
|
83
83
|
<label class="option option--a11y">
|
|
84
84
|
<input
|
|
85
85
|
type="checkbox"
|
|
@@ -100,7 +100,7 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
100
100
|
<fieldset class="section">
|
|
101
101
|
<legend>Sizing</legend>
|
|
102
102
|
<div class="options options--sizing" role="radiogroup" aria-label="Fluid sizing">
|
|
103
|
-
${
|
|
103
|
+
${j.map(n=>`
|
|
104
104
|
<label class="option option--sizing">
|
|
105
105
|
<input
|
|
106
106
|
type="radio"
|
|
@@ -127,7 +127,7 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
127
127
|
<icon-wc name="chevron-down" class="chevron"></icon-wc>
|
|
128
128
|
</summary>
|
|
129
129
|
<div class="extensions-content">
|
|
130
|
-
${
|
|
130
|
+
${V.map(n=>{let c=this.#u()[n.id]??D[n.id];return`
|
|
131
131
|
<label class="extension-toggle">
|
|
132
132
|
<span class="extension-info">
|
|
133
133
|
<icon-wc name="${n.icon}"></icon-wc>
|
|
@@ -144,14 +144,17 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
144
144
|
`}).join("")}
|
|
145
145
|
</div>
|
|
146
146
|
</details>
|
|
147
|
-
`}#B(){let{mode:e,brand:a,fluid:s,accent:
|
|
147
|
+
`}#B(){let{mode:e,brand:a,fluid:s,accent:i}=h.getState(),r=this.#d(),n=this.#u();return`
|
|
148
148
|
<fieldset class="section">
|
|
149
149
|
<legend>Color Mode</legend>
|
|
150
150
|
<div class="compact-segmented" role="radiogroup" aria-label="Color mode">
|
|
151
|
-
${
|
|
151
|
+
${R.map(o=>`
|
|
152
152
|
<label class="compact-seg">
|
|
153
153
|
<input type="radio" name="theme-mode" value="${o.id}" ${e===o.id?"checked":""} />
|
|
154
|
-
<span
|
|
154
|
+
<span class="compact-seg-visual">
|
|
155
|
+
<icon-wc name="${o.icon}" size="xs"></icon-wc>
|
|
156
|
+
<span class="compact-seg-label">${o.name}</span>
|
|
157
|
+
</span>
|
|
155
158
|
</label>
|
|
156
159
|
`).join("")}
|
|
157
160
|
</div>
|
|
@@ -160,8 +163,8 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
160
163
|
<fieldset class="section">
|
|
161
164
|
<legend>Color Accent</legend>
|
|
162
165
|
<select class="compact-select" name="theme-accent-select" aria-label="Color accent">
|
|
163
|
-
${
|
|
164
|
-
<option value="${o.id}" ${
|
|
166
|
+
${$.map(o=>`
|
|
167
|
+
<option value="${o.id}" ${i===o.id?"selected":""}>${o.name}</option>
|
|
165
168
|
`).join("")}
|
|
166
169
|
</select>
|
|
167
170
|
</fieldset>
|
|
@@ -169,7 +172,7 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
169
172
|
<fieldset class="section">
|
|
170
173
|
<legend>Theme</legend>
|
|
171
174
|
<select class="compact-select" name="theme-brand-select" aria-label="Theme">
|
|
172
|
-
${
|
|
175
|
+
${z.map(o=>`
|
|
173
176
|
<optgroup label="${o.label}">
|
|
174
177
|
${o.themes.map(c=>`
|
|
175
178
|
<option value="${c.id}" ${a===c.id?"selected":""}>${c.name}</option>
|
|
@@ -182,7 +185,7 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
182
185
|
<fieldset class="section">
|
|
183
186
|
<legend>Sizing</legend>
|
|
184
187
|
<select class="compact-select" name="theme-fluid-select" aria-label="Sizing">
|
|
185
|
-
${
|
|
188
|
+
${j.map(o=>`
|
|
186
189
|
<option value="${o.id}" ${s===o.id?"selected":""}>${o.name}</option>
|
|
187
190
|
`).join("")}
|
|
188
191
|
</select>
|
|
@@ -191,12 +194,12 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
191
194
|
<fieldset class="section">
|
|
192
195
|
<legend>Accessibility</legend>
|
|
193
196
|
<div class="compact-toggles">
|
|
194
|
-
${
|
|
197
|
+
${H.map(o=>`
|
|
195
198
|
<label class="extension-toggle">
|
|
196
199
|
<span class="extension-info">
|
|
197
200
|
<span class="extension-name">${o.name}</span>
|
|
198
201
|
</span>
|
|
199
|
-
<input type="checkbox" name="a11y-theme" value="${o.id}" data-a11y-theme="${o.id}" data-switch="sm" ${
|
|
202
|
+
<input type="checkbox" name="a11y-theme" value="${o.id}" data-a11y-theme="${o.id}" data-switch="sm" ${r.includes(o.id)?"checked":""} />
|
|
200
203
|
</label>
|
|
201
204
|
`).join("")}
|
|
202
205
|
</div>
|
|
@@ -205,15 +208,15 @@ var oe=Object.defineProperty;var ce=(t,e)=>()=>(t&&(e=t(t=0)),e);var le=(t,e)=>{
|
|
|
205
208
|
<fieldset class="section">
|
|
206
209
|
<legend>Extensions</legend>
|
|
207
210
|
<div class="compact-toggles">
|
|
208
|
-
${
|
|
211
|
+
${V.map(o=>`
|
|
209
212
|
<label class="extension-toggle">
|
|
210
213
|
<span class="extension-info">
|
|
211
214
|
<span class="extension-name">${o.name}</span>
|
|
212
215
|
</span>
|
|
213
|
-
<input type="checkbox" name="ext-${o.id}" data-extension="${o.id}" data-switch="sm" ${n[o.id]??
|
|
216
|
+
<input type="checkbox" name="ext-${o.id}" data-extension="${o.id}" data-switch="sm" ${n[o.id]??D[o.id]?"checked":""} />
|
|
214
217
|
</label>
|
|
215
218
|
`).join("")}
|
|
216
219
|
</div>
|
|
217
220
|
</fieldset>
|
|
218
|
-
`}#
|
|
221
|
+
`}#x(){this.#e.querySelectorAll('input[name="theme-mode"]').forEach(r=>{r.addEventListener("change",this.#P)}),this.#e.querySelectorAll('input[name="theme-brand"]').forEach(r=>{r.addEventListener("change",this.#D)});let e=this.#e.querySelector('select[name="theme-brand-select"]');e&&e.addEventListener("change",this.#L),this.#e.querySelectorAll('input[name="theme-fluid"]').forEach(r=>{r.addEventListener("change",this.#y)});let a=this.#e.querySelector('select[name="theme-fluid-select"]');a&&a.addEventListener("change",this.#y),this.#e.querySelectorAll('input[name="theme-accent"]').forEach(r=>{r.addEventListener("change",this.#w)});let s=this.#e.querySelector('select[name="theme-accent-select"]');s&&s.addEventListener("change",this.#w),this.#e.querySelectorAll("input[data-extension]").forEach(r=>{r.addEventListener("change",this.#O)}),this.#e.querySelectorAll("input[data-a11y-theme]").forEach(r=>{r.addEventListener("change",this.#q)}),this.#e.querySelector(".section--extensions")?.addEventListener("toggle",r=>{this.#f=r.target.open}),this.#s||(this.listen(this.#t,"click",this.#_),this.listen(document,"click",this.#M),this.listen(document,"keydown",this.#F))}#_=e=>{e.stopPropagation(),this.toggle()};#M=e=>{this.#a&&!this.contains(e.target)&&this.close()};#F=e=>{e.key==="Escape"&&this.#a&&(e.preventDefault(),this.close(),this.#t?.focus())};#P=e=>{h.setMode(e.target.value),this.#o()};#D=async e=>{let a=e.target.closest(".swatch-cell");a&&a.setAttribute("aria-busy","true");try{await h.setBrand(e.target.value)}catch{console.warn("[VB] Theme load failed, using default")}finally{a&&a.removeAttribute("aria-busy")}this.#h(),this.#o()};#L=async e=>{let a=e.target;a.disabled=!0;try{await h.setBrand(a.value)}catch{console.warn("[VB] Theme load failed, using default")}finally{a.disabled=!1}this.#h(),this.#o()};#y=e=>{h.setFluid(e.target.value),this.#o()};#w=e=>{h.setAccent(e.target.value),this.#o()};#O=e=>{let a=e.target.dataset.extension,s=e.target.checked;this.#I(a,s),this.#b()};#u(){return{...this.#r}}#I(e,a){this.#r={...this.#r,[e]:a},u.set(P,"extensions",this.#r).catch(()=>{})}async#b(){let e=this.#u(),a=document.documentElement;e.motionFx?delete a.dataset.motionReduced:a.dataset.motionReduced="",e.sounds?(E||(E=(await Promise.resolve().then(()=>(oe(),re))).SoundManager),E.init(),E.enable()):E&&E.disable(),window.dispatchEvent(new CustomEvent("vb:extensions-change",{detail:e}))}#d(){return[...this.#l]}#R(e){this.#l=[...e],u.set(P,"a11y",this.#l).catch(()=>{})}#h(){let e=this.#d(),{brand:a}=h.getState(),s=document.documentElement,i=a==="default"?e.join(" "):[a,...e].join(" "),r=s.dataset.theme||"";i!==r&&(i?s.dataset.theme=i:delete s.dataset.theme)}#q=e=>{let a=e.target.dataset.a11yTheme,s=e.target.checked,i=this.#d();if(s&&!i.includes(a))i.push(a);else if(!s&&i.includes(a)){let r=i.indexOf(a);i.splice(r,1)}this.#R(i),this.#h()};#o(){this.#s||(this.#p(),this.#c=setTimeout(()=>{this.close(),this.#t?.focus()},t.#i))}#p(){this.#c&&(clearTimeout(this.#c),this.#c=null)}#j=()=>{this.#v()};#v(){let{mode:e,brand:a,fluid:s,accent:i}=h.getState(),r=this.#e.querySelector(`input[name="theme-mode"][value="${e}"]`);r&&(r.checked=!0);let n=this.#e.querySelector(`input[name="theme-brand"][value="${a}"]`);n&&(n.checked=!0);let o=this.#e.querySelector('select[name="theme-brand-select"]');o&&(o.value=a);let c=this.#e.querySelector(`input[name="theme-fluid"][value="${s}"]`);c&&(c.checked=!0);let p=this.#e.querySelector('select[name="theme-fluid-select"]');p&&(p.value=s);let m=this.#e.querySelector(`input[name="theme-accent"][value="${i||"default"}"]`);m&&(m.checked=!0);let f=this.#e.querySelector('select[name="theme-accent-select"]');f&&(f.value=i||"default"),this.#e.querySelectorAll(".swatch-dtcg").forEach(l=>this.#E(l))}async#H(){let e=await be();if(!(!e||!this.#e?.isConnected))for(let a of this.#e.querySelectorAll('input[name="theme-brand"]')){let s=a.value,i=e[s];if(!i?.dtcg)continue;let r=a.closest(".swatch-cell");if(!r||r.parentElement?.classList.contains("swatch-cell-group"))continue;let n=document.createElement("span");n.className="swatch-cell-group",r.parentNode.insertBefore(n,r),n.appendChild(r);let o=document.createElement("a");o.className="swatch-dtcg",o.dataset.dtcg=i.dtcg,i.dtcgDark&&(o.dataset.dtcgDark=i.dtcgDark),o.setAttribute("download","");let c=r.getAttribute("title")||s;o.setAttribute("aria-label",`Download ${c} as DTCG tokens.json`),o.setAttribute("title",`Download ${c} as DTCG`),o.innerHTML='<icon-wc name="download" size="xs"></icon-wc>',this.#E(o),o.addEventListener("click",()=>{this.dispatchEvent(new CustomEvent("theme-picker:dtcg-download",{bubbles:!0,detail:{themeId:s,href:o.href}}))}),n.appendChild(o)}}#E(e){let a=h.getState().mode,i=(a==="dark"||a==="auto"&&typeof matchMedia=="function"&&matchMedia("(prefers-color-scheme: dark)").matches)&&e.dataset.dtcgDark?e.dataset.dtcgDark:e.dataset.dtcg;e.href=`/cdn/themes/${i}`}open(){this.#s||this.#a||(this.#a=!0,this.setAttribute("open",""),this.#t?.setAttribute("aria-expanded","true"),requestAnimationFrame(()=>{this.#S(),window.addEventListener("scroll",this.#n,{capture:!0,passive:!0}),window.addEventListener("resize",this.#n,{passive:!0}),this.#e.querySelector('input[type="radio"]:checked')?.focus()}),this.dispatchEvent(new CustomEvent("theme-picker:open",{bubbles:!0})))}#S(){if(!this.#t||!this.#e)return;let e=this.#t.getBoundingClientRect(),a=this.#e.getBoundingClientRect(),s=window.visualViewport||{width:window.innerWidth,height:window.innerHeight},i=s.height,r=s.width,n=8,o=16,c=i-e.bottom-o,p=e.top-o,m=e.height+n;c<a.height&&p>c?(m=-a.height-n,this.#e.dataset.position="top"):delete this.#e.dataset.position;let f=r-e.right,l=e.right-a.width;if(this.#e.style.setProperty("--panel-top",`${m}px`),l<o){let y=0,S=e.left+a.width+o;S>r&&(y=r-S),e.left+y<o&&(y=o-e.left),this.#e.style.setProperty("--panel-left",`${y}px`),this.#e.style.setProperty("--panel-right","auto")}else{let y=Math.max(0,o-f);this.#e.style.setProperty("--panel-left","auto"),this.#e.style.setProperty("--panel-right",`${y}px`)}}close(){this.#s||!this.#a||(this.#p(),this.#a=!1,this.removeAttribute("open"),this.#t?.setAttribute("aria-expanded","false"),window.removeEventListener("scroll",this.#n,{capture:!0}),window.removeEventListener("resize",this.#n),this.dispatchEvent(new CustomEvent("theme-picker:close",{bubbles:!0})))}toggle(){this.#a?this.close():this.open()}get isOpen(){return this.#a}};K("theme-picker",W);export{W as ThemePicker};
|
|
219
222
|
//# sourceMappingURL=theme-picker.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var p=window.matchMedia("(prefers-reduced-motion: reduce)");var d=new Map;function u(i,e,n={}){let t=n.priority??10,o={impl:e,bundle:n.bundle,contract:n.contract,priority:t},r=d.get(i);if(customElements.get(i)){if(!r||r.priority>=t){r&&r.priority===t&&r.impl!==e&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${n.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${n.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=t){r.priority===t&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${r.bundle}". Skipping "${n.bundle}" (first wins at equal priority).`);return}d.set(i,o),customElements.define(i,e)}var
|
|
1
|
+
var p=window.matchMedia("(prefers-reduced-motion: reduce)");var d=new Map;function u(i,e,n={}){let t=n.priority??10,o={impl:e,bundle:n.bundle,contract:n.contract,priority:t},r=d.get(i);if(customElements.get(i)){if(!r||r.priority>=t){r&&r.priority===t&&r.impl!==e&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${n.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${n.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=t){r.priority===t&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${r.bundle}". Skipping "${n.bundle}" (first wins at equal priority).`);return}d.set(i,o),customElements.define(i,e)}var c=class extends HTMLElement{#t=[];#e;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let e of this.#t)e();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,n,t,o){e.addEventListener(n,t,o),this.#t.push(()=>e.removeEventListener(n,t,o))}setup(){}teardown(){}setState(e,n){this.#e||(this.#e=this.attachInternals());let t=this.#e.states;try{n?t.add(e):t.delete(e)}catch{let o=`--${e}`;n?t.add(o):t.delete(o)}}_adoptInternals(e){this.#e||(this.#e=e)}};function m(i){let e=(Date.now()-i.getTime())/1e3;if(e<0)return null;if(e<60)return"just now";if(e<3600){let t=Math.floor(e/60);return`${t} minute${t!==1?"s":""} ago`}if(e<86400){let t=Math.floor(e/3600);return`${t} hour${t!==1?"s":""} ago`}if(e<2592e3){let t=Math.floor(e/86400);return`${t} day${t!==1?"s":""} ago`}if(e<31536e3){let t=Math.floor(e/2592e3);return`${t} month${t!==1?"s":""} ago`}let n=Math.floor(e/31536e3);return`${n} year${n!==1?"s":""} ago`}function a(i=document){for(let e of i.querySelectorAll("time[data-relative]")){let n=e.getAttribute("datetime");if(!n)continue;let t=m(new Date(n));t&&(e.textContent=t)}}var f;function h(){a(),f||(f=setInterval(()=>a(),6e4))}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",h,{once:!0}):h();var l=class extends c{setup(){a(this),this.#t();let e=this.getAttribute("updates-src");e&&this.#i(e)}#t(){let e=document.createElement("nav");e.setAttribute("data-timeline-controls",""),e.setAttribute("aria-label","Timeline controls");let n=document.createElement("button");if(n.type="button",n.textContent="Oldest first",n.addEventListener("click",()=>{this.#n(),n.textContent=this.#e?"Latest first":"Oldest first"}),e.append(n),this.hasAttribute("versions")){let t=this.#o();if(t.length>0){let o=document.createElement("select");o.setAttribute("aria-label","Filter by version"),o.innerHTML='<option value="">All versions</option>'+t.map(r=>`<option value="${r}">${r}</option>`).join(""),o.addEventListener("change",()=>this.#r(o.value)),e.append(o)}}this.prepend(e)}#e=!1;#n(){this.#e=!this.#e;let e=this.querySelector(".changelog-entries")||this,n=[...e.children].filter(t=>t.tagName==="SECTION"||t.tagName==="ARTICLE");n.reverse();for(let t of n)e.append(t)}#o(){let e=this.querySelectorAll(".version-tag"),n=new Set;for(let t of e){let o=t.textContent.trim();o&&n.add(o)}return[...n]}#r(e){let n=this.querySelectorAll('section[id^="v"]');for(let t of n)t.hidden=!!e&&t.id!==e.replace(/\./g,"-").replace(/^v/,"v");if(!n.length){let t=this.querySelectorAll(".changelog-entries article");for(let o of t){let r=o.querySelector(".version-tag");o.hidden=!!e&&r?.textContent?.trim()!==e}}}async#i(e){try{let n=await fetch(e);if(!n.ok)return;let t=await n.json();if(!Array.isArray(t)||!t.length)return;let o=document.createElement("section");o.setAttribute("aria-labelledby","recent-pages-heading"),o.innerHTML=`
|
|
2
2
|
<h2 id="recent-pages-heading">Recently Updated Pages</h2>
|
|
3
3
|
<ul class="recent-pages">
|
|
4
4
|
${t.slice(0,10).map(s=>`
|
|
@@ -8,5 +8,5 @@ var p=window.matchMedia("(prefers-reduced-motion: reduce)");var d=new Map;functi
|
|
|
8
8
|
</li>
|
|
9
9
|
`).join("")}
|
|
10
10
|
</ul>
|
|
11
|
-
`;let r=this.querySelector(".changelog-entries")||this.querySelector("[data-timeline-controls]");r?r.after(o):this.append(o),
|
|
11
|
+
`;let r=this.querySelector(".changelog-entries")||this.querySelector("[data-timeline-controls]");r?r.after(o):this.append(o),a(o)}catch{}}};u("time-index",l);export{l as TimeIndex};
|
|
12
12
|
//# sourceMappingURL=time-index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var x=window.matchMedia("(prefers-reduced-motion: reduce)");var b=new Map;function A(n,t,e={}){let i=e.priority??10,r={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,r),customElements.define(n,t)}var p=class extends HTMLElement{#c=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let t of this.#c)t();this.#c=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,i,r){t.addEventListener(e,i,r),this.#c.push(()=>t.removeEventListener(e,i,r))}setup(){}teardown(){}};function g(){try{let n=new Intl.DateTimeFormat(void 0,{hour:"numeric"}).resolvedOptions();return n.hourCycle==="h12"||n.hourCycle==="h11"?"12h":"24h"}catch{return"12h"}}function u(n){return String(n).padStart(2,"0")}function c(n){if(!n)return null;let t=n.split(":").map(Number);return{h:t[0]||0,m:t[1]||0,s:t[2]||0}}function d(n,t,e,i){return i?`${u(n)}:${u(t)}:${u(e)}`:`${u(n)}:${u(t)}`}function y(n,t,e,i,r){if(r==="12h"){let s=n>=12?"PM":"AM",h=n%12||12;return i?`${h}:${u(t)}:${u(e)} ${s}`:`${h}:${u(t)} ${s}`}return d(n,t,e,i)}function v(n){let t=n.trim();if(!t)return null;let e=t.match(/\s*(am|pm|a\.m\.|p\.m\.|a|p)\s*$/i),i=null,r=t;e&&(i=e[1].toLowerCase().replace(/\./g,"").startsWith("p")?"PM":"AM",r=t.slice(0,e.index).trim());let s=r.split(/[:.]/);if(s.length<1||s.length>3)return null;let h=Number(s[0]),l=s.length>1?Number(s[1]):0,o=s.length>2?Number(s[2]):0;if(isNaN(h)||isNaN(l)||isNaN(o)||l<0||l>59||o<0||o>59)return null;let a=h;if(i){if(a<1||a>12)return null;i==="AM"?a=a===12?0:a:a=a===12?12:a+12}else if(a<0||a>23)return null;return{h:a,m:l,s:o}}function E(n,t,e){return n>e?t:n<t?e:n}var f=class extends p{static formAssociated=!0;#c;#n;#e;#v;#d;#a;#r=[];#u;#h;#p;#t=0;#i=0;#s=0;#o="AM";#L=null;#q=null;#g=60;#S;#F=0;#l=!1;#M;constructor(){super(),this.#c=this.attachInternals()}setup(){if(this.#n=this.querySelector(':scope > input[type="time"]'),!this.#n)return!1;this.#g=Number(this.#n.getAttribute("step"))||60,this.#p=this.#g<60,this.#L=c(this.#n.getAttribute("min")),this.#q=c(this.#n.getAttribute("max")),this.#h=this.getAttribute("data-format")||g();let t=c(this.#n.value);t&&(this.#t=t.h,this.#i=t.m,this.#s=t.s),this.#S=this.#n.value,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),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.#O(),this.#V(),this.#P(),this.#E(),this.#k(),this.#C(),this.listen(document,"click",this.#H),(this.#n.disabled||this.hasAttribute("disabled"))&&(this.setAttribute("data-disabled",""),this.#e.disabled=!0)}#O(){this.#v=document.createElement("div"),this.#v.className="time-trigger",this.#e=document.createElement("input"),this.#e.type="text",this.#e.className="time-input",this.#e.setAttribute("role","combobox"),this.#e.setAttribute("aria-haspopup","listbox"),this.#e.setAttribute("aria-expanded","false"),this.#e.setAttribute("autocomplete","off"),this.#e.setAttribute("placeholder","Type a time\u2026"),this.#v.appendChild(this.#e),this.#d=document.createElement("button"),this.#d.type="button",this.#d.className="time-trigger-icon",this.#d.setAttribute("aria-label","Toggle time spinner"),this.#d.setAttribute("tabindex","-1");let t=document.createElement("icon-wc");t.setAttribute("name","clock"),t.setAttribute("size","sm"),t.setAttribute("aria-hidden","true"),this.#d.appendChild(t),this.#v.appendChild(this.#d),this.appendChild(this.#v),this.listen(this.#d,"click",e=>{e.stopPropagation(),this.#l?this.#f():this.#T(),this.#e.focus()}),this.listen(this.#e,"focus",()=>this.#e.select()),this.listen(this.#e,"keydown",this.#I),this.listen(this.#e,"blur",this.#R)}#V(){this.#M=`tp-${Math.random().toString(36).slice(2,8)}`,this.#a=document.createElement("div"),this.#a.className="time-panel",this.#a.id=this.#M,this.#a.setAttribute("role","group"),this.#a.setAttribute("aria-label","Time spinners"),this.#e.setAttribute("aria-controls",this.#M);let t=this.#h==="12h"?1:0,e=this.#h==="12h"?12:23,i=this.#w("Hours",t,e,1);this.#a.appendChild(i.el),this.#r.push(i),this.#a.appendChild(this.#N());let r=this.#g>=60?Math.max(1,Math.round(this.#g/60)):1,s=this.#w("Minutes",0,59,r);if(this.#a.appendChild(s.el),this.#r.push(s),this.#p){this.#a.appendChild(this.#N());let h=this.#w("Seconds",0,59,this.#g);this.#a.appendChild(h.el),this.#r.push(h)}this.#h==="12h"&&(this.#u=document.createElement("button"),this.#u.type="button",this.#u.className="period-toggle",this.#u.setAttribute("aria-label","Toggle AM/PM"),this.#u.textContent=this.#o,this.#a.appendChild(this.#u),this.listen(this.#u,"click",()=>{this.#o=this.#o==="AM"?"PM":"AM",this.#u.textContent=this.#o,this.#t=this.#B(this.#$(),this.#o),this.#A()}),this.listen(this.#u,"keydown",h=>{h.key==="ArrowLeft"&&(h.preventDefault(),this.#x(this.#r.length-1)),h.key==="Escape"&&(h.preventDefault(),this.#f(),this.#e.focus())})),this.appendChild(this.#a)}#w(t,e,i,r){let s=document.createElement("div");s.className="time-spinner",s.setAttribute("role","spinbutton"),s.setAttribute("aria-label",t),s.setAttribute("aria-valuemin",String(e)),s.setAttribute("aria-valuemax",String(i)),s.setAttribute("tabindex","0");let h=document.createElement("button");h.type="button",h.className="time-inc",h.setAttribute("aria-hidden","true"),h.setAttribute("tabindex","-1"),h.innerHTML="▲";let l=document.createElement("span");l.className="time-value";let o=document.createElement("button");o.type="button",o.className="time-dec",o.setAttribute("aria-hidden","true"),o.setAttribute("tabindex","-1"),o.innerHTML="▼",s.appendChild(h),s.appendChild(l),s.appendChild(o);let a={el:s,valueEl:l,label:t,min:e,max:i,step:r};return this.listen(h,"click",()=>{this.#b(a,r)}),this.listen(o,"click",()=>{this.#b(a,-r)}),this.listen(s,"keydown",m=>{this.#j(m,a)}),this.listen(s,"focus",()=>{this.#F=this.#r.indexOf(a)}),a}#N(){let t=document.createElement("span");return t.className="time-sep",t.setAttribute("aria-hidden","true"),t.textContent=":",t}#T(){this.#l||(this.#l=!0,this.#a.setAttribute("data-open",""),this.#e.setAttribute("aria-expanded","true"))}#f(){this.#l&&(this.#l=!1,this.#a.removeAttribute("data-open"),this.#e.setAttribute("aria-expanded","false"))}#H=t=>{this.#l&&!this.contains(t.target)&&this.#f()};#I=t=>{switch(t.key){case"Enter":{t.preventDefault(),t.stopPropagation();let e=v(this.#e.value);e&&(this.#t=e.h,this.#i=e.m,this.#s=e.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A()),this.#E(),this.#l&&this.#f();return}case"ArrowDown":t.preventDefault(),t.stopPropagation(),this.#l||this.#T(),requestAnimationFrame(()=>this.#x(0));return;case"Escape":t.preventDefault(),t.stopPropagation(),this.#l&&this.#f(),this.#E();return;case"Tab":this.#l&&this.#f();return}};#R=t=>{if(t.relatedTarget&&this.contains(t.relatedTarget))return;let e=this.#e.value.trim();if(e){let i=v(e);i&&(this.#t=i.h,this.#i=i.m,this.#s=i.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#k(),this.#C(),this.dispatchEvent(new CustomEvent("time-picker:change",{bubbles:!0,detail:{value:d(this.#t,this.#i,this.#s,this.#p),hours:this.#t,minutes:this.#i,seconds:this.#s}})))}this.#E(),this.#l&&this.#f(),this.#n.dispatchEvent(new Event("blur",{bubbles:!0}))};#j=(t,e)=>{let i=this.#r.indexOf(e);switch(t.key){case"ArrowUp":t.preventDefault(),this.#b(e,e.step);break;case"ArrowDown":t.preventDefault(),this.#b(e,-e.step);break;case"ArrowRight":t.preventDefault(),i<this.#r.length-1?this.#x(i+1):this.#u&&this.#u.focus();break;case"ArrowLeft":t.preventDefault(),i>0&&this.#x(i-1);break;case"PageUp":t.preventDefault(),this.#b(e,e.step*(e.label==="Hours"?1:10));break;case"PageDown":t.preventDefault(),this.#b(e,-e.step*(e.label==="Hours"?1:10));break;case"Home":t.preventDefault(),this.#y(e,e.min);break;case"End":t.preventDefault(),this.#y(e,e.max);break;case"Escape":t.preventDefault(),this.#f(),this.#e.focus();break;default:/^\d$/.test(t.key)&&(t.preventDefault(),this.#U(t.key,e))}};#m="";#D=0;#U(t,e){clearTimeout(this.#D),this.#m+=t;let i=Number(this.#m);if(this.#m.length>=2||i*10>e.max){let r=Math.min(Math.max(i,e.min),e.max);this.#y(e,r),this.#m=""}else this.#D=setTimeout(()=>{let r=Number(this.#m),s=Math.min(Math.max(r,e.min),e.max);this.#y(e,s),this.#m=""},800)}#b(t,e){let i;t.label==="Hours"?i=this.#h==="12h"?this.#$():this.#t:t.label==="Minutes"?i=this.#i:i=this.#s;let r=E(i+e,t.min,t.max);this.#y(t,r)}#y(t,e){t.label==="Hours"?this.#h==="12h"?this.#t=this.#B(e,this.#o):this.#t=e:t.label==="Minutes"?this.#i=e:this.#s=e,this.#A()}#A(){this.#P(),this.#E(),this.#k(),this.#C(),this.dispatchEvent(new CustomEvent("time-picker:change",{bubbles:!0,detail:{value:d(this.#t,this.#i,this.#s,this.#p),hours:this.#t,minutes:this.#i,seconds:this.#s}}))}#P(){let t=this.#h==="12h"?this.#$():this.#t;this.#r[0].valueEl.textContent=u(t),this.#r[0].el.setAttribute("aria-valuenow",String(t)),this.#r[0].el.setAttribute("aria-valuetext",this.#h==="12h"?`${t} ${this.#o}`:String(t)),this.#r[1].valueEl.textContent=u(this.#i),this.#r[1].el.setAttribute("aria-valuenow",String(this.#i)),this.#p&&this.#r[2]&&(this.#r[2].valueEl.textContent=u(this.#s),this.#r[2].el.setAttribute("aria-valuenow",String(this.#s))),this.#u&&(this.#u.textContent=this.#o)}#E(){this.#t!==void 0&&(this.#e.value=y(this.#t,this.#i,this.#s,this.#p,this.#h))}#k(){let t=d(this.#t,this.#i,this.#s,this.#p);this.#c.setFormValue(t),this.#n.value=t,this.#n.dispatchEvent(new Event("input",{bubbles:!0}))}#C(){if((this.hasAttribute("required")||this.#n.hasAttribute("required"))&&!this.#n.value){this.#c.setValidity({valueMissing:!0},"Please select a time",this.#e||this);return}this.#c.setValidity({})}#B(t,e){return e==="AM"?t===12?0:t:t===12?12:t+12}#$(){if(this.#h==="24h")return this.#t;let t=this.#t%12;return t===0?12:t}#x(t){this.#r[t]?.el.focus()}formResetCallback(){let t=c(this.#S);t?(this.#t=t.h,this.#i=t.m,this.#s=t.s):(this.#t=0,this.#i=0,this.#s=0),this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A()}formStateRestoreCallback(t){if(!t)return;let e=c(t);e&&(this.#t=e.h,this.#i=e.m,this.#s=e.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A())}get value(){return d(this.#t,this.#i,this.#s,this.#p)}set value(t){let e=c(t);e&&(this.#t=e.h,this.#i=e.m,this.#s=e.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A())}};A("time-picker",f);export{f as TimePicker};
|
|
1
|
+
var x=window.matchMedia("(prefers-reduced-motion: reduce)");var b=new Map;function A(n,t,e={}){let i=e.priority??10,r={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,r),customElements.define(n,t)}var p=class extends HTMLElement{#c=[];#i;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.#c)t();this.#c=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,i,r){t.addEventListener(e,i,r),this.#c.push(()=>t.removeEventListener(e,i,r))}setup(){}teardown(){}setState(t,e){this.#i||(this.#i=this.attachInternals());let i=this.#i.states;try{e?i.add(t):i.delete(t)}catch{let r=`--${t}`;e?i.add(r):i.delete(r)}}_adoptInternals(t){this.#i||(this.#i=t)}};function v(){try{let n=new Intl.DateTimeFormat(void 0,{hour:"numeric"}).resolvedOptions();return n.hourCycle==="h12"||n.hourCycle==="h11"?"12h":"24h"}catch{return"12h"}}function l(n){return String(n).padStart(2,"0")}function c(n){if(!n)return null;let t=n.split(":").map(Number);return{h:t[0]||0,m:t[1]||0,s:t[2]||0}}function d(n,t,e,i){return i?`${l(n)}:${l(t)}:${l(e)}`:`${l(n)}:${l(t)}`}function y(n,t,e,i,r){if(r==="12h"){let s=n>=12?"PM":"AM",h=n%12||12;return i?`${h}:${l(t)}:${l(e)} ${s}`:`${h}:${l(t)} ${s}`}return d(n,t,e,i)}function g(n){let t=n.trim();if(!t)return null;let e=t.match(/\s*(am|pm|a\.m\.|p\.m\.|a|p)\s*$/i),i=null,r=t;e&&(i=e[1].toLowerCase().replace(/\./g,"").startsWith("p")?"PM":"AM",r=t.slice(0,e.index).trim());let s=r.split(/[:.]/);if(s.length<1||s.length>3)return null;let h=Number(s[0]),o=s.length>1?Number(s[1]):0,u=s.length>2?Number(s[2]):0;if(isNaN(h)||isNaN(o)||isNaN(u)||o<0||o>59||u<0||u>59)return null;let a=h;if(i){if(a<1||a>12)return null;i==="AM"?a=a===12?0:a:a=a===12?12:a+12}else if(a<0||a>23)return null;return{h:a,m:o,s:u}}function E(n,t,e){return n>e?t:n<t?e:n}var f=class extends p{static formAssociated=!0;#c;#i;#e;#g;#d;#a;#r=[];#u;#h;#p;#t=0;#s=0;#n=0;#o="AM";#L=null;#q=null;#v=60;#S;#I=0;#l=!1;#M;constructor(){super(),this.#c=this.attachInternals(),this._adoptInternals(this.#c)}setup(){if(this.#i=this.querySelector(':scope > input[type="time"]'),!this.#i)return!1;this.#v=Number(this.#i.getAttribute("step"))||60,this.#p=this.#v<60,this.#L=c(this.#i.getAttribute("min")),this.#q=c(this.#i.getAttribute("max")),this.#h=this.getAttribute("data-format")||v();let t=c(this.#i.value);return t&&(this.#t=t.h,this.#s=t.m,this.#n=t.s),this.#S=this.#i.value,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#i.setAttribute("tabindex","-1"),this.#i.setAttribute("aria-hidden","true"),this.#i.style.cssText="position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;overflow:hidden;",this.#F(),this.#O(),this.#P(),this.#E(),this.#k(),this.#C(),this.listen(document,"click",this.#V),(this.#i.disabled||this.hasAttribute("disabled"))&&(this.setAttribute("data-disabled",""),this.#e.disabled=!0),!0}#F(){this.#g=document.createElement("div"),this.#g.className="time-trigger",this.#e=document.createElement("input"),this.#e.type="text",this.#e.className="time-input",this.#e.setAttribute("role","combobox"),this.#e.setAttribute("aria-haspopup","listbox"),this.#e.setAttribute("aria-expanded","false"),this.#e.setAttribute("autocomplete","off"),this.#e.setAttribute("placeholder","Type a time\u2026"),this.#g.appendChild(this.#e),this.#d=document.createElement("button"),this.#d.type="button",this.#d.className="time-trigger-icon",this.#d.setAttribute("aria-label","Toggle time spinner"),this.#d.setAttribute("tabindex","-1");let t=document.createElement("icon-wc");t.setAttribute("name","clock"),t.setAttribute("size","sm"),t.setAttribute("aria-hidden","true"),this.#d.appendChild(t),this.#g.appendChild(this.#d),this.appendChild(this.#g),this.listen(this.#d,"click",e=>{e.stopPropagation(),this.#l?this.#f():this.#T(),this.#e.focus()}),this.listen(this.#e,"focus",()=>this.#e.select()),this.listen(this.#e,"keydown",this.#H),this.listen(this.#e,"blur",this.#R)}#O(){this.#M=`tp-${Math.random().toString(36).slice(2,8)}`,this.#a=document.createElement("div"),this.#a.className="time-panel",this.#a.id=this.#M,this.#a.setAttribute("role","group"),this.#a.setAttribute("aria-label","Time spinners"),this.#e.setAttribute("aria-controls",this.#M);let t=this.#h==="12h"?1:0,e=this.#h==="12h"?12:23,i=this.#w("Hours",t,e,1);this.#a.appendChild(i.el),this.#r.push(i),this.#a.appendChild(this.#N());let r=this.#v>=60?Math.max(1,Math.round(this.#v/60)):1,s=this.#w("Minutes",0,59,r);if(this.#a.appendChild(s.el),this.#r.push(s),this.#p){this.#a.appendChild(this.#N());let h=this.#w("Seconds",0,59,this.#v);this.#a.appendChild(h.el),this.#r.push(h)}this.#h==="12h"&&(this.#u=document.createElement("button"),this.#u.type="button",this.#u.className="period-toggle",this.#u.setAttribute("aria-label","Toggle AM/PM"),this.#u.textContent=this.#o,this.#a.appendChild(this.#u),this.listen(this.#u,"click",()=>{this.#o=this.#o==="AM"?"PM":"AM",this.#u.textContent=this.#o,this.#t=this.#B(this.#$(),this.#o),this.#A()}),this.listen(this.#u,"keydown",h=>{let o=h;o.key==="ArrowLeft"&&(o.preventDefault(),this.#x(this.#r.length-1)),o.key==="Escape"&&(o.preventDefault(),this.#f(),this.#e.focus())})),this.appendChild(this.#a)}#w(t,e,i,r){let s=document.createElement("div");s.className="time-spinner",s.setAttribute("role","spinbutton"),s.setAttribute("aria-label",t),s.setAttribute("aria-valuemin",String(e)),s.setAttribute("aria-valuemax",String(i)),s.setAttribute("tabindex","0");let h=document.createElement("button");h.type="button",h.className="time-inc",h.setAttribute("aria-hidden","true"),h.setAttribute("tabindex","-1"),h.innerHTML="▲";let o=document.createElement("span");o.className="time-value";let u=document.createElement("button");u.type="button",u.className="time-dec",u.setAttribute("aria-hidden","true"),u.setAttribute("tabindex","-1"),u.innerHTML="▼",s.appendChild(h),s.appendChild(o),s.appendChild(u);let a={el:s,valueEl:o,label:t,min:e,max:i,step:r};return this.listen(h,"click",()=>{this.#b(a,r)}),this.listen(u,"click",()=>{this.#b(a,-r)}),this.listen(s,"keydown",m=>{this.#j(m,a)}),this.listen(s,"focus",()=>{this.#I=this.#r.indexOf(a)}),a}#N(){let t=document.createElement("span");return t.className="time-sep",t.setAttribute("aria-hidden","true"),t.textContent=":",t}#T(){this.#l||(this.#l=!0,this.#a.setAttribute("data-open",""),this.#e.setAttribute("aria-expanded","true"))}#f(){this.#l&&(this.#l=!1,this.#a.removeAttribute("data-open"),this.#e.setAttribute("aria-expanded","false"))}#V=t=>{this.#l&&!this.contains(t.target)&&this.#f()};#H=t=>{switch(t.key){case"Enter":{t.preventDefault(),t.stopPropagation();let e=g(this.#e.value);e&&(this.#t=e.h,this.#s=e.m,this.#n=e.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A()),this.#E(),this.#l&&this.#f();return}case"ArrowDown":t.preventDefault(),t.stopPropagation(),this.#l||this.#T(),requestAnimationFrame(()=>this.#x(0));return;case"Escape":t.preventDefault(),t.stopPropagation(),this.#l&&this.#f(),this.#E();return;case"Tab":this.#l&&this.#f();return}};#R=t=>{if(t.relatedTarget&&this.contains(t.relatedTarget))return;let e=this.#e.value.trim();if(e){let i=g(e);i&&(this.#t=i.h,this.#s=i.m,this.#n=i.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#k(),this.#C(),this.dispatchEvent(new CustomEvent("time-picker:change",{bubbles:!0,detail:{value:d(this.#t,this.#s,this.#n,this.#p),hours:this.#t,minutes:this.#s,seconds:this.#n}})))}this.#E(),this.#l&&this.#f(),this.#i.dispatchEvent(new Event("blur",{bubbles:!0}))};#j=(t,e)=>{let i=this.#r.indexOf(e);switch(t.key){case"ArrowUp":t.preventDefault(),this.#b(e,e.step);break;case"ArrowDown":t.preventDefault(),this.#b(e,-e.step);break;case"ArrowRight":t.preventDefault(),i<this.#r.length-1?this.#x(i+1):this.#u&&this.#u.focus();break;case"ArrowLeft":t.preventDefault(),i>0&&this.#x(i-1);break;case"PageUp":t.preventDefault(),this.#b(e,e.step*(e.label==="Hours"?1:10));break;case"PageDown":t.preventDefault(),this.#b(e,-e.step*(e.label==="Hours"?1:10));break;case"Home":t.preventDefault(),this.#y(e,e.min);break;case"End":t.preventDefault(),this.#y(e,e.max);break;case"Escape":t.preventDefault(),this.#f(),this.#e.focus();break;default:/^\d$/.test(t.key)&&(t.preventDefault(),this.#U(t.key,e))}};#m="";#D=0;#U(t,e){clearTimeout(this.#D),this.#m+=t;let i=Number(this.#m);if(this.#m.length>=2||i*10>e.max){let r=Math.min(Math.max(i,e.min),e.max);this.#y(e,r),this.#m=""}else this.#D=setTimeout(()=>{let r=Number(this.#m),s=Math.min(Math.max(r,e.min),e.max);this.#y(e,s),this.#m=""},800)}#b(t,e){let i;t.label==="Hours"?i=this.#h==="12h"?this.#$():this.#t:t.label==="Minutes"?i=this.#s:i=this.#n;let r=E(i+e,t.min,t.max);this.#y(t,r)}#y(t,e){t.label==="Hours"?this.#h==="12h"?this.#t=this.#B(e,this.#o):this.#t=e:t.label==="Minutes"?this.#s=e:this.#n=e,this.#A()}#A(t="internal"){this.#P(),this.#E(),this.#k(),this.#C(),this.dispatchEvent(new CustomEvent("time-picker:change",{bubbles:!0,detail:{value:d(this.#t,this.#s,this.#n,this.#p),hours:this.#t,minutes:this.#s,seconds:this.#n,source:t}}))}#P(){let t=this.#h==="12h"?this.#$():this.#t;this.#r[0].valueEl.textContent=l(t),this.#r[0].el.setAttribute("aria-valuenow",String(t)),this.#r[0].el.setAttribute("aria-valuetext",this.#h==="12h"?`${t} ${this.#o}`:String(t)),this.#r[1].valueEl.textContent=l(this.#s),this.#r[1].el.setAttribute("aria-valuenow",String(this.#s)),this.#p&&this.#r[2]&&(this.#r[2].valueEl.textContent=l(this.#n),this.#r[2].el.setAttribute("aria-valuenow",String(this.#n))),this.#u&&(this.#u.textContent=this.#o)}#E(){this.#t!==void 0&&(this.#e.value=y(this.#t,this.#s,this.#n,this.#p,this.#h))}#k(){let t=d(this.#t,this.#s,this.#n,this.#p);this.#c.setFormValue(t),this.#i.value=t,this.#i.dispatchEvent(new Event("input",{bubbles:!0}))}#C(){if((this.hasAttribute("required")||this.#i.hasAttribute("required"))&&!this.#i.value){this.#c.setValidity({valueMissing:!0},"Please select a time",this.#e||this);return}this.#c.setValidity({})}#B(t,e){return e==="AM"?t===12?0:t:t===12?12:t+12}#$(){if(this.#h==="24h")return this.#t;let t=this.#t%12;return t===0?12:t}#x(t){this.#r[t]?.el.focus()}formResetCallback(){let t=c(this.#S);t?(this.#t=t.h,this.#s=t.m,this.#n=t.s):(this.#t=0,this.#s=0,this.#n=0),this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A()}formStateRestoreCallback(t){if(!t)return;let e=c(t);e&&(this.#t=e.h,this.#s=e.m,this.#n=e.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A())}get value(){return d(this.#t,this.#s,this.#n,this.#p)}set value(t){let e=c(t);e&&(e.h===this.#t&&e.m===this.#s&&e.s===this.#n||(this.#t=e.h,this.#s=e.m,this.#n=e.s,this.#h==="12h"&&(this.#o=this.#t>=12?"PM":"AM"),this.#A("api")))}};A("time-picker",f);export{f as TimePicker};
|
|
2
2
|
//# sourceMappingURL=time-picker.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
var c=class extends HTMLElement{#
|
|
1
|
+
var c=class extends HTMLElement{#t=[];#e;connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),queueMicrotask(()=>{this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0}))}))}disconnectedCallback(){for(let e of this.#t)e();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,t,i,n){e.addEventListener(t,i,n),this.#t.push(()=>e.removeEventListener(t,i,n))}setup(){}teardown(){}setState(e,t){this.#e||(this.#e=this.attachInternals());let i=this.#e.states;try{t?i.add(e):i.delete(e)}catch{let n=`--${e}`;t?i.add(n):i.delete(n)}}_adoptInternals(e){this.#e||(this.#e=e)}};var p=window.matchMedia("(prefers-reduced-motion: reduce)");var l=new Map;function h(o,e,t={}){let i=t.priority??10,n={impl:e,bundle:t.bundle,contract:t.contract,priority:i},s=l.get(o);if(customElements.get(o)){if(!s||s.priority>=i){s&&s.priority===i&&s.impl!==e&&console.warn(`[VB Bundle] Tag <${o}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${t.bundle}".`);return}console.warn(`[VB Bundle] Tag <${o}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${t.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=i){s.priority===i&&console.warn(`[VB Bundle] Tag <${o}> already registered by "${s.bundle}". Skipping "${t.bundle}" (first wins at equal priority).`);return}l.set(o,n),customElements.define(o,e)}var u=class extends c{#t=[];#e=[];static get observedAttributes(){return["position","max"]}setup(){this.setAttribute("role","region"),this.setAttribute("aria-label","Notifications"),this.setAttribute("aria-live","polite")}teardown(){this.#e.forEach(e=>{e._dismissTimer&&clearTimeout(e._dismissTimer)}),this.#t=[],this.#e=[]}show(e){let{message:t,variant:i="info",duration:n=this.#o(),dismissible:s=!0,action:r,onAction:a,source:m="api"}=e,d=this.#r({message:t,variant:i,dismissible:s,action:r,onAction:a}),f=this.#a();return this.#e.length>=f?this.#t.push({toast:d,duration:n}):this.#s(d,n),this.dispatchEvent(new CustomEvent("toast-msg:enqueued",{detail:{message:t,variant:i,duration:n,source:m},bubbles:!0})),d}get queue(){let e=this.#e.map(i=>({message:i.querySelector(".message")?.textContent||"",variant:i.getAttribute("data-variant")||"info",state:"visible"})),t=this.#t.map(({toast:i})=>({message:i.querySelector(".message")?.textContent||"",variant:i.getAttribute("data-variant")||"info",state:"queued"}));return[...e,...t]}#r({message:e,variant:t,dismissible:i,action:n,onAction:s}){let r=document.createElement("div");r.className="toast",r.setAttribute("role",t==="error"||t==="warning"?"alert":"status"),r.setAttribute("data-variant",t);let a={info:"ⓘ",success:"✓",warning:"⚠",error:"✗"};return r.innerHTML=`
|
|
2
2
|
<span class="icon" aria-hidden="true">${a[t]||a.info}</span>
|
|
3
3
|
<span class="message">${this.#n(e)}</span>
|
|
4
4
|
${n?`<button type="button" class="action">${this.#n(n)}</button>`:""}
|
|
5
|
-
${
|
|
6
|
-
`,
|
|
5
|
+
${i?'<button type="button" class="close" aria-label="Dismiss">✕</button>':""}
|
|
6
|
+
`,i&&r.querySelector(".close")?.addEventListener("click",()=>{this.#i(r)}),n&&s&&r.querySelector(".action")?.addEventListener("click",()=>{s(),this.#i(r)}),r}#s(e,t){this.appendChild(e),this.#e.push(e),requestAnimationFrame(()=>{e.setAttribute("data-state","visible")}),t>0&&(e._dismissTimer=setTimeout(()=>{this.#i(e)},t)),this.dispatchEvent(new CustomEvent("toast-msg:show",{bubbles:!0,detail:{toast:e}}))}#i(e){if(!this.contains(e))return;e._dismissTimer&&clearTimeout(e._dismissTimer),e.setAttribute("data-state","hiding");let t=()=>{e.removeEventListener("animationend",t),e.remove();let i=this.#e.indexOf(e);if(i>-1&&this.#e.splice(i,1),this.#t.length>0){let{toast:n,duration:s}=this.#t.shift();this.#s(n,s)}this.dispatchEvent(new CustomEvent("toast-msg:hide",{bubbles:!0,detail:{toast:e}}))};e.addEventListener("animationend",t),setTimeout(()=>{this.contains(e)&&t()},300)}dismissAll(){this.#t=[],[...this.#e].forEach(e=>this.#i(e))}#o(){let e=this.getAttribute("duration");return e!==null?parseInt(e,10):5e3}#a(){let e=this.getAttribute("max");return e!==null?parseInt(e,10):5}#n(e){let t=document.createElement("div");return t.textContent=e,t.innerHTML}};h("toast-msg",u);export{u as ToastMsg};
|
|
7
7
|
//# sourceMappingURL=toast-msg.js.map
|
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
var E=window.matchMedia("(prefers-reduced-motion: reduce)");var
|
|
2
|
-
<div style="width:7rem;height:5rem;background:var(--color-surface,#fff);border-radius:var(--radius-m,0.5rem);box-shadow:var(${
|
|
1
|
+
var E=window.matchMedia("(prefers-reduced-motion: reduce)");var p=new Map;function h(i,e,o={}){let t=o.priority??10,r={impl:e,bundle:o.bundle,contract:o.contract,priority:t},n=p.get(i);if(customElements.get(i)){if(!n||n.priority>=t){n&&n.priority===t&&n.impl!==e&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${n.bundle}" (priority ${n.priority}). Skipping "${o.bundle}".`);return}console.warn(`[VB Bundle] Tag <${i}> defined by "${n.bundle}" cannot be replaced (customElements.define is permanent). "${o.bundle}" has higher priority but arrived late.`);return}if(n&&n.priority>=t){n.priority===t&&console.warn(`[VB Bundle] Tag <${i}> already registered by "${n.bundle}". Skipping "${o.bundle}" (first wins at equal priority).`);return}p.set(i,r),customElements.define(i,e)}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 e of this.#t)e();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,o,t,r){e.addEventListener(o,t,r),this.#t.push(()=>e.removeEventListener(o,t,r))}setup(){}teardown(){}setState(e,o){this.#e||(this.#e=this.attachInternals());let t=this.#e.states;try{o?t.add(e):t.delete(e)}catch{let r=`--${e}`;o?t.add(r):t.delete(r)}}_adoptInternals(e){this.#e||(this.#e=e)}};var v={shadow:{prefix:"--shadow-",tokens:"xs,s,m,l,xl,2xl"},radius:{prefix:"--radius-",tokens:"xs,s,m,l,xl,2xl,full"},border:{prefix:"--border-width-",tokens:"thin,medium,thick"},color:{prefix:"--color-",tokens:"primary,secondary,accent,success,warning,error,info"},size:{prefix:"--size-",tokens:"3xs,2xs,xs,s,m,l,xl,2xl,3xl"},icon:{prefix:"",tokens:"home,search,settings,user,bell,heart,star,check,x,chevron-right,menu,trash"}},y={shadow:b,radius:g,border:x,color:$,size:k,icon:w},f=class extends m{static observedAttributes=["type","tokens","prefix","show-values","label","size","icon-set","editable","target"];setup(){this.#t()}attributeChangedCallback(){this.isConnected&&this.#t()}#t(){let e=this.getAttribute("type")||"shadow",o=v[e]||v.shadow,t=this.getAttribute("prefix")||o.prefix,r=this.getAttribute("tokens")||o.tokens,n=this.getAttribute("show-values")!=="false",a=this.getAttribute("label")||"",l=r.split(",").map(d=>d.trim()),s=y[e]||y.shadow,c="";a&&(c+=`<p style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#666);margin-block-end:0.75rem;font-family:var(--font-sans,system-ui)">${a}</p>`),c+=s(l,t,n,this),this.innerHTML=c;let u=this.hasAttribute("editable")&&e!=="icon";n&&e!=="icon"?requestAnimationFrame(()=>{this.#n(e,t,l),u&&this.#e(e,t)}):u&&requestAnimationFrame(()=>this.#e(e,t))}#e(e,o){let t=getComputedStyle(this);this.querySelectorAll("[data-token-value]").forEach(r=>{let n=r,a=n.dataset.tokenValue,l=t.getPropertyValue(`${o}${a}`).trim(),s=document.createElement("input");s.type=e==="color"&&/^#[0-9a-f]{3,8}$/i.test(l)?"color":"text",s.value=l||"",s.className="ts-edit",s.setAttribute("data-token",a||""),s.setAttribute("aria-label",`${a} value`),s.style.cssText=`font-family:var(--font-mono,monospace);font-size:0.625rem;padding:0.125rem 0.25rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);background:var(--color-surface,#fff);color:var(--color-text,#222);inline-size:${e==="color"?"3rem":"100%"};${e==="color"?"block-size:1.5rem;padding:0;":"max-inline-size:8rem;"}`,n.replaceWith(s),this.listen(s,"change",()=>this.#r(s,o)),this.listen(s,"keydown",c=>{c.key==="Enter"&&this.#r(s,o)})})}#r(e,o){let t=e.getAttribute("data-token"),r=e.value.trim();if(!t||!r)return;let n=this.#o(),a=`${o}${t}`;n&&n.style.setProperty(a,r),this.dispatchEvent(new CustomEvent("token-specimen:change",{bubbles:!0,detail:{name:t,value:r,token:a,target:this.getAttribute("target")||":root"}}))}#o(){let e=this.getAttribute("target")||":root";try{return e===":root"?document.documentElement:document.querySelector(e)}catch{return document.documentElement}}#n(e,o,t){let r=getComputedStyle(this);this.querySelectorAll("[data-token-value]").forEach(n=>{let a=n,l=a.dataset.tokenValue,s=r.getPropertyValue(`${o}${l}`).trim();if(e==="radius"||e==="size"){let c=this.querySelector(`[data-token-sample="${l}"]`);if(c){let u=e==="radius"?"borderRadius":"width",d=e==="size"?c.getBoundingClientRect().width:null;a.textContent=d!=null?`${Math.round(d*100)/100}px`:s||"\u2014"}}else a.textContent=s||"\u2014"})}};function b(i,e,o){let t='<div role="list" style="display:flex;flex-wrap:wrap;gap:1rem;align-items:end">';for(let r of i)t+=`<div role="listitem" style="text-align:center">
|
|
2
|
+
<div style="width:7rem;height:5rem;background:var(--color-surface,#fff);border-radius:var(--radius-m,0.5rem);box-shadow:var(${e}${r})" aria-hidden="true"></div>
|
|
3
3
|
<p style="font-family:var(--font-mono,monospace);font-size:0.75rem;color:var(--color-text-muted,#666);margin-block-start:0.5rem">${r}</p>
|
|
4
4
|
${o?`<p data-token-value="${r}" style="font-family:var(--font-mono,monospace);font-size:0.625rem;color:var(--color-text-muted,#999);max-width:7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap"></p>`:""}
|
|
5
|
-
</div>`;return
|
|
6
|
-
<div data-token-sample="${r}" style="width:4.5rem;height:4.5rem;background:var(--color-primary,oklch(55% 0.2 260));border-radius:var(${
|
|
5
|
+
</div>`;return t+="</div>",t}function g(i,e,o){let t='<div role="list" style="display:flex;flex-wrap:wrap;gap:1rem;align-items:end">';for(let r of i)t+=`<div role="listitem" style="text-align:center">
|
|
6
|
+
<div data-token-sample="${r}" style="width:4.5rem;height:4.5rem;background:var(--color-primary,oklch(55% 0.2 260));border-radius:var(${e}${r});display:flex;align-items:center;justify-content:center;color:#fff;font-size:0.75rem;font-family:var(--font-mono,monospace)" aria-hidden="true">${r}</div>
|
|
7
7
|
${o?`<p data-token-value="${r}" style="font-family:var(--font-mono,monospace);font-size:0.625rem;color:var(--color-text-muted,#999);margin-block-start:0.25rem"></p>`:""}
|
|
8
|
-
</div>`;return
|
|
8
|
+
</div>`;return t+="</div>",t}function x(i,e,o){let t='<div role="list" style="display:flex;flex-direction:column;gap:0.75rem">';for(let r of i)t+=`<div role="listitem" style="display:grid;grid-template-columns:4rem 1fr auto;align-items:center;gap:0.75rem">
|
|
9
9
|
<span style="font-family:var(--font-mono,monospace);font-size:0.875rem;color:var(--color-text-muted,#666);text-align:end">${r}</span>
|
|
10
|
-
<div style="border-block-start:var(${
|
|
10
|
+
<div style="border-block-start:var(${e}${r}) solid var(--color-text,#333);min-inline-size:4rem" aria-hidden="true"></div>
|
|
11
11
|
${o?`<span data-token-value="${r}" style="font-family:var(--font-mono,monospace);font-size:0.75rem;color:var(--color-text-muted,#666);font-variant-numeric:tabular-nums"></span>`:""}
|
|
12
|
-
</div>`;return
|
|
13
|
-
<div style="width:4rem;height:3rem;background:var(${
|
|
12
|
+
</div>`;return t+="</div>",t}function $(i,e,o){let t='<div role="list" style="display:flex;flex-wrap:wrap;gap:0.75rem">';for(let r of i)t+=`<div role="listitem" style="text-align:center">
|
|
13
|
+
<div style="width:4rem;height:3rem;background:var(${e}${r});border-radius:var(--radius-s,0.25rem);border:1px solid var(--color-border,#ddd)" aria-hidden="true"></div>
|
|
14
14
|
<p style="font-family:var(--font-mono,monospace);font-size:0.625rem;color:var(--color-text-muted,#666);margin-block-start:0.25rem">${r}</p>
|
|
15
15
|
${o?`<p data-token-value="${r}" style="font-family:var(--font-mono,monospace);font-size:0.5625rem;color:var(--color-text-muted,#999);max-width:4rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap"></p>`:""}
|
|
16
|
-
</div>`;return
|
|
16
|
+
</div>`;return t+="</div>",t}function k(i,e,o){let t='<div role="list" style="display:flex;flex-direction:column;gap:0.25rem">';for(let r of i)t+=`<div role="listitem" style="display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:0.75rem;min-block-size:1.75rem">
|
|
17
17
|
<span style="font-family:var(--font-mono,monospace);font-size:0.875rem;color:var(--color-text-muted,#666);text-align:end">${r}</span>
|
|
18
|
-
<div data-token-sample="${r}" style="display:block;block-size:var(--size-m,1rem);min-inline-size:2px;inline-size:var(${
|
|
18
|
+
<div data-token-sample="${r}" style="display:block;block-size:var(--size-m,1rem);min-inline-size:2px;inline-size:var(${e}${r});background:var(--color-interactive,oklch(55% 0.2 260));border-radius:var(--radius-s,0.25rem)" aria-hidden="true"></div>
|
|
19
19
|
${o?`<span data-token-value="${r}" style="font-family:var(--font-mono,monospace);font-size:0.75rem;color:var(--color-text-muted,#666);font-variant-numeric:tabular-nums;min-inline-size:3.5rem;text-align:end"></span>`:""}
|
|
20
|
-
</div>`;return
|
|
20
|
+
</div>`;return t+="</div>",t}function w(i,e,o,t){let r=t?.getAttribute("size")||"md",n=t?.getAttribute("icon-set")||"",a=n?` set="${n}"`:"",l='<div role="list" style="display:flex;flex-wrap:wrap;gap:1rem">';for(let s of i)l+=`<div role="listitem" style="display:flex;flex-direction:column;align-items:center;gap:0.375rem;min-inline-size:4.5rem">
|
|
21
21
|
<span style="display:inline-flex;align-items:center;justify-content:center;padding:var(--size-s,0.75rem);background:var(--color-surface-raised,#f5f5f5);border-radius:var(--radius-s,0.25rem);border:1px solid var(--color-border,#ddd);color:var(--color-text,#222)">
|
|
22
|
-
<icon-wc name="${
|
|
22
|
+
<icon-wc name="${s}" size="${r}"${a}></icon-wc>
|
|
23
23
|
</span>
|
|
24
|
-
${o?`<code style="font-family:var(--font-mono,monospace);font-size:0.625rem;color:var(--color-text-muted,#666);max-inline-size:5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${
|
|
25
|
-
</div>`;return
|
|
24
|
+
${o?`<code style="font-family:var(--font-mono,monospace);font-size:0.625rem;color:var(--color-text-muted,#666);max-inline-size:5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${s}</code>`:""}
|
|
25
|
+
</div>`;return l+="</div>",l}h("token-specimen",f);
|
|
26
26
|
//# sourceMappingURL=token-specimen.js.map
|