@vonage/vivid 5.4.0 → 5.6.0

package/alert/index.js

@@ -1,20 +1,21 @@
-import { B as h, b as u } from "../bundled/definition3.js";
+import { B as u, b as h } from "../bundled/definition3.js";
 import { E as f, e as b } from "../bundled/definition4.js";
 import { V as y, a as i, n as x, h as c, c as g, d as _ } from "../bundled/vivid-element.js";
 import { i as $ } from "../bundled/definition2.js";
 import { C as l } from "../bundled/enums.js";
-import { b as k, a as w, I as A, c as C } from "../bundled/affix.js";
-import { h as E } from "../bundled/index.js";
-import { L as z } from "../bundled/localized.js";
+import { b as k, a as A, I as C, c as w } from "../bundled/affix.js";
+import { h as z } from "../bundled/index.js";
+import { L as I } from "../bundled/localized.js";
+import { r as E } from "../bundled/ref.js";
 import { w as p } from "../bundled/when.js";
 import { c as d } from "../bundled/class-names.js";
-const I = '.control{position:fixed;z-index:10;border-radius:8px;inline-size:max-content;inset-block-end:0;inset-inline:0;margin-block:16px;margin-inline:auto;max-inline-size:var(--alert-max-inline-size, fit-content);min-inline-size:var(--alert-min-inline-size, 420px);transition:opacity .15s cubic-bezier(0,0,.2,1) 0ms,transform .15s cubic-bezier(0,0,.2,1) 0ms}.control.placement-top,.control.placement-top-start,.control.placement-top-end{inset-block:0 auto}.control.placement-top-start,.control.placement-bottom-start{right:auto;inset-inline-end:auto;margin-inline:16px}.control.placement-top-end,.control.placement-bottom-end{inset-inline-start:auto;margin-inline:16px}.control:where(.strategy-static){position:static;margin:0;inline-size:auto}.control:not(.open){opacity:0;transform:scale(.8)}.control.open{opacity:1;transform:scale(1)}@media (width <= 768px){.control{min-inline-size:var(--alert-min-inline-size, auto)}}.base.connotation-success{--_connotation-color-primary: var(--vvd-alert-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-alert-success-primary-text, var(--vvd-color-canvas))}.base.connotation-information{--_connotation-color-primary: var(--vvd-alert-information-primary, var(--vvd-color-information-500));--_connotation-color-primary-text: var(--vvd-alert-information-primary-text, var(--vvd-color-canvas))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-alert-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-alert-alert-primary-text, var(--vvd-color-canvas))}.base.connotation-warning{--_connotation-color-primary: var(--vvd-alert-warning-primary, var(--vvd-color-warning-300));--_connotation-color-primary-text: var(--vvd-alert-warning-primary-text, var(--vvd-color-canvas-text))}.base.connotation-announcement{--_connotation-color-primary: var(--vvd-alert-announcement-primary, var(--vvd-color-announcement-500));--_connotation-color-primary-text: var(--vvd-alert-announcement-primary-text, var(--vvd-color-canvas))}.base:not(.connotation-success,.connotation-information,.connotation-alert,.connotation-warning,.connotation-announcement){--_connotation-color-primary: var(--vvd-alert-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-alert-accent-primary-text, var(--vvd-color-canvas))}.base{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.base{display:flex;align-items:center;padding:16px;border-radius:8px;background-color:var(--vvd-color-neutral-50);color:var(--vvd-color-canvas-text);column-gap:16px}.base .alert-text{margin-inline-end:auto}.base .alert-text .headline{font:var(--vvd-typography-base-bold);margin-block:0 4px}.base .alert-text .main-text{font:var(--vvd-typography-base)}.base .alert-text .headline+::slotted([slot=main i]:first-child):before,.base .alert-text .main-text+::slotted([slot=main i]:first-child):before{display:block;margin-top:8px;content:""}.base slot[name=icon]{flex-shrink:0;color:var(--_appearance-color-fill);font-size:24px;line-height:1}.base .dismiss-button{border-left:1px solid var(--vvd-color-neutral-200);padding-inline-start:16px}';
-var B = Object.defineProperty, r = (n, t, e, o) => {
+const B = '.control{position:fixed;z-index:10;border-radius:8px;inline-size:max-content;inset-block-end:0;inset-inline:0;margin-block:16px;margin-inline:auto;max-inline-size:var(--alert-max-inline-size, fit-content);min-inline-size:var(--alert-min-inline-size, 420px);transition:opacity .15s cubic-bezier(0,0,.2,1) 0ms,transform .15s cubic-bezier(0,0,.2,1) 0ms}.control.placement-top,.control.placement-top-start,.control.placement-top-end{inset-block:0 auto}.control.placement-top-start,.control.placement-bottom-start{right:auto;inset-inline-end:auto;margin-inline:16px}.control.placement-top-end,.control.placement-bottom-end{inset-inline-start:auto;margin-inline:16px}.control:where(.strategy-static){position:static;margin:0;inline-size:auto}.control:not(.open){opacity:0;transform:scale(.8)}.control.open{opacity:1;transform:scale(1)}@media (width <= 768px){.control{min-inline-size:var(--alert-min-inline-size, auto)}}.base.connotation-success{--_connotation-color-primary: var(--vvd-alert-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-alert-success-primary-text, var(--vvd-color-canvas))}.base.connotation-information{--_connotation-color-primary: var(--vvd-alert-information-primary, var(--vvd-color-information-500));--_connotation-color-primary-text: var(--vvd-alert-information-primary-text, var(--vvd-color-canvas))}.base.connotation-alert{--_connotation-color-primary: var(--vvd-alert-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-alert-alert-primary-text, var(--vvd-color-canvas))}.base.connotation-warning{--_connotation-color-primary: var(--vvd-alert-warning-primary, var(--vvd-color-warning-300));--_connotation-color-primary-text: var(--vvd-alert-warning-primary-text, var(--vvd-color-canvas-text))}.base.connotation-announcement{--_connotation-color-primary: var(--vvd-alert-announcement-primary, var(--vvd-color-announcement-500));--_connotation-color-primary-text: var(--vvd-alert-announcement-primary-text, var(--vvd-color-canvas))}.base:not(.connotation-success,.connotation-information,.connotation-alert,.connotation-warning,.connotation-announcement){--_connotation-color-primary: var(--vvd-alert-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-alert-accent-primary-text, var(--vvd-color-canvas))}.base{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.base{display:flex;align-items:center;padding:16px;border-radius:8px;background-color:var(--vvd-color-neutral-50);color:var(--vvd-color-canvas-text);column-gap:16px}.base .alert-text{margin-inline-end:auto}.base .alert-text .headline{font:var(--vvd-typography-base-bold);margin-block:0 4px}.base .alert-text .main-text{font:var(--vvd-typography-base)}.base .alert-text .headline+::slotted([slot=main i]:first-child):before,.base .alert-text .main-text+::slotted([slot=main i]:first-child):before{display:block;margin-top:8px;content:""}.base slot[name=icon]{flex-shrink:0;color:var(--_appearance-color-fill);font-size:24px;line-height:1}.base .dismiss-button{border-left:1px solid var(--vvd-color-neutral-200);padding-inline-start:16px}';
+var T = Object.defineProperty, r = (n, t, e, o) => {
   for (var s = void 0, m = n.length - 1, v; m >= 0; m--)
     (v = n[m]) && (s = v(t, e, s) || s);
-  return s && B(t, e, s), s;
+  return s && T(t, e, s), s;
 };
-const T = {
+const L = {
   [l.Accent]: "megaphone-line",
   [l.Information]: "info-line",
   [l.Success]: "check-circle-line",
@@ -22,10 +23,10 @@ const T = {
   [l.Announcement]: "sparkles-line",
   [l.Alert]: "error-line"
 };
-class a extends k(z(y)) {
+class a extends k(I(y)) {
   constructor() {
     super(...arguments), this.dismissButtonAriaLabel = null, this.removable = !1, this.placement = "bottom", this.timeoutms = 0, this.open = !1, this.#o = (t) => {
-      this.open && this.removable && E(t) && (this.open = !1);
+      this.open && this.removable && z(t) && (this.open = !1);
     }, this.#n = () => {
       this.open ? this.style.display = "contents" : this.style.display = "none";
     };
@@ -44,18 +45,13 @@ class a extends k(z(y)) {
         this.style.display = "none";
   }
   connectedCallback() {
-    super.connectedCallback(), this.addEventListener("keydown", this.#o), this.controlEl = this.shadowRoot.querySelector(
-      ".control"
-    ), this.controlEl && this.controlEl.addEventListener("transitionend", this.#n), this.#e();
+    super.connectedCallback(), this.addEventListener("keydown", this.#o), this._controlEl.addEventListener("transitionend", this.#n), this.#e();
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.#t && clearTimeout(this.#t), this.removeEventListener("keydown", this.#o), this.controlEl && this.controlEl.removeEventListener(
-      "transitionend",
-      this.#n
-    );
+    super.disconnectedCallback(), this.#t && clearTimeout(this.#t), this.removeEventListener("keydown", this.#o), this._controlEl.removeEventListener("transitionend", this.#n);
   }
   get conditionedIcon() {
-    return this.icon || this.connotation && T[this.connotation];
+    return this.icon || this.connotation && L[this.connotation];
   }
   #e() {
     this.#t && clearTimeout(this.#t), this.open && this.timeoutms > 0 && (this.#t = setTimeout(() => this.open = !1, this.timeoutms));
@@ -93,25 +89,25 @@ r([
 r([
   i({ mode: "boolean" })
 ], a.prototype, "open");
-const L = ({ connotation: n }) => d("base", [`connotation-${n}`, !!n]), O = ({ open: n, placement: t, strategy: e }) => d(
+const O = ({ connotation: n }) => d("base", [`connotation-${n}`, !!n]), D = ({ open: n, placement: t, strategy: e }) => d(
   "control",
   ["open", n],
   [`placement-${t}`, !!t],
   [`strategy-${e}`, !!e]
 );
-function D(n, t) {
-  const e = w(n), o = t.conditionedIcon, s = !t.icon && t.connotation ? {
+function N(n, t) {
+  const e = A(n), o = t.conditionedIcon, s = !t.icon && t.connotation ? {
     label: t.locale.connotationAnnoncement[`${t.connotation}Icon`],
     announceOnUpdate: !0
   } : void 0;
   return e(
     o,
-    A.Slot,
-    C.Hidden,
+    C.Slot,
+    w.Hidden,
     s
   );
 }
-function N(n) {
+function F(n) {
   return c`
 		<${n}
 			aria-label="${(t) => t.dismissButtonAriaLabel || t.locale.alert.dismissButtonLabel}"
@@ -122,37 +118,37 @@ function N(n) {
 			@click="${(t) => t.open = !1}">
 		</${n}>`;
 }
-const S = (n) => {
-  const t = n.tagFor(f), e = n.tagFor(h);
+const P = (n) => {
+  const t = n.tagFor(f), e = n.tagFor(u);
   return c`
 	<${t} class="elevation" dp='8' exportparts="vvd-theme-alternate">
-		<div class="${O}">
+		<div class="${D}" ${E("_controlEl")}>
 			<div
 				part="vvd-theme-alternate"
-				class="${L}"
+				class="${O}"
 				role="alert"
 				aria-hidden="${(o) => o.open ? "false" : "true"}"
-				${(o) => o.open ? "" : "hidden"}
+				?hidden="${(o) => !o.open}"
 			>
-				${(o) => D(n, o)}
+				${(o) => N(n, o)}
 				<div class="alert-text">
 					${p((o) => o.headline, c`<h2 class="headline">${(o) => o.headline}</h2>`)}
 					${p((o) => o.text, c`<div class="main-text">${(o) => o.text}</div>`)}
 					<slot name="main"></slot>
 				</div>
 				<slot class="action-items" name="action-items"></slot>
-				${p((o) => o.removable, N(e))}
+				${p((o) => o.removable, F(e))}
 			</div>
 		</div>
 	</${t}>
 	`;
-}, F = _(
+}, S = _(
   "alert",
   a,
-  S,
-  [$, u, b],
+  P,
+  [$, h, b],
   {
-    styles: I
+    styles: B
   }
-), P = g(F);
-P();
+), V = g(S);
+V();

package/audio-player/definition.cjs

@@ -79,6 +79,7 @@ class AudioPlayer extends localized.Localized(vividElement.VividElement) {
       const currentTime = this.currentTime;
       const isValid = Number.isFinite(duration) && duration > 0 && Number.isFinite(currentTime) && currentTime >= 0;
       const percent = isValid ? currentTime / duration * 100 : 0;
+      /* v8 ignore else -- @preserve */
       if (this.#sliderEl) {
         this.#isProgrammaticSliderUpdate = true;
         this.#sliderEl.value = percent.toString();
@@ -109,6 +110,7 @@ class AudioPlayer extends localized.Localized(vividElement.VividElement) {
       if (this.#isProgrammaticSliderUpdate) {
         return;
       }
+      /* v8 ignore else -- @preserve */
       if (this.#playerEl) {
         this.currentTime = this.duration * Number(this.#sliderEl.value) / 100;
       }
@@ -188,6 +190,7 @@ class AudioPlayer extends localized.Localized(vividElement.VividElement) {
       this.#audioBuffer = audioBuffer;
       fastElement.Observable.notify(this, "duration");
     } catch (e) {
+      /* v8 ignore else -- @preserve */
       if (e instanceof Error && e.name !== "AbortError") {
         console.error("Error loading audio:", e);
       }
@@ -245,6 +248,7 @@ class AudioPlayer extends localized.Localized(vividElement.VividElement) {
   }
   #setSliderInteractionListeners(add = true) {
     const action = add ? "addEventListener" : "removeEventListener";
+    /* v8 ignore else -- @preserve */
     if (this.#sliderEl) {
       this.#sliderEl[action]("change", this.#updateCurrentTimeOnSliderChange);
     }

package/audio-player/definition.js

@@ -75,6 +75,7 @@ class AudioPlayer extends Localized(VividElement) {
       const currentTime = this.currentTime;
       const isValid = Number.isFinite(duration) && duration > 0 && Number.isFinite(currentTime) && currentTime >= 0;
       const percent = isValid ? currentTime / duration * 100 : 0;
+      /* v8 ignore else -- @preserve */
       if (this.#sliderEl) {
         this.#isProgrammaticSliderUpdate = true;
         this.#sliderEl.value = percent.toString();
@@ -105,6 +106,7 @@ class AudioPlayer extends Localized(VividElement) {
       if (this.#isProgrammaticSliderUpdate) {
         return;
       }
+      /* v8 ignore else -- @preserve */
       if (this.#playerEl) {
         this.currentTime = this.duration * Number(this.#sliderEl.value) / 100;
       }
@@ -184,6 +186,7 @@ class AudioPlayer extends Localized(VividElement) {
       this.#audioBuffer = audioBuffer;
       Observable.notify(this, "duration");
     } catch (e) {
+      /* v8 ignore else -- @preserve */
       if (e instanceof Error && e.name !== "AbortError") {
         console.error("Error loading audio:", e);
       }
@@ -241,6 +244,7 @@ class AudioPlayer extends Localized(VividElement) {
   }
   #setSliderInteractionListeners(add = true) {
     const action = add ? "addEventListener" : "removeEventListener";
+    /* v8 ignore else -- @preserve */
     if (this.#sliderEl) {
       this.#sliderEl[action]("change", this.#updateCurrentTimeOnSliderChange);
     }

package/audio-player/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const u=require("../bundled/definition3.cjs"),h=require("../bundled/definition5.cjs"),y=require("../bundled/definition6.cjs"),r=require("../bundled/vivid-element.cjs"),m=require("../bundled/definition7.cjs"),c=require("../bundled/enums.cjs"),f=require("../bundled/localized.cjs"),g=require("../bundled/playbackRates.cjs"),d=require("../bundled/when.cjs"),v=require("../bundled/repeat.cjs"),B=require("../bundled/class-names.cjs"),$=':host{display:block}.wrapper{container-type:inline-size}.base{display:inline-flex;box-sizing:border-box;align-items:center;padding:8px;color:var(--vvd-color-canvas-text);gap:8px;inline-size:100%;user-select:none}.base.disabled{color:var(--vvd-color-neutral-300)}.base .slider{flex:1;grid-area:slider}.base .controls{display:flex;align-items:center;justify-content:center;gap:8px;grid-area:controls}.base .time-stamp{display:inline-flex}.base .time-stamp .current-time,.base .time-stamp .total-time{margin-inline:6px;min-inline-size:32px}.base .playback-button{grid-area:playback}@container (max-width: 500px){.base.two-lines{display:inline-grid;grid-template:auto auto/1fr;grid-template-areas:"slider" "controls";inline-size:100%;row-gap:4px}.base.two-lines .time-stamp{margin-inline:auto 2px}.base.two-lines.playback{grid-template-areas:"slider slider" "controls playback";grid-template-columns:1fr auto}.base.two-lines.playback .time-stamp{margin-inline:auto}.base .slider{box-sizing:border-box;min-inline-size:auto;padding-inline:2px}}';var w=Object.defineProperty,o=(i,e,t,s)=>{for(var a=void 0,l=i.length-1,p;l>=0;l--)(p=i[l])&&(a=p(e,t,a)||a);return a&&w(e,t,a),a};const k={FORWARD:1,BACKWARD:-1};function b(i){if(!i||Number.isNaN(i))return"0:00";const e=Math.floor(i/60),t=Math.floor(i%60);return e+":"+(t<10?"0"+t:t)}const A=!0,L=!1,T={toView(i){return i},fromView(i){return Object.values(c.MediaSkipBy).includes(i)?i:void 0}};class n extends f.Localized(r.VividElement){constructor(){super(),this.playButtonAriaLabel=null,this.pauseButtonAriaLabel=null,this.sliderAriaLabel=null,this.skipForwardButtonAriaLabel=null,this.skipBackwardButtonAriaLabel=null,this.disabled=!1,this.notime=!1,this.playbackRates=null,this.#t=new Audio,this.#n=!1,this.durationFallback=!1,this.#l=e=>{if(e===this.paused){this.#o();return}this.paused?(this.#r(),this.#t.play()):this.#t.pause(),this.#o()},this.#r=()=>{r.Observable.notify(this,"currentTime");const e=this.duration,t=this.currentTime,s=Number.isFinite(e)&&e>0&&Number.isFinite(t)&&t>=0,a=s?t/e*100:0;this.#e&&(this.#n=!0,this.#e.value=a.toString(),this.#n=!1),s&&a===100&&this.pause()},this.#s=()=>{r.Observable.notify(this,"duration"),(!Number.isFinite(this.#t.duration)||this.#t.duration<=0)&&this.durationFallback&&this.#p()},this.#u=()=>{!this.paused&&this.#e.isDragging&&(this.pause(),this.#d=window.setInterval(()=>{this.#e.isDragging||(clearInterval(this.#d),this.play())},0)),!this.#n&&this.#t&&(this.currentTime=this.duration*Number(this.#e.value)/100)},this.#o=()=>{r.Observable.notify(this,"paused")}}srcChanged(){this.src===void 0?this.setSrc(""):this.setSrc(this.src)}revokeSrc(){const e=this.getCurrentSrc();e&&e.startsWith("blob:")&&URL.revokeObjectURL(e)}getCurrentSrc(){return this.#t.currentSrc||this.#t.src||""}canPlayType(e){return this.#t.canPlayType(e)!==""}setSrc(e,t){const s=this.getCurrentSrc();this.revokeSrc(),this.#i=void 0,this.#a&&(this.#a.abort(),this.#a=void 0);const a=t&&(this.canPlayType(t.type)||!e)?URL.createObjectURL(t):e;if(s&&this.#t.removeAttribute("src"),a||e)try{this.#t.src=a}catch(l){console.log("Falling back to original URL due to error:",l),this.#t.src=e}}get playbackRate(){return r.Observable.track(this,"playbackRate"),this.#t.playbackRate}set playbackRate(e){this.#t.playbackRate=e,r.Observable.notify(this,"playbackRate")}get paused(){return r.Observable.track(this,"paused"),this.#t.paused}set paused(e){}#i;#a;async#p(){if(this.#i||!this.src)return;this.#a=new AbortController;const e=this.#a.signal;try{const s=await(await fetch(this.src,{signal:e})).blob();this.setSrc(this.src,s);const a=await s.arrayBuffer(),l=new window.AudioContext,p=await l.decodeAudioData(a);l.close(),this.#i=p,r.Observable.notify(this,"duration")}catch(t){t instanceof Error&&t.name!=="AbortError"&&console.error("Error loading audio:",t)}finally{this.#a=void 0}}get duration(){r.Observable.track(this,"duration");const e=this.#t.duration;return Number.isFinite(e)&&e>0?e:this.#i&&this.#i.duration>0?this.#i.duration:e}set duration(e){}get currentTime(){return r.Observable.track(this,"currentTime"),this.#t.currentTime}set currentTime(e){this.#t.currentTime=e}get#e(){return this.shadowRoot.querySelector(".slider")}#t;#n;connectedCallback(){super.connectedCallback(),this.#t.addEventListener("timeupdate",this.#r),this.#t.addEventListener("loadedmetadata",this.#s),this.#t.addEventListener("durationchange",this.#s),this.#c(),this.#o(),this.#r()}disconnectedCallback(){super.disconnectedCallback(),this.#c(!1),this.pause(),this.#t.removeEventListener("timeupdate",this.#r),this.#t.removeEventListener("loadedmetadata",this.#s),this.#t.removeEventListener("durationchange",this.#s)}play(){this.#l(L)}pause(){this.#l(A)}#c(e=!0){const t=e?"addEventListener":"removeEventListener";this.#e&&this.#e[t]("change",this.#u)}#l;#r;#s;#d;#u;#o;skip(e){const t=this.currentTime,s=parseInt(this.skipBy)*e,a=t+s;this.currentTime=Math.max(0,Math.min(this.duration,a))}}o([r.attr({attribute:"play-button-aria-label"})],n.prototype,"playButtonAriaLabel");o([r.attr({attribute:"pause-button-aria-label"})],n.prototype,"pauseButtonAriaLabel");o([r.attr({attribute:"slider-aria-label"})],n.prototype,"sliderAriaLabel");o([r.attr({attribute:"skip-forward-aria-label"})],n.prototype,"skipForwardButtonAriaLabel");o([r.attr({attribute:"skip-backward-aria-label"})],n.prototype,"skipBackwardButtonAriaLabel");o([r.attr],n.prototype,"connotation");o([r.attr],n.prototype,"src");o([r.attr({mode:"boolean"})],n.prototype,"disabled");o([r.attr({mode:"boolean"})],n.prototype,"notime");o([r.attr({attribute:"skip-by",converter:T})],n.prototype,"skipBy");o([r.attr({attribute:"playback-rates"})],n.prototype,"playbackRates");o([r.attr({mode:"boolean",attribute:"duration-fallback"})],n.prototype,"durationFallback");const S=({notime:i,disabled:e,duration:t,skipBy:s,playbackRates:a})=>B.classNames(["disabled",!!e||!t],["two-lines",!i&&(!!Number(s)||!!a)],["playback",!!a]),R=(i,{parent:e})=>i===e.playbackRate;function C(i){const e=i.tagFor(u.Button);return r.html`<${e} class="pause" @click="${t=>t.paused?t.play():t.pause()}"
+"use strict";const u=require("../bundled/definition3.cjs"),h=require("../bundled/definition5.cjs"),y=require("../bundled/definition6.cjs"),r=require("../bundled/vivid-element.cjs"),m=require("../bundled/definition7.cjs"),c=require("../bundled/enums.cjs"),f=require("../bundled/localized.cjs"),g=require("../bundled/playbackRates.cjs"),d=require("../bundled/when.cjs"),v=require("../bundled/repeat.cjs"),B=require("../bundled/class-names.cjs"),$=':host{display:block}.wrapper{container-type:inline-size}.base{display:inline-flex;box-sizing:border-box;align-items:center;padding:8px;color:var(--vvd-color-canvas-text);gap:8px;inline-size:100%;user-select:none}.base.disabled{color:var(--vvd-color-neutral-300)}.base .slider{flex:1;grid-area:slider}.base .controls{display:flex;align-items:center;justify-content:center;gap:8px;grid-area:controls}.base .time-stamp{display:inline-flex}.base .time-stamp .current-time,.base .time-stamp .total-time{margin-inline:6px;min-inline-size:32px}.base .playback-button{grid-area:playback}@container (max-width: 500px){.base.two-lines{display:inline-grid;grid-template:auto auto/1fr;grid-template-areas:"slider" "controls";inline-size:100%;row-gap:4px}.base.two-lines .time-stamp{margin-inline:auto 2px}.base.two-lines.playback{grid-template-areas:"slider slider" "controls playback";grid-template-columns:1fr auto}.base.two-lines.playback .time-stamp{margin-inline:auto}.base .slider{box-sizing:border-box;min-inline-size:auto;padding-inline:2px}}';var w=Object.defineProperty,o=(i,e,t,s)=>{for(var a=void 0,l=i.length-1,p;l>=0;l--)(p=i[l])&&(a=p(e,t,a)||a);return a&&w(e,t,a),a};const k={FORWARD:1,BACKWARD:-1};function b(i){if(!i||Number.isNaN(i))return"0:00";const e=Math.floor(i/60),t=Math.floor(i%60);return e+":"+(t<10?"0"+t:t)}const A=!0,L=!1,T={toView(i){return i},fromView(i){return Object.values(c.MediaSkipBy).includes(i)?i:void 0}};class n extends f.Localized(r.VividElement){constructor(){super(),this.playButtonAriaLabel=null,this.pauseButtonAriaLabel=null,this.sliderAriaLabel=null,this.skipForwardButtonAriaLabel=null,this.skipBackwardButtonAriaLabel=null,this.disabled=!1,this.notime=!1,this.playbackRates=null,this.#t=new Audio,this.#n=!1,this.durationFallback=!1,this.#l=e=>{if(e===this.paused){this.#o();return}this.paused?(this.#r(),this.#t.play()):this.#t.pause(),this.#o()},this.#r=()=>{r.Observable.notify(this,"currentTime");const e=this.duration,t=this.currentTime,s=Number.isFinite(e)&&e>0&&Number.isFinite(t)&&t>=0,a=s?t/e*100:0;/* v8 ignore else -- @preserve */this.#e&&(this.#n=!0,this.#e.value=a.toString(),this.#n=!1),s&&a===100&&this.pause()},this.#s=()=>{r.Observable.notify(this,"duration"),(!Number.isFinite(this.#t.duration)||this.#t.duration<=0)&&this.durationFallback&&this.#p()},this.#u=()=>{if(!this.paused&&this.#e.isDragging&&(this.pause(),this.#d=window.setInterval(()=>{this.#e.isDragging||(clearInterval(this.#d),this.play())},0)),this.#n)return;/* v8 ignore else -- @preserve */this.#t&&(this.currentTime=this.duration*Number(this.#e.value)/100)},this.#o=()=>{r.Observable.notify(this,"paused")}}srcChanged(){this.src===void 0?this.setSrc(""):this.setSrc(this.src)}revokeSrc(){const e=this.getCurrentSrc();e&&e.startsWith("blob:")&&URL.revokeObjectURL(e)}getCurrentSrc(){return this.#t.currentSrc||this.#t.src||""}canPlayType(e){return this.#t.canPlayType(e)!==""}setSrc(e,t){const s=this.getCurrentSrc();this.revokeSrc(),this.#i=void 0,this.#a&&(this.#a.abort(),this.#a=void 0);const a=t&&(this.canPlayType(t.type)||!e)?URL.createObjectURL(t):e;if(s&&this.#t.removeAttribute("src"),a||e)try{this.#t.src=a}catch(l){console.log("Falling back to original URL due to error:",l),this.#t.src=e}}get playbackRate(){return r.Observable.track(this,"playbackRate"),this.#t.playbackRate}set playbackRate(e){this.#t.playbackRate=e,r.Observable.notify(this,"playbackRate")}get paused(){return r.Observable.track(this,"paused"),this.#t.paused}set paused(e){}#i;#a;async#p(){if(this.#i||!this.src)return;this.#a=new AbortController;const e=this.#a.signal;try{const s=await(await fetch(this.src,{signal:e})).blob();this.setSrc(this.src,s);const a=await s.arrayBuffer(),l=new window.AudioContext,p=await l.decodeAudioData(a);l.close(),this.#i=p,r.Observable.notify(this,"duration")}catch(t){/* v8 ignore else -- @preserve */t instanceof Error&&t.name!=="AbortError"&&console.error("Error loading audio:",t)}finally{this.#a=void 0}}get duration(){r.Observable.track(this,"duration");const e=this.#t.duration;return Number.isFinite(e)&&e>0?e:this.#i&&this.#i.duration>0?this.#i.duration:e}set duration(e){}get currentTime(){return r.Observable.track(this,"currentTime"),this.#t.currentTime}set currentTime(e){this.#t.currentTime=e}get#e(){return this.shadowRoot.querySelector(".slider")}#t;#n;connectedCallback(){super.connectedCallback(),this.#t.addEventListener("timeupdate",this.#r),this.#t.addEventListener("loadedmetadata",this.#s),this.#t.addEventListener("durationchange",this.#s),this.#c(),this.#o(),this.#r()}disconnectedCallback(){super.disconnectedCallback(),this.#c(!1),this.pause(),this.#t.removeEventListener("timeupdate",this.#r),this.#t.removeEventListener("loadedmetadata",this.#s),this.#t.removeEventListener("durationchange",this.#s)}play(){this.#l(L)}pause(){this.#l(A)}#c(e=!0){const t=e?"addEventListener":"removeEventListener";/* v8 ignore else -- @preserve */this.#e&&this.#e[t]("change",this.#u)}#l;#r;#s;#d;#u;#o;skip(e){const t=this.currentTime,s=parseInt(this.skipBy)*e,a=t+s;this.currentTime=Math.max(0,Math.min(this.duration,a))}}o([r.attr({attribute:"play-button-aria-label"})],n.prototype,"playButtonAriaLabel");o([r.attr({attribute:"pause-button-aria-label"})],n.prototype,"pauseButtonAriaLabel");o([r.attr({attribute:"slider-aria-label"})],n.prototype,"sliderAriaLabel");o([r.attr({attribute:"skip-forward-aria-label"})],n.prototype,"skipForwardButtonAriaLabel");o([r.attr({attribute:"skip-backward-aria-label"})],n.prototype,"skipBackwardButtonAriaLabel");o([r.attr],n.prototype,"connotation");o([r.attr],n.prototype,"src");o([r.attr({mode:"boolean"})],n.prototype,"disabled");o([r.attr({mode:"boolean"})],n.prototype,"notime");o([r.attr({attribute:"skip-by",converter:T})],n.prototype,"skipBy");o([r.attr({attribute:"playback-rates"})],n.prototype,"playbackRates");o([r.attr({mode:"boolean",attribute:"duration-fallback"})],n.prototype,"durationFallback");const S=({notime:i,disabled:e,duration:t,skipBy:s,playbackRates:a})=>B.classNames(["disabled",!!e||!t],["two-lines",!i&&(!!Number(s)||!!a)],["playback",!!a]),R=(i,{parent:e})=>i===e.playbackRate;function C(i){const e=i.tagFor(u.Button);return r.html`<${e} class="pause" @click="${t=>t.paused?t.play():t.pause()}"
 	icon="${t=>t.paused?"play-solid":"pause-solid"}"
 	aria-label="${t=>t.paused?t.playButtonAriaLabel||t.locale.audioPlayer.playButtonLabel:t.pauseButtonAriaLabel||t.locale.audioPlayer.pauseButtonLabel}"
 	size='condensed'

package/audio-player/index.js

@@ -44,13 +44,17 @@ class s extends S($) {
     }, this.#r = () => {
       l.notify(this, "currentTime");
       const e = this.duration, t = this.currentTime, r = Number.isFinite(e) && e > 0 && Number.isFinite(t) && t >= 0, i = r ? t / e * 100 : 0;
+      /* v8 ignore else -- @preserve */
       this.#e && (this.#n = !0, this.#e.value = i.toString(), this.#n = !1), r && i === 100 && this.pause();
     }, this.#s = () => {
       l.notify(this, "duration"), (!Number.isFinite(this.#t.duration) || this.#t.duration <= 0) && this.durationFallback && this.#p();
     }, this.#u = () => {
-      !this.paused && this.#e.isDragging && (this.pause(), this.#d = window.setInterval(() => {
+      if (!this.paused && this.#e.isDragging && (this.pause(), this.#d = window.setInterval(() => {
         this.#e.isDragging || (clearInterval(this.#d), this.play());
-      }, 0)), !this.#n && this.#t && (this.currentTime = this.duration * Number(this.#e.value) / 100);
+      }, 0)), this.#n)
+        return;
+      /* v8 ignore else -- @preserve */
+      this.#t && (this.currentTime = this.duration * Number(this.#e.value) / 100);
     }, this.#o = () => {
       l.notify(this, "paused");
     };
@@ -102,6 +106,7 @@ class s extends S($) {
       const i = await r.arrayBuffer(), d = new window.AudioContext(), h = await d.decodeAudioData(i);
       d.close(), this.#a = h, l.notify(this, "duration");
     } catch (t) {
+      /* v8 ignore else -- @preserve */
       t instanceof Error && t.name !== "AbortError" && console.error("Error loading audio:", t);
     } finally {
       this.#i = void 0;
@@ -139,6 +144,7 @@ class s extends S($) {
   }
   #c(e = !0) {
     const t = e ? "addEventListener" : "removeEventListener";
+    /* v8 ignore else -- @preserve */
     this.#e && this.#e[t]("change", this.#u);
   }
   #l;

package/banner/definition.cjs

@@ -61,10 +61,8 @@ class Banner extends affix.AffixIcon(localized.Localized(delegatesAria.Delegates
   remove() {
     this.$emit("removing");
     const banner = this.shadowRoot && this.shadowRoot.querySelector(".control");
-    if (banner) {
-      banner.classList.add("removing");
-      banner.addEventListener("transitionend", this.#handleRemoveEnd);
-    }
+    banner?.classList.add("removing");
+    banner?.addEventListener("transitionend", this.#handleRemoveEnd);
   }
   #handleRemoveEnd;
   #closeOnKeyDown;

package/banner/definition.js

@@ -57,10 +57,8 @@ class Banner extends AffixIcon(Localized(DelegatesAria(VividElement))) {
   remove() {
     this.$emit("removing");
     const banner = this.shadowRoot && this.shadowRoot.querySelector(".control");
-    if (banner) {
-      banner.classList.add("removing");
-      banner.addEventListener("transitionend", this.#handleRemoveEnd);
-    }
+    banner?.classList.add("removing");
+    banner?.addEventListener("transitionend", this.#handleRemoveEnd);
   }
   #handleRemoveEnd;
   #closeOnKeyDown;

package/banner/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const m=require("../bundled/definition3.cjs"),u=require("../bundled/definition2.cjs"),e=require("../bundled/vivid-element.cjs"),c=require("../bundled/enums.cjs"),p=require("../bundled/delegates-aria.cjs"),s=require("../bundled/affix.cjs"),h=require("../bundled/localized.cjs"),b=require("../bundled/slotted.cjs"),f=require("../bundled/when.cjs"),y=require("../bundled/class-names.cjs"),g=":host{display:block}.control.connotation-success{--_connotation-color-primary: var(--vvd-banner-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-banner-success-primary-text, var(--vvd-color-canvas))}.control.connotation-alert{--_connotation-color-primary: var(--vvd-banner-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-banner-alert-primary-text, var(--vvd-color-canvas))}.control.connotation-announcement{--_connotation-color-primary: var(--vvd-banner-announcement-primary, var(--vvd-color-announcement-500));--_connotation-color-primary-text: var(--vvd-banner-announcement-primary-text, var(--vvd-color-canvas))}.control.connotation-warning{--_connotation-color-primary: var(--vvd-banner-warning-primary, var(--vvd-color-warning-300));--_connotation-color-primary-text: var(--vvd-banner-warning-primary-text, var(--vvd-color-canvas-text))}.control:not(.connotation-success,.connotation-alert,.connotation-announcement,.connotation-warning){--_connotation-color-primary: var(--vvd-banner-information-primary, var(--vvd-color-information-500));--_connotation-color-primary-text: var(--vvd-banner-information-primary-text, var(--vvd-color-canvas))}.control{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.control{overflow:hidden;max-height:160px;background-color:var(--_appearance-color-fill);color:var(--_appearance-color-text);transition:max-height var(--transition-delay, .2s)}.control.removing{max-height:0}.header{display:flex;box-sizing:border-box;align-items:center;font:var(--vvd-typography-base-bold);inline-size:100%;min-block-size:calc(1px*(60 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.header .content{display:flex;flex-grow:1;align-items:center;justify-content:center;padding:10px 16px;column-gap:16px;inline-size:100%}.header .content slot[name=icon]{flex-shrink:0;font-size:20px;line-height:1}.header .content .action-items{flex-shrink:0}.header .dismiss-button{flex-shrink:0;margin-inline-end:8px}";var x=Object.defineProperty,i=(o,n,t,d)=>{for(var r=void 0,l=o.length-1,v;l>=0;l--)(v=o[l])&&(r=v(n,t,r)||r);return r&&x(n,t,r),r};const _={[c.Connotation.Information]:"info-solid",[c.Connotation.Announcement]:"megaphone-solid",[c.Connotation.Success]:"check-circle-solid",[c.Connotation.Warning]:"warning-solid",[c.Connotation.Alert]:"error-solid"},C=(o=c.Connotation.Information)=>_[o];class a extends s.AffixIcon(h.Localized(p.DelegatesAria(e.VividElement))){constructor(){super(...arguments),this.dismissButtonAriaLabel=null,this.removable=!1,this.#o=()=>{this.$emit("removed"),this.parentElement&&this.parentElement.removeChild(this)},this.#n=n=>{n.key!=="Escape"||!this.removable||this.remove()}}get conditionedIcon(){return this.icon??C(this.connotation)}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",this.#n)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("keydown",this.#n)}remove(){this.$emit("removing");const n=this.shadowRoot&&this.shadowRoot.querySelector(".control");n&&(n.classList.add("removing"),n.addEventListener("transitionend",this.#o))}#o;#n}i([e.attr({attribute:"dismiss-aria-label"})],a.prototype,"dismissButtonAriaLabel");i([e.attr({attribute:"action-href"})],a.prototype,"actionHref");i([e.attr({attribute:"action-text"})],a.prototype,"actionText");i([e.attr({mode:"boolean"})],a.prototype,"removable");i([e.attr()],a.prototype,"text");i([e.attr()],a.prototype,"connotation");i([e.observable],a.prototype,"actionItemsSlottedContent");const w=o=>y.classNames("control",[`connotation-${o.connotation}`,!!o.connotation]);function I(o){return e.html`
+"use strict";const m=require("../bundled/definition3.cjs"),u=require("../bundled/definition2.cjs"),e=require("../bundled/vivid-element.cjs"),c=require("../bundled/enums.cjs"),p=require("../bundled/delegates-aria.cjs"),s=require("../bundled/affix.cjs"),h=require("../bundled/localized.cjs"),b=require("../bundled/slotted.cjs"),y=require("../bundled/when.cjs"),f=require("../bundled/class-names.cjs"),g=":host{display:block}.control.connotation-success{--_connotation-color-primary: var(--vvd-banner-success-primary, var(--vvd-color-success-500));--_connotation-color-primary-text: var(--vvd-banner-success-primary-text, var(--vvd-color-canvas))}.control.connotation-alert{--_connotation-color-primary: var(--vvd-banner-alert-primary, var(--vvd-color-alert-500));--_connotation-color-primary-text: var(--vvd-banner-alert-primary-text, var(--vvd-color-canvas))}.control.connotation-announcement{--_connotation-color-primary: var(--vvd-banner-announcement-primary, var(--vvd-color-announcement-500));--_connotation-color-primary-text: var(--vvd-banner-announcement-primary-text, var(--vvd-color-canvas))}.control.connotation-warning{--_connotation-color-primary: var(--vvd-banner-warning-primary, var(--vvd-color-warning-300));--_connotation-color-primary-text: var(--vvd-banner-warning-primary-text, var(--vvd-color-canvas-text))}.control:not(.connotation-success,.connotation-alert,.connotation-announcement,.connotation-warning){--_connotation-color-primary: var(--vvd-banner-information-primary, var(--vvd-color-information-500));--_connotation-color-primary-text: var(--vvd-banner-information-primary-text, var(--vvd-color-canvas))}.control{--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: transparent}.control{overflow:hidden;max-height:160px;background-color:var(--_appearance-color-fill);color:var(--_appearance-color-text);transition:max-height var(--transition-delay, .2s)}.control.removing{max-height:0}.header{display:flex;box-sizing:border-box;align-items:center;font:var(--vvd-typography-base-bold);inline-size:100%;min-block-size:calc(1px*(60 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.header .content{display:flex;flex-grow:1;align-items:center;justify-content:center;padding:10px 16px;column-gap:16px;inline-size:100%}.header .content slot[name=icon]{flex-shrink:0;font-size:20px;line-height:1}.header .content .action-items{flex-shrink:0}.header .dismiss-button{flex-shrink:0;margin-inline-end:8px}";var x=Object.defineProperty,i=(o,n,t,d)=>{for(var r=void 0,l=o.length-1,v;l>=0;l--)(v=o[l])&&(r=v(n,t,r)||r);return r&&x(n,t,r),r};const _={[c.Connotation.Information]:"info-solid",[c.Connotation.Announcement]:"megaphone-solid",[c.Connotation.Success]:"check-circle-solid",[c.Connotation.Warning]:"warning-solid",[c.Connotation.Alert]:"error-solid"},C=(o=c.Connotation.Information)=>_[o];class a extends s.AffixIcon(h.Localized(p.DelegatesAria(e.VividElement))){constructor(){super(...arguments),this.dismissButtonAriaLabel=null,this.removable=!1,this.#o=()=>{this.$emit("removed"),this.parentElement&&this.parentElement.removeChild(this)},this.#n=n=>{n.key!=="Escape"||!this.removable||this.remove()}}get conditionedIcon(){return this.icon??C(this.connotation)}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",this.#n)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("keydown",this.#n)}remove(){this.$emit("removing");const n=this.shadowRoot&&this.shadowRoot.querySelector(".control");n?.classList.add("removing"),n?.addEventListener("transitionend",this.#o)}#o;#n}i([e.attr({attribute:"dismiss-aria-label"})],a.prototype,"dismissButtonAriaLabel");i([e.attr({attribute:"action-href"})],a.prototype,"actionHref");i([e.attr({attribute:"action-text"})],a.prototype,"actionText");i([e.attr({mode:"boolean"})],a.prototype,"removable");i([e.attr()],a.prototype,"text");i([e.attr()],a.prototype,"connotation");i([e.observable],a.prototype,"actionItemsSlottedContent");const w=o=>f.classNames("control",[`connotation-${o.connotation}`,!!o.connotation]);function I(o){return e.html`
 	  <${o}
 	  		aria-label="${n=>n.dismissButtonAriaLabel||n.locale.banner.dismissButtonLabel}"
 			part="${n=>n.connotation==="warning"?"":"vvd-theme-alternate"}"
@@ -24,7 +24,7 @@
 					></slot>
 				</div>
 
-				${f.when(t=>t.removable,I(n))}
+				${y.when(t=>t.removable,I(n))}
 			</header>
 		</div>
 	`},A=e.defineVividComponent("banner",a,k,[u.iconDefinition,m.buttonDefinition],{styles:g}),L=e.createRegisterFunction(A);L();

package/banner/index.js

@@ -41,7 +41,7 @@ class a extends _(C(g(b))) {
   remove() {
     this.$emit("removing");
     const n = this.shadowRoot && this.shadowRoot.querySelector(".control");
-    n && (n.classList.add("removing"), n.addEventListener("transitionend", this.#o));
+    n?.classList.add("removing"), n?.addEventListener("transitionend", this.#o);
   }
   #o;
   #n;

package/breadcrumb/definition.cjs

@@ -41,6 +41,7 @@ class Breadcrumb extends delegatesAria.DelegatesAria(vividElement.VividElement)
    * @internal
    */
   slottedBreadcrumbItemsChanged(_, newItems) {
+    /* v8 ignore else -- @preserve */
     if (newItems) {
       newItems.forEach((item, index) => {
         const itemIsLastNode = index === newItems.length - 1;

package/breadcrumb/definition.js

@@ -37,6 +37,7 @@ class Breadcrumb extends DelegatesAria(VividElement) {
    * @internal
    */
   slottedBreadcrumbItemsChanged(_, newItems) {
+    /* v8 ignore else -- @preserve */
     if (newItems) {
       newItems.forEach((item, index) => {
         const itemIsLastNode = index === newItems.length - 1;

package/breadcrumb/index.cjs

@@ -9,4 +9,4 @@
 			></slot>
 		</div>
 	</nav>
-`,f=".list{display:flex}";var m=Object.defineProperty,h=(i,e,r,s)=>{for(var t=void 0,a=i.length-1,o;a>=0;a--)(o=i[a])&&(t=o(e,r,t)||t);return t&&m(e,r,t),t};class c extends d.DelegatesAria(l.VividElement){slottedBreadcrumbItemsChanged(e,r){r&&r.forEach((s,t)=>{const a=t===r.length-1;this.setItemSeparator(s,a),this.setAriaCurrent(s,a)})}setItemSeparator(e,r){e instanceof u.BreadcrumbItem&&(e.separator=!r)}findChildWithHref(e){return e.childElementCount>0?e.querySelector("a[href]"):e.shadowRoot?e.shadowRoot.querySelector("a[href]"):null}setAriaCurrent(e,r){const s=this.findChildWithHref(e);s!==null&&(r?s.setAttribute("aria-current","page"):s.removeAttribute("aria-current"))}}h([l.observable],c.prototype,"slottedBreadcrumbItems");const v=l.defineVividComponent("breadcrumb",c,b,[],{styles:f}),p=l.createRegisterFunction(v);p();
+`,f=".list{display:flex}";var m=Object.defineProperty,h=(i,e,r,s)=>{for(var t=void 0,a=i.length-1,o;a>=0;a--)(o=i[a])&&(t=o(e,r,t)||t);return t&&m(e,r,t),t};class c extends d.DelegatesAria(l.VividElement){slottedBreadcrumbItemsChanged(e,r){/* v8 ignore else -- @preserve */r&&r.forEach((s,t)=>{const a=t===r.length-1;this.setItemSeparator(s,a),this.setAriaCurrent(s,a)})}setItemSeparator(e,r){e instanceof u.BreadcrumbItem&&(e.separator=!r)}findChildWithHref(e){return e.childElementCount>0?e.querySelector("a[href]"):e.shadowRoot?e.shadowRoot.querySelector("a[href]"):null}setAriaCurrent(e,r){const s=this.findChildWithHref(e);s!==null&&(r?s.setAttribute("aria-current","page"):s.removeAttribute("aria-current"))}}h([l.observable],c.prototype,"slottedBreadcrumbItems");const v=l.defineVividComponent("breadcrumb",c,b,[],{styles:f}),p=l.createRegisterFunction(v);p();

package/breadcrumb/index.js

@@ -29,6 +29,7 @@ class l extends b(n) {
    * @internal
    */
   slottedBreadcrumbItemsChanged(e, r) {
+    /* v8 ignore else -- @preserve */
     r && r.forEach((a, t) => {
       const s = t === r.length - 1;
       this.setItemSeparator(a, s), this.setAriaCurrent(a, s);

package/bundled/affix.js

@@ -1,5 +1,5 @@
 import { I as f } from "./definition2.js";
-import { a as p, h as s, o as d } from "./vivid-element.js";
+import { a as p, o as d, h as s } from "./vivid-element.js";
 import { s as u } from "./slotted.js";
 var $ = Object.defineProperty, l = (a, n, e, i) => {
   for (var o = void 0, r = a.length - 1, t; r >= 0; r--)

package/bundled/anchored.cjs

@@ -1,4 +1,4 @@
-"use strict";const l=require("./slotted.cjs"),n=require("./vivid-element.cjs");var a=Object.defineProperty,c=(s,o,r,t)=>{for(var e=void 0,h=s.length-1,i;h>=0;h--)(i=s[h])&&(e=i(o,r,e)||e);return e&&a(o,r,e),e};const d=s=>{class o extends s{anchorChanged(){this.#e()}_slottedAnchorChanged(){const t=!!(this._slottedAnchor&&this._slottedAnchor.length>0);n.DOM.setBooleanAttribute(this,"slotted-anchor",t),this.#e()}#e=()=>{if(!this.isConnected){this._anchorEl=void 0;return}this.#o();let t;this._slottedAnchor&&this._slottedAnchor.length>0?t=this._slottedAnchor[0]:this.anchor instanceof HTMLElement?t=this.anchor:typeof this.anchor=="string"&&(t=document.getElementById(this.anchor)??void 0,t||this.#n(this.anchor)),this._anchorEl=t};#t;#n=t=>{this.#t=new MutationObserver(()=>{const e=document.getElementById(t);e&&(this._anchorEl=e,this.#o())}),this.#t.observe(document.body,{childList:!0,subtree:!0})};#o=()=>{this.#t?.disconnect(),this.#t=void 0};connectedCallback(){super.connectedCallback(),this.#e()}disconnectedCallback(){super.disconnectedCallback(),this.#o(),this._anchorEl=void 0}}return c([n.attr],o.prototype,"anchor"),c([n.observable],o.prototype,"_slottedAnchor"),c([n.observable],o.prototype,"_anchorEl"),o},u=()=>n.html`<slot
+"use strict";const n=require("./vivid-element.cjs"),l=require("./slotted.cjs");var a=Object.defineProperty,c=(s,o,r,t)=>{for(var e=void 0,h=s.length-1,i;h>=0;h--)(i=s[h])&&(e=i(o,r,e)||e);return e&&a(o,r,e),e};const d=s=>{class o extends s{anchorChanged(){this.#e()}_slottedAnchorChanged(){const t=!!(this._slottedAnchor&&this._slottedAnchor.length>0);n.DOM.setBooleanAttribute(this,"slotted-anchor",t),this.#e()}#e=()=>{if(!this.isConnected){this._anchorEl=void 0;return}this.#o();let t;this._slottedAnchor&&this._slottedAnchor.length>0?t=this._slottedAnchor[0]:this.anchor instanceof HTMLElement?t=this.anchor:typeof this.anchor=="string"&&(t=document.getElementById(this.anchor)??void 0,t||this.#n(this.anchor)),this._anchorEl=t};#t;#n=t=>{this.#t=new MutationObserver(()=>{const e=document.getElementById(t);e&&(this._anchorEl=e,this.#o())}),this.#t.observe(document.body,{childList:!0,subtree:!0})};#o=()=>{this.#t?.disconnect(),this.#t=void 0};connectedCallback(){super.connectedCallback(),this.#e()}disconnectedCallback(){super.disconnectedCallback(),this.#o(),this._anchorEl=void 0}}return c([n.attr],o.prototype,"anchor"),c([n.observable],o.prototype,"_slottedAnchor"),c([n.observable],o.prototype,"_anchorEl"),o},u=()=>n.html`<slot
 		name="anchor"
 		${l.slotted("_slottedAnchor")}
 	></slot>`;exports.Anchored=d;exports.anchorSlotTemplateFactory=u;

package/bundled/anchored.js

@@ -1,5 +1,5 @@
-import { s as a } from "./slotted.js";
-import { h as l, D as d, a as p, o as i } from "./vivid-element.js";
+import { D as a, a as l, o as i, h as d } from "./vivid-element.js";
+import { s as p } from "./slotted.js";
 var u = Object.defineProperty, h = (s, o, n, t) => {
   for (var e = void 0, r = s.length - 1, c; r >= 0; r--)
     (c = s[r]) && (e = c(o, n, e) || e);
@@ -18,7 +18,7 @@ const v = (s) => {
      */
     _slottedAnchorChanged() {
       const t = !!(this._slottedAnchor && this._slottedAnchor.length > 0);
-      d.setBooleanAttribute(
+      a.setBooleanAttribute(
         this,
         "slotted-anchor",
         t
@@ -51,15 +51,15 @@ const v = (s) => {
     }
   }
   return h([
-    p
+    l
   ], o.prototype, "anchor"), h([
     i
   ], o.prototype, "_slottedAnchor"), h([
     i
   ], o.prototype, "_anchorEl"), o;
-}, b = () => l`<slot
+}, b = () => d`<slot
 		name="anchor"
-		${a("_slottedAnchor")}
+		${p("_slottedAnchor")}
 	></slot>`;
 export {
   v as A,

package/bundled/attribute-binding-behaviour.cjs

@@ -1 +1 @@
-"use strict";const i=require("./vivid-element.cjs");class r{constructor(t,e,s,n){this.target=t,this.binding=e,this.isBindingVolatile=s,this.attributeName=n,this.source=null,this.context=null}bind(t){this.source=t.source,this.context=t.context,this.bindingObserver||(this.bindingObserver=i.Observable.binding(this.binding.evaluate,this,this.isBindingVolatile)),this.bindingObserver.observe(this.source,this.context),this.updateTarget(this.bindingObserver.observe(this.source,this.context))}handleChange(){this.updateTarget(this.bindingObserver.observe(this.source,this.context))}updateTarget(t){i.DOM.setAttribute(this.target,this.attributeName,t)}}exports.AttributeBindingBehavior=r;
+"use strict";const i=require("./vivid-element.cjs");class r{constructor(t,e,s,n){this.target=t,this.binding=e,this.isBindingVolatile=s,this.attributeName=n,this.source=null,this.context=null}bind(t){this.source=t.source,this.context=t.context;/* v8 ignore else -- @preserve */this.bindingObserver||(this.bindingObserver=i.Observable.binding(this.binding.evaluate,this,this.isBindingVolatile)),this.bindingObserver.observe(this.source,this.context),this.updateTarget(this.bindingObserver.observe(this.source,this.context))}handleChange(){this.updateTarget(this.bindingObserver.observe(this.source,this.context))}updateTarget(t){i.DOM.setAttribute(this.target,this.attributeName,t)}}exports.AttributeBindingBehavior=r;

package/bundled/attribute-binding-behaviour.js

@@ -4,7 +4,9 @@ class b {
     this.target = t, this.binding = i, this.isBindingVolatile = e, this.attributeName = s, this.source = null, this.context = null;
   }
   bind(t) {
-    this.source = t.source, this.context = t.context, this.bindingObserver || (this.bindingObserver = n.binding(
+    this.source = t.source, this.context = t.context;
+    /* v8 ignore else -- @preserve */
+    this.bindingObserver || (this.bindingObserver = n.binding(
       this.binding.evaluate,
       this,
       this.isBindingVolatile

package/bundled/base-color-picker.cjs

@@ -1,13 +1,18 @@
-"use strict";const m=require("./form-associated.cjs"),u=require("./vivid-element.cjs"),v=require("./when.cjs"),g=require("./localized.cjs"),y=require("./form-element.cjs"),S=require("./class-names.cjs");function C(o){if(!o)return null;const s=o.trim().replace(/^#/,"");return/^[0-9a-fA-F]{3}$/.test(s)?s.split("").map(a=>a+a).join("").toLowerCase():/^[0-9a-fA-F]{6}$/.test(s)?s.toLowerCase():null}function b(o){return C(o)!==null}function p(o){const s=C(o);if(!s)return 0;const a=parseInt(s.slice(0,2),16)/255,r=parseInt(s.slice(2,4),16)/255,e=parseInt(s.slice(4,6),16)/255,t=a<=.03928?a/12.92:Math.pow((a+.055)/1.055,2.4),l=r<=.03928?r/12.92:Math.pow((r+.055)/1.055,2.4),n=e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4);return .2126*t+.7152*l+.0722*n}function I(o,s){const a=p(o),r=p(s),e=Math.max(a,r),t=Math.min(a,r);return(e+.05)/(t+.05)}function B(o,s){return s||(s=document.querySelector(".vvd-root")||document.documentElement),getComputedStyle(s).getPropertyValue(o).trim()}var A=Object.defineProperty,_=(o,s,a,r)=>{for(var e=void 0,t=o.length-1,l;t>=0;t--)(l=o[t])&&(e=l(s,a,e)||e);return e&&A(s,a,e),e};const E=o=>{class s extends g.Localized(y.FormElement(m.FormAssociated(o))){constructor(){super(...arguments),this.proxy=document.createElement("input"),this.open=!1,this.swatches=[],this._canvasColor=""}connectedCallback(){super.connectedCallback(),this._refreshCanvasColor()}_refreshCanvasColor(){this._canvasColor=B("--vvd-color-canvas",this)}_applyContrastClass(r,e=3){return!r||!this._canvasColor?!1:I(r,this._canvasColor)<e}_getRowLength(){return 7}_handleSwatchSelection(r){this.value===r?this.value="":this.value=r,this.$emit("change"),this.open=!1}_handleColorSaving(){}_getFocusReturnEl(){return null}_returnFocusToAnchor(){const r=this._getFocusReturnEl();r&&u.Updates.enqueue(()=>r.focus())}_getGridCells(){const r=this.shadowRoot?.querySelector('[role="grid"]');return r?Array.from(r.querySelectorAll('[role="gridcell"], [data-vvd-role="gridcell"]')):[]}_handleCellKeydown(r,e,t,l){const n=this._getRowLength(),c=this._getGridCells().length,h=Math.floor(t/n),f=t%n,d=Math.ceil(c/n);switch(r.key){case"ArrowRight":return f<n-1&&t+1<c&&this._focusSwatchByIndex(t+1),!1;case"ArrowLeft":return f>0&&this._focusSwatchByIndex(t-1),!1;case"ArrowDown":return h<d-1&&t+n<c&&this._focusSwatchByIndex(t+n),!1;case"ArrowUp":return h>0&&this._focusSwatchByIndex(t-n),!1;case"PageDown":{const i=(d-1)*n,w=Math.min(i+f,c-1);return t!==w&&this._focusSwatchByIndex(w),!1}case"PageUp":{const i=Math.min(f,c-1);return t!==i&&this._focusSwatchByIndex(i),!1}case"Home":return r.ctrlKey?this._focusSwatchByIndex(0):this._focusSwatchByIndex(h*n),!1;case"End":if(r.ctrlKey)this._focusSwatchByIndex(c-1);else{const i=Math.min((h+1)*n-1,c-1);this._focusSwatchByIndex(i)}return!1;case"Enter":case" ":return l&&this._handleColorSaving(),e&&!l&&(this._handleSwatchSelection(e),this._returnFocusToAnchor()),!1;case"Escape":return this.open=!1,this._returnFocusToAnchor(),!1;case"Tab":return this.open=!1,!0;default:return!0}}_focusSwatchByIndex(r){const e=this._getGridCells();r<0||r>=e.length||e[r]?.focus()}_renderColorSwatch(r){return u.html`
-				<button
-					class="swatch ${(e,t)=>S.classNames(t.parent.value===e.value?"selected":"",t.parent._applyContrastClass(e.value)?"contrast":"")}"
-					role="gridcell"
-					style="--swatch-color: ${e=>e.value};"
-					tabindex="${(e,t)=>t.index===0?"0":"-1"}"
-					aria-label="${(e,t)=>t.parent.locale.baseColorPicker.colorSwatchLabel(e.value,e.label,t.parent.value===e.value)}"
-					@click="${(e,t)=>t.parent._handleSwatchSelection(e.value)}"
-					@keydown="${(e,t)=>t.parent._handleCellKeydown(t.event,e.value,t.index)}"
-				>
-					${v.when((e,t)=>t.parent.value===e.value,u.html`<${r} size="-6" name="check-solid" aria-hidden="true"></${r}>`)}
-				</button>
-			`}}return _([u.attr({mode:"boolean"})],s.prototype,"open"),_([u.observable],s.prototype,"swatches"),s};exports.BaseColorPicker=E;exports.isValidHexColor=b;
+"use strict";const m=require("./form-associated.cjs"),u=require("./vivid-element.cjs"),g=require("./when.cjs"),y=require("./localized.cjs"),S=require("./form-element.cjs"),b=require("./class-names.cjs");function C(a){if(!a)return null;const s=a.trim().replace(/^#/,"");return/^[0-9a-fA-F]{3}$/.test(s)?s.split("").map(n=>n+n).join("").toLowerCase():/^[0-9a-fA-F]{6}$/.test(s)?s.toLowerCase():null}function I(a){return C(a)!==null}function w(a){const s=C(a);if(!s)return 0;const n=parseInt(s.slice(0,2),16)/255,t=parseInt(s.slice(2,4),16)/255,o=parseInt(s.slice(4,6),16)/255,e=n<=.03928?n/12.92:Math.pow((n+.055)/1.055,2.4),r=t<=.03928?t/12.92:Math.pow((t+.055)/1.055,2.4),l=o<=.03928?o/12.92:Math.pow((o+.055)/1.055,2.4);return .2126*e+.7152*r+.0722*l}function B(a,s){const n=w(a),t=w(s),o=Math.max(n,t),e=Math.min(n,t);return(o+.05)/(e+.05)}function _(a,s){return s||(s=document.querySelector(".vvd-root")||document.documentElement),getComputedStyle(s).getPropertyValue(a).trim()}var $=Object.defineProperty,d=(a,s,n,t)=>{for(var o=void 0,e=a.length-1,r;e>=0;e--)(r=a[e])&&(o=r(s,n,o)||o);return o&&$(s,n,o),o};const A=a=>{class s extends y.Localized(S.FormElement(m.FormAssociated(a))){constructor(){super(...arguments),this.proxy=document.createElement("input"),this.open=!1,this.swatches=[],this._canvasColor=""}connectedCallback(){super.connectedCallback(),requestAnimationFrame(()=>{this._refreshCanvasColor()})}get _computedCanvasColor(){return this._canvasColor||(this._canvasColor=_("--vvd-color-canvas",this)),this._canvasColor}_refreshCanvasColor(){this._canvasColor=_("--vvd-color-canvas",this)}_applyContrastClass(t,o=3){if(!t)return!1;const e=this._computedCanvasColor;return e?B(t,e)<o:!1}_getRowLength(){return 7}_handleSwatchSelection(t){this.value===t?this.value="":this.value=t,this.$emit("change"),this.open=!1}_handleColorSaving(){}_getFocusReturnEl(){return null}_returnFocusToAnchor(){const t=this._getFocusReturnEl();t&&u.Updates.enqueue(()=>t.focus())}_getGridCells(){const t=this.shadowRoot?.querySelector('[role="grid"]');return t?Array.from(t.querySelectorAll('[role="gridcell"], [data-vvd-role="gridcell"]')):[]}_handleCellKeydown(t,o,e,r){const l=this._getRowLength(),c=this._getGridCells().length,h=Math.floor(e/l),f=e%l,p=Math.ceil(c/l);switch(t.key){case"ArrowRight":{/* v8 ignore else -- @preserve */return f<l-1&&e+1<c&&this._focusSwatchByIndex(e+1),!1}case"ArrowLeft":return f>0&&this._focusSwatchByIndex(e-1),!1;case"ArrowDown":{/* v8 ignore else -- @preserve */return h<p-1&&e+l<c&&this._focusSwatchByIndex(e+l),!1}case"ArrowUp":return h>0&&this._focusSwatchByIndex(e-l),!1;case"PageDown":{const i=(p-1)*l,v=Math.min(i+f,c-1);/* v8 ignore else -- @preserve */return e!==v&&this._focusSwatchByIndex(v),!1}case"PageUp":{const i=Math.min(f,c-1);return e!==i&&this._focusSwatchByIndex(i),!1}case"Home":return t.ctrlKey?this._focusSwatchByIndex(0):this._focusSwatchByIndex(h*l),!1;case"End":if(t.ctrlKey)this._focusSwatchByIndex(c-1);else{const i=Math.min((h+1)*l-1,c-1);this._focusSwatchByIndex(i)}return!1;case"Enter":case" ":return r&&this._handleColorSaving(),o&&!r&&(this._handleSwatchSelection(o),this._returnFocusToAnchor()),!1;case"Escape":return this.open=!1,this._returnFocusToAnchor(),!1;case"Tab":return this.open=!1,!0;default:return!0}}_focusSwatchByIndex(t){const o=this._getGridCells();t<0||t>=o.length||o[t]?.focus()}_renderColorSwatch(t,o){return u.html`
+				<${o} placement="top" 
+					text="${e=>e.label??e.value}" 
+					exportparts="vvd-theme-alternate">
+					<button
+						slot="anchor"
+						class="swatch ${(e,r)=>b.classNames(r.parent.value===e.value?"selected":"",r.parent._applyContrastClass(e.value)?"contrast":"")}"
+						role="gridcell"
+						style="--swatch-color: ${e=>e.value};"
+						tabindex="${(e,r)=>r.index===0?"0":"-1"}"
+						aria-label="${(e,r)=>r.parent.locale.baseColorPicker.colorSwatchLabel(e.value,e.label,r.parent.value===e.value)}"
+						@click="${(e,r)=>r.parent._handleSwatchSelection(e.value)}"
+						@keydown="${(e,r)=>r.parent._handleCellKeydown(r.event,e.value,r.index)}"
+					>
+						${g.when((e,r)=>r.parent.value===e.value,u.html`<${t} size="-6" name="check-solid" aria-hidden="true"></${t}>`)}
+					</button>
+				</${o}>
+			`}}return d([u.attr({mode:"boolean"})],s.prototype,"open"),d([u.observable],s.prototype,"swatches"),d([u.observable],s.prototype,"_canvasColor"),s};exports.BaseColorPicker=A;exports.isValidHexColor=I;