@vonage/vivid 5.25.0 → 5.27.0

package/date-time-picker/index.cjs

@@ -1,4 +1,4 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/definition.cjs`),n=require(`../bundled/decorate.cjs`),r=require(`../bundled/definition6.cjs`),i=require(`../bundled/definition8.cjs`),a=require(`../bundled/definition12.cjs`),o=require(`../bundled/picker-field.template.cjs`),s=require(`../bundled/time-selection-picker.template.cjs`),c=require(`../bundled/single-value-picker.cjs`),l=require(`../bundled/definition20.cjs`),u=require(`../bundled/calendar-picker.template.cjs`),d=require(`../bundled/single-date-picker.cjs`);var f=`.date-time-picker{gap:28px;padding-inline-start:12px;display:flex}.time-picker{padding-block:4px 12px}`,p=e=>e.split(`T`)[0]||``,m=e=>e.split(`T`)[1]||``,h=e=>{let[t=``,n=``]=e.split(`T`);return u.l(t)&&s.l(n)},g=(e,t,n,r)=>{let[i,a]=e.split(`T`);return`${u.a(i,t)} ${s.i(a,n,r)}`},_=(e,t,n)=>{let[r,...i]=e.split(` `);return`${u.o(r,t)}T${s.a(i.join(` `),n)}`},v={fromView:e=>e&&h(e)?e:``,toView(e){return e}},y=class extends s.o(d.t(c.t(u.i(o.n)))){get _resolvedMinDate(){return this.minDate||p(this.min)}get _resolvedMaxDate(){return this.maxDate||p(this.max)}get _resolvedMinTime(){return this.minTime||this.min&&p(this.min)===this._dateValue()&&m(this.min)||``}get _resolvedMaxTime(){return this.maxTime||this.max&&p(this.max)===this._dateValue()&&m(this.max)||``}_toPresentationValue(e){return g(e,this.locale.calendarPicker,this._displaySeconds,this._use12hClock)}_parsePresentationValue(e){return _(e,this.locale.calendarPicker,this._use12hClock)}_dateValue(){return p(this.value)}_withUpdatedDate(e){return`${e}T${m(this.value)||`00:00:00`}`}get _timeValue(){return m(this.value)}_withUpdatedTime(e){return`${p(this.value)||u.c()}T${e}`}constructor(){super(),this._isValidValue=h,this._textFieldSize=`30`,this.proxy.type=`datetime-local`,this.proxy.step=`1`,this.min=``,this.minDate=``,this.minTime=``,this.max=``,this.maxDate=``,this.maxTime=``}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.dateTimePicker.invalidDateTimeError:this._dateValue()&&this._resolvedMinDate&&u.s(this._dateValue(),this._resolvedMinDate)<0?this.locale.dateTimePicker.dateBeforeMinDateError(u.a(this._resolvedMinDate,this.locale.calendarPicker)):this._dateValue()&&this._resolvedMaxDate&&u.s(this._dateValue(),this._resolvedMaxDate)>0?this.locale.dateTimePicker.dateAfterMaxDateError(u.a(this._resolvedMaxDate,this.locale.calendarPicker)):this._timeValue&&this._resolvedMinTime&&s.c(this._timeValue,this._resolvedMinTime)<0?this.locale.dateTimePicker.timeBeforeMinTimeError(s.i(this._resolvedMinTime,this._displaySeconds,this._use12hClock)):this._timeValue&&this._resolvedMaxTime&&s.c(this._timeValue,this._resolvedMaxTime)>0?this.locale.dateTimePicker.timeAfterMaxTimeError(s.i(this._resolvedMaxTime,this._displaySeconds,this._use12hClock)):null}get _textFieldPlaceholder(){return`${this.locale.calendarPicker.dateFormatPlaceholder} ${this._timePlaceholder}`}get _pickerButtonLabel(){return this.value?this.locale.dateTimePicker.changeDateTimeLabel(this._toPresentationValue(this.value)):this.locale.dateTimePicker.chooseDateTimeLabel}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll(`#inline-time-picker, button, .vwc-button`)}get _pickerButtonIcon(){return`calendar-clock-line`}get _dialogLabel(){return this.locale.dateTimePicker.chooseDateTimeLabel}};n.t([e.m({converter:v})],y.prototype,`min`,void 0),n.t([e.m({converter:s.r,attribute:`min-time`})],y.prototype,`minTime`,void 0),n.t([e.m({converter:u.r,attribute:`min-date`})],y.prototype,`minDate`,void 0),n.t([e.m({converter:v})],y.prototype,`max`,void 0),n.t([e.m({converter:s.r,attribute:`max-time`})],y.prototype,`maxTime`,void 0),n.t([e.m({converter:u.r,attribute:`max-date`})],y.prototype,`maxDate`,void 0);var b=e.u(`date-time-picker`,y,t=>o.t(t,e.p`
+const e=require("../bundled/vivid-element.cjs"),t=require("../bundled/definition.cjs"),n=require("../bundled/decorate.cjs"),r=require("../bundled/definition5.cjs"),i=require("../bundled/definition7.cjs"),a=require("../bundled/definition11.cjs"),o=require("../bundled/picker-field.template.cjs"),s=require("../bundled/time-selection-picker.template.cjs"),c=require("../bundled/single-value-picker.cjs"),l=require("../bundled/definition20.cjs"),u=require("../bundled/calendar-picker.template.cjs"),d=require("../bundled/single-date-picker.cjs");var f=`.date-time-picker{gap:28px;padding-inline-start:12px;display:flex}.time-picker{padding-block:4px 12px}`,p=e=>e.split(`T`)[0]||``,m=e=>e.split(`T`)[1]||``,h=e=>{let[t=``,n=``]=e.split(`T`);return u.l(t)&&s.l(n)},g=(e,t,n,r)=>{let[i,a]=e.split(`T`);return`${u.a(i,t)} ${s.i(a,n,r)}`},_=(e,t,n)=>{let[r,...i]=e.split(` `);return`${u.o(r,t)}T${s.a(i.join(` `),n)}`},v={fromView:e=>e&&h(e)?e:``,toView(e){return e}},y=class extends s.o(d.t(c.t(u.i(o.n)))){get _resolvedMinDate(){return this.minDate||p(this.min)}get _resolvedMaxDate(){return this.maxDate||p(this.max)}get _resolvedMinTime(){return this.minTime||this.min&&p(this.min)===this._dateValue()&&m(this.min)||``}get _resolvedMaxTime(){return this.maxTime||this.max&&p(this.max)===this._dateValue()&&m(this.max)||``}_toPresentationValue(e){return g(e,this.locale.calendarPicker,this._displaySeconds,this._use12hClock)}_parsePresentationValue(e){return _(e,this.locale.calendarPicker,this._use12hClock)}_dateValue(){return p(this.value)}_withUpdatedDate(e){return`${e}T${m(this.value)||`00:00:00`}`}get _timeValue(){return m(this.value)}_withUpdatedTime(e){return`${p(this.value)||u.c()}T${e}`}constructor(){super(),this._isValidValue=h,this._textFieldSize=`30`,this.proxy.type=`datetime-local`,this.proxy.step=`1`,this.min=``,this.minDate=``,this.minTime=``,this.max=``,this.maxDate=``,this.maxTime=``}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.dateTimePicker.invalidDateTimeError:this._dateValue()&&this._resolvedMinDate&&u.s(this._dateValue(),this._resolvedMinDate)<0?this.locale.dateTimePicker.dateBeforeMinDateError(u.a(this._resolvedMinDate,this.locale.calendarPicker)):this._dateValue()&&this._resolvedMaxDate&&u.s(this._dateValue(),this._resolvedMaxDate)>0?this.locale.dateTimePicker.dateAfterMaxDateError(u.a(this._resolvedMaxDate,this.locale.calendarPicker)):this._timeValue&&this._resolvedMinTime&&s.c(this._timeValue,this._resolvedMinTime)<0?this.locale.dateTimePicker.timeBeforeMinTimeError(s.i(this._resolvedMinTime,this._displaySeconds,this._use12hClock)):this._timeValue&&this._resolvedMaxTime&&s.c(this._timeValue,this._resolvedMaxTime)>0?this.locale.dateTimePicker.timeAfterMaxTimeError(s.i(this._resolvedMaxTime,this._displaySeconds,this._use12hClock)):null}get _textFieldPlaceholder(){return`${this.locale.calendarPicker.dateFormatPlaceholder} ${this._timePlaceholder}`}get _pickerButtonLabel(){return this.value?this.locale.dateTimePicker.changeDateTimeLabel(this._toPresentationValue(this.value)):this.locale.dateTimePicker.chooseDateTimeLabel}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll(`#inline-time-picker, button, .vwc-button`)}get _pickerButtonIcon(){return`calendar-clock-line`}get _dialogLabel(){return this.locale.dateTimePicker.chooseDateTimeLabel}};n.t([e.m({converter:v})],y.prototype,`min`,void 0),n.t([e.m({converter:s.r,attribute:`min-time`})],y.prototype,`minTime`,void 0),n.t([e.m({converter:u.r,attribute:`min-date`})],y.prototype,`minDate`,void 0),n.t([e.m({converter:v})],y.prototype,`max`,void 0),n.t([e.m({converter:s.r,attribute:`max-time`})],y.prototype,`maxTime`,void 0),n.t([e.m({converter:u.r,attribute:`max-date`})],y.prototype,`maxDate`,void 0);var b=e.u(`date-time-picker`,y,t=>o.t(t,e.p`
 			<div class="date-time-picker">
 				${()=>u.t(t)}
 				<div class="time-picker">

package/date-time-picker/index.js

@@ -1,9 +1,9 @@
 import { d as e, m as t, p as n, u as r } from "../bundled/vivid-element.js";
 import { n as i } from "../bundled/definition.js";
 import { t as a } from "../bundled/decorate.js";
-import { t as o } from "../bundled/definition6.js";
-import { t as s } from "../bundled/definition8.js";
-import { n as c } from "../bundled/definition12.js";
+import { t as o } from "../bundled/definition5.js";
+import { t as s } from "../bundled/definition7.js";
+import { n as c } from "../bundled/definition11.js";
 import { n as l, r as u, t as d } from "../bundled/picker-field.template.js";
 import { a as f, c as p, i as m, l as h, o as g, r as _, s as v, t as y } from "../bundled/time-selection-picker.template.js";
 import { t as b } from "../bundled/single-value-picker.js";
@@ -78,8 +78,6 @@ var M = ".date-time-picker{gap:28px;padding-inline-start:12px;display:flex}.time
 		return this.locale.dateTimePicker.chooseDateTimeLabel;
 	}
 };
-//#endregion
-//#region src/lib/date-time-picker/index.ts
 a([t({ converter: R })], z.prototype, "min", void 0), a([t({
 	converter: _,
 	attribute: "min-time"
@@ -92,7 +90,10 @@ a([t({ converter: R })], z.prototype, "min", void 0), a([t({
 })], z.prototype, "maxTime", void 0), a([t({
 	converter: D,
 	attribute: "max-date"
-})], z.prototype, "maxDate", void 0), e(r("date-time-picker", z, (e) => d(e, n`
+})], z.prototype, "maxDate", void 0);
+//#endregion
+//#region src/lib/date-time-picker/definition.ts
+var B = r("date-time-picker", z, (e) => d(e, n`
 			<div class="date-time-picker">
 				${() => k(e)}
 				<div class="time-picker">
@@ -116,5 +117,8 @@ a([t({ converter: R })], z.prototype, "min", void 0), a([t({
 		M
 	],
 	shadowOptions: { delegatesFocus: !0 }
-}))();
+});
+//#endregion
+//#region src/lib/date-time-picker/index.ts
+e(B)();
 //#endregion

package/dial-pad/index.cjs

@@ -1,4 +1,4 @@
-const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/repeat.cjs`),r=require(`../bundled/ref.cjs`),i=require(`../bundled/when.cjs`),a=require(`../bundled/definition.cjs`),o=require(`../bundled/decorate.cjs`),s=require(`../bundled/class-names.cjs`);require(`../bundled/key-codes.cjs`);const c=require(`../bundled/definition3.cjs`),l=require(`../bundled/icon.cjs`),u=require(`../bundled/definition6.cjs`),d=require(`../bundled/definition12.cjs`);var f=`:host{inline-size:230px;margin:16px;display:inline-block}.base{box-sizing:border-box;grid-template-rows:80px 1fr auto;display:grid}.base.no-input{grid-template-rows:1fr auto}.digits{grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(3,1fr);gap:16px;inline-size:100%;display:grid}.phone-field{grid-column:1/-1;align-self:flex-start}.digit-btn{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}@media (hover:hover){.digit-btn:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}}.digit-btn.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.digit-btn:disabled,.digit-btn.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.digit-btn{--_connotation-color-contrast:var(--vvd-dial-pad-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-soft:var(--vvd-dial-pad-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-pale:var(--vvd-dial-pad-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-dial-pad-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm-all:var(--vvd-dial-pad-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-dial-pad-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-dial-pad-accent-dim,var(--vvd-color-neutral-200));--vvd-button-accent-firm:var(--_appearance-color-text);box-shadow:0 0 0 1px var(--_appearance-color-outline);border-radius:16px;flex-direction:column;inline-size:100%;display:flex;overflow:hidden}.digit-btn:not(.disabled) .digit-btn-num{color:var(--vvd-color-canvas-text)}.digit-btn:focus-within{--focus-stroke-gap-color:transparent;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))}.call-btn{grid-column:1/-1;margin-block-start:32px}.base.size-condensed{grid-template-rows:60px 1fr auto}.base.size-condensed .digits{grid-template-rows:repeat(4,.85fr);gap:8px}.base.size-condensed .call-btn{margin-block-start:12px}.base.size-condensed .digit-btn-num{padding-top:6px}.base.size-condensed.no-letters .digit-btn-num{padding-top:0}`,p=class extends e.t(t.t){constructor(...e){super(...e),this.helperText=null,this.placeholder=null,this.value=``,this.pattern=`^[0-9#*]*$`,this.disabled=!1,this.pending=!1,this.callActive=!1,this.noCall=!1,this.noInput=!1,this.noLetters=!1,this.endCallButtonLabel=null,this.callButtonLabel=null,this.deleteAriaLabel=null,this._longPressTimeoutId=null,this._suppressNextClick=!1,this._keyboardLongPressCompleted=!1,this._onDial=()=>{this._textFieldEl.checkValidity()?this._clearErrorAnnouncement():this._announceValidationError(this._textFieldEl.errorValidationMessage??``),this.$emit(this.callActive?`end-call`:`dial`)},this.autofocus=!1,this._errorAnnouncement=``,this._forceAnnouncementToggle=!1}valueChanged(e,t){t!=null&&this._textFieldEl&&t!==this._textFieldEl.value&&(this._textFieldEl.value=t,this._textFieldEl.reportValidity())}_startLongPress(e,t){if(this.disabled||this.callActive||e!==`0`)return;this._clearLongPressTimer();let n=t.currentTarget;this._longPressTimeoutId=window.setTimeout(()=>{this._suppressNextClick=!0,this.value+=`+`,this.$emit(`keypad-click`,n),this.$emit(`input`),this.$emit(`change`)},600)}_startKeyboardLongPress(){this.disabled||this.callActive||this._longPressTimeoutId===null&&(this._keyboardLongPressCompleted=!1,this._longPressTimeoutId=window.setTimeout(()=>{this._keyboardLongPressCompleted=!0,this.value+=`+`,this.$emit(`input`),this.$emit(`change`)},650))}_endLongPress(){this._clearLongPressTimer(),window.setTimeout(()=>{this._suppressNextClick&&=!1},0)}_endKeyboardLongPress(){let e=this._keyboardLongPressCompleted;return this._clearLongPressTimer(),window.setTimeout(()=>{this._keyboardLongPressCompleted=!1},0),e}_cancelLongPress(){this._clearLongPressTimer()}_clearLongPressTimer(){this._longPressTimeoutId!==null&&(clearTimeout(this._longPressTimeoutId),this._longPressTimeoutId=null)}focus(){let e=this.shadowRoot?.querySelectorAll(`.digits .digit-btn`);(this._textFieldEl||e?.[0])?.focus()}_announceValidationError(e){this._errorAnnouncement=``,window.queueMicrotask(()=>{e?(this._forceAnnouncementToggle=!this._forceAnnouncementToggle,this._errorAnnouncement=`${e}${this._forceAnnouncementToggle?`​`:``}`):this._clearErrorAnnouncement()})}_clearErrorAnnouncement(){this._errorAnnouncement=``,this._forceAnnouncementToggle=!1}};o.t([t.m({attribute:`helper-text`})],p.prototype,`helperText`,void 0),o.t([t.m],p.prototype,`placeholder`,void 0),o.t([t.m({mode:`fromView`})],p.prototype,`value`,void 0),o.t([t.m({mode:`fromView`})],p.prototype,`pattern`,void 0),o.t([t.m({mode:`boolean`})],p.prototype,`disabled`,void 0),o.t([t.m({mode:`boolean`})],p.prototype,`pending`,void 0),o.t([t.m({attribute:`call-active`,mode:`boolean`})],p.prototype,`callActive`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-call`})],p.prototype,`noCall`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-input`})],p.prototype,`noInput`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-letters`})],p.prototype,`noLetters`,void 0),o.t([t.m],p.prototype,`size`,void 0),o.t([t.m({attribute:`end-call-button-label`})],p.prototype,`endCallButtonLabel`,void 0),o.t([t.m({attribute:`call-button-label`})],p.prototype,`callButtonLabel`,void 0),o.t([t.m({attribute:`delete-aria-label`})],p.prototype,`deleteAriaLabel`,void 0),o.t([t.m({mode:`boolean`})],p.prototype,`autofocus`,void 0),o.t([t.A],p.prototype,`_errorAnnouncement`,void 0);var m=[{value:`1`,letters:`\xA0`,ariaLabel:`digitOneLabel`,icon:`one-solid`,id:`btn1`},{value:`2`,letters:`ABC`,ariaLabel:`digitTwoLabel`,icon:`two-solid`,id:`btn2`},{value:`3`,letters:`DEF`,ariaLabel:`digitThreeLabel`,icon:`three-solid`,id:`btn3`},{value:`4`,letters:`GHI`,ariaLabel:`digitFourLabel`,icon:`four-solid`,id:`btn4`},{value:`5`,letters:`JKL`,ariaLabel:`digitFiveLabel`,icon:`five-solid`,id:`btn5`},{value:`6`,letters:`MNO`,ariaLabel:`digitSixLabel`,icon:`six-solid`,id:`btn6`},{value:`7`,letters:`PQRS`,ariaLabel:`digitSevenLabel`,icon:`seven-solid`,id:`btn7`},{value:`8`,letters:`TUV`,ariaLabel:`digitEightLabel`,icon:`eight-solid`,id:`btn8`},{value:`9`,letters:`WXYZ`,ariaLabel:`digitNineLabel`,icon:`nine-solid`,id:`btn9`},{value:`*`,ariaLabel:`digitAsteriskLabel`,icon:`asterisk-2-solid`,id:`btnAsterisk`},{value:`0`,alwaysVisibleLetters:`+`,ariaLabel:`digitZeroLabel`,icon:`zero-solid`,id:`btn0`},{value:`#`,ariaLabel:`digitHashtagLabel`,icon:`hashtag-solid`,id:`btnHashtag`}];function h(e,t){if(t.key===`Enter`&&!e.pending&&!e.disabled&&!e.callActive&&!e.noCall&&e.value.length>0&&t.target instanceof HTMLInputElement)e._onDial();else if(t.key===` `||t.key===`Space`)t.target instanceof HTMLInputElement&&(t.preventDefault(),t.repeat||e._startKeyboardLongPress());else{let n=m.findIndex(e=>e.value===t.key);if(n>-1){let t=e.shadowRoot.querySelector(`.digits`).children[n];t&&(t.active=!0,setTimeout(()=>{t.active=!1},200))}}return!0}function g(e,t){return(t.key===` `||t.key===`Space`)&&t.target instanceof HTMLInputElement&&(t.preventDefault(),!e._endKeyboardLongPress()&&!e.disabled&&!e.callActive&&(e.value+=` `,e.$emit(`input`),e.$emit(`change`))),!0}function _(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),n.repeat||t._startKeyboardLongPress()),!0}function v(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),!t._endKeyboardLongPress()&&!t.disabled&&!t.callActive&&C(e,{parent:t,event:new MouseEvent(`click`,{bubbles:!0})})),!0}function y(e){e.value=e._textFieldEl.value}function b(e,{event:t}){t.stopImmediatePropagation()}function x(e){e.value=e.value.slice(0,-1),e.$emit(`input`),e.$emit(`change`),e.value===``&&e._textFieldEl?.focus()}function S(e,n){return t.p`<${e} ${r.t(`_textFieldEl`)} class="phone-field" internal-part type="tel"
+const e=require("../bundled/localized.cjs"),t=require("../bundled/vivid-element.cjs"),n=require("../bundled/repeat.cjs"),r=require("../bundled/ref.cjs"),i=require("../bundled/when.cjs"),a=require("../bundled/definition.cjs"),o=require("../bundled/decorate.cjs"),s=require("../bundled/class-names.cjs");require("../bundled/key-codes.cjs");const c=require("../bundled/definition2.cjs"),l=require("../bundled/icon.cjs"),u=require("../bundled/definition5.cjs"),d=require("../bundled/definition11.cjs");var f=`:host{inline-size:230px;margin:16px;display:inline-block}.base{box-sizing:border-box;grid-template-rows:80px 1fr auto;display:grid}.base.no-input{grid-template-rows:1fr auto}.digits{grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(3,1fr);gap:16px;inline-size:100%;display:grid}.phone-field{grid-column:1/-1;align-self:flex-start}.digit-btn{--vvd-button-accent-firm:var(--_appearance-color-text);box-shadow:0 0 0 1px var(--_appearance-color-outline);border-radius:16px;flex-direction:column;inline-size:100%;display:flex;overflow:hidden}.digit-btn:not(.disabled) .digit-btn-num{color:var(--vvd-color-canvas-text)}.digit-btn:focus-within{--focus-stroke-gap-color:transparent;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))}.call-btn{grid-column:1/-1;margin-block-start:32px}.base.size-condensed{grid-template-rows:60px 1fr auto}.base.size-condensed .digits{grid-template-rows:repeat(4,.85fr);gap:8px}.base.size-condensed .call-btn{margin-block-start:12px}.base.size-condensed .digit-btn-num{padding-top:6px}.base.size-condensed.no-letters .digit-btn-num{padding-top:0}`,p=class extends e.t(t.t){constructor(...e){super(...e),this.helperText=null,this.placeholder=null,this.value=``,this.pattern=`^[0-9#*]*$`,this.disabled=!1,this.pending=!1,this.callActive=!1,this.noCall=!1,this.noInput=!1,this.noLetters=!1,this.endCallButtonLabel=null,this.callButtonLabel=null,this.deleteAriaLabel=null,this._longPressTimeoutId=null,this._suppressNextClick=!1,this._keyboardLongPressCompleted=!1,this._onDial=()=>{this._textFieldEl.checkValidity()?this._clearErrorAnnouncement():this._announceValidationError(this._textFieldEl.errorValidationMessage??``),this.$emit(this.callActive?`end-call`:`dial`)},this.autofocus=!1,this._errorAnnouncement=``,this._forceAnnouncementToggle=!1}valueChanged(e,t){t!=null&&this._textFieldEl&&t!==this._textFieldEl.value&&(this._textFieldEl.value=t,this._textFieldEl.reportValidity())}_startLongPress(e,t){if(this.disabled||this.callActive||e!==`0`)return;this._clearLongPressTimer();let n=t.currentTarget;this._longPressTimeoutId=window.setTimeout(()=>{this._suppressNextClick=!0,this.value+=`+`,this.$emit(`keypad-click`,n),this.$emit(`input`),this.$emit(`change`)},600)}_startKeyboardLongPress(){this.disabled||this.callActive||this._longPressTimeoutId===null&&(this._keyboardLongPressCompleted=!1,this._longPressTimeoutId=window.setTimeout(()=>{this._keyboardLongPressCompleted=!0,this.value+=`+`,this.$emit(`input`),this.$emit(`change`)},650))}_endLongPress(){this._clearLongPressTimer(),window.setTimeout(()=>{this._suppressNextClick&&=!1},0)}_endKeyboardLongPress(){let e=this._keyboardLongPressCompleted;return this._clearLongPressTimer(),window.setTimeout(()=>{this._keyboardLongPressCompleted=!1},0),e}_cancelLongPress(){this._clearLongPressTimer()}_clearLongPressTimer(){this._longPressTimeoutId!==null&&(clearTimeout(this._longPressTimeoutId),this._longPressTimeoutId=null)}focus(){let e=this.shadowRoot?.querySelectorAll(`.digits .digit-btn`);(this._textFieldEl||e?.[0])?.focus()}_announceValidationError(e){this._errorAnnouncement=``,window.queueMicrotask(()=>{e?(this._forceAnnouncementToggle=!this._forceAnnouncementToggle,this._errorAnnouncement=`${e}${this._forceAnnouncementToggle?`​`:``}`):this._clearErrorAnnouncement()})}_clearErrorAnnouncement(){this._errorAnnouncement=``,this._forceAnnouncementToggle=!1}};o.t([t.m({attribute:`helper-text`})],p.prototype,`helperText`,void 0),o.t([t.m],p.prototype,`placeholder`,void 0),o.t([t.m({mode:`fromView`})],p.prototype,`value`,void 0),o.t([t.m({mode:`fromView`})],p.prototype,`pattern`,void 0),o.t([t.m({mode:`boolean`})],p.prototype,`disabled`,void 0),o.t([t.m({mode:`boolean`})],p.prototype,`pending`,void 0),o.t([t.m({attribute:`call-active`,mode:`boolean`})],p.prototype,`callActive`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-call`})],p.prototype,`noCall`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-input`})],p.prototype,`noInput`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-letters`})],p.prototype,`noLetters`,void 0),o.t([t.m],p.prototype,`size`,void 0),o.t([t.m({attribute:`end-call-button-label`})],p.prototype,`endCallButtonLabel`,void 0),o.t([t.m({attribute:`call-button-label`})],p.prototype,`callButtonLabel`,void 0),o.t([t.m({attribute:`delete-aria-label`})],p.prototype,`deleteAriaLabel`,void 0),o.t([t.m({mode:`boolean`})],p.prototype,`autofocus`,void 0),o.t([t.A],p.prototype,`_errorAnnouncement`,void 0);var m=[{value:`1`,letters:`\xA0`,ariaLabel:`digitOneLabel`,icon:`one-solid`,id:`btn1`},{value:`2`,letters:`ABC`,ariaLabel:`digitTwoLabel`,icon:`two-solid`,id:`btn2`},{value:`3`,letters:`DEF`,ariaLabel:`digitThreeLabel`,icon:`three-solid`,id:`btn3`},{value:`4`,letters:`GHI`,ariaLabel:`digitFourLabel`,icon:`four-solid`,id:`btn4`},{value:`5`,letters:`JKL`,ariaLabel:`digitFiveLabel`,icon:`five-solid`,id:`btn5`},{value:`6`,letters:`MNO`,ariaLabel:`digitSixLabel`,icon:`six-solid`,id:`btn6`},{value:`7`,letters:`PQRS`,ariaLabel:`digitSevenLabel`,icon:`seven-solid`,id:`btn7`},{value:`8`,letters:`TUV`,ariaLabel:`digitEightLabel`,icon:`eight-solid`,id:`btn8`},{value:`9`,letters:`WXYZ`,ariaLabel:`digitNineLabel`,icon:`nine-solid`,id:`btn9`},{value:`*`,ariaLabel:`digitAsteriskLabel`,icon:`asterisk-2-solid`,id:`btnAsterisk`},{value:`0`,alwaysVisibleLetters:`+`,ariaLabel:`digitZeroLabel`,ariaDescription:`digitZeroDescription`,icon:`zero-solid`,id:`btn0`},{value:`#`,ariaLabel:`digitHashtagLabel`,icon:`hashtag-solid`,id:`btnHashtag`}];function h(e,t){if(t.key===`Enter`&&!e.pending&&!e.disabled&&!e.callActive&&!e.noCall&&e.value.length>0&&t.target instanceof HTMLInputElement)e._onDial();else if(t.key===` `||t.key===`Space`)t.target instanceof HTMLInputElement&&(t.preventDefault(),t.repeat||e._startKeyboardLongPress());else{let n=m.findIndex(e=>e.value===t.key);if(n>-1){let t=e.shadowRoot.querySelector(`.digits`).children[n];t&&(t.active=!0,setTimeout(()=>{t.active=!1},200))}}return!0}function g(e,t){return(t.key===` `||t.key===`Space`)&&t.target instanceof HTMLInputElement&&(t.preventDefault(),!e._endKeyboardLongPress()&&!e.disabled&&!e.callActive&&(e.value+=` `,e.$emit(`input`),e.$emit(`change`))),!0}function _(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),n.repeat||t._startKeyboardLongPress()),!0}function v(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),!t._endKeyboardLongPress()&&!t.disabled&&!t.callActive&&C(e,{parent:t,event:new MouseEvent(`click`,{bubbles:!0})})),!0}function y(e){e.value=e._textFieldEl.value}function b(e,{event:t}){t.stopImmediatePropagation()}function x(e){e.value=e.value.slice(0,-1),e.$emit(`input`),e.$emit(`change`),e.value===``&&e._textFieldEl?.focus()}function S(e,n){return t.p`<${e} ${r.t(`_textFieldEl`)} class="phone-field" internal-part type="tel"
         value="${e=>e.value}" placeholder="${e=>e.placeholder}"
             ?disabled="${e=>e.disabled}" helper-text="${e=>e.helperText}" pattern="${e=>e.pattern}"
             aria-label="${e=>e.locale.dialPad.inputLabel}"
@@ -30,9 +30,10 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 					  shape="pill"
 					  label="${(e,t)=>(t.parent.noLetters?null:e.letters)??e.alwaysVisibleLetters}"
 					  size='condensed'
-					  class="digit-btn"
+					  class="digit-btn connotation-accent appearance-duotone with-idle with-hover with-disabled"
 						?autofocus="${(e,t)=>t.parent.autofocus&&t.parent.noInput&&t.index===0}"
-					  aria-label="${(e,t)=>t.parent.noLetters?e.value:t.parent.locale.dialPad[e.ariaLabel]}"
+					  aria-label="${(e,t)=>t.parent.noLetters&&e.letters?e.value:t.parent.locale.dialPad[e.ariaLabel]}"
+					  aria-description="${(e,t)=>e.ariaDescription?t.parent.locale.dialPad[e.ariaDescription]:null}"
 					  ?disabled="${(e,t)=>t.parent.disabled}"
 					  @pointerdown="${(e,t)=>t.parent._startLongPress(e.value,t.event)}"
 					  @pointerup="${(e,t)=>t.parent._endLongPress()}"

package/dial-pad/index.js

@@ -7,12 +7,12 @@ import { n as u, r as d } from "../bundled/definition.js";
 import { t as f } from "../bundled/decorate.js";
 import { t as p } from "../bundled/class-names.js";
 import "../bundled/key-codes.js";
-import { t as m } from "../bundled/definition3.js";
+import { t as m } from "../bundled/definition2.js";
 import { t as h } from "../bundled/icon.js";
-import { i as g, t as _ } from "../bundled/definition6.js";
-import { n as v, r as y } from "../bundled/definition12.js";
+import { i as g, t as _ } from "../bundled/definition5.js";
+import { n as v, r as y } from "../bundled/definition11.js";
 //#region src/lib/dial-pad/dial-pad.scss?inline
-var b = ":host{inline-size:230px;margin:16px;display:inline-block}.base{box-sizing:border-box;grid-template-rows:80px 1fr auto;display:grid}.base.no-input{grid-template-rows:1fr auto}.digits{grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(3,1fr);gap:16px;inline-size:100%;display:grid}.phone-field{grid-column:1/-1;align-self:flex-start}.digit-btn{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}@media (hover:hover){.digit-btn:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}}.digit-btn.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.digit-btn:disabled,.digit-btn.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.digit-btn{--_connotation-color-contrast:var(--vvd-dial-pad-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-soft:var(--vvd-dial-pad-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-pale:var(--vvd-dial-pad-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-dial-pad-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm-all:var(--vvd-dial-pad-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-dial-pad-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-dial-pad-accent-dim,var(--vvd-color-neutral-200));--vvd-button-accent-firm:var(--_appearance-color-text);box-shadow:0 0 0 1px var(--_appearance-color-outline);border-radius:16px;flex-direction:column;inline-size:100%;display:flex;overflow:hidden}.digit-btn:not(.disabled) .digit-btn-num{color:var(--vvd-color-canvas-text)}.digit-btn:focus-within{--focus-stroke-gap-color:transparent;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))}.call-btn{grid-column:1/-1;margin-block-start:32px}.base.size-condensed{grid-template-rows:60px 1fr auto}.base.size-condensed .digits{grid-template-rows:repeat(4,.85fr);gap:8px}.base.size-condensed .call-btn{margin-block-start:12px}.base.size-condensed .digit-btn-num{padding-top:6px}.base.size-condensed.no-letters .digit-btn-num{padding-top:0}", x = class extends e(a) {
+var b = ":host{inline-size:230px;margin:16px;display:inline-block}.base{box-sizing:border-box;grid-template-rows:80px 1fr auto;display:grid}.base.no-input{grid-template-rows:1fr auto}.digits{grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(3,1fr);gap:16px;inline-size:100%;display:grid}.phone-field{grid-column:1/-1;align-self:flex-start}.digit-btn{--vvd-button-accent-firm:var(--_appearance-color-text);box-shadow:0 0 0 1px var(--_appearance-color-outline);border-radius:16px;flex-direction:column;inline-size:100%;display:flex;overflow:hidden}.digit-btn:not(.disabled) .digit-btn-num{color:var(--vvd-color-canvas-text)}.digit-btn:focus-within{--focus-stroke-gap-color:transparent;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))}.call-btn{grid-column:1/-1;margin-block-start:32px}.base.size-condensed{grid-template-rows:60px 1fr auto}.base.size-condensed .digits{grid-template-rows:repeat(4,.85fr);gap:8px}.base.size-condensed .call-btn{margin-block-start:12px}.base.size-condensed .digit-btn-num{padding-top:6px}.base.size-condensed.no-letters .digit-btn-num{padding-top:0}", x = class extends e(a) {
 	constructor(...e) {
 		super(...e), this.helperText = null, this.placeholder = null, this.value = "", this.pattern = "^[0-9#*]*$", this.disabled = !1, this.pending = !1, this.callActive = !1, this.noCall = !1, this.noInput = !1, this.noLetters = !1, this.endCallButtonLabel = null, this.callButtonLabel = null, this.deleteAriaLabel = null, this._longPressTimeoutId = null, this._suppressNextClick = !1, this._keyboardLongPressCompleted = !1, this._onDial = () => {
 			this._textFieldEl.checkValidity() ? this._clearErrorAnnouncement() : this._announceValidationError(this._textFieldEl.errorValidationMessage ?? ""), this.$emit(this.callActive ? "end-call" : "dial");
@@ -153,6 +153,7 @@ var S = [
 		value: "0",
 		alwaysVisibleLetters: "+",
 		ariaLabel: "digitZeroLabel",
+		ariaDescription: "digitZeroDescription",
 		icon: "zero-solid",
 		id: "btn0"
 	},
@@ -244,9 +245,10 @@ function M(e, t) {
 					  shape="pill"
 					  label="${(e, t) => (t.parent.noLetters ? null : e.letters) ?? e.alwaysVisibleLetters}"
 					  size='condensed'
-					  class="digit-btn"
+					  class="digit-btn connotation-accent appearance-duotone with-idle with-hover with-disabled"
 						?autofocus="${(e, t) => t.parent.autofocus && t.parent.noInput && t.index === 0}"
-					  aria-label="${(e, t) => t.parent.noLetters ? e.value : t.parent.locale.dialPad[e.ariaLabel]}"
+					  aria-label="${(e, t) => t.parent.noLetters && e.letters ? e.value : t.parent.locale.dialPad[e.ariaLabel]}"
+					  aria-description="${(e, t) => e.ariaDescription ? t.parent.locale.dialPad[e.ariaDescription] : null}"
 					  ?disabled="${(e, t) => t.parent.disabled}"
 					  @pointerdown="${(e, t) => t.parent._startLongPress(e.value, t.event)}"
 					  @pointerup="${(e, t) => t.parent._endLongPress()}"
@@ -286,8 +288,8 @@ function P(e) {
 	</${e}>`;
 }
 //#endregion
-//#region src/lib/dial-pad/index.ts
-n(o("dial-pad", x, (e) => {
+//#region src/lib/dial-pad/definition.ts
+var F = o("dial-pad", x, (e) => {
 	let t = e.tagFor(g), n = e.tagFor(h), r = e.tagFor(y), a = e.tagFor(d);
 	return i` <div
 		class="${(e) => p("base", [`size-${e.size}`, !!e.size], ["no-input", e.noInput], ["no-letters", e.noLetters])}"
@@ -302,5 +304,8 @@ n(o("dial-pad", x, (e) => {
 	v,
 	m,
 	u
-], { styles: b }))();
+], { styles: b });
+//#endregion
+//#region src/lib/dial-pad/index.ts
+n(F)();
 //#endregion

package/dialog/index.cjs

@@ -1,4 +1,4 @@
-const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/slotted.cjs`),r=require(`../bundled/when.cjs`),i=require(`../bundled/decorate.cjs`),a=require(`../bundled/class-names.cjs`),o=require(`../bundled/definition3.cjs`),s=require(`../bundled/icon.cjs`),c=require(`../bundled/delegates-aria.cjs`),l=require(`../bundled/definition6.cjs`),u=require(`../bundled/definition7.cjs`),d=require(`../bundled/dialog.cjs`);var f=`.base{white-space:initial;box-sizing:border-box;color:var(--vvd-color-canvas-text);max-block-size:none;max-inline-size:var(--dialog-max-inline-size,var(--_dialog-default-max-inline-size));min-block-size:fit-content;min-inline-size:var(--dialog-min-inline-size,280px);background-color:#0000;border:none;border-radius:8px;padding:0}@media not all and (width>=600px){.base{--_dialog-default-max-inline-size:90vw}}@media (width>=600px){.base{--_dialog-default-max-inline-size:560px}}.base:not(.scrollable-body){max-block-size:var(--dialog-max-block-size,calc(100vh - 64px))}.base:not(.modal){z-index:var(--dialog-z-index,1);inset-block:var(--dialog-inset-block,auto);inset-inline:var(--dialog-inset-inline,0)}.base.modal{box-shadow:0 4px 20px #00000059}.base.modal::backdrop{background-color:var(--vvd-color-canvas-text,currentColor);opacity:.5}.base: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))}.main-wrapper{box-sizing:border-box;flex-direction:column;gap:24px;padding-block:24px;display:flex}.main-wrapper>*{box-sizing:border-box}.header{justify-content:space-between;align-items:flex-start;inline-size:100%;padding-inline:24px;display:grid}.base:not(.icon-placement-side) .header{grid-template-rows:auto auto auto;grid-template-columns:1fr auto}.base:not(.icon-placement-side) .header .icon{font-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));grid-area:1/1/2/2;margin-block-end:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));line-height:1}.base.icon-placement-side .header{grid-template-rows:auto auto;grid-template-columns:auto 1fr auto}.base.icon-placement-side .header .icon{font-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.base.icon-placement-side .header ::slotted(*),.base.icon-placement-side .header .icon{grid-area:1/1/-1/2;margin-inline-end:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2)}.header.border{position:relative}.header.border:after{background-color:var(--vvd-color-neutral-200);content:"";block-size:1px;inline-size:100%;position:absolute;bottom:-24px;left:0}.base.hide-body .header.border:after{content:none}.body:not(.full-width){padding-inline:24px}.hide-body .body{display:none}.scrollable-body .body{max-block-size:var(--dialog-body-max-block-size,300px);--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin;overflow:hidden auto}.scrollable-body .body ::-webkit-scrollbar{width:4px}.scrollable-body .body ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.scrollable-body .body ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.footer{justify-content:space-between;align-items:center;gap:24px;padding-inline:24px;display:flex}.hide-footer .footer{display:none}.footer .actions{align-self:flex-end;gap:8px;display:flex}.dismiss-button{flex-shrink:0;grid-area:1/-2/-1/-1;margin-block-start:-8px;margin-inline:4px -8px}.headline{font:var(--vvd-typography-heading-4);margin:0}.subtitle{font:var(--vvd-typography-base);margin:0}slot[name=main]{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}slot[name=main] ::-webkit-scrollbar{width:4px}slot[name=main] ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}slot[name=main] ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}slot[name=main]{max-width:inherit;max-height:inherit;border-radius:inherit;display:block;overflow:hidden auto}`,p=class extends e.t(c.t(t.t)){constructor(...e){super(...e),this.open=!1,this.fullWidthBody=!1,this.dismissButtonAriaLabel=null,this.noLightDismiss=!1,this.noDismissOnEsc=!1,this.noDismissButton=!1,this.nonDismissible=!1,this.modal=!1,this.scrollableBody=!1,this._openedAsModal=!1,this.#r=e=>{if(e.target!==this.#t||!this.#n(`light-dismiss`))return;let t=this.#t.getBoundingClientRect();t.top<=e.clientY&&e.clientY<=t.top+t.height&&t.left<=e.clientX&&e.clientX<=t.left+t.width||this._handleCloseRequest()},this.#i=e=>{e.target.method===`dialog`&&(this.open=!1)}}modalChanged(e,t){this.open&&(this._openedAsModal=t,this.$fastController.isConnected&&(this.#a(),this.#o()))}set returnValue(e){this.#t&&(this.#t.returnValue=e)}get returnValue(){return this.#t?.returnValue}#e;get#t(){return this.#e||=this.shadowRoot.querySelector(`dialog`),this.#e}openChanged(e,t){e!==void 0&&(t?(this._openedAsModal=this._openedAsModal||this.modal,this.$fastController.isConnected&&this.#o(),this.$emit(`open`,void 0,{bubbles:!1})):(this._openedAsModal=!1,this.$fastController.isConnected&&this.#a(),this.$emit(`close`,this.returnValue,{bubbles:!1})))}get _showDismissButton(){return this.#n(`dismiss-button`)}#n(e){if(this.nonDismissible)return!1;switch(e){case`escape`:return!this.noDismissOnEsc;case`dismiss-button`:return!this.noDismissButton;case`light-dismiss`:return!this.noLightDismiss}}#r;#i;_onKeyDown(e){return d.t(e)&&this._openedAsModal?(this.#n(`escape`)&&this._handleCloseRequest(),!1):!0}_handleCloseRequest(){this.$emit(`cancel`,void 0,{bubbles:!1,cancelable:!0})&&(this.open=!1)}close(){this.open=!1}show(){if(this._openedAsModal&&!this.modal)throw new DOMException(`Failed to execute 'show' on 'Dialog': The dialog is already open as a modal dialog, and therefore cannot be opened as a non-modal dialog.`,`InvalidStateError`);this.open=!0}showModal(){if(this.open&&!this._openedAsModal)throw new DOMException(`Failed to execute 'showModal' on 'Dialog': The dialog is already open as a non-modal dialog, and therefore cannot be opened as a modal dialog.`,`InvalidStateError`);this._openedAsModal=!0,this.open=!0}#a(){this.#t.close()}#o(){this._openedAsModal?this.#t.showModal():this.#t.show()}connectedCallback(){super.connectedCallback(),this.open&&this.#o(),this.#t.addEventListener(`mousedown`,this.#r),this.#t.addEventListener(`submit`,this.#i)}disconnectedCallback(){super.disconnectedCallback(),this.open&&this.#a(),this.#t.removeEventListener(`mousedown`,this.#r),this.#t.removeEventListener(`submit`,this.#i)}};i.t([t.m({mode:`boolean`})],p.prototype,`open`,void 0),i.t([t.m],p.prototype,`icon`,void 0),i.t([t.m({attribute:`icon-placement`})],p.prototype,`iconPlacement`,void 0),i.t([t.m],p.prototype,`subtitle`,void 0),i.t([t.m],p.prototype,`headline`,void 0),i.t([t.m({attribute:`full-width-body`,mode:`boolean`})],p.prototype,`fullWidthBody`,void 0),i.t([t.m({attribute:`dismiss-button-aria-label`})],p.prototype,`dismissButtonAriaLabel`,void 0),i.t([t.m({attribute:`no-light-dismiss`,mode:`boolean`})],p.prototype,`noLightDismiss`,void 0),i.t([t.m({attribute:`no-dismiss-on-esc`,mode:`boolean`})],p.prototype,`noDismissOnEsc`,void 0),i.t([t.m({attribute:`no-dismiss-button`,mode:`boolean`})],p.prototype,`noDismissButton`,void 0),i.t([t.m({attribute:`non-dismissible`,mode:`boolean`})],p.prototype,`nonDismissible`,void 0),i.t([t.m({mode:`boolean`})],p.prototype,`modal`,void 0),i.t([t.m({mode:`boolean`,attribute:`scrollable-body`})],p.prototype,`scrollableBody`,void 0),i.t([t.A],p.prototype,`_openedAsModal`,void 0),i.t([t.A],p.prototype,`bodySlottedContent`,void 0),i.t([t.A],p.prototype,`footerSlottedContent`,void 0),i.t([t.A],p.prototype,`actionItemsSlottedContent`,void 0);function m(e){return t.p`
+const e=require("../bundled/localized.cjs"),t=require("../bundled/vivid-element.cjs"),n=require("../bundled/slotted.cjs"),r=require("../bundled/when.cjs"),i=require("../bundled/decorate.cjs"),a=require("../bundled/class-names.cjs"),o=require("../bundled/definition2.cjs"),s=require("../bundled/icon.cjs"),c=require("../bundled/delegates-aria.cjs"),l=require("../bundled/definition5.cjs"),u=require("../bundled/definition6.cjs"),d=require("../bundled/dialog.cjs");var f=`.base{white-space:initial;box-sizing:border-box;color:var(--vvd-color-canvas-text);max-block-size:none;max-inline-size:var(--dialog-max-inline-size,var(--_dialog-default-max-inline-size));min-block-size:fit-content;min-inline-size:var(--dialog-min-inline-size,280px);background-color:#0000;border:none;border-radius:8px;padding:0}@media not all and (width>=600px){.base{--_dialog-default-max-inline-size:90vw}}@media (width>=600px){.base{--_dialog-default-max-inline-size:560px}}.base:not(.scrollable-body){max-block-size:var(--dialog-max-block-size,calc(100vh - 64px))}.base:not(.modal){z-index:var(--dialog-z-index,1);inset-block:var(--dialog-inset-block,auto);inset-inline:var(--dialog-inset-inline,0)}.base.modal{box-shadow:0 4px 20px #00000059}.base.modal::backdrop{background-color:var(--vvd-color-canvas-text,currentColor);opacity:.5}.base: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))}.main-wrapper{box-sizing:border-box;flex-direction:column;gap:24px;padding-block:24px;display:flex}.main-wrapper>*{box-sizing:border-box}.header{justify-content:space-between;align-items:flex-start;inline-size:100%;padding-inline:24px;display:grid}.base:not(.icon-placement-side) .header{grid-template-rows:auto auto auto;grid-template-columns:1fr auto}.base:not(.icon-placement-side) .header .icon{font-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));grid-area:1/1/2/2;margin-block-end:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));line-height:1}.base.icon-placement-side .header{grid-template-rows:auto auto;grid-template-columns:auto 1fr auto}.base.icon-placement-side .header .icon{font-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.base.icon-placement-side .header ::slotted(*),.base.icon-placement-side .header .icon{grid-area:1/1/-1/2;margin-inline-end:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2)}.header.border{position:relative}.header.border:after{background-color:var(--vvd-color-neutral-200);content:"";block-size:1px;inline-size:100%;position:absolute;bottom:-24px;left:0}.base.hide-body .header.border:after{content:none}.body:not(.full-width){padding-inline:24px}.hide-body .body{display:none}.scrollable-body .body{max-block-size:var(--dialog-body-max-block-size,300px);--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin;overflow:hidden auto}.scrollable-body .body ::-webkit-scrollbar{width:4px}.scrollable-body .body ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.scrollable-body .body ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.footer{justify-content:space-between;align-items:center;gap:24px;padding-inline:24px;display:flex}.hide-footer .footer{display:none}.footer .actions{align-self:flex-end;gap:8px;display:flex}.dismiss-button{flex-shrink:0;grid-area:1/-2/-1/-1;margin-block-start:-8px;margin-inline:4px -8px}.headline{font:var(--vvd-typography-heading-4);margin:0}.subtitle{font:var(--vvd-typography-base);margin:0}slot[name=main]{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}slot[name=main] ::-webkit-scrollbar{width:4px}slot[name=main] ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}slot[name=main] ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}slot[name=main]{max-width:inherit;max-height:inherit;border-radius:inherit;display:block;overflow:hidden auto}`,p=class extends e.t(c.t(t.t)){constructor(...e){super(...e),this.open=!1,this.fullWidthBody=!1,this.dismissButtonAriaLabel=null,this.noLightDismiss=!1,this.noDismissOnEsc=!1,this.noDismissButton=!1,this.nonDismissible=!1,this.modal=!1,this.scrollableBody=!1,this._openedAsModal=!1,this.#r=e=>{if(e.target!==this.#t||!this.#n(`light-dismiss`))return;let t=this.#t.getBoundingClientRect();t.top<=e.clientY&&e.clientY<=t.top+t.height&&t.left<=e.clientX&&e.clientX<=t.left+t.width||this._handleCloseRequest()},this.#i=e=>{e.target.method===`dialog`&&(this.open=!1)}}modalChanged(e,t){this.open&&(this._openedAsModal=t,this.$fastController.isConnected&&(this.#a(),this.#o()))}set returnValue(e){this.#t&&(this.#t.returnValue=e)}get returnValue(){return this.#t?.returnValue}#e;get#t(){return this.#e||=this.shadowRoot.querySelector(`dialog`),this.#e}openChanged(e,t){e!==void 0&&(t?(this._openedAsModal=this._openedAsModal||this.modal,this.$fastController.isConnected&&this.#o(),this.$emit(`open`,void 0,{bubbles:!1})):(this._openedAsModal=!1,this.$fastController.isConnected&&this.#a(),this.$emit(`close`,this.returnValue,{bubbles:!1})))}get _showDismissButton(){return this.#n(`dismiss-button`)}#n(e){if(this.nonDismissible)return!1;switch(e){case`escape`:return!this.noDismissOnEsc;case`dismiss-button`:return!this.noDismissButton;case`light-dismiss`:return!this.noLightDismiss}}#r;#i;_onKeyDown(e){return d.t(e)&&this._openedAsModal?(this.#n(`escape`)&&this._handleCloseRequest(),!1):!0}_handleCloseRequest(){this.$emit(`cancel`,void 0,{bubbles:!1,cancelable:!0})&&(this.open=!1)}close(){this.open=!1}show(){if(this._openedAsModal&&!this.modal)throw new DOMException(`Failed to execute 'show' on 'Dialog': The dialog is already open as a modal dialog, and therefore cannot be opened as a non-modal dialog.`,`InvalidStateError`);this.open=!0}showModal(){if(this.open&&!this._openedAsModal)throw new DOMException(`Failed to execute 'showModal' on 'Dialog': The dialog is already open as a non-modal dialog, and therefore cannot be opened as a modal dialog.`,`InvalidStateError`);this._openedAsModal=!0,this.open=!0}#a(){this.#t.close()}#o(){this._openedAsModal?this.#t.showModal():this.#t.show()}connectedCallback(){super.connectedCallback(),this.open&&this.#o(),this.#t.addEventListener(`mousedown`,this.#r),this.#t.addEventListener(`submit`,this.#i)}disconnectedCallback(){super.disconnectedCallback(),this.open&&this.#a(),this.#t.removeEventListener(`mousedown`,this.#r),this.#t.removeEventListener(`submit`,this.#i)}};i.t([t.m({mode:`boolean`})],p.prototype,`open`,void 0),i.t([t.m],p.prototype,`icon`,void 0),i.t([t.m({attribute:`icon-placement`})],p.prototype,`iconPlacement`,void 0),i.t([t.m],p.prototype,`subtitle`,void 0),i.t([t.m],p.prototype,`headline`,void 0),i.t([t.m({attribute:`full-width-body`,mode:`boolean`})],p.prototype,`fullWidthBody`,void 0),i.t([t.m({attribute:`dismiss-button-aria-label`})],p.prototype,`dismissButtonAriaLabel`,void 0),i.t([t.m({attribute:`no-light-dismiss`,mode:`boolean`})],p.prototype,`noLightDismiss`,void 0),i.t([t.m({attribute:`no-dismiss-on-esc`,mode:`boolean`})],p.prototype,`noDismissOnEsc`,void 0),i.t([t.m({attribute:`no-dismiss-button`,mode:`boolean`})],p.prototype,`noDismissButton`,void 0),i.t([t.m({attribute:`non-dismissible`,mode:`boolean`})],p.prototype,`nonDismissible`,void 0),i.t([t.m({mode:`boolean`})],p.prototype,`modal`,void 0),i.t([t.m({mode:`boolean`,attribute:`scrollable-body`})],p.prototype,`scrollableBody`,void 0),i.t([t.A],p.prototype,`_openedAsModal`,void 0),i.t([t.A],p.prototype,`bodySlottedContent`,void 0),i.t([t.A],p.prototype,`footerSlottedContent`,void 0),i.t([t.A],p.prototype,`actionItemsSlottedContent`,void 0);function m(e){return t.p`
 		<${e} class="icon" name="${e=>e.icon}"></${e}>
 	`}function h(){return t.p`
 		<h2 class="headline" id="dialog-headline">${e=>e.headline}</h2>

package/dialog/index.js

@@ -4,11 +4,11 @@ import { t as s } from "../bundled/slotted.js";
 import { t as c } from "../bundled/when.js";
 import { t as l } from "../bundled/decorate.js";
 import { t as u } from "../bundled/class-names.js";
-import { t as d } from "../bundled/definition3.js";
+import { t as d } from "../bundled/definition2.js";
 import { t as f } from "../bundled/icon.js";
 import { n as p, t as m } from "../bundled/delegates-aria.js";
-import { i as h, t as g } from "../bundled/definition6.js";
-import { r as _, t as v } from "../bundled/definition7.js";
+import { i as h, t as g } from "../bundled/definition5.js";
+import { r as _, t as v } from "../bundled/definition6.js";
 import { t as y } from "../bundled/dialog.js";
 //#region src/lib/dialog/dialog.scss?inline
 var b = ".base{white-space:initial;box-sizing:border-box;color:var(--vvd-color-canvas-text);max-block-size:none;max-inline-size:var(--dialog-max-inline-size,var(--_dialog-default-max-inline-size));min-block-size:fit-content;min-inline-size:var(--dialog-min-inline-size,280px);background-color:#0000;border:none;border-radius:8px;padding:0}@media not all and (width>=600px){.base{--_dialog-default-max-inline-size:90vw}}@media (width>=600px){.base{--_dialog-default-max-inline-size:560px}}.base:not(.scrollable-body){max-block-size:var(--dialog-max-block-size,calc(100vh - 64px))}.base:not(.modal){z-index:var(--dialog-z-index,1);inset-block:var(--dialog-inset-block,auto);inset-inline:var(--dialog-inset-inline,0)}.base.modal{box-shadow:0 4px 20px #00000059}.base.modal::backdrop{background-color:var(--vvd-color-canvas-text,currentColor);opacity:.5}.base: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))}.main-wrapper{box-sizing:border-box;flex-direction:column;gap:24px;padding-block:24px;display:flex}.main-wrapper>*{box-sizing:border-box}.header{justify-content:space-between;align-items:flex-start;inline-size:100%;padding-inline:24px;display:grid}.base:not(.icon-placement-side) .header{grid-template-rows:auto auto auto;grid-template-columns:1fr auto}.base:not(.icon-placement-side) .header .icon{font-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));grid-area:1/1/2/2;margin-block-end:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));line-height:1}.base.icon-placement-side .header{grid-template-rows:auto auto;grid-template-columns:auto 1fr auto}.base.icon-placement-side .header .icon{font-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.base.icon-placement-side .header ::slotted(*),.base.icon-placement-side .header .icon{grid-area:1/1/-1/2;margin-inline-end:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2)}.header.border{position:relative}.header.border:after{background-color:var(--vvd-color-neutral-200);content:\"\";block-size:1px;inline-size:100%;position:absolute;bottom:-24px;left:0}.base.hide-body .header.border:after{content:none}.body:not(.full-width){padding-inline:24px}.hide-body .body{display:none}.scrollable-body .body{max-block-size:var(--dialog-body-max-block-size,300px);--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin;overflow:hidden auto}.scrollable-body .body ::-webkit-scrollbar{width:4px}.scrollable-body .body ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.scrollable-body .body ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.footer{justify-content:space-between;align-items:center;gap:24px;padding-inline:24px;display:flex}.hide-footer .footer{display:none}.footer .actions{align-self:flex-end;gap:8px;display:flex}.dismiss-button{flex-shrink:0;grid-area:1/-2/-1/-1;margin-block-start:-8px;margin-inline:4px -8px}.headline{font:var(--vvd-typography-heading-4);margin:0}.subtitle{font:var(--vvd-typography-base);margin:0}slot[name=main]{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}slot[name=main] ::-webkit-scrollbar{width:4px}slot[name=main] ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}slot[name=main] ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}slot[name=main]{max-width:inherit;max-height:inherit;border-radius:inherit;display:block;overflow:hidden auto}", x = class extends e(m(a)) {
@@ -136,8 +136,8 @@ function E(e) {
 	></${e}>`;
 }
 //#endregion
-//#region src/lib/dialog/index.ts
-n(o("dialog", x, (e) => {
+//#region src/lib/dialog/definition.ts
+var D = o("dialog", x, (e) => {
 	let t = e.tagFor(_), n = e.tagFor(f), r = e.tagFor(h);
 	return i`
 	<${t} dp="8" not-relative>
@@ -180,5 +180,8 @@ n(o("dialog", x, (e) => {
 	d,
 	g,
 	v
-], { styles: b }))();
+], { styles: b });
+//#endregion
+//#region src/lib/dialog/index.ts
+n(D)();
 //#endregion

package/divider/index.cjs

@@ -1 +1 @@
-require(`../bundled/definition20.cjs`).n();
+require("../bundled/definition20.cjs").n();

package/elevation/definition.cjs

@@ -1,4 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_definition = require("../unbundled/definition7.cjs");
+exports.VwcElevationElement = require_definition.Elevation;
 exports.elevationDefinition = require_definition.elevationDefinition;
 exports.registerElevation = require_definition.registerElevation;

package/elevation/definition.js

@@ -1,2 +1,2 @@
-import { n as registerElevation, t as elevationDefinition } from "../unbundled/definition7.js";
-export { elevationDefinition, registerElevation };
+import { n as registerElevation, r as Elevation, t as elevationDefinition } from "../unbundled/definition7.js";
+export { Elevation as VwcElevationElement, elevationDefinition, registerElevation };

package/elevation/index.cjs

@@ -1 +1 @@
-require(`../bundled/definition7.cjs`).n();
+require("../bundled/definition6.cjs").n();

package/elevation/index.js

@@ -1,4 +1,4 @@
-import { n as e } from "../bundled/definition7.js";
+import { n as e } from "../bundled/definition6.js";
 //#region src/lib/elevation/index.ts
 e();
 //#endregion

package/empty-state/index.cjs

@@ -1,5 +1,5 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/slotted.cjs`),n=require(`../bundled/when.cjs`),r=require(`../bundled/decorate.cjs`),i=require(`../bundled/class-names.cjs`),a=require(`../bundled/definition3.cjs`),o=require(`../bundled/icon.cjs`);var s=`:host{display:block}.base.connotation-cta{--_connotation-color-firm-all:var(--vvd-empty-state-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-dim:var(--vvd-empty-state-cta-dim,var(--vvd-color-cta-200));--_connotation-color-faint:var(--vvd-empty-state-cta-faint,var(--vvd-color-cta-50));--_connotation-color-primary:var(--vvd-empty-state-cta-primary,var(--vvd-color-cta-500))}.base.connotation-success{--_connotation-color-firm-all:var(--vvd-empty-state-success-firm-all,var(--vvd-color-success-600));--_connotation-color-dim:var(--vvd-empty-state-success-dim,var(--vvd-color-success-200));--_connotation-color-faint:var(--vvd-empty-state-success-faint,var(--vvd-color-success-50));--_connotation-color-primary:var(--vvd-empty-state-success-primary,var(--vvd-color-success-500))}.base.connotation-alert{--_connotation-color-firm-all:var(--vvd-empty-state-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-dim:var(--vvd-empty-state-alert-dim,var(--vvd-color-alert-200));--_connotation-color-faint:var(--vvd-empty-state-alert-faint,var(--vvd-color-alert-50));--_connotation-color-primary:var(--vvd-empty-state-alert-primary,var(--vvd-color-alert-500))}.base.connotation-warning{--_connotation-color-firm-all:var(--vvd-empty-state-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-dim:var(--vvd-empty-state-warning-dim,var(--vvd-color-warning-200));--_connotation-color-faint:var(--vvd-empty-state-warning-faint,var(--vvd-color-warning-50));--_connotation-color-primary:var(--vvd-empty-state-warning-primary,var(--vvd-color-warning-300))}.base.connotation-information{--_connotation-color-firm-all:var(--vvd-empty-state-information-firm-all,var(--vvd-color-information-600));--_connotation-color-dim:var(--vvd-empty-state-information-dim,var(--vvd-color-information-200));--_connotation-color-faint:var(--vvd-empty-state-information-faint,var(--vvd-color-information-50));--_connotation-color-primary:var(--vvd-empty-state-information-primary,var(--vvd-color-information-500))}.base.connotation-announcement{--_connotation-color-firm-all:var(--vvd-empty-state-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-dim:var(--vvd-empty-state-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-faint:var(--vvd-empty-state-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-primary:var(--vvd-empty-state-announcement-primary,var(--vvd-color-announcement-500))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-firm-all:var(--vvd-empty-state-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-dim:var(--vvd-empty-state-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-faint:var(--vvd-empty-state-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-primary:var(--vvd-empty-state-accent-primary,var(--vvd-color-canvas-text))}.base{--_empty-state-icon-container:120px;--_empty-state-icon-background:var(--_connotation-color-faint);--_empty-state-icon-font-size:52px;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:24px;block-size:100%;display:flex}.icon-container{background-color:var(--_empty-state-icon-background);block-size:var(--_empty-state-icon-container);box-shadow:inset 0 0 0 21px color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);font-size:var(--_empty-state-icon-font-size);inline-size:var(--_empty-state-icon-container);--_empty-state-icon-background:transparent;--_empty-state-icon-font-size:40px;border-radius:50%;justify-content:center;align-items:center;display:flex}.icon-container .icon{border:1px solid var(--_connotation-color-dim);border-radius:inherit;color:var(--_connotation-color-firm-all);padding:19px}.content{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);text-align:center;flex-direction:column;gap:8px;display:flex}header{color:var(--_connotation-color-firm-all);font:var(--vvd-typography-base-extended-bold)}.actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.base.no-actions .actions{display:none}`,c=class extends e.t{};r.t([e.m],c.prototype,`connotation`,void 0),r.t([e.m],c.prototype,`headline`,void 0),r.t([e.m],c.prototype,`icon`,void 0),r.t([e.m({attribute:`icon-decoration`})],c.prototype,`iconDecoration`,void 0),r.t([e.A],c.prototype,`slottedActionItems`,void 0);var l=e.u(`empty-state`,c,r=>{let a=r.tagFor(o.t);return e.p` <div
-		class="${e=>i.t(`base`,[`connotation-${e.connotation}`,!!e.connotation],[`no-actions`,e.slottedActionItems?.length===0])}"
+const e=require("../bundled/vivid-element.cjs"),t=require("../bundled/slotted.cjs"),n=require("../bundled/when.cjs"),r=require("../bundled/decorate.cjs"),i=require("../bundled/class-names.cjs"),a=require("../bundled/definition2.cjs"),o=require("../bundled/icon.cjs"),s=require("../bundled/component-enum.cjs");var c=`:host{display:block}.base{--_empty-state-icon-container:120px;--_empty-state-icon-background:var(--_connotation-color-faint);--_empty-state-icon-font-size:52px;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:24px;block-size:100%;display:flex}.icon-container{background-color:var(--_empty-state-icon-background);block-size:var(--_empty-state-icon-container);box-shadow:inset 0 0 0 21px color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);font-size:var(--_empty-state-icon-font-size);inline-size:var(--_empty-state-icon-container);--_empty-state-icon-background:transparent;--_empty-state-icon-font-size:40px;border-radius:50%;justify-content:center;align-items:center;display:flex}.icon-container .icon{border:1px solid var(--_connotation-color-dim);border-radius:inherit;color:var(--_connotation-color-firm-all);padding:19px}.content{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);text-align:center;flex-direction:column;gap:8px;display:flex}header{color:var(--_connotation-color-firm-all);font:var(--vvd-typography-base-extended-bold)}.actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.base.no-actions .actions{display:none}`,l=s.t([`accent`,`cta`,`success`,`alert`,`warning`,`information`],`accent`),u=class extends e.t{};r.t([e.m],u.prototype,`connotation`,void 0),r.t([e.m],u.prototype,`headline`,void 0),r.t([e.m],u.prototype,`icon`,void 0),r.t([e.m({attribute:`icon-decoration`})],u.prototype,`iconDecoration`,void 0),r.t([e.A],u.prototype,`slottedActionItems`,void 0);var d=e.u(`empty-state`,u,r=>{let a=r.tagFor(o.t);return e.p` <div
+		class="${e=>i.t(`base`,`connotation-${l.parse(e.connotation)}`,[`no-actions`,e.slottedActionItems?.length===0])}"
 		aria-labelledby="${e=>e.headline?`empty-state-headline`:null}"
 	>
 		<slot name="graphic">
@@ -16,4 +16,4 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/slotted.cj
 		<div class="actions">
 			<slot name="action-items" ${t.t(`slottedActionItems`)}></slot>
 		</div>
-	</div>`},[a.t],{styles:s});e.d(l)();
+	</div>`},[a.t],{styles:c});e.d(d)();

package/empty-state/index.js

@@ -3,16 +3,25 @@ import { t as o } from "../bundled/slotted.js";
 import { t as s } from "../bundled/when.js";
 import { t as c } from "../bundled/decorate.js";
 import { t as l } from "../bundled/class-names.js";
-import { t as u } from "../bundled/definition3.js";
+import { t as u } from "../bundled/definition2.js";
 import { t as d } from "../bundled/icon.js";
+import { t as f } from "../bundled/component-enum.js";
 //#region src/lib/empty-state/empty-state.scss?inline
-var f = ":host{display:block}.base.connotation-cta{--_connotation-color-firm-all:var(--vvd-empty-state-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-dim:var(--vvd-empty-state-cta-dim,var(--vvd-color-cta-200));--_connotation-color-faint:var(--vvd-empty-state-cta-faint,var(--vvd-color-cta-50));--_connotation-color-primary:var(--vvd-empty-state-cta-primary,var(--vvd-color-cta-500))}.base.connotation-success{--_connotation-color-firm-all:var(--vvd-empty-state-success-firm-all,var(--vvd-color-success-600));--_connotation-color-dim:var(--vvd-empty-state-success-dim,var(--vvd-color-success-200));--_connotation-color-faint:var(--vvd-empty-state-success-faint,var(--vvd-color-success-50));--_connotation-color-primary:var(--vvd-empty-state-success-primary,var(--vvd-color-success-500))}.base.connotation-alert{--_connotation-color-firm-all:var(--vvd-empty-state-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-dim:var(--vvd-empty-state-alert-dim,var(--vvd-color-alert-200));--_connotation-color-faint:var(--vvd-empty-state-alert-faint,var(--vvd-color-alert-50));--_connotation-color-primary:var(--vvd-empty-state-alert-primary,var(--vvd-color-alert-500))}.base.connotation-warning{--_connotation-color-firm-all:var(--vvd-empty-state-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-dim:var(--vvd-empty-state-warning-dim,var(--vvd-color-warning-200));--_connotation-color-faint:var(--vvd-empty-state-warning-faint,var(--vvd-color-warning-50));--_connotation-color-primary:var(--vvd-empty-state-warning-primary,var(--vvd-color-warning-300))}.base.connotation-information{--_connotation-color-firm-all:var(--vvd-empty-state-information-firm-all,var(--vvd-color-information-600));--_connotation-color-dim:var(--vvd-empty-state-information-dim,var(--vvd-color-information-200));--_connotation-color-faint:var(--vvd-empty-state-information-faint,var(--vvd-color-information-50));--_connotation-color-primary:var(--vvd-empty-state-information-primary,var(--vvd-color-information-500))}.base.connotation-announcement{--_connotation-color-firm-all:var(--vvd-empty-state-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-dim:var(--vvd-empty-state-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-faint:var(--vvd-empty-state-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-primary:var(--vvd-empty-state-announcement-primary,var(--vvd-color-announcement-500))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-firm-all:var(--vvd-empty-state-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-dim:var(--vvd-empty-state-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-faint:var(--vvd-empty-state-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-primary:var(--vvd-empty-state-accent-primary,var(--vvd-color-canvas-text))}.base{--_empty-state-icon-container:120px;--_empty-state-icon-background:var(--_connotation-color-faint);--_empty-state-icon-font-size:52px;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:24px;block-size:100%;display:flex}.icon-container{background-color:var(--_empty-state-icon-background);block-size:var(--_empty-state-icon-container);box-shadow:inset 0 0 0 21px color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);font-size:var(--_empty-state-icon-font-size);inline-size:var(--_empty-state-icon-container);--_empty-state-icon-background:transparent;--_empty-state-icon-font-size:40px;border-radius:50%;justify-content:center;align-items:center;display:flex}.icon-container .icon{border:1px solid var(--_connotation-color-dim);border-radius:inherit;color:var(--_connotation-color-firm-all);padding:19px}.content{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);text-align:center;flex-direction:column;gap:8px;display:flex}header{color:var(--_connotation-color-firm-all);font:var(--vvd-typography-base-extended-bold)}.actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.base.no-actions .actions{display:none}", p = class extends i {};
+var p = ":host{display:block}.base{--_empty-state-icon-container:120px;--_empty-state-icon-background:var(--_connotation-color-faint);--_empty-state-icon-font-size:52px;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:24px;block-size:100%;display:flex}.icon-container{background-color:var(--_empty-state-icon-background);block-size:var(--_empty-state-icon-container);box-shadow:inset 0 0 0 21px color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);font-size:var(--_empty-state-icon-font-size);inline-size:var(--_empty-state-icon-container);--_empty-state-icon-background:transparent;--_empty-state-icon-font-size:40px;border-radius:50%;justify-content:center;align-items:center;display:flex}.icon-container .icon{border:1px solid var(--_connotation-color-dim);border-radius:inherit;color:var(--_connotation-color-firm-all);padding:19px}.content{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);text-align:center;flex-direction:column;gap:8px;display:flex}header{color:var(--_connotation-color-firm-all);font:var(--vvd-typography-base-extended-bold)}.actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.base.no-actions .actions{display:none}", m = f([
+	"accent",
+	"cta",
+	"success",
+	"alert",
+	"warning",
+	"information"
+], "accent"), h = class extends i {};
+c([n], h.prototype, "connotation", void 0), c([n], h.prototype, "headline", void 0), c([n], h.prototype, "icon", void 0), c([n({ attribute: "icon-decoration" })], h.prototype, "iconDecoration", void 0), c([e], h.prototype, "slottedActionItems", void 0);
 //#endregion
-//#region src/lib/empty-state/index.ts
-c([n], p.prototype, "connotation", void 0), c([n], p.prototype, "headline", void 0), c([n], p.prototype, "icon", void 0), c([n({ attribute: "icon-decoration" })], p.prototype, "iconDecoration", void 0), c([e], p.prototype, "slottedActionItems", void 0), t(a("empty-state", p, (e) => {
+//#region src/lib/empty-state/definition.ts
+var g = a("empty-state", h, (e) => {
 	let t = e.tagFor(d);
 	return r` <div
-		class="${(e) => l("base", [`connotation-${e.connotation}`, !!e.connotation], ["no-actions", e.slottedActionItems?.length === 0])}"
+		class="${(e) => l("base", `connotation-${m.parse(e.connotation)}`, ["no-actions", e.slottedActionItems?.length === 0])}"
 		aria-labelledby="${(e) => e.headline ? "empty-state-headline" : null}"
 	>
 		<slot name="graphic">
@@ -30,5 +39,8 @@ c([n], p.prototype, "connotation", void 0), c([n], p.prototype, "headline", void
 			<slot name="action-items" ${o("slottedActionItems")}></slot>
 		</div>
 	</div>`;
-}, [u], { styles: f }))();
+}, [u], { styles: p });
+//#endregion
+//#region src/lib/empty-state/index.ts
+t(g)();
 //#endregion

package/fab/index.cjs

@@ -1,6 +1,6 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/ref.cjs`),n=require(`../bundled/decorate.cjs`),r=require(`../bundled/class-names.cjs`),i=require(`../bundled/definition3.cjs`),a=require(`../bundled/affix.cjs`),o=require(`../bundled/delegates-aria.cjs`),s=require(`../bundled/button.cjs`);var c=`.control.connotation-accent{--_connotation-color-primary:var(--vvd-fab-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-fab-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-fab-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-fab-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-fab-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-fab-accent-firm,var(--vvd-color-canvas-text))}.control.connotation-cta{--_connotation-color-primary:var(--vvd-fab-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-fab-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-fab-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-fab-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-fab-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-fab-cta-firm,var(--vvd-color-cta-600))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-fab-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-fab-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-fab-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-fab-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-fab-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-fab-announcement-firm,var(--vvd-color-announcement-600))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:disabled,.control.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)),.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control{--_fab-inline-padding:12px;box-sizing:border-box;border-radius:var(--_fab-border-radius);background:var(--_appearance-color-fill,var(--_elevation-fill));block-size:var(--_fab-block-size);color:var(--_appearance-color-text,var(--vvd-color-canvas-text));align-items:center;column-gap:var(--fab-icon-gap);filter:var(--_elevation-shadow);font:var(--vvd-typography-base-bold);padding-inline:var(--_fab-inline-padding);vertical-align:middle;border:0;transition:background-color .15s linear,filter .15s linear;display:inline-flex}.control:not(.connotation-accent,.connotation-cta,.connotation-announcement){--focus-stroke-gap-color:transparent}.control:focus-visible{outline:none;position:relative}.control:focus-visible:after{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));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control{user-select:none}.control.size-expanded{--_fab-border-radius:40px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16));--_fab-inline-padding:20px}.control.size-condensed{--_fab-border-radius:20px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold)}.control.size-condensed [data-vvd-component=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2)}.control:not(.size-expanded,.size-condensed){--_fab-border-radius:24px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.control:not(.size-condensed){font:var(--vvd-typography-base-bold)}.control.icon-only{--_fab-inline-padding:0;border-radius:50%;place-content:center}@supports (aspect-ratio:1){.control.icon-only{aspect-ratio:1}}@supports not (aspect-ratio:1){.control.icon-only{inline-size:var(--_fab-block-size)}}.control:not(.icon-only){--fab-icon-gap:10px}.control.disabled{--_elevation-fill:var(--_vvd-tinted-color-surface-nonedp,var(--vvd-color-surface-nonedp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-nonedp,var(--vvd-shadow-surface-nonedp));cursor:not-allowed}.control:not(.disabled){--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp));cursor:pointer}@media (hover:hover){.control:not(.disabled):hover{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}}.control:not(.disabled):active{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:inline-block}.control.size-extended slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16)) / 2.3333)}.control:not(.size-extended) slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2)}`,l=class extends a.n(s.t){clickHandler(e){if(this.disabled){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};n.t([e.m],l.prototype,`connotation`,void 0),n.t([e.m],l.prototype,`size`,void 0),n.t([e.m],l.prototype,`label`,void 0);var u=e.u(`fab`,l,n=>{let i=a.a(n);return e.p`
+const e=require("../bundled/vivid-element.cjs"),t=require("../bundled/ref.cjs"),n=require("../bundled/decorate.cjs"),r=require("../bundled/class-names.cjs"),i=require("../bundled/definition2.cjs"),a=require("../bundled/affix.cjs"),o=require("../bundled/delegates-aria.cjs"),s=require("../bundled/button.cjs");var c=`.control{--_fab-inline-padding:12px;box-sizing:border-box;border-radius:var(--_fab-border-radius);background:var(--_appearance-color-fill,var(--_elevation-fill));block-size:var(--_fab-block-size);color:var(--_appearance-color-text,var(--vvd-color-canvas-text));align-items:center;column-gap:var(--fab-icon-gap);filter:var(--_elevation-shadow);font:var(--vvd-typography-base-bold);padding-inline:var(--_fab-inline-padding);vertical-align:middle;border:0;transition:background-color .15s linear,filter .15s linear;display:inline-flex}.control:not(.connotation-accent,.connotation-cta,.connotation-announcement){--focus-stroke-gap-color:transparent}.control:focus-visible{outline:none;position:relative}.control:focus-visible:after{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));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control{user-select:none}.control.size-expanded{--_fab-border-radius:40px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16));--_fab-inline-padding:20px}.control.size-condensed{--_fab-border-radius:20px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold)}.control.size-condensed [data-vvd-component=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2)}.control:not(.size-expanded,.size-condensed){--_fab-border-radius:24px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.control:not(.size-condensed){font:var(--vvd-typography-base-bold)}.control.icon-only{--_fab-inline-padding:0;border-radius:50%;place-content:center}@supports (aspect-ratio:1){.control.icon-only{aspect-ratio:1}}@supports not (aspect-ratio:1){.control.icon-only{inline-size:var(--_fab-block-size)}}.control:not(.icon-only){--fab-icon-gap:10px}.control.disabled{--_elevation-fill:var(--_vvd-tinted-color-surface-nonedp,var(--vvd-color-surface-nonedp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-nonedp,var(--vvd-shadow-surface-nonedp));cursor:not-allowed}.control:not(.disabled){--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp));cursor:pointer}@media (hover:hover){.control:not(.disabled):hover{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}}.control:not(.disabled):active{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:inline-block}.control.size-extended slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16)) / 2.3333)}.control:not(.size-extended) slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2)}`,l=[`cta`,`accent`,`announcement`],u=class extends a.n(s.t){clickHandler(e){if(this.disabled){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};n.t([e.m],u.prototype,`connotation`,void 0),n.t([e.m],u.prototype,`size`,void 0),n.t([e.m],u.prototype,`label`,void 0);var d=e.u(`fab`,u,n=>{let i=a.a(n);return e.p`
 		<button
-			class="${e=>r.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)],[`icon-trailing`,e.iconTrailing],[`disabled`,e.disabled])} "
+			class="${e=>r.t(`control`,`appearance-filled`,`with-idle`,`with-hover`,`with-active`,`with-disabled`,[`connotation-${e.connotation}`,l.includes(e.connotation??``)],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)],[`icon-trailing`,e.iconTrailing],[`disabled`,e.disabled])} "
 			?autofocus="${e=>e.autofocus}"
 			form="${e=>e.formId}"
 			formaction="${e=>e.formaction}"
@@ -17,4 +17,4 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/ref.cjs`),
 		>
 			${e=>i(e.icon,a.i.Slot)} ${e=>e.label}
 		</button>
-	`},[i.t],{styles:c,shadowOptions:{delegatesFocus:!0}});e.d(u)();
+	`},[i.t],{styles:c,shadowOptions:{delegatesFocus:!0}});e.d(d)();

package/fab/index.js

@@ -2,12 +2,16 @@ import { d as e, m as t, p as n, u as r } from "../bundled/vivid-element.js";
 import { t as i } from "../bundled/ref.js";
 import { t as a } from "../bundled/decorate.js";
 import { t as o } from "../bundled/class-names.js";
-import { t as s } from "../bundled/definition3.js";
+import { t as s } from "../bundled/definition2.js";
 import { a as c, i as l, n as u } from "../bundled/affix.js";
 import { n as d } from "../bundled/delegates-aria.js";
 import { t as f } from "../bundled/button.js";
 //#region src/lib/fab/fab.scss?inline
-var p = ".control.connotation-accent{--_connotation-color-primary:var(--vvd-fab-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-fab-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-fab-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-fab-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-fab-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-fab-accent-firm,var(--vvd-color-canvas-text))}.control.connotation-cta{--_connotation-color-primary:var(--vvd-fab-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-fab-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-fab-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-fab-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-fab-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-fab-cta-firm,var(--vvd-color-cta-600))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-fab-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-fab-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-fab-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-fab-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-fab-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-fab-announcement-firm,var(--vvd-color-announcement-600))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:disabled,.control.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)),.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control{--_fab-inline-padding:12px;box-sizing:border-box;border-radius:var(--_fab-border-radius);background:var(--_appearance-color-fill,var(--_elevation-fill));block-size:var(--_fab-block-size);color:var(--_appearance-color-text,var(--vvd-color-canvas-text));align-items:center;column-gap:var(--fab-icon-gap);filter:var(--_elevation-shadow);font:var(--vvd-typography-base-bold);padding-inline:var(--_fab-inline-padding);vertical-align:middle;border:0;transition:background-color .15s linear,filter .15s linear;display:inline-flex}.control:not(.connotation-accent,.connotation-cta,.connotation-announcement){--focus-stroke-gap-color:transparent}.control:focus-visible{outline:none;position:relative}.control:focus-visible:after{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));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control{user-select:none}.control.size-expanded{--_fab-border-radius:40px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16));--_fab-inline-padding:20px}.control.size-condensed{--_fab-border-radius:20px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold)}.control.size-condensed [data-vvd-component=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2)}.control:not(.size-expanded,.size-condensed){--_fab-border-radius:24px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.control:not(.size-condensed){font:var(--vvd-typography-base-bold)}.control.icon-only{--_fab-inline-padding:0;border-radius:50%;place-content:center}@supports (aspect-ratio:1){.control.icon-only{aspect-ratio:1}}@supports not (aspect-ratio:1){.control.icon-only{inline-size:var(--_fab-block-size)}}.control:not(.icon-only){--fab-icon-gap:10px}.control.disabled{--_elevation-fill:var(--_vvd-tinted-color-surface-nonedp,var(--vvd-color-surface-nonedp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-nonedp,var(--vvd-shadow-surface-nonedp));cursor:not-allowed}.control:not(.disabled){--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp));cursor:pointer}@media (hover:hover){.control:not(.disabled):hover{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}}.control:not(.disabled):active{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:inline-block}.control.size-extended slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16)) / 2.3333)}.control:not(.size-extended) slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2)}", m = class extends u(f) {
+var p = ".control{--_fab-inline-padding:12px;box-sizing:border-box;border-radius:var(--_fab-border-radius);background:var(--_appearance-color-fill,var(--_elevation-fill));block-size:var(--_fab-block-size);color:var(--_appearance-color-text,var(--vvd-color-canvas-text));align-items:center;column-gap:var(--fab-icon-gap);filter:var(--_elevation-shadow);font:var(--vvd-typography-base-bold);padding-inline:var(--_fab-inline-padding);vertical-align:middle;border:0;transition:background-color .15s linear,filter .15s linear;display:inline-flex}.control:not(.connotation-accent,.connotation-cta,.connotation-announcement){--focus-stroke-gap-color:transparent}.control:focus-visible{outline:none;position:relative}.control:focus-visible:after{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));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control{user-select:none}.control.size-expanded{--_fab-border-radius:40px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16));--_fab-inline-padding:20px}.control.size-condensed{--_fab-border-radius:20px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold)}.control.size-condensed [data-vvd-component=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2)}.control:not(.size-expanded,.size-condensed){--_fab-border-radius:24px;--_fab-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.control:not(.size-condensed){font:var(--vvd-typography-base-bold)}.control.icon-only{--_fab-inline-padding:0;border-radius:50%;place-content:center}@supports (aspect-ratio:1){.control.icon-only{aspect-ratio:1}}@supports not (aspect-ratio:1){.control.icon-only{inline-size:var(--_fab-block-size)}}.control:not(.icon-only){--fab-icon-gap:10px}.control.disabled{--_elevation-fill:var(--_vvd-tinted-color-surface-nonedp,var(--vvd-color-surface-nonedp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-nonedp,var(--vvd-shadow-surface-nonedp));cursor:not-allowed}.control:not(.disabled){--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp));cursor:pointer}@media (hover:hover){.control:not(.disabled):hover{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}}.control:not(.disabled):active{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:inline-block}.control.size-extended slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16)) / 2.3333)}.control:not(.size-extended) slot[name=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2)}", m = [
+	"cta",
+	"accent",
+	"announcement"
+], h = class extends u(f) {
 	clickHandler(e) {
 		/* v8 ignore else -- @preserve */
 		if (this.disabled) {
@@ -17,13 +21,14 @@ var p = ".control.connotation-accent{--_connotation-color-primary:var(--vvd-fab-
 		return !0;
 	}
 };
+a([t], h.prototype, "connotation", void 0), a([t], h.prototype, "size", void 0), a([t], h.prototype, "label", void 0);
 //#endregion
-//#region src/lib/fab/index.ts
-a([t], m.prototype, "connotation", void 0), a([t], m.prototype, "size", void 0), a([t], m.prototype, "label", void 0), e(r("fab", m, (e) => {
+//#region src/lib/fab/definition.ts
+var g = r("fab", h, (e) => {
 	let t = c(e);
 	return n`
 		<button
-			class="${(e) => o("control", [`connotation-${e.connotation}`, !!e.connotation], [`size-${e.size}`, !!e.size], ["icon-only", !e.label && !!(e.icon || e.iconSlottedContent?.length)], ["icon-trailing", e.iconTrailing], ["disabled", e.disabled])} "
+			class="${(e) => o("control", "appearance-filled", "with-idle", "with-hover", "with-active", "with-disabled", [`connotation-${e.connotation}`, m.includes(e.connotation ?? "")], [`size-${e.size}`, !!e.size], ["icon-only", !e.label && !!(e.icon || e.iconSlottedContent?.length)], ["icon-trailing", e.iconTrailing], ["disabled", e.disabled])} "
 			?autofocus="${(e) => e.autofocus}"
 			form="${(e) => e.formId}"
 			formaction="${(e) => e.formaction}"
@@ -44,5 +49,8 @@ a([t], m.prototype, "connotation", void 0), a([t], m.prototype, "size", void 0),
 }, [s], {
 	styles: p,
 	shadowOptions: { delegatesFocus: !0 }
-}))();
+});
+//#endregion
+//#region src/lib/fab/index.ts
+e(g)();
 //#endregion

package/file-picker/index.cjs

@@ -1,5 +1,5 @@
-const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/repeat.cjs`),r=require(`../bundled/slotted.cjs`),i=require(`../bundled/ref.cjs`),a=require(`../bundled/when.cjs`),o=require(`../bundled/decorate.cjs`),s=require(`../bundled/class-names.cjs`),c=require(`../bundled/definition3.cjs`),l=require(`../bundled/icon.cjs`),u=require(`../bundled/delegates-aria.cjs`),d=require(`../bundled/form-associated.cjs`),f=require(`../bundled/definition6.cjs`),p=require(`../bundled/mixins.cjs`),m=require(`../bundled/form-element.cjs`),h=require(`../bundled/with-contextual-help.cjs`),g=require(`../bundled/with-error-text.cjs`);var _=`.label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex-direction:row;display:flex}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 auto}:host{max-inline-size:400px;display:block}:host([disabled]){cursor:not-allowed}.base{block-size:inherit;max-block-size:inherit;--_low-ink-color:var(--vvd-color-neutral-600);flex-direction:column;display:flex}.control-wrapper{block-size:inherit;max-block-size:inherit;flex-direction:column;gap:4px;display:flex}.control{box-sizing:border-box;border:1px dashed var(--vvd-color-neutral-400);background-color:var(--vvd-color-cta-50);color:var(--vvd-color-neutral-600);cursor:pointer;font:var(--vvd-typography-base);border-radius:8px;outline:none;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;min-block-size:52px;inline-size:100%;padding:16px;display:flex;position:relative}@media (prefers-reduced-motion:no-preference){.control{transition:all .3s}}.control .upload-text{color:var(--vvd-color-neutral-600);isolation:isolate;pointer-events:none;text-align:center;justify-content:center;align-items:center;display:flex}@media (prefers-reduced-motion:no-preference){.control .upload-text{transition:all .3s}}.control.disabled{border-color:var(--vvd-color-neutral-300);background-color:var(--vvd-color-neutral-100);box-shadow:none;color:var(--vvd-color-neutral-300);pointer-events:none;transform:none}.control.disabled .upload-text{color:var(--vvd-color-neutral-300)}@media (hover:hover){.control:hover .upload-text{color:var(--vvd-color-neutral-800)}}.control.drag-hover .upload-text{color:var(--vvd-color-neutral-800)}.control:not(.size-expanded){min-block-size:52px}.control.size-expanded{min-block-size:120px}.control:focus-visible{--focus-stroke-gap-color:transparent;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))}.control:active,.control:focus-visible{border-color:var(--vvd-color-cta-400);background-color:var(--vvd-color-cta-100);transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}@media (hover:hover){.control:hover{border-color:var(--vvd-color-cta-400);background-color:var(--vvd-color-cta-100);transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}}.control:active{transform:translateY(0);box-shadow:0 1px 4px #0000001a}.control.drag-hover{border-color:var(--vvd-color-cta-200);background-color:var(--vvd-color-cta-200);outline:2px dashed var(--vvd-color-cta-500);transform:scale(1.02)}.upload-icon{color:var(--vvd-color-cta-600);pointer-events:none}@media (prefers-reduced-motion:no-preference){.upload-icon{transition:all .3s;animation:2s ease-in-out infinite subtle-pulse}}@media (hover:hover){.control:hover .upload-icon{color:var(--vvd-color-cta-700);animation:none;transform:scale(1.1)}}.control:active .upload-icon{transform:scale(1.05)}.control.drag-hover .upload-icon{color:var(--vvd-color-neutral-800);animation:none;transform:scale(1.15)}.control.disabled .upload-icon{color:var(--vvd-color-neutral-300);animation:none}@keyframes subtle-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.main{pointer-events:none}.preview{box-sizing:border-box;border:1px solid var(--vvd-color-neutral-300);background-color:var(--file-picker-list-item-background-color,var(--vvd-color-canvas));border-radius:8px;grid-template-rows:auto auto;grid-template-columns:1fr auto;inline-size:100%;padding:8px;display:grid}.preview .details{min-width:0;flex-direction:column;max-inline-size:100%;display:flex}.preview .details .filename{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.preview .details .size{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base-condensed)}.preview .error-message{color:var(--vvd-color-alert-600);font:var(--vvd-typography-base-condensed-bold);align-items:center;gap:4px;margin-block-start:4px;display:flex}.preview:not(.has-error) .error-message{display:none}.preview.has-error{border:1px solid var(--vvd-color-alert-500);background-color:var(--vvd-color-alert-50)}.preview.has-error .size{display:none}.preview .remove-btn{grid-area:1/2/-1/-1;align-self:center;display:inline}.preview-list{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.preview-list ::-webkit-scrollbar{width:4px}.preview-list ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.preview-list ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.preview-list{flex-direction:column;gap:12px;margin-block-start:12px;display:flex;overflow-y:auto}.preview-list:not(:has(.preview)){display:none}.hidden-input{visibility:hidden;width:0;height:0;position:absolute;top:0;left:0}`;async function v(e){return e.items?.[0]?.webkitGetAsEntry==null?Array.from(e.files):await y(e.items)}async function y(e){let t=[];for(let n of e){let e=n.getAsFile();if(e)t.push(Promise.resolve([e]));else{let e=n.webkitGetAsEntry();e&&t.push(b(e,!1))}}return(await Promise.all(t)).flat()}var b=(e,t)=>{let n=e.isFile?(e=>new Promise((n,r)=>{e.file(e=>{t&&e.name.substring(0,1)===`.`?n([]):n([e])},r)}))(e):e.isDirectory?x(e):Promise.resolve([]);return n.catch(()=>null),n},x=async e=>new Promise((t,n)=>{let r=[],i=e.createReader(),a=()=>{i.readEntries(e=>{for(let t of e)r.push(b(t,!0));e.length?a():t(Promise.all(r).then(e=>e.flat()))},n)};a()});function S(e,t){if(!t)return!0;let n=t.split(`,`),r=e=>/\/\*$/.test(e),i=e=>e.replace(/\/.*$/,``);for(let t of n)if(t=t.trim(),t.charAt(0)===`.`){if(e.name.toLowerCase().endsWith(t.toLowerCase()))return!0}else if(r(t)){if(i(e.type)===i(t))return!0}else if(e.type===t)return!0;return!1}var C=class extends h.t(p.t(g.t(m.t(u.t(e.t(d.n(t.t))))))){constructor(...e){super(...e),this.singleFile=!1,this.maxFiles=null,this.maxFileSize=256,this.valueChanged=(e,t)=>{super.valueChanged(e,t),t===``&&this.files.length&&this.removeAllFiles()},this.proxy=document.createElement(`input`),this.setFormValue=(e,t)=>{typeof e!=`string`&&super.setFormValue(e,t)},this._customValidationError=null,this.#r={handleChange:()=>{this._customValidationError=this.#i.observe(this,t.O.default)}},this._dragHover=!1,this._allFiles=[]}nameChanged(e,t){super.nameChanged(e,t),this.#e()}#e(){let e=this.files;if(!this.name)this.setFormValue(null);else{let t=new FormData;for(let n of e)t.append(this.name,n);this.setFormValue(t)}this.#t()}#t(){this.value=this.files.length>0?`C:\\fakepath\\${this.files[0].name}`:``}validate(){super.validate(this.control)}formResetCallback(){this.removeAllFiles(),super.formResetCallback()}#n(){return this.rejectedFiles.length>0?this.locale.filePicker.invalidFilesError:null}_customValidationErrorChanged(){this.proxy&&this.proxy.setCustomValidity(this._customValidationError??``),this.validate()}#r;#i;#a(){this.#i=t.k.binding(()=>this.#n(),this.#r,!0),this.#r.handleChange()}#o(){this.#i.dispose()}connectedCallback(){super.connectedCallback(),this.#a()}disconnectedCallback(){super.disconnectedCallback(),this.#o()}_onDragEnter(){return this.disabled||(this._dragHover=!0),!0}_onDragOver(e){if(this.disabled||!e.dataTransfer)return!0;let t=e.dataTransfer.effectAllowed;return e.dataTransfer.dropEffect=t===`move`||t===`linkMove`?`move`:`copy`,!1}_onDragLeave(e){return this.disabled||e.currentTarget===e.target&&(this._dragHover=!1),!0}_onDrop(e){return this.disabled||(this._dragHover=!1,!e.dataTransfer)?!0:(v(e.dataTransfer).then(e=>this.#s(e)).catch(e=>{console.error(e)}),!1)}_onDragEnd(){return this.disabled||(this._dragHover=!1),!0}_onControlClick(){this.disabled||this._hiddenInput.click()}_onRemoveFileClick(e){this.disabled||(this._allFiles=this._allFiles.filter(t=>t!==e),this.$emit(`change`))}_allFilesChanged(){this.#e()}#s(e){let t=Array.from(e).filter(e=>!this._allFiles.some(t=>t.name===e.name&&t.size===e.size));this.singleFile&&t.length>0?this._allFiles=[t[t.length-1]]:this._allFiles=[...this._allFiles,...t],this.$emit(`change`)}removeAllFiles(){this._allFiles=[]}get _validatedFiles(){let e=(e,t)=>this.maxFileSize&&e.size>this.maxFileSize*1024*1024?(this.fileTooBigError||this.locale.filePicker.fileTooBigError).replace(`{{filesize}}`,this._formatNumber(Math.round(e.size/1024/10.24)/100)).replace(`{{maxFilesize}}`,this._formatNumber(this.maxFileSize)):S(e,this.accept)?typeof this.maxFiles==`number`&&t>=this.maxFiles?(this.maxFilesExceededError||this.locale.filePicker.maxFilesExceededError).replace(`{{maxFiles}}`,String(this.maxFiles)):null:this.invalidFileTypeError||this.locale.filePicker.invalidFileTypeError,t=[],n=0;for(let r of this._allFiles){let i={file:r,validationError:e(r,n)};t.push(i),i.validationError||n++}return t}get files(){return this._validatedFiles.filter(e=>!e.validationError).map(e=>e.file)}get rejectedFiles(){return this._validatedFiles.filter(e=>!!e.validationError).map(e=>e.file)}_onHiddenInputChange(e){this.#s(this._hiddenInput.files),this._hiddenInput.value=``,e.stopPropagation()}_formatNumber(e){let t=String(e);return this.locale.common.useCommaAsDecimalSeparator?t.replace(`.`,`,`):t}};o.t([t.m({attribute:`single-file`,mode:`boolean`})],C.prototype,`singleFile`,void 0),o.t([t.m({attribute:`max-files`,converter:t.h,mode:`fromView`})],C.prototype,`maxFiles`,void 0),o.t([t.m({mode:`fromView`,attribute:`max-file-size`})],C.prototype,`maxFileSize`,void 0),o.t([t.m],C.prototype,`accept`,void 0),o.t([t.m],C.prototype,`size`,void 0),o.t([t.m({attribute:`invalid-file-type-error`})],C.prototype,`invalidFileTypeError`,void 0),o.t([t.m({attribute:`max-files-exceeded-error`})],C.prototype,`maxFilesExceededError`,void 0),o.t([t.m({attribute:`file-too-big-error`})],C.prototype,`fileTooBigError`,void 0),o.t([t.A],C.prototype,`_customValidationError`,void 0),o.t([t.A],C.prototype,`_dragHover`,void 0),o.t([t.A],C.prototype,`_allFiles`,void 0),o.t([t.j],C.prototype,`_validatedFiles`,null);var w=1e3,T={tb:`TB`,gb:`GB`,mb:`MB`,kb:`KB`,b:`b`},E=(e,n)=>{let r=0,i=`b`;if(n>0){let e=[`tb`,`gb`,`mb`,`kb`,`b`];for(let t=0;t<e.length;t++){let a=e[t];if(n>=w**(4-t)/10){r=n/w**(4-t),i=a;break}}r=Math.round(10*r)/10}return t.p`<strong>${e._formatNumber(r)}</strong>
-		${T[i]}`},D=t.u(`file-picker`,C,e=>{let o=e.tagFor(l.t),c=e.tagFor(f.i);return t.p`
+const e=require("../bundled/localized.cjs"),t=require("../bundled/vivid-element.cjs"),n=require("../bundled/repeat.cjs"),r=require("../bundled/slotted.cjs"),i=require("../bundled/ref.cjs"),a=require("../bundled/when.cjs"),o=require("../bundled/decorate.cjs"),s=require("../bundled/class-names.cjs"),c=require("../bundled/definition2.cjs"),l=require("../bundled/icon.cjs"),u=require("../bundled/delegates-aria.cjs"),d=require("../bundled/form-associated.cjs"),f=require("../bundled/definition5.cjs"),p=require("../bundled/feedback-message.cjs"),m=require("../bundled/form-element.cjs"),h=require("../bundled/with-contextual-help.cjs"),g=require("../bundled/with-error-text.cjs"),_=require("../bundled/mixins.cjs");var v=`.label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex-direction:row;display:flex}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 auto}:host{max-inline-size:400px;display:block}:host([disabled]){cursor:not-allowed}.base{block-size:inherit;max-block-size:inherit;--_low-ink-color:var(--vvd-color-neutral-600);flex-direction:column;display:flex}.control-wrapper{block-size:inherit;max-block-size:inherit;flex-direction:column;gap:4px;display:flex}.control{box-sizing:border-box;border:1px dashed var(--vvd-color-neutral-400);background-color:var(--vvd-color-cta-50);color:var(--vvd-color-neutral-600);cursor:pointer;font:var(--vvd-typography-base);border-radius:8px;outline:none;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;inline-size:100%;padding:15px 16px;display:flex;position:relative}@media (prefers-reduced-motion:no-preference){.control{transition:all .3s}}.control .upload-text{isolation:isolate;pointer-events:none;text-align:center;justify-content:center;align-items:center;display:flex}@media (prefers-reduced-motion:no-preference){.control .upload-text{transition:all .3s}}.control.disabled{border-color:var(--vvd-color-neutral-300);background-color:var(--vvd-color-neutral-100);box-shadow:none;pointer-events:none;transform:none}.control:not(.size-expanded){min-block-size:52px}.control.size-expanded{min-block-size:120px}.control:focus-visible{--focus-stroke-gap-color:transparent;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))}.control:active,.control:focus-visible{border-color:var(--vvd-color-cta-400);background-color:var(--vvd-color-cta-100);transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}@media (hover:hover){.control:hover{border-color:var(--vvd-color-cta-400);background-color:var(--vvd-color-cta-100);transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}}.control:active{transform:translateY(0);box-shadow:0 1px 4px #0000001a}.control.drag-hover{border-color:var(--vvd-color-cta-200);background-color:var(--vvd-color-cta-200);outline:2px dashed var(--vvd-color-cta-500);transform:scale(1.02)}.upload-icon{pointer-events:none;font-size:20px;display:block}.upload-icon slot[name=icon]::slotted([data-vvd-component=icon]),.upload-icon [data-vvd-component=icon]{display:inline}@media (prefers-reduced-motion:no-preference){.upload-icon{transition:all .3s;animation:2s ease-in-out infinite subtle-pulse}}@media (hover:hover){.control:hover .upload-icon{animation:none;transform:scale(1.1)}}.control:active .upload-icon{transform:scale(1.05)}.control.drag-hover .upload-icon{animation:none;transform:scale(1.15)}.control.disabled .upload-icon{animation:none}@keyframes subtle-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.main{pointer-events:none}.preview{box-sizing:border-box;border:1px solid var(--vvd-color-neutral-300);background-color:var(--file-picker-list-item-background-color,var(--vvd-color-canvas));border-radius:8px;grid-template-rows:auto auto;grid-template-columns:1fr auto;inline-size:100%;padding:8px;display:grid}.preview .details{min-width:0;flex-direction:column;max-inline-size:100%;display:flex}.preview .details .filename{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.preview .details .size{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base-condensed)}.preview .error-message{color:var(--vvd-color-alert-600);font:var(--vvd-typography-base-condensed-bold);align-items:center;gap:4px;margin-block-start:4px;display:flex}.preview:not(.has-error) .error-message{display:none}.preview.has-error{border:1px solid var(--vvd-color-alert-500);background-color:var(--vvd-color-alert-50)}.preview.has-error .size{display:none}.preview .remove-btn{grid-area:1/2/-1/-1;align-self:center;display:inline}.preview-list{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.preview-list ::-webkit-scrollbar{width:4px}.preview-list ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.preview-list ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.preview-list{flex-direction:column;gap:12px;margin-block-start:12px;display:flex;overflow-y:auto}.preview-list:not(:has(.preview)){display:none}.hidden-input{visibility:hidden;width:0;height:0;position:absolute;top:0;left:0}`;async function y(e){return e.items?.[0]?.webkitGetAsEntry==null?Array.from(e.files):await b(e.items)}async function b(e){let t=[];for(let n of e){let e=n.getAsFile();if(e)t.push(Promise.resolve([e]));else{let e=n.webkitGetAsEntry();e&&t.push(x(e,!1))}}return(await Promise.all(t)).flat()}var x=(e,t)=>{let n=e.isFile?(e=>new Promise((n,r)=>{e.file(e=>{t&&e.name.substring(0,1)===`.`?n([]):n([e])},r)}))(e):e.isDirectory?S(e):Promise.resolve([]);return n.catch(()=>null),n},S=async e=>new Promise((t,n)=>{let r=[],i=e.createReader(),a=()=>{i.readEntries(e=>{for(let t of e)r.push(x(t,!0));e.length?a():t(Promise.all(r).then(e=>e.flat()))},n)};a()});function C(e,t){if(!t)return!0;let n=t.split(`,`),r=e=>/\/\*$/.test(e),i=e=>e.replace(/\/.*$/,``);for(let t of n)if(t=t.trim(),t.charAt(0)===`.`){if(e.name.toLowerCase().endsWith(t.toLowerCase()))return!0}else if(r(t)){if(i(e.type)===i(t))return!0}else if(e.type===t)return!0;return!1}var w=class extends h.t(_.t(g.t(m.t(u.t(e.t(d.n(t.t))))))){constructor(...e){super(...e),this.singleFile=!1,this.maxFiles=null,this.maxFileSize=256,this.valueChanged=(e,t)=>{super.valueChanged(e,t),t===``&&this.files.length&&this.removeAllFiles()},this.proxy=document.createElement(`input`),this.setFormValue=(e,t)=>{typeof e!=`string`&&super.setFormValue(e,t)},this._customValidationError=null,this.#r={handleChange:()=>{this._customValidationError=this.#i.observe(this,t.O.default)}},this._dragHover=!1,this._allFiles=[]}nameChanged(e,t){super.nameChanged(e,t),this.#e()}#e(){let e=this.files;if(!this.name)this.setFormValue(null);else{let t=new FormData;for(let n of e)t.append(this.name,n);this.setFormValue(t)}this.#t()}#t(){this.value=this.files.length>0?`C:\\fakepath\\${this.files[0].name}`:``}validate(){super.validate(this.control)}formResetCallback(){this.removeAllFiles(),super.formResetCallback()}#n(){return this.rejectedFiles.length>0?this.locale.filePicker.invalidFilesError:null}_customValidationErrorChanged(){this.proxy&&this.proxy.setCustomValidity(this._customValidationError??``),this.validate()}#r;#i;#a(){this.#i=t.k.binding(()=>this.#n(),this.#r,!0),this.#r.handleChange()}#o(){this.#i.dispose()}connectedCallback(){super.connectedCallback(),this.#a()}disconnectedCallback(){super.disconnectedCallback(),this.#o()}_onDragEnter(){return this.disabled||(this._dragHover=!0),!0}_onDragOver(e){if(this.disabled||!e.dataTransfer)return!0;let t=e.dataTransfer.effectAllowed;return e.dataTransfer.dropEffect=t===`move`||t===`linkMove`?`move`:`copy`,!1}_onDragLeave(e){return this.disabled||e.currentTarget===e.target&&(this._dragHover=!1),!0}_onDrop(e){return this.disabled||(this._dragHover=!1,!e.dataTransfer)?!0:(y(e.dataTransfer).then(e=>this.#s(e)).catch(e=>{console.error(e)}),!1)}_onDragEnd(){return this.disabled||(this._dragHover=!1),!0}_onControlClick(){this.disabled||this._hiddenInput.click()}_onRemoveFileClick(e){this.disabled||(this._allFiles=this._allFiles.filter(t=>t!==e),this.$emit(`change`))}_allFilesChanged(){this.#e()}#s(e){let t=Array.from(e).filter(e=>!this._allFiles.some(t=>t.name===e.name&&t.size===e.size));this._allFiles=this.singleFile&&t.length>0?[t[t.length-1]]:[...this._allFiles,...t],this.$emit(`change`)}removeAllFiles(){this._allFiles=[]}get _validatedFiles(){let e=(e,t)=>this.maxFileSize&&e.size>this.maxFileSize*1024*1024?(this.fileTooBigError||this.locale.filePicker.fileTooBigError).replace(`{{filesize}}`,this._formatNumber(Math.round(e.size/1024/10.24)/100)).replace(`{{maxFilesize}}`,this._formatNumber(this.maxFileSize)):C(e,this.accept)?typeof this.maxFiles==`number`&&t>=this.maxFiles?(this.maxFilesExceededError||this.locale.filePicker.maxFilesExceededError).replace(`{{maxFiles}}`,String(this.maxFiles)):null:this.invalidFileTypeError||this.locale.filePicker.invalidFileTypeError,t=[],n=0;for(let r of this._allFiles){let i={file:r,validationError:e(r,n)};t.push(i),i.validationError||n++}return t}get files(){return this._validatedFiles.filter(e=>!e.validationError).map(e=>e.file)}get rejectedFiles(){return this._validatedFiles.filter(e=>!!e.validationError).map(e=>e.file)}_onHiddenInputChange(e){this.#s(this._hiddenInput.files),this._hiddenInput.value=``,e.stopPropagation()}_formatNumber(e){let t=String(e);return this.locale.common.useCommaAsDecimalSeparator?t.replace(`.`,`,`):t}};o.t([t.m({attribute:`single-file`,mode:`boolean`})],w.prototype,`singleFile`,void 0),o.t([t.m({attribute:`max-files`,converter:t.h,mode:`fromView`})],w.prototype,`maxFiles`,void 0),o.t([t.m({mode:`fromView`,attribute:`max-file-size`})],w.prototype,`maxFileSize`,void 0),o.t([t.m],w.prototype,`accept`,void 0),o.t([t.m],w.prototype,`size`,void 0),o.t([t.m({attribute:`invalid-file-type-error`})],w.prototype,`invalidFileTypeError`,void 0),o.t([t.m({attribute:`max-files-exceeded-error`})],w.prototype,`maxFilesExceededError`,void 0),o.t([t.m({attribute:`file-too-big-error`})],w.prototype,`fileTooBigError`,void 0),o.t([t.A],w.prototype,`_customValidationError`,void 0),o.t([t.A],w.prototype,`_dragHover`,void 0),o.t([t.A],w.prototype,`_allFiles`,void 0),o.t([t.j],w.prototype,`_validatedFiles`,null);var T=1e3,E={tb:`TB`,gb:`GB`,mb:`MB`,kb:`KB`,b:`b`},D=(e,n)=>{let r=0,i=`b`;if(n>0){let e=[`tb`,`gb`,`mb`,`kb`,`b`];for(let t=0;t<e.length;t++){let a=e[t];if(n>=T**(4-t)/10){r=n/T**(4-t),i=a;break}}r=Math.round(10*r)/10}return t.p`<strong>${e._formatNumber(r)}</strong>
+		${E[i]}`},O=t.u(`file-picker`,w,e=>{let o=e.tagFor(l.t),c=e.tagFor(f.i);return t.p`
 		<div class="base">
 			<div class="label-wrapper" ?hidden=${e=>!e.label&&!e._hasContextualHelp}>
 				${a.t(e=>e.label,t.p`<label class="label">${e=>e.label}</label>`)}
@@ -20,12 +20,10 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 					@dragend="${e=>e._onDragEnd()}"
 					${u.n({ariaDescribedBy:e=>e._feedbackDescribedBy})}
 				>
-					<${o}
-						class="upload-icon"
-						name="cloud-upload-line"
-						size="-4"
-						label="${e=>e.locale.filePicker.uploadFilesLabel}"
-					></${o}>
+					<span class="upload-icon"><slot name="icon"><${o}
+								name="cloud-upload-line"
+								label="${e=>e.locale.filePicker.uploadFilesLabel}"
+							></${o}></slot></span>
 					<span class="upload-text"><slot></slot></span>
 				</button>
 				${t=>t._getFeedbackTemplate(e)}
@@ -35,7 +33,7 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 				<div class="${e=>s.t(`preview`,[`has-error`,!!e.validationError])}">
 					<div class="details">
 						<div class="filename">${e=>e.file.name}</div>
-						<div class="size">${(e,t)=>E(t.parent,e.file.size)}</div>
+						<div class="size">${(e,t)=>D(t.parent,e.file.size)}</div>
 					</div>
 					<div class="error-message">
 						<${o} name="info-line" size="-6"></${o}>
@@ -60,4 +58,4 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 			tabindex="-1"
 			@change="${(e,t)=>e._onHiddenInputChange(t.event)}"
 		/>
-	`},[c.t,f.t,p.r],{styles:_,shadowOptions:{delegatesFocus:!0}});t.d(D)();
+	`},[c.t,f.t,p.n],{styles:v,shadowOptions:{delegatesFocus:!0}});t.d(O)();