@vonage/vivid 5.18.0 → 5.20.0

package/date-time-picker/index.js

@@ -1,6 +1,5 @@
-import { d as e, l as t, o as n, s as r } from "../bundled/vivid-element.js";
+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 "../bundled/numberConverter.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";
@@ -93,11 +92,11 @@ 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), r(n("date-time-picker", z, (t) => d(t, e`
+})], z.prototype, "maxDate", void 0), e(r("date-time-picker", z, (e) => d(e, n`
 			<div class="date-time-picker">
-				${() => k(t)}
+				${() => k(e)}
 				<div class="time-picker">
-					${() => y(t, 9)}
+					${() => y(e, 9)}
 				</div>
 			</div>
 		`, {

package/dial-pad/definition.cjs

@@ -1,6 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require("../unbundled/numberConverter.cjs");
-const require_definition = require("../unbundled/definition40.cjs");
+const require_definition = require("../unbundled/definition39.cjs");
 exports.VwcDialPadElement = require_definition.DialPad;
 exports.dialPadDefinition = require_definition.dialPadDefinition;
 exports.registerDialPad = require_definition.registerDialPad;

package/dial-pad/definition.js

@@ -1,3 +1,2 @@
-import "../unbundled/numberConverter.js";
-import { n as registerDialPad, r as DialPad, t as dialPadDefinition } from "../unbundled/definition40.js";
+import { n as registerDialPad, r as DialPad, t as dialPadDefinition } from "../unbundled/definition39.js";
 export { DialPad as VwcDialPadElement, dialPadDefinition, registerDialPad };

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`);require(`../bundled/numberConverter.cjs`);const o=require(`../bundled/decorate.cjs`),s=require(`../bundled/definition2.cjs`),c=require(`../bundled/class-names.cjs`);require(`../bundled/key-codes.cjs`);const l=require(`../bundled/definition6.cjs`),u=require(`../bundled/definition12.cjs`);var d=`: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}`,f=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.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.callActive?this.$emit(`end-call`):this.$emit(`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.l({attribute:`helper-text`})],f.prototype,`helperText`,void 0),o.t([t.l],f.prototype,`placeholder`,void 0),o.t([t.l({mode:`fromView`})],f.prototype,`value`,void 0),o.t([t.l({mode:`fromView`})],f.prototype,`pattern`,void 0),o.t([t.l({mode:`boolean`})],f.prototype,`disabled`,void 0),o.t([t.l({mode:`boolean`})],f.prototype,`pending`,void 0),o.t([t.l({attribute:`call-active`,mode:`boolean`})],f.prototype,`callActive`,void 0),o.t([t.l({mode:`boolean`,attribute:`no-call`})],f.prototype,`noCall`,void 0),o.t([t.l({mode:`boolean`,attribute:`no-input`})],f.prototype,`noInput`,void 0),o.t([t.l],f.prototype,`size`,void 0),o.t([t.l({attribute:`end-call-button-label`})],f.prototype,`endCallButtonLabel`,void 0),o.t([t.l({attribute:`call-button-label`})],f.prototype,`callButtonLabel`,void 0),o.t([t.l({attribute:`delete-aria-label`})],f.prototype,`deleteAriaLabel`,void 0),o.t([t.l({mode:`boolean`})],f.prototype,`autofocus`,void 0),o.t([t.T],f.prototype,`_errorAnnouncement`,void 0);var p=class{constructor(e,t,n,r,i){this.value=e,this.label=t,this.ariaLabel=n,this.icon=r,this.id=i}},m=[new p(`1`,`&nbsp;`,`digitOneLabel`,`one-solid`,`btn1`),new p(`2`,`ABC`,`digitTwoLabel`,`two-solid`,`btn2`),new p(`3`,`DEF`,`digitThreeLabel`,`three-solid`,`btn3`),new p(`4`,`GHI`,`digitFourLabel`,`four-solid`,`btn4`),new p(`5`,`JKL`,`digitFiveLabel`,`five-solid`,`btn5`),new p(`6`,`MNO`,`digitSixLabel`,`six-solid`,`btn6`),new p(`7`,`PQRS`,`digitSevenLabel`,`seven-solid`,`btn7`),new p(`8`,`TUV`,`digitEightLabel`,`eight-solid`,`btn8`),new p(`9`,`WXYZ`,`digitNineLabel`,`nine-solid`,`btn9`),new p(`*`,null,`digitAsteriskLabel`,`asterisk-2-solid`,`btnAsterisk`),new p(`0`,`+`,`digitZeroLabel`,`zero-solid`,`btn0`),new p(`#`,null,`digitHashtagLabel`,`hashtag-solid`,`btnHashtag`)],h=({noInput:e,size:t})=>c.t(`base`,[`size-${t}`,!!t],[`no-input`,!!e]);function g(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 _(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 v(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),n.repeat||t._startKeyboardLongPress()),!0}function y(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),!t._endKeyboardLongPress()&&!t.disabled&&!t.callActive&&w(e,{parent:t,event:new MouseEvent(`click`,{bubbles:!0})})),!0}function b(e){e.value=e._textFieldEl.value}function x(e,{event:t}){t.stopImmediatePropagation()}function S(e){e.value=e.value.slice(0,-1),e.$emit(`input`),e.$emit(`change`),e.value===``&&e._textFieldEl?.focus()}function C(e,n){return t.d`<${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/definition2.cjs`),c=require(`../bundled/class-names.cjs`);require(`../bundled/key-codes.cjs`);const l=require(`../bundled/definition6.cjs`),u=require(`../bundled/definition12.cjs`);var d=`: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}`,f=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.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.callActive?this.$emit(`end-call`):this.$emit(`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`})],f.prototype,`helperText`,void 0),o.t([t.m],f.prototype,`placeholder`,void 0),o.t([t.m({mode:`fromView`})],f.prototype,`value`,void 0),o.t([t.m({mode:`fromView`})],f.prototype,`pattern`,void 0),o.t([t.m({mode:`boolean`})],f.prototype,`disabled`,void 0),o.t([t.m({mode:`boolean`})],f.prototype,`pending`,void 0),o.t([t.m({attribute:`call-active`,mode:`boolean`})],f.prototype,`callActive`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-call`})],f.prototype,`noCall`,void 0),o.t([t.m({mode:`boolean`,attribute:`no-input`})],f.prototype,`noInput`,void 0),o.t([t.m],f.prototype,`size`,void 0),o.t([t.m({attribute:`end-call-button-label`})],f.prototype,`endCallButtonLabel`,void 0),o.t([t.m({attribute:`call-button-label`})],f.prototype,`callButtonLabel`,void 0),o.t([t.m({attribute:`delete-aria-label`})],f.prototype,`deleteAriaLabel`,void 0),o.t([t.m({mode:`boolean`})],f.prototype,`autofocus`,void 0),o.t([t.A],f.prototype,`_errorAnnouncement`,void 0);var p=class{constructor(e,t,n,r,i){this.value=e,this.label=t,this.ariaLabel=n,this.icon=r,this.id=i}},m=[new p(`1`,`&nbsp;`,`digitOneLabel`,`one-solid`,`btn1`),new p(`2`,`ABC`,`digitTwoLabel`,`two-solid`,`btn2`),new p(`3`,`DEF`,`digitThreeLabel`,`three-solid`,`btn3`),new p(`4`,`GHI`,`digitFourLabel`,`four-solid`,`btn4`),new p(`5`,`JKL`,`digitFiveLabel`,`five-solid`,`btn5`),new p(`6`,`MNO`,`digitSixLabel`,`six-solid`,`btn6`),new p(`7`,`PQRS`,`digitSevenLabel`,`seven-solid`,`btn7`),new p(`8`,`TUV`,`digitEightLabel`,`eight-solid`,`btn8`),new p(`9`,`WXYZ`,`digitNineLabel`,`nine-solid`,`btn9`),new p(`*`,null,`digitAsteriskLabel`,`asterisk-2-solid`,`btnAsterisk`),new p(`0`,`+`,`digitZeroLabel`,`zero-solid`,`btn0`),new p(`#`,null,`digitHashtagLabel`,`hashtag-solid`,`btnHashtag`)],h=({noInput:e,size:t})=>c.t(`base`,[`size-${t}`,!!t],[`no-input`,!!e]);function g(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 _(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 v(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),n.repeat||t._startKeyboardLongPress()),!0}function y(e,{parent:t,event:n}){return(n.key===` `||n.key===`Space`)&&e.value===`0`&&(n.preventDefault(),!t._endKeyboardLongPress()&&!t.disabled&&!t.callActive&&w(e,{parent:t,event:new MouseEvent(`click`,{bubbles:!0})})),!0}function b(e){e.value=e._textFieldEl.value}function x(e,{event:t}){t.stopImmediatePropagation()}function S(e){e.value=e.value.slice(0,-1),e.$emit(`input`),e.$emit(`change`),e.value===``&&e._textFieldEl?.focus()}function C(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}"
@@ -11,7 +11,7 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 			?autofocus="${e=>e.autofocus}"
 			scale="${e=>e.size===`condensed`?`condensed`:`normal`}">
 			>
-         ${i.t(e=>e.value&&e.value.length&&e.value.length>0,t.d`<${n}
+         ${i.t(e=>e.value&&e.value.length&&e.value.length>0,t.p`<${n}
                 slot="action-items"
 								size='super-condensed'
 								icon="backspace-line"
@@ -20,8 +20,8 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 								?disabled="${e=>e.disabled||e.callActive}"
 								@click="${e=>S(e)}">
             </${n}>`)}
-        </${e}>`}function w(e,{parent:t,event:n}){if(t._suppressNextClick){t._suppressNextClick=!1;return}t.value+=e.value,t.$emit(`keypad-click`,n.currentTarget),t.$emit(`input`),t.$emit(`change`)}function T(e,r){return t.d`
-		${n.n(e=>m,t.d`
+        </${e}>`}function w(e,{parent:t,event:n}){if(t._suppressNextClick){t._suppressNextClick=!1;return}t.value+=e.value,t.$emit(`keypad-click`,n.currentTarget),t.$emit(`input`),t.$emit(`change`)}function T(e,r){return t.p`
+		${n.n(e=>m,t.p`
 			<${e}
 					  id="${e=>e.id}"
 					  value="${e=>e.value}"
@@ -46,7 +46,7 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 									class="digit-btn-num"></${r}>
 					</${e}>
 		`,{positioning:!0})}
-	`}function E(e){return t.d`<${e} class="call-btn"
+	`}function E(e){return t.p`<${e} class="call-btn"
         size="${e=>e.size===`condensed`?`normal`:`expanded`}"
         appearance="filled"
         icon="${e=>e.callActive?`disable-call-line`:`call-line`}"
@@ -55,11 +55,11 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 		?pending="${e=>e.pending}"
         @click="${e=>e._onDial()}"
         label="${e=>e.callActive?e.endCallButtonLabel||e.locale.dialPad.endCallButtonLabel:e.callButtonLabel||e.locale.dialPad.callButtonLabel}">
-    </${e}>`}function D(e){return t.d`<${e} role="alert" aria-atomic="true">
+    </${e}>`}function D(e){return t.p`<${e} role="alert" aria-atomic="true">
 		${e=>`${e.locale.dialPad.errorLabel} ${e._errorAnnouncement}`}
-	</${e}>`}var O=t.o(`dial-pad`,f,e=>{let n=e.tagFor(l.i),r=e.tagFor(s.r),o=e.tagFor(u.r),c=e.tagFor(a.r);return t.d` <div class="${h}">
+	</${e}>`}var O=t.u(`dial-pad`,f,e=>{let n=e.tagFor(l.i),r=e.tagFor(s.r),o=e.tagFor(u.r),c=e.tagFor(a.r);return t.p` <div class="${h}">
 		${i.t(e=>!e.noInput,C(o,n))}
 		<div class="digits">${T(n,r)}</div>
 		${i.t(e=>!e.noCall,E(n))}
 		${D(c)}
-	</div>`},[l.t,u.n,s.t,a.n],{styles:d});t.s(O)();
+	</div>`},[l.t,u.n,s.t,a.n],{styles:d});t.d(O)();

package/dial-pad/index.js

@@ -1,10 +1,9 @@
 import { t as e } from "../bundled/localized.js";
-import { T as t, d as n, l as r, o as i, s as a, t as o } from "../bundled/vivid-element.js";
+import { A as t, d as n, m as r, p as i, t as a, u as o } from "../bundled/vivid-element.js";
 import { n as s } from "../bundled/repeat.js";
 import { t as c } from "../bundled/ref.js";
 import { t as l } from "../bundled/when.js";
 import { n as u, r as d } from "../bundled/definition.js";
-import "../bundled/numberConverter.js";
 import { t as f } from "../bundled/decorate.js";
 import { r as p, t as m } from "../bundled/definition2.js";
 import { t as h } from "../bundled/class-names.js";
@@ -12,7 +11,7 @@ import "../bundled/key-codes.js";
 import { i as g, t as _ } from "../bundled/definition6.js";
 import { n as v, r as y } from "../bundled/definition12.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}", x = class extends e(o) {
+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}", 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.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.callActive ? this.$emit("end-call") : this.$emit("dial");
@@ -133,7 +132,7 @@ function j(e) {
 	e.value = e.value.slice(0, -1), e.$emit("input"), e.$emit("change"), e.value === "" && e._textFieldEl?.focus();
 }
 function M(e, t) {
-	return n`<${e} ${c("_textFieldEl")} class="phone-field" internal-part type="tel"
+	return i`<${e} ${c("_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}"
@@ -146,7 +145,7 @@ function M(e, t) {
 			?autofocus="${(e) => e.autofocus}"
 			scale="${(e) => e.size === "condensed" ? "condensed" : "normal"}">
 			>
-         ${l((e) => e.value && e.value.length && e.value.length > 0, n`<${t}
+         ${l((e) => e.value && e.value.length && e.value.length > 0, i`<${t}
                 slot="action-items"
 								size='super-condensed'
 								icon="backspace-line"
@@ -165,8 +164,8 @@ function N(e, { parent: t, event: n }) {
 	t.value += e.value, t.$emit("keypad-click", n.currentTarget), t.$emit("input"), t.$emit("change");
 }
 function P(e, t) {
-	return n`
-		${s((e) => C, n`
+	return i`
+		${s((e) => C, i`
 			<${e}
 					  id="${(e) => e.id}"
 					  value="${(e) => e.value}"
@@ -200,7 +199,7 @@ function P(e, t) {
 	`;
 }
 function F(e) {
-	return n`<${e} class="call-btn"
+	return i`<${e} class="call-btn"
         size="${(e) => e.size === "condensed" ? "normal" : "expanded"}"
         appearance="filled"
         icon="${(e) => e.callActive ? "disable-call-line" : "call-line"}"
@@ -212,17 +211,17 @@ function F(e) {
     </${e}>`;
 }
 function I(e) {
-	return n`<${e} role="alert" aria-atomic="true">
+	return i`<${e} role="alert" aria-atomic="true">
 		${(e) => `${e.locale.dialPad.errorLabel} ${e._errorAnnouncement}`}
 	</${e}>`;
 }
 //#endregion
 //#region src/lib/dial-pad/index.ts
-a(i("dial-pad", x, (e) => {
-	let t = e.tagFor(g), r = e.tagFor(p), i = e.tagFor(y), a = e.tagFor(d);
-	return n` <div class="${w}">
-		${l((e) => !e.noInput, M(i, t))}
-		<div class="digits">${P(t, r)}</div>
+n(o("dial-pad", x, (e) => {
+	let t = e.tagFor(g), n = e.tagFor(p), r = e.tagFor(y), a = e.tagFor(d);
+	return i` <div class="${w}">
+		${l((e) => !e.noInput, M(r, t))}
+		<div class="digits">${P(t, n)}</div>
 		${l((e) => !e.noCall, F(t))}
 		${I(a)}
 	</div>`;

package/dialog/definition.cjs

@@ -1,6 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require("../unbundled/numberConverter.cjs");
-const require_definition = require("../unbundled/definition41.cjs");
+const require_definition = require("../unbundled/definition40.cjs");
 exports.VwcDialogElement = require_definition.Dialog;
 exports.dialogDefinition = require_definition.dialogDefinition;
 exports.registerDialog = require_definition.registerDialog;

package/dialog/definition.js

@@ -1,3 +1,2 @@
-import "../unbundled/numberConverter.js";
-import { n as registerDialog, r as Dialog, t as dialogDefinition } from "../unbundled/definition41.js";
+import { n as registerDialog, r as Dialog, t as dialogDefinition } from "../unbundled/definition40.js";
 export { Dialog as VwcDialogElement, dialogDefinition, registerDialog };

package/dialog/index.cjs

@@ -1,47 +1,49 @@
-const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/when.cjs`),r=require(`../bundled/slotted.cjs`);require(`../bundled/numberConverter.cjs`);const i=require(`../bundled/decorate.cjs`),a=require(`../bundled/definition2.cjs`),o=require(`../bundled/delegates-aria.cjs`),s=require(`../bundled/class-names.cjs`),c=require(`../bundled/definition6.cjs`),l=require(`../bundled/definition7.cjs`),u=require(`../bundled/dialog.cjs`);var d=`.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}`,f=class extends e.t(o.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}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=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()};#i=e=>{e.target.method===`dialog`&&(this.open=!1)};_onKeyDown(e){return u.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.l({mode:`boolean`})],f.prototype,`open`,void 0),i.t([t.l],f.prototype,`icon`,void 0),i.t([t.l({attribute:`icon-placement`})],f.prototype,`iconPlacement`,void 0),i.t([t.l],f.prototype,`subtitle`,void 0),i.t([t.l],f.prototype,`headline`,void 0),i.t([t.l({attribute:`full-width-body`,mode:`boolean`})],f.prototype,`fullWidthBody`,void 0),i.t([t.l({attribute:`dismiss-button-aria-label`})],f.prototype,`dismissButtonAriaLabel`,void 0),i.t([t.l({attribute:`no-light-dismiss`,mode:`boolean`})],f.prototype,`noLightDismiss`,void 0),i.t([t.l({attribute:`no-dismiss-on-esc`,mode:`boolean`})],f.prototype,`noDismissOnEsc`,void 0),i.t([t.l({attribute:`no-dismiss-button`,mode:`boolean`})],f.prototype,`noDismissButton`,void 0),i.t([t.l({attribute:`non-dismissible`,mode:`boolean`})],f.prototype,`nonDismissible`,void 0),i.t([t.l({mode:`boolean`})],f.prototype,`modal`,void 0),i.t([t.l({mode:`boolean`,attribute:`scrollable-body`})],f.prototype,`scrollableBody`,void 0),i.t([t.T],f.prototype,`_openedAsModal`,void 0),i.t([t.T],f.prototype,`bodySlottedContent`,void 0),i.t([t.T],f.prototype,`footerSlottedContent`,void 0),i.t([t.T],f.prototype,`actionItemsSlottedContent`,void 0);var p=({iconPlacement:e,bodySlottedContent:t,footerSlottedContent:n,actionItemsSlottedContent:r,_openedAsModal:i,scrollableBody:a})=>s.t(`base`,[`icon-placement-${e}`,!!e],[`hide-body`,!t?.length],[`hide-footer`,!(n?.length||r?.length)],[`modal`,i],[`scrollable-body`,!!a]);function m(e){return t.d`
+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/definition2.cjs`),o=require(`../bundled/class-names.cjs`),s=require(`../bundled/delegates-aria.cjs`),c=require(`../bundled/definition6.cjs`),l=require(`../bundled/definition7.cjs`),u=require(`../bundled/dialog.cjs`);var d=`.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}`,f=class extends e.t(s.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 u.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`})],f.prototype,`open`,void 0),i.t([t.m],f.prototype,`icon`,void 0),i.t([t.m({attribute:`icon-placement`})],f.prototype,`iconPlacement`,void 0),i.t([t.m],f.prototype,`subtitle`,void 0),i.t([t.m],f.prototype,`headline`,void 0),i.t([t.m({attribute:`full-width-body`,mode:`boolean`})],f.prototype,`fullWidthBody`,void 0),i.t([t.m({attribute:`dismiss-button-aria-label`})],f.prototype,`dismissButtonAriaLabel`,void 0),i.t([t.m({attribute:`no-light-dismiss`,mode:`boolean`})],f.prototype,`noLightDismiss`,void 0),i.t([t.m({attribute:`no-dismiss-on-esc`,mode:`boolean`})],f.prototype,`noDismissOnEsc`,void 0),i.t([t.m({attribute:`no-dismiss-button`,mode:`boolean`})],f.prototype,`noDismissButton`,void 0),i.t([t.m({attribute:`non-dismissible`,mode:`boolean`})],f.prototype,`nonDismissible`,void 0),i.t([t.m({mode:`boolean`})],f.prototype,`modal`,void 0),i.t([t.m({mode:`boolean`,attribute:`scrollable-body`})],f.prototype,`scrollableBody`,void 0),i.t([t.A],f.prototype,`_openedAsModal`,void 0),i.t([t.A],f.prototype,`bodySlottedContent`,void 0),i.t([t.A],f.prototype,`footerSlottedContent`,void 0),i.t([t.A],f.prototype,`actionItemsSlottedContent`,void 0);var p=({iconPlacement:e,bodySlottedContent:t,footerSlottedContent:n,actionItemsSlottedContent:r,_openedAsModal:i,scrollableBody:a})=>o.t(`base`,[`icon-placement-${e}`,!!e],[`hide-body`,!t?.length],[`hide-footer`,!(n?.length||r?.length)],[`modal`,i],[`scrollable-body`,!!a]);function m(e){return t.p`
 		<${e} class="icon" name="${e=>e.icon}"></${e}>
-	`}function h(){return t.d`
+	`}function h(){return t.p`
 		<h2 class="headline" id="dialog-headline">${e=>e.headline}</h2>
-	`}function g(){return t.d` <h3 class="subtitle">${e=>e.subtitle}</h3> `}function _(){return t.d`
+	`}function g(){return t.p`
+		<h3 class="subtitle" id="dialog-subtitle">${e=>e.subtitle}</h3>
+	`}function _(){return t.p`
 		<div class="header-text">${h()} ${g()}</div>
-	`}function v(e){return t.d`
+	`}function v(e){return t.p`
 	<${e}
 		aria-label="${e=>e.dismissButtonAriaLabel||e.locale.dialog.dismissButtonLabel}"
 		size="condensed"
 		class="dismiss-button"
 		icon="close-line"
 		@click="${e=>e._handleCloseRequest()}"
-	></${e}>`}var y=t.o(`dialog`,f,e=>{let i=e.tagFor(l.r),s=e.tagFor(a.r),u=e.tagFor(c.i);return t.d`
+	></${e}>`}var y=t.u(`dialog`,f,e=>{let i=e.tagFor(l.r),o=e.tagFor(a.r),u=e.tagFor(c.i);return t.p`
 	<${i} dp="8" not-relative>
 		<dialog class="${p}"
+
 				@keydown="${(e,t)=>e._onKeyDown(t.event)}"
 				@cancel="${(e,t)=>t.event.preventDefault()}"
-				${o.n({ariaModal:e=>String(e._openedAsModal)})}
-				aria-labelledby="${e=>e.headline?`dialog-headline`:null}"
+				${s.n({ariaModal:e=>String(e._openedAsModal),ariaLabelledBy:e=>e.headline?`dialog-headline dialog-subtitle`:null})}
 		>
 			<slot name="main">
 				<div class="main-wrapper">
 					<div class="header ${e=>e.subtitle?`border`:``}">
+							${r.t(e=>e._showDismissButton,v(u))}
 							<slot name="graphic">
-								${n.t(e=>e.icon,m(s))}
+								${r.t(e=>e.icon,m(o))}
 							</slot>
-							${n.t(e=>e.headline&&e.subtitle,_())}
-							${n.t(e=>e.headline&&!e.subtitle,h())}
-							${n.t(e=>e.subtitle&&!e.headline,g())}
-							${n.t(e=>e._showDismissButton,v(u))}
+							${r.t(e=>e.headline&&e.subtitle,_())}
+							${r.t(e=>e.headline&&!e.subtitle,h())}
+							${r.t(e=>e.subtitle&&!e.headline,g())}
 					</div>
 					<div class="body ${e=>e.fullWidthBody?`full-width`:``}" >
-						<slot name="body" ${r.t(`bodySlottedContent`)}></slot>
+						<slot name="body" ${n.t(`bodySlottedContent`)}></slot>
 					</div>
 					<div class="footer">
 						<div>
-							<slot name="footer" ${r.t(`footerSlottedContent`)}></slot>
+							<slot name="footer" ${n.t(`footerSlottedContent`)}></slot>
 						</div>
 						<div class="actions">
-							<slot name="action-items" ${r.t(`actionItemsSlottedContent`)}></slot>
+							<slot name="action-items" ${n.t(`actionItemsSlottedContent`)}></slot>
 						</div>
 					</div>
 				</div>
 			</slot>
 		</dialog>
-	</${i}>`},[a.t,c.t,l.t],{styles:d});t.s(y)();
+	</${i}>`},[a.t,c.t,l.t],{styles:d});t.d(y)();

package/dialog/index.js

@@ -1,19 +1,24 @@
 import { t as e } from "../bundled/localized.js";
-import { T as t, d as n, l as r, o as i, s as a, t as o } from "../bundled/vivid-element.js";
-import { t as s } from "../bundled/when.js";
-import { t as c } from "../bundled/slotted.js";
-import "../bundled/numberConverter.js";
+import { A as t, d as n, m as r, p as i, t as a, u as o } from "../bundled/vivid-element.js";
+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 { r as u, t as d } from "../bundled/definition2.js";
-import { n as f, t as p } from "../bundled/delegates-aria.js";
-import { t as m } from "../bundled/class-names.js";
+import { t as f } from "../bundled/class-names.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 { 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(p(o)) {
+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)) {
 	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;
+		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()));
@@ -43,14 +48,8 @@ var b = ".base{white-space:initial;box-sizing:border-box;color:var(--vvd-color-c
 			case "light-dismiss": return !this.noLightDismiss;
 		}
 	}
-	#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();
-	};
-	#i = (e) => {
-		e.target.method === "dialog" && (this.open = !1);
-	};
+	#r;
+	#i;
 	_onKeyDown(e) {
 		return y(e) && this._openedAsModal ? (this.#n("escape") && this._handleCloseRequest(), !1) : !0;
 	}
@@ -105,27 +104,29 @@ l([r({ mode: "boolean" })], x.prototype, "open", void 0), l([r], x.prototype, "i
 })], x.prototype, "scrollableBody", void 0), l([t], x.prototype, "_openedAsModal", void 0), l([t], x.prototype, "bodySlottedContent", void 0), l([t], x.prototype, "footerSlottedContent", void 0), l([t], x.prototype, "actionItemsSlottedContent", void 0);
 //#endregion
 //#region src/lib/dialog/dialog.template.ts
-var S = ({ iconPlacement: e, bodySlottedContent: t, footerSlottedContent: n, actionItemsSlottedContent: r, _openedAsModal: i, scrollableBody: a }) => m("base", [`icon-placement-${e}`, !!e], ["hide-body", !t?.length], ["hide-footer", !(n?.length || r?.length)], ["modal", i], ["scrollable-body", !!a]);
+var S = ({ iconPlacement: e, bodySlottedContent: t, footerSlottedContent: n, actionItemsSlottedContent: r, _openedAsModal: i, scrollableBody: a }) => f("base", [`icon-placement-${e}`, !!e], ["hide-body", !t?.length], ["hide-footer", !(n?.length || r?.length)], ["modal", i], ["scrollable-body", !!a]);
 function C(e) {
-	return n`
+	return i`
 		<${e} class="icon" name="${(e) => e.icon}"></${e}>
 	`;
 }
 function w() {
-	return n`
+	return i`
 		<h2 class="headline" id="dialog-headline">${(e) => e.headline}</h2>
 	`;
 }
 function T() {
-	return n` <h3 class="subtitle">${(e) => e.subtitle}</h3> `;
+	return i`
+		<h3 class="subtitle" id="dialog-subtitle">${(e) => e.subtitle}</h3>
+	`;
 }
 function E() {
-	return n`
+	return i`
 		<div class="header-text">${w()} ${T()}</div>
 	`;
 }
 function D(e) {
-	return n`
+	return i`
 	<${e}
 		aria-label="${(e) => e.dismissButtonAriaLabel || e.locale.dialog.dismissButtonLabel}"
 		size="condensed"
@@ -136,36 +137,39 @@ function D(e) {
 }
 //#endregion
 //#region src/lib/dialog/index.ts
-a(i("dialog", x, (e) => {
-	let t = e.tagFor(_), r = e.tagFor(u), i = e.tagFor(h);
-	return n`
+n(o("dialog", x, (e) => {
+	let t = e.tagFor(_), n = e.tagFor(u), r = e.tagFor(h);
+	return i`
 	<${t} dp="8" not-relative>
 		<dialog class="${S}"
+
 				@keydown="${(e, t) => e._onKeyDown(t.event)}"
 				@cancel="${(e, t) => t.event.preventDefault()}"
-				${f({ ariaModal: (e) => String(e._openedAsModal) })}
-				aria-labelledby="${(e) => e.headline ? "dialog-headline" : null}"
+				${p({
+		ariaModal: (e) => String(e._openedAsModal),
+		ariaLabelledBy: (e) => e.headline ? "dialog-headline dialog-subtitle" : null
+	})}
 		>
 			<slot name="main">
 				<div class="main-wrapper">
 					<div class="header ${(e) => e.subtitle ? "border" : ""}">
+							${c((e) => e._showDismissButton, D(r))}
 							<slot name="graphic">
-								${s((e) => e.icon, C(r))}
+								${c((e) => e.icon, C(n))}
 							</slot>
-							${s((e) => e.headline && e.subtitle, E())}
-							${s((e) => e.headline && !e.subtitle, w())}
-							${s((e) => e.subtitle && !e.headline, T())}
-							${s((e) => e._showDismissButton, D(i))}
+							${c((e) => e.headline && e.subtitle, E())}
+							${c((e) => e.headline && !e.subtitle, w())}
+							${c((e) => e.subtitle && !e.headline, T())}
 					</div>
 					<div class="body ${(e) => e.fullWidthBody ? "full-width" : ""}" >
-						<slot name="body" ${c("bodySlottedContent")}></slot>
+						<slot name="body" ${s("bodySlottedContent")}></slot>
 					</div>
 					<div class="footer">
 						<div>
-							<slot name="footer" ${c("footerSlottedContent")}></slot>
+							<slot name="footer" ${s("footerSlottedContent")}></slot>
 						</div>
 						<div class="actions">
-							<slot name="action-items" ${c("actionItemsSlottedContent")}></slot>
+							<slot name="action-items" ${s("actionItemsSlottedContent")}></slot>
 						</div>
 					</div>
 				</div>

package/divider/definition.cjs

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_divider = require("../unbundled/divider.cjs");
-const require_definition = require("../unbundled/definition36.cjs");
+const require_definition = require("../unbundled/definition35.cjs");
 exports.VwcDividerElement = require_divider.Divider;
 exports.dividerDefinition = require_definition.dividerDefinition;
 exports.registerDivider = require_definition.registerDivider;

package/divider/definition.js

@@ -1,3 +1,3 @@
 import { t as Divider } from "../unbundled/divider.js";
-import { n as registerDivider, t as dividerDefinition } from "../unbundled/definition36.js";
+import { n as registerDivider, t as dividerDefinition } from "../unbundled/definition35.js";
 export { Divider as VwcDividerElement, dividerDefinition, registerDivider };

package/divider/index.cjs

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

package/divider/index.js

@@ -1,4 +1,3 @@
-import "../bundled/vivid-element.js";
 import { n as e } from "../bundled/definition19.js";
 //#region src/lib/divider/index.ts
 e();

package/elevation/index.cjs

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

package/elevation/index.js

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

package/empty-state/definition.cjs

@@ -1,6 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require("../unbundled/numberConverter.cjs");
-const require_definition = require("../unbundled/definition42.cjs");
+const require_definition = require("../unbundled/definition41.cjs");
 exports.VwcEmptyStateElement = require_definition.EmptyState;
 exports.emptyStateDefinition = require_definition.emptyStateDefinition;
 exports.registerEmptyState = require_definition.registerEmptyState;

package/empty-state/definition.js

@@ -1,3 +1,2 @@
-import "../unbundled/numberConverter.js";
-import { n as registerEmptyState, r as EmptyState, t as emptyStateDefinition } from "../unbundled/definition42.js";
+import { n as registerEmptyState, r as EmptyState, t as emptyStateDefinition } from "../unbundled/definition41.js";
 export { EmptyState as VwcEmptyStateElement, emptyStateDefinition, registerEmptyState };

package/empty-state/index.cjs

@@ -1,19 +1,19 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/slotted.cjs`);require(`../bundled/numberConverter.cjs`);const r=require(`../bundled/decorate.cjs`),i=require(`../bundled/definition2.cjs`),a=require(`../bundled/class-names.cjs`);var o=`: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}`,s=class extends e.t{};r.t([e.l],s.prototype,`connotation`,void 0),r.t([e.l],s.prototype,`headline`,void 0),r.t([e.l],s.prototype,`icon`,void 0),r.t([e.l({attribute:`icon-decoration`})],s.prototype,`iconDecoration`,void 0),r.t([e.T],s.prototype,`slottedActionItems`,void 0);var c=({connotation:e,slottedActionItems:t})=>a.t(`base`,[`connotation-${e}`,!!e],[`no-actions`,t?.length===0]),l=e.o(`empty-state`,s,r=>{let a=r.tagFor(i.r);return e.d` <div
+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/definition2.cjs`),a=require(`../bundled/class-names.cjs`);var o=`: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}`,s=class extends e.t{};r.t([e.m],s.prototype,`connotation`,void 0),r.t([e.m],s.prototype,`headline`,void 0),r.t([e.m],s.prototype,`icon`,void 0),r.t([e.m({attribute:`icon-decoration`})],s.prototype,`iconDecoration`,void 0),r.t([e.A],s.prototype,`slottedActionItems`,void 0);var c=({connotation:e,slottedActionItems:t})=>a.t(`base`,[`connotation-${e}`,!!e],[`no-actions`,t?.length===0]),l=e.u(`empty-state`,s,r=>{let a=r.tagFor(i.r);return e.p` <div
 		class="${c}"
 		aria-labelledby="${e=>e.headline?`empty-state-headline`:null}"
 	>
 		<slot name="graphic">
-			${t.t(e=>e.icon,e.d`<div class="icon-container">
+			${n.t(e=>e.icon,e.p`<div class="icon-container">
 					<${a} class="icon" name="${e=>e.icon}"></${a}>
 				</div>`)}
 		</slot>
 		<div class="content">
-			${t.t(e=>e.headline,e.d`<header id="empty-state-headline">
+			${n.t(e=>e.headline,e.p`<header id="empty-state-headline">
 					${e=>e.headline}
 				</header>`)}
 			<slot></slot>
 		</div>
 		<div class="actions">
-			<slot name="action-items" ${n.t(`slottedActionItems`)}></slot>
+			<slot name="action-items" ${t.t(`slottedActionItems`)}></slot>
 		</div>
-	</div>`},[i.t],{styles:o});e.s(l)();
+	</div>`},[i.t],{styles:o});e.d(l)();