@vonage/vivid 5.16.0 → 5.17.0

package/accordion/index.cjs

@@ -1,4 +1,4 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/slotted.cjs`);require(`../bundled/definition2.cjs`);const n=require(`../bundled/decorate.cjs`),r=require(`../bundled/class-names.cjs`),i=require(`../bundled/key-codes.cjs`),a=require(`../bundled/numbers.cjs`),o=require(`../bundled/definition4.cjs`);var s=`.base{box-sizing:border-box;flex-direction:column;display:flex}::slotted(:not(:only-of-type)){border-bottom:1px solid var(--vvd-color-neutral-200)}`,c={single:`single`,multi:`multi`},l=class extends e.t{constructor(...e){super(...e),this.expandmode=c.single,this.activeItemIndex=0,this.change=()=>{this.$emit(`change`,this.activeid)},this.setItems=()=>{this.accordionItems.length!==0&&(this.accordionIds=this.getItemIds(),this.activeid=this.accordionIds[this.activeItemIndex],this.accordionItems.forEach((e,t)=>{e instanceof o.r&&(e.addEventListener(`change`,this.activeItemChange),this.isSingleExpandMode()&&(this.findExpandedItem()===null&&t===0||e===this.findExpandedItem()?e.expanded=!0:e.expanded=!1));let n=this.accordionIds[t];e.setAttribute(`id`,typeof n==`string`?n:`accordion-${t+1}`),e.addEventListener(`keydown`,this.handleItemKeyDown)}),this.isSingleExpandMode()&&(this.findExpandedItem()??this.accordionItems[0]).setAttribute(`aria-disabled`,`true`))},this.removeItemListeners=e=>{e.forEach(e=>{e.removeEventListener(`change`,this.activeItemChange),e.removeEventListener(`keydown`,this.handleItemKeyDown)})},this.activeItemChange=e=>{if(e.defaultPrevented||e.target!==e.currentTarget)return;e.preventDefault();let t=e.target;this.activeid=t.getAttribute(`id`),this.isSingleExpandMode()&&(this.resetItems(),t.expanded=!0,t.setAttribute(`aria-disabled`,`true`),this.accordionItems.forEach(e=>{!e.hasAttribute(`disabled`)&&e.id!==this.activeid&&e.removeAttribute(`aria-disabled`)})),this.activeItemIndex=Array.from(this.accordionItems).indexOf(t),this.change()},this.handleItemKeyDown=e=>{if(e.target===e.currentTarget)switch(this.accordionIds=this.getItemIds(),e.key){case i.i:e.preventDefault(),this.adjust(e.target,-1);break;case i.t:e.preventDefault(),this.adjust(e.target,1);break;case i.s:this.focusItem(0);break;case`End`:this.focusItem(this.accordionItems.length-1);break}}}accordionItemsChanged(e){this.$fastController.isConnected&&(this.removeItemListeners(e),this.setItems())}findExpandedItem(){for(let e=0;e<this.accordionItems.length;e++)if(this.accordionItems[e].hasAttribute(`expanded`)===!0)return this.accordionItems[e];return null}resetItems(){this.accordionItems.forEach(e=>{e.expanded=!1})}getItemIds(){return this.accordionItems.map(e=>e.getAttribute(`id`))}isSingleExpandMode(){return this.expandmode!==c.multi}adjust(e,t){this.focusItem(a.r(0,this.accordionItems.length-1,this.accordionItems.indexOf(e)+t))}focusItem(e){let t=this.accordionItems[e];t instanceof o.r&&t.expandbutton.focus()}closeAll(){this.expandmode===c.multi&&this.accordionItems.forEach(e=>{e.expanded=!1})}};n.t([e.l({attribute:`expand-mode`})],l.prototype,`expandmode`,void 0),n.t([e.T],l.prototype,`accordionItems`,void 0);var u=e.d`
+const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/slotted.cjs`);require(`../bundled/definition2.cjs`);const n=require(`../bundled/decorate.cjs`),r=require(`../bundled/class-names.cjs`),i=require(`../bundled/key-codes.cjs`),a=require(`../bundled/numbers.cjs`),o=require(`../bundled/definition22.cjs`);var s=`.base{box-sizing:border-box;flex-direction:column;display:flex}::slotted(:not(:only-of-type)){border-bottom:1px solid var(--vvd-color-neutral-200)}`,c={single:`single`,multi:`multi`},l=class extends e.t{constructor(...e){super(...e),this.expandmode=c.single,this.activeItemIndex=0,this.change=()=>{this.$emit(`change`,this.activeid)},this.setItems=()=>{this.accordionItems.length!==0&&(this.accordionIds=this.getItemIds(),this.activeid=this.accordionIds[this.activeItemIndex],this.accordionItems.forEach((e,t)=>{e instanceof o.r&&(e.addEventListener(`change`,this.activeItemChange),this.isSingleExpandMode()&&(this.findExpandedItem()===null&&t===0||e===this.findExpandedItem()?e.expanded=!0:e.expanded=!1));let n=this.accordionIds[t];e.setAttribute(`id`,typeof n==`string`?n:`accordion-${t+1}`),e.addEventListener(`keydown`,this.handleItemKeyDown)}),this.isSingleExpandMode()&&(this.findExpandedItem()??this.accordionItems[0]).setAttribute(`aria-disabled`,`true`))},this.removeItemListeners=e=>{e.forEach(e=>{e.removeEventListener(`change`,this.activeItemChange),e.removeEventListener(`keydown`,this.handleItemKeyDown)})},this.activeItemChange=e=>{if(e.defaultPrevented||e.target!==e.currentTarget)return;e.preventDefault();let t=e.target;this.activeid=t.getAttribute(`id`),this.isSingleExpandMode()&&(this.resetItems(),t.expanded=!0,t.setAttribute(`aria-disabled`,`true`),this.accordionItems.forEach(e=>{!e.hasAttribute(`disabled`)&&e.id!==this.activeid&&e.removeAttribute(`aria-disabled`)})),this.activeItemIndex=Array.from(this.accordionItems).indexOf(t),this.change()},this.handleItemKeyDown=e=>{if(e.target===e.currentTarget)switch(this.accordionIds=this.getItemIds(),e.key){case i.i:e.preventDefault(),this.adjust(e.target,-1);break;case i.t:e.preventDefault(),this.adjust(e.target,1);break;case i.s:this.focusItem(0);break;case`End`:this.focusItem(this.accordionItems.length-1);break}}}accordionItemsChanged(e){this.$fastController.isConnected&&(this.removeItemListeners(e),this.setItems())}findExpandedItem(){for(let e=0;e<this.accordionItems.length;e++)if(this.accordionItems[e].hasAttribute(`expanded`)===!0)return this.accordionItems[e];return null}resetItems(){this.accordionItems.forEach(e=>{e.expanded=!1})}getItemIds(){return this.accordionItems.map(e=>e.getAttribute(`id`))}isSingleExpandMode(){return this.expandmode!==c.multi}adjust(e,t){this.focusItem(a.r(0,this.accordionItems.length-1,this.accordionItems.indexOf(e)+t))}focusItem(e){let t=this.accordionItems[e];t instanceof o.r&&t.expandbutton.focus()}closeAll(){this.expandmode===c.multi&&this.accordionItems.forEach(e=>{e.expanded=!1})}};n.t([e.l({attribute:`expand-mode`})],l.prototype,`expandmode`,void 0),n.t([e.T],l.prototype,`accordionItems`,void 0);var u=e.d`
 	<div class="${e=>r.t(`base`)}">
 		<slot ${t.t({property:`accordionItems`,filter:t.r()})}></slot>
 	</div>

package/accordion/index.js

@@ -5,7 +5,7 @@ import { t as c } from "../bundled/decorate.js";
 import { t as l } from "../bundled/class-names.js";
 import { i as u, s as d, t as f } from "../bundled/key-codes.js";
 import { r as p } from "../bundled/numbers.js";
-import { r as m, t as h } from "../bundled/definition4.js";
+import { r as m, t as h } from "../bundled/definition22.js";
 //#region src/lib/accordion/accordion.scss?inline
 var g = ".base{box-sizing:border-box;flex-direction:column;display:flex}::slotted(:not(:only-of-type)){border-bottom:1px solid var(--vvd-color-neutral-200)}", _ = {
 	single: "single",

package/accordion-item/index.cjs

@@ -1 +1 @@
-require(`../bundled/vivid-element.cjs`),require(`../bundled/definition2.cjs`),require(`../bundled/definition4.cjs`).n();
+require(`../bundled/vivid-element.cjs`),require(`../bundled/definition2.cjs`),require(`../bundled/definition22.cjs`).n();

package/accordion-item/index.js

@@ -1,6 +1,6 @@
 import "../bundled/vivid-element.js";
 import "../bundled/definition2.js";
-import { n as e } from "../bundled/definition4.js";
+import { n as e } from "../bundled/definition22.js";
 //#region src/lib/accordion-item/index.ts
 e();
 //#endregion

package/action-group/index.cjs

@@ -1,6 +1,6 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/decorate.cjs`),n=require(`../bundled/class-names.cjs`),r=require(`../bundled/delegates-aria.cjs`);var i=`:host{display:inline-block}.base{--_connotation-color-primary:var(--vvd-action-group-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-intermediate:var(--vvd-action-group-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-faint:var(--vvd-action-group-accent-faint,var(--vvd-color-neutral-50));--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base{box-sizing:border-box;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle;align-items:center;display:flex;position:relative}.base:before{z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:"";pointer-events:none;position:absolute;inset:0}.base:not(.tight){column-gap:4px;padding:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([data-vvd-component=divider]){align-self:stretch;margin-block:4px}`,a=class extends r.t(e.t){constructor(...e){super(...e),this.tight=!1}};t.t([e.l],a.prototype,`shape`,void 0),t.t([e.l],a.prototype,`appearance`,void 0),t.t([e.l({mode:`boolean`})],a.prototype,`tight`,void 0);var o=e.d`<div
-	class="${({appearance:e,shape:t,tight:r})=>n.t(`base`,[`appearance-${e}`,!!e],[`shape-${t}`,!!t],[`tight`,r])}"
-	${r.n({role:e=>e.role?e.role:`group`})}
+const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/decorate.cjs`),n=require(`../bundled/delegates-aria.cjs`),r=require(`../bundled/class-names.cjs`);var i=`:host{display:inline-block}.base{--_connotation-color-primary:var(--vvd-action-group-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-intermediate:var(--vvd-action-group-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-faint:var(--vvd-action-group-accent-faint,var(--vvd-color-neutral-50));--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base{box-sizing:border-box;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle;align-items:center;display:flex;position:relative}.base:before{z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:"";pointer-events:none;position:absolute;inset:0}.base:not(.tight){column-gap:4px;padding:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([data-vvd-component=divider]){align-self:stretch;margin-block:4px}`,a=class extends n.t(e.t){constructor(...e){super(...e),this.tight=!1}};t.t([e.l],a.prototype,`shape`,void 0),t.t([e.l],a.prototype,`appearance`,void 0),t.t([e.l({mode:`boolean`})],a.prototype,`tight`,void 0);var o=e.d`<div
+	class="${({appearance:e,shape:t,tight:n})=>r.t(`base`,[`appearance-${e}`,!!e],[`shape-${t}`,!!t],[`tight`,n])}"
+	${n.n({role:e=>e.role?e.role:`group`})}
 >
 	<slot></slot>
 </div>`,s=e.o(`action-group`,a,o,[],{styles:i});e.s(s)();

package/action-group/index.js

@@ -1,9 +1,9 @@
 import { d as e, l as t, o as n, s as r, t as i } from "../bundled/vivid-element.js";
 import { t as a } from "../bundled/decorate.js";
-import { t as o } from "../bundled/class-names.js";
-import { n as s, t as c } from "../bundled/delegates-aria.js";
+import { n as o, t as s } from "../bundled/delegates-aria.js";
+import { t as c } from "../bundled/class-names.js";
 //#region src/lib/action-group/action-group.scss?inline
-var l = ":host{display:inline-block}.base{--_connotation-color-primary:var(--vvd-action-group-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-intermediate:var(--vvd-action-group-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-faint:var(--vvd-action-group-accent-faint,var(--vvd-color-neutral-50));--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base{box-sizing:border-box;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle;align-items:center;display:flex;position:relative}.base:before{z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";pointer-events:none;position:absolute;inset:0}.base:not(.tight){column-gap:4px;padding:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([data-vvd-component=divider]){align-self:stretch;margin-block:4px}", u = class extends c(i) {
+var l = ":host{display:inline-block}.base{--_connotation-color-primary:var(--vvd-action-group-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-intermediate:var(--vvd-action-group-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-faint:var(--vvd-action-group-accent-faint,var(--vvd-color-neutral-50));--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base{box-sizing:border-box;background-color:var(--_appearance-color-fill);inline-size:inherit;vertical-align:middle;align-items:center;display:flex;position:relative}.base:before{z-index:1;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";pointer-events:none;position:absolute;inset:0}.base:not(.tight){column-gap:4px;padding:4px}.base:not(.shape-pill){border-radius:8px}.base.shape-pill{border-radius:24px}::slotted([data-vvd-component=divider]){align-self:stretch;margin-block:4px}", u = class extends s(i) {
 	constructor(...e) {
 		super(...e), this.tight = !1;
 	}
@@ -11,8 +11,8 @@ var l = ":host{display:inline-block}.base{--_connotation-color-primary:var(--vvd
 //#endregion
 //#region src/lib/action-group/index.ts
 a([t], u.prototype, "shape", void 0), a([t], u.prototype, "appearance", void 0), a([t({ mode: "boolean" })], u.prototype, "tight", void 0), r(n("action-group", u, e`<div
-	class="${({ appearance: e, shape: t, tight: n }) => o("base", [`appearance-${e}`, !!e], [`shape-${t}`, !!t], ["tight", n])}"
-	${s({ role: (e) => e.role ? e.role : "group" })}
+	class="${({ appearance: e, shape: t, tight: n }) => c("base", [`appearance-${e}`, !!e], [`shape-${t}`, !!t], ["tight", n])}"
+	${o({ role: (e) => e.role ? e.role : "group" })}
 >
 	<slot></slot>
 </div>`, [], { styles: l }))();

package/alert/index.cjs

@@ -1,4 +1,4 @@
-const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/ref.cjs`),r=require(`../bundled/when.cjs`),i=require(`../bundled/definition2.cjs`),a=require(`../bundled/decorate.cjs`),o=require(`../bundled/class-names.cjs`),s=require(`../bundled/affix.cjs`),c=require(`../bundled/definition6.cjs`),l=require(`../bundled/enums.cjs`),u=require(`../bundled/definition7.cjs`),d=require(`../bundled/dialog.cjs`);var f=`.control{z-index:10;inline-size:max-content;max-inline-size:var(--alert-max-inline-size,fit-content);min-inline-size:var(--alert-min-inline-size,420px);border-radius:8px;margin-block:16px;margin-inline:auto;transition:opacity .15s cubic-bezier(0,0,.2,1),transform .15s cubic-bezier(0,0,.2,1);position:fixed;inset-block-end:0;inset-inline:0}.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;margin-inline:16px;inset-inline-end:auto}.control.placement-top-end,.control.placement-bottom-end{margin-inline:16px;inset-inline-start:auto}.control:where(.strategy-static){inline-size:auto;margin:0;position:static}.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;background-color:var(--vvd-color-neutral-50);color:var(--vvd-color-canvas-text);border-radius:8px;align-items:center;column-gap:16px;padding:16px;display:flex}.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{content:"";margin-top:8px;display:block}.base slot[name=icon]{color:var(--_appearance-color-fill);flex-shrink:0;font-size:24px;line-height:1}.base .dismiss-button{border-left:1px solid var(--vvd-color-neutral-200);padding-inline-start:16px}`,p={[l.n.Accent]:`megaphone-line`,[l.n.Information]:`info-line`,[l.n.Success]:`check-circle-line`,[l.n.Warning]:`warning-line`,[l.n.Announcement]:`sparkles-line`,[l.n.Alert]:`error-line`},m=class extends s.t(e.t(t.t)){constructor(...e){super(...e),this.dismissButtonAriaLabel=null,this.removable=!1,this.placement=`bottom`,this.timeoutms=0,this.open=!1}#e;openChanged(e,t){if(e!==void 0)if(this.$emit(t?`open`:`close`),this.#t(),t){this.style.display=`contents`;let e=this.shadowRoot.querySelector(`.dismiss-button`);this.removable&&e&&e.focus()}else this.style.display=`none`}connectedCallback(){super.connectedCallback(),this.addEventListener(`keydown`,this.#n),this._controlEl.addEventListener(`transitionend`,this.#r),this.#t()}disconnectedCallback(){super.disconnectedCallback(),this.#e&&clearTimeout(this.#e),this.removeEventListener(`keydown`,this.#n),this._controlEl.removeEventListener(`transitionend`,this.#r)}get conditionedIcon(){return this.icon||this.connotation&&p[this.connotation]}#t(){this.#e&&clearTimeout(this.#e),this.open&&this.timeoutms>0&&(this.#e=setTimeout(()=>this.open=!1,this.timeoutms))}#n=e=>{this.open&&this.removable&&d.t(e)&&(this.open=!1)};#r=()=>{this.open?this.style.display=`contents`:this.style.display=`none`}};a.t([t.l({attribute:`dismiss-button-aria-label`})],m.prototype,`dismissButtonAriaLabel`,void 0),a.t([t.l({mode:`boolean`})],m.prototype,`removable`,void 0),a.t([t.l({mode:`fromView`})],m.prototype,`placement`,void 0),a.t([t.l],m.prototype,`headline`,void 0),a.t([t.l],m.prototype,`text`,void 0),a.t([t.l({mode:`fromView`,converter:t.u})],m.prototype,`timeoutms`,void 0),a.t([t.l],m.prototype,`connotation`,void 0),a.t([t.l],m.prototype,`strategy`,void 0),a.t([t.l({mode:`boolean`})],m.prototype,`open`,void 0);var h=({connotation:e})=>o.t(`base`,[`connotation-${e}`,!!e]),g=({open:e,placement:t,strategy:n})=>o.t(`control`,[`open`,e],[`placement-${t}`,!!t],[`strategy-${n}`,!!n]);function _(e,t){let n=s.a(e),r=t.conditionedIcon,i=!t.icon&&t.connotation?{label:t.locale.connotationAnnoncement[`${t.connotation}Icon`],announceOnUpdate:!0}:void 0;return n(r,s.i.Slot,s.r.Hidden,i)}function v(e){return t.d`
+const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/ref.cjs`),r=require(`../bundled/when.cjs`),i=require(`../bundled/enums.cjs`),a=require(`../bundled/definition2.cjs`),o=require(`../bundled/decorate.cjs`),s=require(`../bundled/affix.cjs`),c=require(`../bundled/class-names.cjs`),l=require(`../bundled/definition6.cjs`),u=require(`../bundled/definition7.cjs`),d=require(`../bundled/dialog.cjs`);var f=`.control{z-index:10;inline-size:max-content;max-inline-size:var(--alert-max-inline-size,fit-content);min-inline-size:var(--alert-min-inline-size,420px);border-radius:8px;margin-block:16px;margin-inline:auto;transition:opacity .15s cubic-bezier(0,0,.2,1),transform .15s cubic-bezier(0,0,.2,1);position:fixed;inset-block-end:0;inset-inline:0}.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;margin-inline:16px;inset-inline-end:auto}.control.placement-top-end,.control.placement-bottom-end{margin-inline:16px;inset-inline-start:auto}.control:where(.strategy-static){inline-size:auto;margin:0;position:static}.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;background-color:var(--vvd-color-neutral-50);color:var(--vvd-color-canvas-text);border-radius:8px;align-items:center;column-gap:16px;padding:16px;display:flex}.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{content:"";margin-top:8px;display:block}.base slot[name=icon]{color:var(--_appearance-color-fill);flex-shrink:0;font-size:24px;line-height:1}.base .dismiss-button{border-left:1px solid var(--vvd-color-neutral-200);padding-inline-start:16px}`,p={[i.n.Accent]:`megaphone-line`,[i.n.Information]:`info-line`,[i.n.Success]:`check-circle-line`,[i.n.Warning]:`warning-line`,[i.n.Announcement]:`sparkles-line`,[i.n.Alert]:`error-line`},m=class extends s.t(e.t(t.t)){constructor(...e){super(...e),this.dismissButtonAriaLabel=null,this.removable=!1,this.placement=`bottom`,this.timeoutms=0,this.open=!1}#e;openChanged(e,t){if(e!==void 0)if(this.$emit(t?`open`:`close`),this.#t(),t){this.style.display=`contents`;let e=this.shadowRoot.querySelector(`.dismiss-button`);this.removable&&e&&e.focus()}else this.style.display=`none`}connectedCallback(){super.connectedCallback(),this.addEventListener(`keydown`,this.#n),this._controlEl.addEventListener(`transitionend`,this.#r),this.#t()}disconnectedCallback(){super.disconnectedCallback(),this.#e&&clearTimeout(this.#e),this.removeEventListener(`keydown`,this.#n),this._controlEl.removeEventListener(`transitionend`,this.#r)}get conditionedIcon(){return this.icon||this.connotation&&p[this.connotation]}#t(){this.#e&&clearTimeout(this.#e),this.open&&this.timeoutms>0&&(this.#e=setTimeout(()=>this.open=!1,this.timeoutms))}#n=e=>{this.open&&this.removable&&d.t(e)&&(this.open=!1)};#r=()=>{this.open?this.style.display=`contents`:this.style.display=`none`}};o.t([t.l({attribute:`dismiss-button-aria-label`})],m.prototype,`dismissButtonAriaLabel`,void 0),o.t([t.l({mode:`boolean`})],m.prototype,`removable`,void 0),o.t([t.l({mode:`fromView`})],m.prototype,`placement`,void 0),o.t([t.l],m.prototype,`headline`,void 0),o.t([t.l],m.prototype,`text`,void 0),o.t([t.l({mode:`fromView`,converter:t.u})],m.prototype,`timeoutms`,void 0),o.t([t.l],m.prototype,`connotation`,void 0),o.t([t.l],m.prototype,`strategy`,void 0),o.t([t.l({mode:`boolean`})],m.prototype,`open`,void 0);var h=({connotation:e})=>c.t(`base`,[`connotation-${e}`,!!e]),g=({open:e,placement:t,strategy:n})=>c.t(`control`,[`open`,e],[`placement-${t}`,!!t],[`strategy-${n}`,!!n]);function _(e,t){let n=s.a(e),r=t.conditionedIcon,i=!t.icon&&t.connotation?{label:t.locale.connotationAnnoncement[`${t.connotation}Icon`],announceOnUpdate:!0}:void 0;return n(r,s.i.Slot,s.r.Hidden,i)}function v(e){return t.d`
 		<${e}
 			aria-label="${e=>e.dismissButtonAriaLabel||e.locale.alert.dismissButtonLabel}"
 			size="condensed"
@@ -6,7 +6,7 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 			class="dismiss-button"
 			icon="close-line"
 			@click="${e=>e.open=!1}">
-		</${e}>`}var y=t.o(`alert`,m,e=>{let i=e.tagFor(u.r),a=e.tagFor(c.i);return t.d`
+		</${e}>`}var y=t.o(`alert`,m,e=>{let i=e.tagFor(u.r),a=e.tagFor(l.i);return t.d`
 	<${i} class="elevation" dp='8' exportparts="vvd-theme-alternate">
 		<div class="${g}" ${n.t(`_controlEl`)}>
 			<div
@@ -27,4 +27,4 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 			</div>
 		</div>
 	</${i}>
-	`},[i.t,c.t,u.t],{styles:f});t.s(y)();
+	`},[a.t,l.t,u.t],{styles:f});t.s(y)();

package/alert/index.js

@@ -2,22 +2,22 @@ import { t as e } from "../bundled/localized.js";
 import { d as t, l as n, o as r, s as i, t as a, u as o } from "../bundled/vivid-element.js";
 import { t as s } from "../bundled/ref.js";
 import { t as c } from "../bundled/when.js";
-import { t as l } from "../bundled/definition2.js";
-import { t as u } from "../bundled/decorate.js";
-import { t as d } from "../bundled/class-names.js";
+import { n as l } from "../bundled/enums.js";
+import { t as u } from "../bundled/definition2.js";
+import { t as d } from "../bundled/decorate.js";
 import { a as f, i as p, r as m, t as h } from "../bundled/affix.js";
-import { i as g, t as _ } from "../bundled/definition6.js";
-import { n as v } from "../bundled/enums.js";
+import { t as g } from "../bundled/class-names.js";
+import { i as _, t as v } from "../bundled/definition6.js";
 import { r as y, t as b } from "../bundled/definition7.js";
 import { t as x } from "../bundled/dialog.js";
 //#region src/lib/alert/alert.scss?inline
 var S = ".control{z-index:10;inline-size:max-content;max-inline-size:var(--alert-max-inline-size,fit-content);min-inline-size:var(--alert-min-inline-size,420px);border-radius:8px;margin-block:16px;margin-inline:auto;transition:opacity .15s cubic-bezier(0,0,.2,1),transform .15s cubic-bezier(0,0,.2,1);position:fixed;inset-block-end:0;inset-inline:0}.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;margin-inline:16px;inset-inline-end:auto}.control.placement-top-end,.control.placement-bottom-end{margin-inline:16px;inset-inline-start:auto}.control:where(.strategy-static){inline-size:auto;margin:0;position:static}.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;background-color:var(--vvd-color-neutral-50);color:var(--vvd-color-canvas-text);border-radius:8px;align-items:center;column-gap:16px;padding:16px;display:flex}.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{content:\"\";margin-top:8px;display:block}.base slot[name=icon]{color:var(--_appearance-color-fill);flex-shrink:0;font-size:24px;line-height:1}.base .dismiss-button{border-left:1px solid var(--vvd-color-neutral-200);padding-inline-start:16px}", C = {
-	[v.Accent]: "megaphone-line",
-	[v.Information]: "info-line",
-	[v.Success]: "check-circle-line",
-	[v.Warning]: "warning-line",
-	[v.Announcement]: "sparkles-line",
-	[v.Alert]: "error-line"
+	[l.Accent]: "megaphone-line",
+	[l.Information]: "info-line",
+	[l.Success]: "check-circle-line",
+	[l.Warning]: "warning-line",
+	[l.Announcement]: "sparkles-line",
+	[l.Alert]: "error-line"
 }, w = class extends h(e(a)) {
 	constructor(...e) {
 		super(...e), this.dismissButtonAriaLabel = null, this.removable = !1, this.placement = "bottom", this.timeoutms = 0, this.open = !1;
@@ -49,13 +49,13 @@ var S = ".control{z-index:10;inline-size:max-content;max-inline-size:var(--alert
 		this.open ? this.style.display = "contents" : this.style.display = "none";
 	};
 };
-u([n({ attribute: "dismiss-button-aria-label" })], w.prototype, "dismissButtonAriaLabel", void 0), u([n({ mode: "boolean" })], w.prototype, "removable", void 0), u([n({ mode: "fromView" })], w.prototype, "placement", void 0), u([n], w.prototype, "headline", void 0), u([n], w.prototype, "text", void 0), u([n({
+d([n({ attribute: "dismiss-button-aria-label" })], w.prototype, "dismissButtonAriaLabel", void 0), d([n({ mode: "boolean" })], w.prototype, "removable", void 0), d([n({ mode: "fromView" })], w.prototype, "placement", void 0), d([n], w.prototype, "headline", void 0), d([n], w.prototype, "text", void 0), d([n({
 	mode: "fromView",
 	converter: o
-})], w.prototype, "timeoutms", void 0), u([n], w.prototype, "connotation", void 0), u([n], w.prototype, "strategy", void 0), u([n({ mode: "boolean" })], w.prototype, "open", void 0);
+})], w.prototype, "timeoutms", void 0), d([n], w.prototype, "connotation", void 0), d([n], w.prototype, "strategy", void 0), d([n({ mode: "boolean" })], w.prototype, "open", void 0);
 //#endregion
 //#region src/lib/alert/alert.template.ts
-var T = ({ connotation: e }) => d("base", [`connotation-${e}`, !!e]), E = ({ open: e, placement: t, strategy: n }) => d("control", ["open", e], [`placement-${t}`, !!t], [`strategy-${n}`, !!n]);
+var T = ({ connotation: e }) => g("base", [`connotation-${e}`, !!e]), E = ({ open: e, placement: t, strategy: n }) => g("control", ["open", e], [`placement-${t}`, !!t], [`strategy-${n}`, !!n]);
 function D(e, t) {
 	let n = f(e), r = t.conditionedIcon, i = !t.icon && t.connotation ? {
 		label: t.locale.connotationAnnoncement[`${t.connotation}Icon`],
@@ -77,7 +77,7 @@ function O(e) {
 //#endregion
 //#region src/lib/alert/index.ts
 i(r("alert", w, (e) => {
-	let n = e.tagFor(y), r = e.tagFor(g);
+	let n = e.tagFor(y), r = e.tagFor(_);
 	return t`
 	<${n} class="elevation" dp='8' exportparts="vvd-theme-alternate">
 		<div class="${E}" ${s("_controlEl")}>
@@ -101,8 +101,8 @@ i(r("alert", w, (e) => {
 	</${n}>
 	`;
 }, [
-	l,
-	_,
+	u,
+	v,
 	b
 ], { styles: S }))();
 //#endregion

package/audio-player/index.cjs

@@ -1,28 +1,28 @@
-const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/repeat.cjs`),r=require(`../bundled/when.cjs`);require(`../bundled/definition2.cjs`);const i=require(`../bundled/decorate.cjs`),a=require(`../bundled/class-names.cjs`),o=require(`../bundled/definition3.cjs`),s=require(`../bundled/definition6.cjs`),c=require(`../bundled/enums.cjs`),l=require(`../bundled/definition9.cjs`),u=require(`../bundled/definition10.cjs`),d=require(`../bundled/playbackRates.cjs`);var f=`:host{display:block}.wrapper{container-type:inline-size}.base{box-sizing:border-box;color:var(--vvd-color-canvas-text);user-select:none;align-items:center;gap:8px;inline-size:100%;padding:8px;display:inline-flex}.base.disabled{color:var(--vvd-color-neutral-300)}.base .slider{flex:1;grid-area:slider}.base .controls{grid-area:controls;justify-content:center;align-items:center;gap:8px;display:flex}.base .time-stamp{display:inline-flex}.base .time-stamp .current-time,.base .time-stamp .total-time{min-inline-size:32px;margin-inline:6px}.base .playback-button{grid-area:playback}@container (width<=500px){.base.two-lines{grid-template:"slider""controls"/1fr;row-gap:4px;inline-size:100%;display:inline-grid}.base.two-lines .time-stamp{margin-inline:auto 2px}.base.two-lines.playback{grid-template-columns:1fr auto;grid-template-areas:"slider slider""controls playback"}.base.two-lines.playback .time-stamp{margin-inline:auto}.base .slider{box-sizing:border-box;min-inline-size:auto;padding-inline:2px}}`,p={FORWARD:1,BACKWARD:-1};function m(e){if(!e||Number.isNaN(e))return`0:00`;let t=Math.floor(e/60),n=Math.floor(e%60);return t+`:`+(n<10?`0`+n:n)}var h=!0,g=!1,_={toView(e){return e},fromView(e){return Object.values(c.r).includes(e)?e:void 0}},v=class extends e.t(t.t){srcChanged(){this.src===void 0?this.setSrc(``):this.setSrc(this.src)}revokeSrc(){let e=this.getCurrentSrc();e&&e.startsWith(`blob:`)&&URL.revokeObjectURL(e)}getCurrentSrc(){return this.#i.currentSrc||this.#i.src||``}canPlayType(e){return this.#i.canPlayType(e)!==``}setSrc(e,t){let n=this.getCurrentSrc();this.revokeSrc(),this.#e=void 0,this.#t&&=(this.#t.abort(),void 0);let r=t&&(this.canPlayType(t.type)||!e)?URL.createObjectURL(t):e;if(n&&this.#i.removeAttribute(`src`),r||e)try{this.#i.src=r}catch(t){console.log(`Falling back to original URL due to error:`,t),this.#i.src=e}}get playbackRate(){return t.w.track(this,`playbackRate`),this.#i.playbackRate}set playbackRate(e){this.#i.playbackRate=e,t.w.notify(this,`playbackRate`)}get paused(){return t.w.track(this,`paused`),this.#i.paused}set paused(e){}#e;#t;async#n(){if(this.#e||!this.src)return;this.#t=new AbortController;let e=this.#t.signal;try{let n=await(await fetch(this.src,{signal:e})).blob();this.setSrc(this.src,n);let r=await n.arrayBuffer(),i=new window.AudioContext,a=await i.decodeAudioData(r);i.close(),this.#e=a,t.w.notify(this,`duration`)}catch(e){e instanceof Error&&e.name!==`AbortError`&&console.error(`Error loading audio:`,e)}finally{this.#t=void 0}}get duration(){t.w.track(this,`duration`);let e=this.#i.duration;return Number.isFinite(e)&&e>0?e:this.#e&&this.#e.duration>0?this.#e.duration:e}set duration(e){}get currentTime(){return t.w.track(this,`currentTime`),this.#i.currentTime}set currentTime(e){this.#i.currentTime=e}get#r(){return this.shadowRoot.querySelector(`.slider`)}#i=new Audio;#a=!1;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.durationFallback=!1}connectedCallback(){super.connectedCallback(),this.#i.addEventListener(`timeupdate`,this.#u),this.#i.addEventListener(`loadedmetadata`,this.#d),this.#i.addEventListener(`durationchange`,this.#d),this.#i.addEventListener(`play`,this.#o),this.#i.addEventListener(`pause`,this.#s),this.#c(),this.#m(),this.#u()}disconnectedCallback(){super.disconnectedCallback(),this.#c(!1),this.pause(),this.#i.removeEventListener(`timeupdate`,this.#u),this.#i.removeEventListener(`loadedmetadata`,this.#d),this.#i.removeEventListener(`durationchange`,this.#d),this.#i.removeEventListener(`play`,this.#o),this.#i.removeEventListener(`pause`,this.#s)}play(){this.#l(g)}pause(){this.#l(h)}#o=()=>{this.#r?.isDragging||this.$emit(`play`,void 0,{bubbles:!1})};#s=()=>{this.#r?.isDragging||this.$emit(`pause`,void 0,{bubbles:!1})};#c(e=!0){let t=e?`addEventListener`:`removeEventListener`;this.#r&&this.#r[t](`change`,this.#p)}#l=e=>{if(e===this.paused){this.#m();return}this.paused?(this.#u(),this.#i.play()):this.#i.pause(),this.#m()};#u=()=>{t.w.notify(this,`currentTime`);let e=this.duration,n=this.currentTime,r=Number.isFinite(e)&&e>0&&Number.isFinite(n)&&n>=0,i=r?n/e*100:0;this.#r&&(this.#a=!0,this.#r.value=i.toString(),this.#a=!1),r&&i===100&&this.pause()};#d=()=>{t.w.notify(this,`duration`),(!Number.isFinite(this.#i.duration)||this.#i.duration<=0)&&this.durationFallback&&this.#n()};#f;#p=()=>{!this.paused&&this.#r.isDragging&&(this.pause(),this.#f=window.setInterval(()=>{this.#r.isDragging||(clearInterval(this.#f),this.play())},0)),!this.#a&&this.#i&&(this.currentTime=this.duration*Number(this.#r.value)/100)};#m=()=>{t.w.notify(this,`paused`)};skip(e){let t=this.currentTime+parseInt(this.skipBy)*e;this.currentTime=Math.max(0,Math.min(this.duration,t))}};i.t([t.l({attribute:`play-button-aria-label`})],v.prototype,`playButtonAriaLabel`,void 0),i.t([t.l({attribute:`pause-button-aria-label`})],v.prototype,`pauseButtonAriaLabel`,void 0),i.t([t.l({attribute:`slider-aria-label`})],v.prototype,`sliderAriaLabel`,void 0),i.t([t.l({attribute:`skip-forward-aria-label`})],v.prototype,`skipForwardButtonAriaLabel`,void 0),i.t([t.l({attribute:`skip-backward-aria-label`})],v.prototype,`skipBackwardButtonAriaLabel`,void 0),i.t([t.l],v.prototype,`connotation`,void 0),i.t([t.l],v.prototype,`src`,void 0),i.t([t.l({mode:`boolean`})],v.prototype,`disabled`,void 0),i.t([t.l({mode:`boolean`})],v.prototype,`notime`,void 0),i.t([t.l({attribute:`skip-by`,converter:_})],v.prototype,`skipBy`,void 0),i.t([t.l({attribute:`playback-rates`})],v.prototype,`playbackRates`,void 0),i.t([t.l({mode:`boolean`,attribute:`duration-fallback`})],v.prototype,`durationFallback`,void 0);var y=({notime:e,disabled:t,duration:n,skipBy:r,playbackRates:i})=>a.t([`disabled`,!!t||!n],[`two-lines`,!e&&(!!Number(r)||!!i)],[`playback`,!!i]),b=(e,{parent:t})=>e===t.playbackRate;function x(e){let n=e.tagFor(s.i);return t.d`<${n} class="pause" @click="${e=>e.paused?e.play():e.pause()}"
+const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/repeat.cjs`),r=require(`../bundled/when.cjs`),i=require(`../bundled/enums.cjs`);require(`../bundled/definition2.cjs`);const a=require(`../bundled/decorate.cjs`),o=require(`../bundled/playbackRates.cjs`),s=require(`../bundled/class-names.cjs`),c=require(`../bundled/definition3.cjs`),l=require(`../bundled/definition6.cjs`),u=require(`../bundled/definition20.cjs`),d=require(`../bundled/definition21.cjs`);var f=`:host{display:block}.wrapper{container-type:inline-size}.base{box-sizing:border-box;color:var(--vvd-color-canvas-text);user-select:none;align-items:center;gap:8px;inline-size:100%;padding:8px;display:inline-flex}.base.disabled{color:var(--vvd-color-neutral-300)}.base .slider{flex:1;grid-area:slider}.base .controls{grid-area:controls;justify-content:center;align-items:center;gap:8px;display:flex}.base .time-stamp{display:inline-flex}.base .time-stamp .current-time,.base .time-stamp .total-time{min-inline-size:32px;margin-inline:6px}.base .playback-button{grid-area:playback}@container (width<=500px){.base.two-lines{grid-template:"slider""controls"/1fr;row-gap:4px;inline-size:100%;display:inline-grid}.base.two-lines .time-stamp{margin-inline:auto 2px}.base.two-lines.playback{grid-template-columns:1fr auto;grid-template-areas:"slider slider""controls playback"}.base.two-lines.playback .time-stamp{margin-inline:auto}.base .slider{box-sizing:border-box;min-inline-size:auto;padding-inline:2px}}`,p={FORWARD:1,BACKWARD:-1};function m(e){if(!e||Number.isNaN(e))return`0:00`;let t=Math.floor(e/60),n=Math.floor(e%60);return t+`:`+(n<10?`0`+n:n)}var h=!0,g=!1,_={toView(e){return e},fromView(e){return Object.values(i.r).includes(e)?e:void 0}},v=class extends e.t(t.t){srcChanged(){this.src===void 0?this.setSrc(``):this.setSrc(this.src)}revokeSrc(){let e=this.getCurrentSrc();e&&e.startsWith(`blob:`)&&URL.revokeObjectURL(e)}getCurrentSrc(){return this.#i.currentSrc||this.#i.src||``}canPlayType(e){return this.#i.canPlayType(e)!==``}setSrc(e,t){let n=this.getCurrentSrc();this.revokeSrc(),this.#e=void 0,this.#t&&=(this.#t.abort(),void 0);let r=t&&(this.canPlayType(t.type)||!e)?URL.createObjectURL(t):e;if(n&&this.#i.removeAttribute(`src`),r||e)try{this.#i.src=r}catch(t){console.log(`Falling back to original URL due to error:`,t),this.#i.src=e}}get playbackRate(){return t.w.track(this,`playbackRate`),this.#i.playbackRate}set playbackRate(e){this.#i.playbackRate=e,t.w.notify(this,`playbackRate`)}get paused(){return t.w.track(this,`paused`),this.#i.paused}set paused(e){}#e;#t;async#n(){if(this.#e||!this.src)return;this.#t=new AbortController;let e=this.#t.signal;try{let n=await(await fetch(this.src,{signal:e})).blob();this.setSrc(this.src,n);let r=await n.arrayBuffer(),i=new window.AudioContext,a=await i.decodeAudioData(r);i.close(),this.#e=a,t.w.notify(this,`duration`)}catch(e){e instanceof Error&&e.name!==`AbortError`&&console.error(`Error loading audio:`,e)}finally{this.#t=void 0}}get duration(){t.w.track(this,`duration`);let e=this.#i.duration;return Number.isFinite(e)&&e>0?e:this.#e&&this.#e.duration>0?this.#e.duration:e}set duration(e){}get currentTime(){return t.w.track(this,`currentTime`),this.#i.currentTime}set currentTime(e){this.#i.currentTime=e}get#r(){return this.shadowRoot.querySelector(`.slider`)}#i=new Audio;#a=!1;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.durationFallback=!1}connectedCallback(){super.connectedCallback(),this.#i.addEventListener(`timeupdate`,this.#u),this.#i.addEventListener(`loadedmetadata`,this.#d),this.#i.addEventListener(`durationchange`,this.#d),this.#i.addEventListener(`play`,this.#o),this.#i.addEventListener(`pause`,this.#s),this.#c(),this.#m(),this.#u()}disconnectedCallback(){super.disconnectedCallback(),this.#c(!1),this.pause(),this.#i.removeEventListener(`timeupdate`,this.#u),this.#i.removeEventListener(`loadedmetadata`,this.#d),this.#i.removeEventListener(`durationchange`,this.#d),this.#i.removeEventListener(`play`,this.#o),this.#i.removeEventListener(`pause`,this.#s)}play(){this.#l(g)}pause(){this.#l(h)}#o=()=>{this.#r?.isDragging||this.$emit(`play`,void 0,{bubbles:!1})};#s=()=>{this.#r?.isDragging||this.$emit(`pause`,void 0,{bubbles:!1})};#c(e=!0){let t=e?`addEventListener`:`removeEventListener`;this.#r&&this.#r[t](`change`,this.#p)}#l=e=>{if(e===this.paused){this.#m();return}this.paused?(this.#u(),this.#i.play()):this.#i.pause(),this.#m()};#u=()=>{t.w.notify(this,`currentTime`);let e=this.duration,n=this.currentTime,r=Number.isFinite(e)&&e>0&&Number.isFinite(n)&&n>=0,i=r?n/e*100:0;this.#r&&(this.#a=!0,this.#r.value=i.toString(),this.#a=!1),r&&i===100&&this.pause()};#d=()=>{t.w.notify(this,`duration`),(!Number.isFinite(this.#i.duration)||this.#i.duration<=0)&&this.durationFallback&&this.#n()};#f;#p=()=>{!this.paused&&this.#r.isDragging&&(this.pause(),this.#f=window.setInterval(()=>{(!this.#r.isDragging||!this.isConnected)&&(clearInterval(this.#f),this.isConnected&&this.play())},0)),!this.#a&&this.#i&&(this.currentTime=this.duration*Number(this.#r.value)/100)};#m=()=>{t.w.notify(this,`paused`)};skip(e){let t=this.currentTime+parseInt(this.skipBy)*e;this.currentTime=Math.max(0,Math.min(this.duration,t))}};a.t([t.l({attribute:`play-button-aria-label`})],v.prototype,`playButtonAriaLabel`,void 0),a.t([t.l({attribute:`pause-button-aria-label`})],v.prototype,`pauseButtonAriaLabel`,void 0),a.t([t.l({attribute:`slider-aria-label`})],v.prototype,`sliderAriaLabel`,void 0),a.t([t.l({attribute:`skip-forward-aria-label`})],v.prototype,`skipForwardButtonAriaLabel`,void 0),a.t([t.l({attribute:`skip-backward-aria-label`})],v.prototype,`skipBackwardButtonAriaLabel`,void 0),a.t([t.l],v.prototype,`connotation`,void 0),a.t([t.l],v.prototype,`src`,void 0),a.t([t.l({mode:`boolean`})],v.prototype,`disabled`,void 0),a.t([t.l({mode:`boolean`})],v.prototype,`notime`,void 0),a.t([t.l({attribute:`skip-by`,converter:_})],v.prototype,`skipBy`,void 0),a.t([t.l({attribute:`playback-rates`})],v.prototype,`playbackRates`,void 0),a.t([t.l({mode:`boolean`,attribute:`duration-fallback`})],v.prototype,`durationFallback`,void 0);var y=({notime:e,disabled:t,duration:n,skipBy:r,playbackRates:i})=>s.t([`disabled`,!!t||!n],[`two-lines`,!e&&(!!Number(r)||!!i)],[`playback`,!!i]),b=(e,{parent:t})=>e===t.playbackRate;function x(e){let n=e.tagFor(l.i);return t.d`<${n} class="pause" @click="${e=>e.paused?e.play():e.pause()}"
 	icon="${e=>e.paused?`play-solid`:`pause-solid`}"
 	aria-label="${e=>e.paused?e.playButtonAriaLabel||e.locale.audioPlayer.playButtonLabel:e.pauseButtonAriaLabel||e.locale.audioPlayer.pauseButtonLabel}"
 	size='condensed'
 	connotation="${e=>e.connotation}"
 	?disabled="${e=>e.disabled||!e.duration}"
-  ></${n}>`}function S(e){let n=e.tagFor(s.i);return t.d`
+  ></${n}>`}function S(e){let n=e.tagFor(l.i);return t.d`
 		<${n} class="skip backward"
 			@click="${e=>e.skip(p.BACKWARD)}"
-		icon="${e=>e.skipBy==c.r.Five?`5-sec-backward-line`:e.skipBy==c.r.Thirty?`30-sec-backward-line`:`10-sec-backward-line`}"
+		icon="${e=>e.skipBy==i.r.Five?`5-sec-backward-line`:e.skipBy==i.r.Thirty?`30-sec-backward-line`:`10-sec-backward-line`}"
 		size='condensed'
 		aria-label="${e=>e.skipBackwardButtonAriaLabel||e.locale.audioPlayer.skipBackwardButton}"
 		connotation="${e=>e.connotation}"
 		?disabled="${e=>e.disabled||!e.duration}"
 		></${n}>
-	`}function C(e){let n=e.tagFor(s.i);return t.d`
+	`}function C(e){let n=e.tagFor(l.i);return t.d`
 		<${n} class="skip forward"
 		@click="${e=>e.skip(p.FORWARD)}"
-		icon="${e=>e.skipBy==c.r.Five?`5-sec-forward-line`:e.skipBy==c.r.Thirty?`30-sec-forward-line`:`10-sec-forward-line`}"
+		icon="${e=>e.skipBy==i.r.Five?`5-sec-forward-line`:e.skipBy==i.r.Thirty?`30-sec-forward-line`:`10-sec-forward-line`}"
 		size='condensed'
 		aria-label="${e=>e.skipForwardButtonAriaLabel||e.locale.audioPlayer.skipForwardButton}"
 		connotation="${e=>e.connotation}"
 		?disabled="${e=>e.disabled||!e.duration}"
 		></${n}>
-	`}function w(e){let n=e.tagFor(o.r);return t.d`
+	`}function w(e){let n=e.tagFor(c.r);return t.d`
 	<${n}
 		class="slider"
 		aria-label="${e=>e.sliderAriaLabel||e.locale.audioPlayer.sliderLabel}"
@@ -39,18 +39,18 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 				<span>/</span>
 				<span class="total-time">${e=>m(e?.duration)}</span>
 			`)}
-	</div>`}function E(e,t){return t.parent.playbackRate=e,!0}var D=t.o(`audio-player`,v,e=>{let i=e.tagFor(u.r),a=e.tagFor(s.i),o=e.tagFor(l.i);return t.d` <div class="wrapper">
+	</div>`}function E(e,t){return t.parent.playbackRate=e,!0}var D=t.o(`audio-player`,v,e=>{let a=e.tagFor(d.r),s=e.tagFor(l.i),c=e.tagFor(u.i);return t.d` <div class="wrapper">
 		<div class="base ${y}">
 			<div class="controls">
-				${r.t(e=>e.skipBy&&e.skipBy!=c.r.Zero,S(e))}
+				${r.t(e=>e.skipBy&&e.skipBy!=i.r.Zero,S(e))}
 				${x(e)}
-				${r.t(e=>e.skipBy&&e.skipBy!=c.r.Zero,C(e))}
+				${r.t(e=>e.skipBy&&e.skipBy!=i.r.Zero,C(e))}
 				${r.t(e=>!e.notime,T())}
 			</div>
 			${w(e)}
 			${r.t(e=>!!e.playbackRates,t.d`
-			<${i} class="playback-rates" placement="top-start" auto-dismiss id="playback-menu" position-strategy="absolute">
-				<${a} id="playback-open-button"
+			<${a} class="playback-rates" placement="top-start" auto-dismiss id="playback-menu" position-strategy="absolute">
+				<${s} id="playback-open-button"
 							  class="playback-button"
 							  slot="anchor"
 							  icon="playback-speed-line"
@@ -58,14 +58,14 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 							  size='condensed'
 							  connotation="${e=>e.connotation}"
 							  ?disabled="${e=>e.disabled||!e.duration}"
-				></${a}>
+				></${s}>
 
-				${n.n(e=>d.t(e.playbackRates),t.d`<${o} @click="${E}"
+				${n.n(e=>o.t(e.playbackRates),t.d`<${c} @click="${E}"
 																			 control-type="radio"
 																			 class="playback-rate"
 																			 text="${e=>e}"
 																			 check-appearance="tick-only"
-																			 ?checked="${b}"></${o}>`)}
-			</${i}>`)}
+																			 ?checked="${b}"></${c}>`)}
+			</${a}>`)}
 		</div>
-	</div>`},[s.t,o.n,u.t,l.t],{styles:f});t.s(D)();
+	</div>`},[l.t,c.n,d.t,u.t],{styles:f});t.s(D)();

package/audio-player/index.js

@@ -2,15 +2,15 @@ import { t as e } from "../bundled/localized.js";
 import { d as t, l as n, o as r, s as i, t as a, w as o } from "../bundled/vivid-element.js";
 import { n as s } from "../bundled/repeat.js";
 import { t as c } from "../bundled/when.js";
+import { r as l } from "../bundled/enums.js";
 import "../bundled/definition2.js";
-import { t as l } from "../bundled/decorate.js";
-import { t as u } from "../bundled/class-names.js";
-import { n as d, r as f } from "../bundled/definition3.js";
-import { i as p, t as m } from "../bundled/definition6.js";
-import { r as h } from "../bundled/enums.js";
-import { i as g, t as _ } from "../bundled/definition9.js";
-import { r as v, t as y } from "../bundled/definition10.js";
-import { t as b } from "../bundled/playbackRates.js";
+import { t as u } from "../bundled/decorate.js";
+import { t as d } from "../bundled/playbackRates.js";
+import { t as f } from "../bundled/class-names.js";
+import { n as p, r as m } from "../bundled/definition3.js";
+import { i as h, t as g } from "../bundled/definition6.js";
+import { i as _, t as v } from "../bundled/definition20.js";
+import { r as y, t as b } from "../bundled/definition21.js";
 //#region src/lib/audio-player/audio-player.scss?inline
 var x = ":host{display:block}.wrapper{container-type:inline-size}.base{box-sizing:border-box;color:var(--vvd-color-canvas-text);user-select:none;align-items:center;gap:8px;inline-size:100%;padding:8px;display:inline-flex}.base.disabled{color:var(--vvd-color-neutral-300)}.base .slider{flex:1;grid-area:slider}.base .controls{grid-area:controls;justify-content:center;align-items:center;gap:8px;display:flex}.base .time-stamp{display:inline-flex}.base .time-stamp .current-time,.base .time-stamp .total-time{min-inline-size:32px;margin-inline:6px}.base .playback-button{grid-area:playback}@container (width<=500px){.base.two-lines{grid-template:\"slider\"\"controls\"/1fr;row-gap:4px;inline-size:100%;display:inline-grid}.base.two-lines .time-stamp{margin-inline:auto 2px}.base.two-lines.playback{grid-template-columns:1fr auto;grid-template-areas:\"slider slider\"\"controls playback\"}.base.two-lines.playback .time-stamp{margin-inline:auto}.base .slider{box-sizing:border-box;min-inline-size:auto;padding-inline:2px}}", S = {
 	FORWARD: 1,
@@ -26,7 +26,7 @@ var w = !0, T = !1, E = {
 		return e;
 	},
 	fromView(e) {
-		return Object.values(h).includes(e) ? e : void 0;
+		return Object.values(l).includes(e) ? e : void 0;
 	}
 }, D = class extends e(a) {
 	srcChanged() {
@@ -141,7 +141,7 @@ var w = !0, T = !1, E = {
 	#f;
 	#p = () => {
 		!this.paused && this.#r.isDragging && (this.pause(), this.#f = window.setInterval(() => {
-			this.#r.isDragging || (clearInterval(this.#f), this.play());
+			(!this.#r.isDragging || !this.isConnected) && (clearInterval(this.#f), this.isConnected && this.play());
 		}, 0)), !this.#a && this.#i && (this.currentTime = this.duration * Number(this.#r.value) / 100);
 	};
 	#m = () => {
@@ -152,18 +152,18 @@ var w = !0, T = !1, E = {
 		this.currentTime = Math.max(0, Math.min(this.duration, t));
 	}
 };
-l([n({ attribute: "play-button-aria-label" })], D.prototype, "playButtonAriaLabel", void 0), l([n({ attribute: "pause-button-aria-label" })], D.prototype, "pauseButtonAriaLabel", void 0), l([n({ attribute: "slider-aria-label" })], D.prototype, "sliderAriaLabel", void 0), l([n({ attribute: "skip-forward-aria-label" })], D.prototype, "skipForwardButtonAriaLabel", void 0), l([n({ attribute: "skip-backward-aria-label" })], D.prototype, "skipBackwardButtonAriaLabel", void 0), l([n], D.prototype, "connotation", void 0), l([n], D.prototype, "src", void 0), l([n({ mode: "boolean" })], D.prototype, "disabled", void 0), l([n({ mode: "boolean" })], D.prototype, "notime", void 0), l([n({
+u([n({ attribute: "play-button-aria-label" })], D.prototype, "playButtonAriaLabel", void 0), u([n({ attribute: "pause-button-aria-label" })], D.prototype, "pauseButtonAriaLabel", void 0), u([n({ attribute: "slider-aria-label" })], D.prototype, "sliderAriaLabel", void 0), u([n({ attribute: "skip-forward-aria-label" })], D.prototype, "skipForwardButtonAriaLabel", void 0), u([n({ attribute: "skip-backward-aria-label" })], D.prototype, "skipBackwardButtonAriaLabel", void 0), u([n], D.prototype, "connotation", void 0), u([n], D.prototype, "src", void 0), u([n({ mode: "boolean" })], D.prototype, "disabled", void 0), u([n({ mode: "boolean" })], D.prototype, "notime", void 0), u([n({
 	attribute: "skip-by",
 	converter: E
-})], D.prototype, "skipBy", void 0), l([n({ attribute: "playback-rates" })], D.prototype, "playbackRates", void 0), l([n({
+})], D.prototype, "skipBy", void 0), u([n({ attribute: "playback-rates" })], D.prototype, "playbackRates", void 0), u([n({
 	mode: "boolean",
 	attribute: "duration-fallback"
 })], D.prototype, "durationFallback", void 0);
 //#endregion
 //#region src/lib/audio-player/audio-player.template.ts
-var O = ({ notime: e, disabled: t, duration: n, skipBy: r, playbackRates: i }) => u(["disabled", !!t || !n], ["two-lines", !e && (!!Number(r) || !!i)], ["playback", !!i]), k = (e, { parent: t }) => e === t.playbackRate;
+var O = ({ notime: e, disabled: t, duration: n, skipBy: r, playbackRates: i }) => f(["disabled", !!t || !n], ["two-lines", !e && (!!Number(r) || !!i)], ["playback", !!i]), k = (e, { parent: t }) => e === t.playbackRate;
 function A(e) {
-	let n = e.tagFor(p);
+	let n = e.tagFor(h);
 	return t`<${n} class="pause" @click="${(e) => e.paused ? e.play() : e.pause()}"
 	icon="${(e) => e.paused ? "play-solid" : "pause-solid"}"
 	aria-label="${(e) => e.paused ? e.playButtonAriaLabel || e.locale.audioPlayer.playButtonLabel : e.pauseButtonAriaLabel || e.locale.audioPlayer.pauseButtonLabel}"
@@ -173,11 +173,11 @@ function A(e) {
   ></${n}>`;
 }
 function j(e) {
-	let n = e.tagFor(p);
+	let n = e.tagFor(h);
 	return t`
 		<${n} class="skip backward"
 			@click="${(e) => e.skip(S.BACKWARD)}"
-		icon="${(e) => e.skipBy == h.Five ? "5-sec-backward-line" : e.skipBy == h.Thirty ? "30-sec-backward-line" : "10-sec-backward-line"}"
+		icon="${(e) => e.skipBy == l.Five ? "5-sec-backward-line" : e.skipBy == l.Thirty ? "30-sec-backward-line" : "10-sec-backward-line"}"
 		size='condensed'
 		aria-label="${(e) => e.skipBackwardButtonAriaLabel || e.locale.audioPlayer.skipBackwardButton}"
 		connotation="${(e) => e.connotation}"
@@ -186,11 +186,11 @@ function j(e) {
 	`;
 }
 function M(e) {
-	let n = e.tagFor(p);
+	let n = e.tagFor(h);
 	return t`
 		<${n} class="skip forward"
 		@click="${(e) => e.skip(S.FORWARD)}"
-		icon="${(e) => e.skipBy == h.Five ? "5-sec-forward-line" : e.skipBy == h.Thirty ? "30-sec-forward-line" : "10-sec-forward-line"}"
+		icon="${(e) => e.skipBy == l.Five ? "5-sec-forward-line" : e.skipBy == l.Thirty ? "30-sec-forward-line" : "10-sec-forward-line"}"
 		size='condensed'
 		aria-label="${(e) => e.skipForwardButtonAriaLabel || e.locale.audioPlayer.skipForwardButton}"
 		connotation="${(e) => e.connotation}"
@@ -199,7 +199,7 @@ function M(e) {
 	`;
 }
 function N(e) {
-	let n = e.tagFor(f);
+	let n = e.tagFor(m);
 	return t`
 	<${n}
 		class="slider"
@@ -228,13 +228,13 @@ function F(e, t) {
 //#endregion
 //#region src/lib/audio-player/index.ts
 i(r("audio-player", D, (e) => {
-	let n = e.tagFor(v), r = e.tagFor(p), i = e.tagFor(g);
+	let n = e.tagFor(y), r = e.tagFor(h), i = e.tagFor(_);
 	return t` <div class="wrapper">
 		<div class="base ${O}">
 			<div class="controls">
-				${c((e) => e.skipBy && e.skipBy != h.Zero, j(e))}
+				${c((e) => e.skipBy && e.skipBy != l.Zero, j(e))}
 				${A(e)}
-				${c((e) => e.skipBy && e.skipBy != h.Zero, M(e))}
+				${c((e) => e.skipBy && e.skipBy != l.Zero, M(e))}
 				${c((e) => !e.notime, P())}
 			</div>
 			${N(e)}
@@ -250,7 +250,7 @@ i(r("audio-player", D, (e) => {
 							  ?disabled="${(e) => e.disabled || !e.duration}"
 				></${r}>
 
-				${s((e) => b(e.playbackRates), t`<${i} @click="${F}"
+				${s((e) => d(e.playbackRates), t`<${i} @click="${F}"
 																			 control-type="radio"
 																			 class="playback-rate"
 																			 text="${(e) => e}"
@@ -260,9 +260,9 @@ i(r("audio-player", D, (e) => {
 		</div>
 	</div>`;
 }, [
-	m,
-	d,
-	y,
-	_
+	g,
+	p,
+	b,
+	v
 ], { styles: x }))();
 //#endregion

package/avatar/index.cjs

@@ -1,11 +1,11 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/definition2.cjs`),r=require(`../bundled/decorate.cjs`),i=require(`../bundled/class-names.cjs`),a=require(`../bundled/delegates-aria.cjs`),o=require(`../bundled/linkable.cjs`);var s=`:host{display:inline-block}.base.connotation-cta{--_connotation-color-primary:var(--vvd-avatar-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-avatar-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-avatar-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-fierce:var(--vvd-avatar-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-pale:var(--vvd-avatar-cta-pale,var(--vvd-color-cta-300));--_connotation-color-soft:var(--vvd-avatar-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-avatar-cta-contrast,var(--vvd-color-cta-800))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-avatar-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-avatar-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-avatar-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-fierce:var(--vvd-avatar-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-pale:var(--vvd-avatar-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-soft:var(--vvd-avatar-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-avatar-accent-contrast,var(--vvd-color-neutral-800))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{border-radius:var(--_avatar-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:var(--_size);vertical-align:middle;border:none;justify-content:center;align-items:center;display:inline-flex;overflow:hidden}.base.size-condensed{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size-condensed .initials{font:var(--vvd-typography-base-condensed-bold)}.base.size-condensed .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);line-height:1}.base.size-expanded{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-expanded .initials{font:var(--vvd-typography-heading-4)}.base.size-expanded .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8)) / 2);line-height:1}.base:is(a,button){cursor:pointer;--focus-stroke-gap-color:transparent}.base:not(.shape-pill){--_avatar-border-radius:8px}.base:not(.shape-pill).size-condensed{--_avatar-border-radius:4px}.base:not(.size-condensed,.size-expanded){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base:not(.size-condensed,.size-expanded) .initials{font:var(--vvd-typography-base-extended-bold)}.base:not(.size-condensed,.size-expanded) .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2);line-height:1}.base:is(a,button):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.base.shape-pill{--_avatar-border-radius:50%}.base .initials{text-transform:uppercase}.base ::slotted([slot=graphic]){object-fit:cover;block-size:100%;inline-size:100%}`,c=class extends o.t(e.t){constructor(...e){super(...e),this.clickable=!1}};r.t([e.l],c.prototype,`connotation`,void 0),r.t([e.l],c.prototype,`shape`,void 0),r.t([e.l],c.prototype,`appearance`,void 0),r.t([e.l],c.prototype,`size`,void 0),r.t([e.l],c.prototype,`icon`,void 0),r.t([e.l],c.prototype,`initials`,void 0),r.t([e.l({mode:`boolean`,attribute:`clickable`})],c.prototype,`clickable`,void 0);var l=({appearance:e,connotation:t,shape:n,size:r})=>i.t(`base`,[`connotation-${t}`,!!t],[`appearance-${e}`,!!e],[`shape-${n}`,!!n],[`size-${r}`,!!r]);function u(t){return e.d`
+const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/definition2.cjs`),r=require(`../bundled/decorate.cjs`),i=require(`../bundled/delegates-aria.cjs`),a=require(`../bundled/linkable.cjs`),o=require(`../bundled/class-names.cjs`);var s=`:host{display:inline-block}.base.connotation-cta{--_connotation-color-primary:var(--vvd-avatar-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-avatar-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-avatar-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-fierce:var(--vvd-avatar-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-pale:var(--vvd-avatar-cta-pale,var(--vvd-color-cta-300));--_connotation-color-soft:var(--vvd-avatar-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-avatar-cta-contrast,var(--vvd-color-cta-800))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-avatar-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-avatar-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-avatar-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-fierce:var(--vvd-avatar-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-pale:var(--vvd-avatar-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-soft:var(--vvd-avatar-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-avatar-accent-contrast,var(--vvd-color-neutral-800))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{border-radius:var(--_avatar-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:var(--_size);vertical-align:middle;border:none;justify-content:center;align-items:center;display:inline-flex;overflow:hidden}.base.size-condensed{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size-condensed .initials{font:var(--vvd-typography-base-condensed-bold)}.base.size-condensed .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);line-height:1}.base.size-expanded{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-expanded .initials{font:var(--vvd-typography-heading-4)}.base.size-expanded .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8)) / 2);line-height:1}.base:is(a,button){cursor:pointer;--focus-stroke-gap-color:transparent}.base:not(.shape-pill){--_avatar-border-radius:8px}.base:not(.shape-pill).size-condensed{--_avatar-border-radius:4px}.base:not(.size-condensed,.size-expanded){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base:not(.size-condensed,.size-expanded) .initials{font:var(--vvd-typography-base-extended-bold)}.base:not(.size-condensed,.size-expanded) .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2);line-height:1}.base:is(a,button):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.base.shape-pill{--_avatar-border-radius:50%}.base .initials{text-transform:uppercase}.base ::slotted([slot=graphic]){object-fit:cover;block-size:100%;inline-size:100%}`,c=class extends a.t(e.t){constructor(...e){super(...e),this.clickable=!1}};r.t([e.l],c.prototype,`connotation`,void 0),r.t([e.l],c.prototype,`shape`,void 0),r.t([e.l],c.prototype,`appearance`,void 0),r.t([e.l],c.prototype,`size`,void 0),r.t([e.l],c.prototype,`icon`,void 0),r.t([e.l],c.prototype,`initials`,void 0),r.t([e.l({mode:`boolean`,attribute:`clickable`})],c.prototype,`clickable`,void 0);var l=({appearance:e,connotation:t,shape:n,size:r})=>o.t(`base`,[`connotation-${t}`,!!t],[`appearance-${e}`,!!e],[`shape-${n}`,!!n],[`size-${r}`,!!r]);function u(t){return e.d`
 		<${t} name="${e=>e.icon?`${e.icon}`:`user-line`}"></${t}>
 	`}function d(){return e.d`
 		<span class="initials">${({initials:e})=>e.substring(0,2)}</span>
 	`}function f(t,n){return t.href?t._renderLinkElement(n,l):t.clickable?e.d`<button
 			type="button"
 			class="${l}"
-			${a.n()}
+			${i.n()}
 		>
 			${n}
 		</button>`:e.d`<span class="${l}">${n}</span>`}var p=e.o(`avatar`,c,r=>{let i=r.tagFor(n.r);return e.d`

package/avatar/index.js

@@ -2,11 +2,11 @@ import { d as e, l as t, o as n, s as r, t as i } from "../bundled/vivid-element
 import { t as a } from "../bundled/when.js";
 import { r as o, t as s } from "../bundled/definition2.js";
 import { t as c } from "../bundled/decorate.js";
-import { t as l } from "../bundled/class-names.js";
-import { n as u } from "../bundled/delegates-aria.js";
-import { t as d } from "../bundled/linkable.js";
+import { n as l } from "../bundled/delegates-aria.js";
+import { t as u } from "../bundled/linkable.js";
+import { t as d } from "../bundled/class-names.js";
 //#region src/lib/avatar/avatar.scss?inline
-var f = ":host{display:inline-block}.base.connotation-cta{--_connotation-color-primary:var(--vvd-avatar-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-avatar-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-avatar-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-fierce:var(--vvd-avatar-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-pale:var(--vvd-avatar-cta-pale,var(--vvd-color-cta-300));--_connotation-color-soft:var(--vvd-avatar-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-avatar-cta-contrast,var(--vvd-color-cta-800))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-avatar-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-avatar-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-avatar-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-fierce:var(--vvd-avatar-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-pale:var(--vvd-avatar-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-soft:var(--vvd-avatar-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-avatar-accent-contrast,var(--vvd-color-neutral-800))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{border-radius:var(--_avatar-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:var(--_size);vertical-align:middle;border:none;justify-content:center;align-items:center;display:inline-flex;overflow:hidden}.base.size-condensed{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size-condensed .initials{font:var(--vvd-typography-base-condensed-bold)}.base.size-condensed .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);line-height:1}.base.size-expanded{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-expanded .initials{font:var(--vvd-typography-heading-4)}.base.size-expanded .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8)) / 2);line-height:1}.base:is(a,button){cursor:pointer;--focus-stroke-gap-color:transparent}.base:not(.shape-pill){--_avatar-border-radius:8px}.base:not(.shape-pill).size-condensed{--_avatar-border-radius:4px}.base:not(.size-condensed,.size-expanded){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base:not(.size-condensed,.size-expanded) .initials{font:var(--vvd-typography-base-extended-bold)}.base:not(.size-condensed,.size-expanded) .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2);line-height:1}.base:is(a,button):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.base.shape-pill{--_avatar-border-radius:50%}.base .initials{text-transform:uppercase}.base ::slotted([slot=graphic]){object-fit:cover;block-size:100%;inline-size:100%}", p = class extends d(i) {
+var f = ":host{display:inline-block}.base.connotation-cta{--_connotation-color-primary:var(--vvd-avatar-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-avatar-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-avatar-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-fierce:var(--vvd-avatar-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-pale:var(--vvd-avatar-cta-pale,var(--vvd-color-cta-300));--_connotation-color-soft:var(--vvd-avatar-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-avatar-cta-contrast,var(--vvd-color-cta-800))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-avatar-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-avatar-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-firm:var(--vvd-avatar-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-avatar-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-fierce:var(--vvd-avatar-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-pale:var(--vvd-avatar-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-soft:var(--vvd-avatar-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-avatar-accent-contrast,var(--vvd-color-neutral-800))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{border-radius:var(--_avatar-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:var(--_size);vertical-align:middle;border:none;justify-content:center;align-items:center;display:inline-flex;overflow:hidden}.base.size-condensed{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size-condensed .initials{font:var(--vvd-typography-base-condensed-bold)}.base.size-condensed .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);line-height:1}.base.size-expanded{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-expanded .initials{font:var(--vvd-typography-heading-4)}.base.size-expanded .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8)) / 2);line-height:1}.base:is(a,button){cursor:pointer;--focus-stroke-gap-color:transparent}.base:not(.shape-pill){--_avatar-border-radius:8px}.base:not(.shape-pill).size-condensed{--_avatar-border-radius:4px}.base:not(.size-condensed,.size-expanded){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base:not(.size-condensed,.size-expanded) .initials{font:var(--vvd-typography-base-extended-bold)}.base:not(.size-condensed,.size-expanded) .icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2);line-height:1}.base:is(a,button):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.base.shape-pill{--_avatar-border-radius:50%}.base .initials{text-transform:uppercase}.base ::slotted([slot=graphic]){object-fit:cover;block-size:100%;inline-size:100%}", p = class extends u(i) {
 	constructor(...e) {
 		super(...e), this.clickable = !1;
 	}
@@ -17,7 +17,7 @@ c([t], p.prototype, "connotation", void 0), c([t], p.prototype, "shape", void 0)
 })], p.prototype, "clickable", void 0);
 //#endregion
 //#region src/lib/avatar/avatar.template.ts
-var m = ({ appearance: e, connotation: t, shape: n, size: r }) => l("base", [`connotation-${t}`, !!t], [`appearance-${e}`, !!e], [`shape-${n}`, !!n], [`size-${r}`, !!r]);
+var m = ({ appearance: e, connotation: t, shape: n, size: r }) => d("base", [`connotation-${t}`, !!t], [`appearance-${e}`, !!e], [`shape-${n}`, !!n], [`size-${r}`, !!r]);
 function h(t) {
 	return e`
 		<${t} name="${(e) => e.icon ? `${e.icon}` : "user-line"}"></${t}>
@@ -32,7 +32,7 @@ function _(t, n) {
 	return t.href ? t._renderLinkElement(n, m) : t.clickable ? e`<button
 			type="button"
 			class="${m}"
-			${u()}
+			${l()}
 		>
 			${n}
 		</button>` : e`<span class="${m}">${n}</span>`;