@vonage/vivid 5.24.0 → 5.25.0

package/bundled/definition6.cjs

@@ -1,12 +1,12 @@
-const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./ref.cjs`),r=require(`./when.cjs`),i=require(`./enums.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./affix.cjs`),l=require(`./definition5.cjs`),u=require(`./delegates-aria.cjs`),d=require(`./button.cjs`),f=require(`./linkable.cjs`);var p=class extends c.n(e.t(f.t(d.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.pressed=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};a.t([t.m({converter:{fromView:e=>e||null,toView:e=>e||null}})],p.prototype,`title`,void 0),a.t([t.m],p.prototype,`connotation`,void 0),a.t([t.m],p.prototype,`shape`,void 0),a.t([t.m],p.prototype,`appearance`,void 0),a.t([t.m],p.prototype,`size`,void 0),a.t([t.m({mode:`boolean`,attribute:`stacked`})],p.prototype,`stacked`,void 0),a.t([t.m({mode:`boolean`,attribute:`pending`})],p.prototype,`pending`,void 0),a.t([t.m({mode:`boolean`,attribute:`dropdown-indicator`})],p.prototype,`dropdownIndicator`,void 0),a.t([t.m({mode:`boolean`,attribute:`active`})],p.prototype,`active`,void 0),a.t([t.m({mode:`boolean`,attribute:`pressed`})],p.prototype,`pressed`,void 0),a.t([t.m],p.prototype,`label`,void 0);var m=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_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-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_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-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_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)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled: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:not(.appearance-filled):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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}`,h=e=>{let n=e.tagFor(s.r);return t.p`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function g(e,t){let n=e??`ghost`;if(t){if(n===`ghost`)return`subtle`;if(n===`ghost-light`)return`subtle-light`;if(n===`outlined`)return`filled`}return n}var _=e=>o.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],`appearance-${g(e.appearance,e.pressed)}`,[`disabled`,e.disabled||e.pending],[`shape-${e.shape}`,!!e.shape],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)&&!e.dropdownIndicator],[`icon-trailing`,e.iconTrailing],[`stacked`,e.stacked],[`active`,e.ariaExpanded===`true`||e.active]);function v(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(l.r),s={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.p`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return o.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${s[a]}"></${r}></span>`}else return c.a(e)(n,c.i.Slot)}var y=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,b=e=>{let n=h(e);return t.p`<span class="content">
-			${t=>v(e,t.icon,t.pending,t.size)}
+const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./ref.cjs`),r=require(`./when.cjs`),i=require(`./enums.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./icon.cjs`),l=require(`./affix.cjs`),u=require(`./definition5.cjs`),d=require(`./delegates-aria.cjs`),f=require(`./button.cjs`),p=require(`./linkable.cjs`);var m=class extends l.n(e.t(p.t(f.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.pressed=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};a.t([t.m({converter:{fromView:e=>e||null,toView:e=>e||null}})],m.prototype,`title`,void 0),a.t([t.m],m.prototype,`connotation`,void 0),a.t([t.m],m.prototype,`shape`,void 0),a.t([t.m],m.prototype,`appearance`,void 0),a.t([t.m],m.prototype,`size`,void 0),a.t([t.m({mode:`boolean`,attribute:`stacked`})],m.prototype,`stacked`,void 0),a.t([t.m({mode:`boolean`,attribute:`pending`})],m.prototype,`pending`,void 0),a.t([t.m({mode:`boolean`,attribute:`dropdown-indicator`})],m.prototype,`dropdownIndicator`,void 0),a.t([t.m({mode:`boolean`,attribute:`active`})],m.prototype,`active`,void 0),a.t([t.m({mode:`boolean`,attribute:`pressed`})],m.prototype,`pressed`,void 0),a.t([t.m],m.prototype,`label`,void 0);var h=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_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-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_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-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_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)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled: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:not(.appearance-filled):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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}`,g=e=>{let n=e.tagFor(c.t);return t.p`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function _(e,t){let n=e??`ghost`;if(t){if(n===`ghost`)return`subtle`;if(n===`ghost-light`)return`subtle-light`;if(n===`outlined`)return`filled`}return n}var v=e=>o.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],`appearance-${_(e.appearance,e.pressed)}`,[`disabled`,e.disabled||e.pending],[`shape-${e.shape}`,!!e.shape],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)&&!e.dropdownIndicator],[`icon-trailing`,e.iconTrailing],[`stacked`,e.stacked],[`active`,e.ariaExpanded===`true`||e.active]);function y(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(u.r),s={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.p`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return o.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${s[a]}"></${r}></span>`}else return l.a(e)(n,l.i.Slot)}var b=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,x=e=>{let n=g(e);return t.p`<span class="content">
+			${t=>y(e,t.icon,t.pending,t.size)}
 			${r.t(e=>e.label,t.p`<span class="text" aria-hidden="true">${e=>e.label}</span>`)}
 			<span class="sr-only"
 				>${e=>e.pending?e.locale.button.pendingLabel:e.ariaLabel??e.label}</span
 			>
 		</span>
-		${r.t(e=>e.dropdownIndicator,n)}`};function x(e){return t.p` <button
-		class="${_}"
+		${r.t(e=>e.dropdownIndicator,n)}`};function S(e){return t.p` <button
+		class="${v}"
 		?autofocus="${e=>e.autofocus}"
 		form="${e=>e.formId}"
 		formaction="${e=>e.formaction}"
@@ -15,15 +15,15 @@ const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`.
 		formnovalidate="${e=>e.formnovalidate}"
 		formtarget="${e=>e.formtarget}"
 		name="${e=>e.name}"
-		type="${e=>y(e.type)}"
+		type="${e=>b(e.type)}"
 		value="${e=>e.value}"
 		title="${e=>e.title}"
-		${u.n({ariaLabel:null,ariaDisabled:e=>e.disabled||e.pending,ariaPressed:e=>e.pressed?`true`:e.ariaPressed??null})}
+		${d.n({ariaLabel:null,ariaDisabled:e=>e.disabled||e.pending,ariaPressed:e=>e.pressed?`true`:e.ariaPressed??null})}
 		${n.t(`control`)}
 		@click="${(e,t)=>e.clickHandler(t.event)}"
 	>
-		${b(e)}
-	</button>`}function S(e){return t.p`${t=>t._renderLinkElement(b(e),_,{ariaLabel:null})}`}var C=t.u(`button`,p,e=>t.p` <template>
-		${r.t(e=>!e.href,t.p`${x(e)}`)}
-		${r.t(e=>e.href,S(e))}
-	</template>`,[s.t,l.t],{styles:m,shadowOptions:{delegatesFocus:!0}}),w=t.d(C);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return w}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return C}});
+		${x(e)}
+	</button>`}function C(e){return t.p`${t=>t._renderLinkElement(x(e),v,{ariaLabel:null})}`}var w=t.u(`button`,m,e=>t.p` <template>
+		${r.t(e=>!e.href,t.p`${S(e)}`)}
+		${r.t(e=>e.href,C(e))}
+	</template>`,[s.t,u.t],{styles:h,shadowOptions:{delegatesFocus:!0}}),T=t.d(w);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return T}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return w}});

package/bundled/definition6.js

@@ -5,7 +5,8 @@ import { t as o } from "./when.js";
 import { a as s } from "./enums.js";
 import { t as c } from "./decorate.js";
 import { t as l } from "./class-names.js";
-import { r as u, t as d } from "./definition3.js";
+import { t as u } from "./definition3.js";
+import { t as d } from "./icon.js";
 import { a as f, i as p, n as m } from "./affix.js";
 import { r as h, t as g } from "./definition5.js";
 import { n as _ } from "./delegates-aria.js";
@@ -47,7 +48,7 @@ c([n({ converter: {
 //#endregion
 //#region src/lib/button/button.scss?inline
 var x = ".chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_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-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_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-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_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)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled: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:not(.appearance-filled):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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}", S = (e) => {
-	let t = e.tagFor(u);
+	let t = e.tagFor(d);
 	return r`<${t} class="chevron" aria-hidden="true" name="chevron-down-line"></${t}>`;
 };
 //#endregion
@@ -123,7 +124,7 @@ function k(e) {
 var A = i("button", b, (e) => r` <template>
 		${o((e) => !e.href, r`${O(e)}`)}
 		${o((e) => e.href, k(e))}
-	</template>`, [d, g], {
+	</template>`, [u, g], {
 	styles: x,
 	shadowOptions: { delegatesFocus: !0 }
 }), j = t(A);

package/bundled/definition9.cjs

@@ -1,16 +1,22 @@
-const e=require(`./vivid-element.cjs`),t=require(`./slotted.cjs`),n=require(`./decorate.cjs`),r=require(`./class-names.cjs`),i=require(`./definition8.cjs`),a=require(`./anchored.cjs`),o=require(`./kbd-shortcut.cjs`),s=require(`./render-in-light-dom.cjs`),c=require(`./dialog.cjs`);var l=`:host :host{display:var(--_popup-display,inline)}:host :host([slotted-anchor]){--_popup-display:contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size,auto);box-sizing:border-box;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size,30ch);flex-direction:column;align-items:flex-start;gap:4px;padding:8px 12px;display:flex}`,u=class extends o.t(a.t(e.t)){constructor(...e){super(...e),this.open=!1,this._descriptionId=`vwc-tooltip-desc-${s.n()}`,this.#n=()=>{this.open=!0},this.#r=()=>{this.open=!1},this.#a=e=>{e.key===`Escape`&&this.#r()}}_kbdAriaShortcutsValueChanged(){this._anchorEl&&e.P.setAttribute(this._anchorEl,`aria-keyshortcuts`,this._kbdAriaShortcutsValue)}connectedCallback(){super.connectedCallback(),this.#i()}disconnectedCallback(){super.disconnectedCallback(),this.#i()}_anchorElChanged(e,t){e&&this.#t(e),t&&this.#e(t)}#e(t){t.addEventListener(`mouseover`,this.#n),t.addEventListener(`mouseout`,this.#r),t.addEventListener(`focusin`,this.#n),t.addEventListener(`focusout`,this.#r);let n=t.getAttribute(`aria-describedby`)??t.ariaDescribedBy;t.setAttribute(`aria-describedby`,n?`${n} ${this._descriptionId}`:this._descriptionId),e.P.setAttribute(t,`aria-keyshortcuts`,this._kbdAriaShortcutsValue)}#t(t){t.removeEventListener(`mouseover`,this.#n),t.removeEventListener(`mouseout`,this.#r),t.removeEventListener(`focusin`,this.#n),t.removeEventListener(`focusout`,this.#r);let n=(t.getAttribute(`aria-describedby`)??t.ariaDescribedBy??``).split(` `).filter(e=>e!==this._descriptionId),r=n.length?n.join(` `):null;t.hasAttribute(`aria-describedby`)?e.P.setAttribute(t,`aria-describedby`,r):t.ariaDescribedBy=r,t.removeAttribute(`aria-keyshortcuts`)}#n;#r;#i(){document.removeEventListener(`keydown`,this.#a),this.open&&this.isConnected&&document.addEventListener(`keydown`,this.#a)}#a;openChanged(e){e!==void 0&&this.#i()}};n.t([e.m],u.prototype,`text`,void 0),n.t([e.m({mode:`fromView`})],u.prototype,`placement`,void 0),n.t([e.m({mode:`boolean`})],u.prototype,`open`,void 0);var d=e.u(`tooltip`,u,n=>{let o=n.tagFor(i.i);return e.p`
-${a.n()}
-${s.t(e.p`<span slot="_description" id="${e=>e._descriptionId}">${e=>e.text}</span>`)}
-<${o} class="${e=>r.t(`control`,[`open`,e.open])}" arrow alternate
+const e=require(`./vivid-element.cjs`),t=require(`./slotted.cjs`),n=require(`./when.cjs`),r=require(`./decorate.cjs`),i=require(`./class-names.cjs`),a=require(`./definition8.cjs`),o=require(`./anchored.cjs`),s=require(`./kbd-shortcut.cjs`),c=require(`./render-in-light-dom.cjs`),l=require(`./dialog.cjs`);var u=`:host :host{display:var(--_popup-display,inline)}:host :host([slotted-anchor]){--_popup-display:contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size,auto);box-sizing:border-box;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size,30ch);flex-direction:column;align-items:flex-start;gap:4px;padding:8px 12px;display:flex}.text-secondary{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}`,d=class extends s.t(o.t(e.t)){constructor(...e){super(...e),this.open=!1,this._descriptionId=`vwc-tooltip-desc-${c.n()}`,this._descriptionSecondaryId=`vwc-tooltip-desc-secondary-${c.n()}`,this._defaultSlotContent=[],this.#i=()=>{this.open=!0},this.#a=()=>{this.open=!1},this.#s=e=>{e.key===`Escape`&&this.#a()}}_defaultSlotContentChanged(){for(let e of this._defaultSlotContent)e.id||=`vwc-tooltip-content-${c.n()}`;this._anchorEl&&this.#t(this._anchorEl)}_kbdAriaShortcutsValueChanged(){this._anchorEl&&e.P.setAttribute(this._anchorEl,`aria-keyshortcuts`,this._kbdAriaShortcutsValue)}connectedCallback(){super.connectedCallback(),this.#o()}disconnectedCallback(){super.disconnectedCallback(),this.#o()}_anchorElChanged(e,t){e&&this.#r(e),t&&this.#n(t)}#e(){return[this._descriptionId,this._descriptionSecondaryId,...this._defaultSlotContent.map(e=>e.id).filter(Boolean)]}#t(e){let t=e.getAttribute(`aria-describedby`)??e.ariaDescribedBy??``,n=new Set(this.#e()),r=t.split(` `).filter(e=>e&&!n.has(e));e.setAttribute(`aria-describedby`,[...r,...this.#e()].join(` `))}#n(t){t.addEventListener(`mouseover`,this.#i),t.addEventListener(`mouseout`,this.#a),t.addEventListener(`focusin`,this.#i),t.addEventListener(`focusout`,this.#a),this.#t(t),e.P.setAttribute(t,`aria-keyshortcuts`,this._kbdAriaShortcutsValue)}#r(t){t.removeEventListener(`mouseover`,this.#i),t.removeEventListener(`mouseout`,this.#a),t.removeEventListener(`focusin`,this.#i),t.removeEventListener(`focusout`,this.#a);let n=t.getAttribute(`aria-describedby`)??t.ariaDescribedBy??``,r=new Set(this.#e()),i=n.split(` `).filter(e=>e&&!r.has(e)),a=i.length?i.join(` `):null;t.hasAttribute(`aria-describedby`)?e.P.setAttribute(t,`aria-describedby`,a):t.ariaDescribedBy=a,t.removeAttribute(`aria-keyshortcuts`)}#i;#a;#o(){document.removeEventListener(`keydown`,this.#s),this.open&&this.isConnected&&document.addEventListener(`keydown`,this.#s)}#s;openChanged(e){e!==void 0&&this.#o()}};r.t([e.m],d.prototype,`text`,void 0),r.t([e.m({attribute:`text-secondary`})],d.prototype,`textSecondary`,void 0),r.t([e.m({mode:`fromView`})],d.prototype,`placement`,void 0),r.t([e.m({mode:`boolean`})],d.prototype,`open`,void 0),r.t([e.A],d.prototype,`_defaultSlotContent`,void 0);var f=e.u(`tooltip`,d,r=>{let s=r.tagFor(a.i);return e.p`
+${o.n()}
+${c.t(e.p`<span slot="_description" id="${e=>e._descriptionId}">${e=>e.text}</span><span slot="_description-secondary" id="${e=>e._descriptionSecondaryId}">${e=>e.textSecondary}</span>`)}
+<${s} class="${e=>i.t(`control`,[`open`,e.open])}" arrow alternate
 	:placement=${e=>e.placement}
 	:anchor="${e=>e._anchorEl}"
 	:open="${e=>e.open}"
-	@keydown="${(e,t)=>{e.open&&c.t(t.event)&&(e.open=!1)}}"
+	@keydown="${(e,t)=>{e.open&&l.t(t.event)&&(e.open=!1)}}"
   exportparts="vvd-theme-alternate">
   <div part="vvd-theme-alternate" class="tooltip" role="tooltip">
 		<span class="text"><slot name="_description"></slot></span>
+		${n.t(e=>e.textSecondary,e.p`<span class="text-secondary"
+				><slot name="_description-secondary"></slot
+			></span>`)}
+		<slot
+			${t.t({property:`_defaultSlotContent`,filter:t.r()})}
+		></slot>
 		<slot name="kbd-shortcut"
 			${t.t({property:`_kbdShortcutSlotted`,filter:t.r()})}
 		></slot>
   </div>
-</${o}>`},[i.t],{styles:l}),f=e.d(d);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return f}});
+</${s}>`},[a.t],{styles:u}),p=e.d(f);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return p}});

package/bundled/definition9.js

@@ -1,82 +1,105 @@
-import { P as e, d as t, m as n, p as r, t as i, u as a } from "./vivid-element.js";
-import { r as o, t as s } from "./slotted.js";
-import { t as c } from "./decorate.js";
-import { t as l } from "./class-names.js";
-import { i as u, t as d } from "./definition8.js";
-import { n as f, t as p } from "./anchored.js";
-import { t as m } from "./kbd-shortcut.js";
-import { n as h, t as g } from "./render-in-light-dom.js";
-import { t as _ } from "./dialog.js";
+import { A as e, P as t, d as n, m as r, p as i, t as a, u as o } from "./vivid-element.js";
+import { r as s, t as c } from "./slotted.js";
+import { t as l } from "./when.js";
+import { t as u } from "./decorate.js";
+import { t as d } from "./class-names.js";
+import { i as f, t as p } from "./definition8.js";
+import { n as m, t as h } from "./anchored.js";
+import { t as g } from "./kbd-shortcut.js";
+import { n as _, t as v } from "./render-in-light-dom.js";
+import { t as y } from "./dialog.js";
 //#region src/lib/tooltip/tooltip.scss?inline
-var v = ":host :host{display:var(--_popup-display,inline)}:host :host([slotted-anchor]){--_popup-display:contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size,auto);box-sizing:border-box;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size,30ch);flex-direction:column;align-items:flex-start;gap:4px;padding:8px 12px;display:flex}", y = class extends m(p(i)) {
+var b = ":host :host{display:var(--_popup-display,inline)}:host :host([slotted-anchor]){--_popup-display:contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size,auto);box-sizing:border-box;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size,30ch);flex-direction:column;align-items:flex-start;gap:4px;padding:8px 12px;display:flex}.text-secondary{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}", x = class extends g(h(a)) {
 	constructor(...e) {
-		super(...e), this.open = !1, this._descriptionId = `vwc-tooltip-desc-${h()}`, this.#n = () => {
+		super(...e), this.open = !1, this._descriptionId = `vwc-tooltip-desc-${_()}`, this._descriptionSecondaryId = `vwc-tooltip-desc-secondary-${_()}`, this._defaultSlotContent = [], this.#i = () => {
 			this.open = !0;
-		}, this.#r = () => {
+		}, this.#a = () => {
 			this.open = !1;
-		}, this.#a = (e) => {
+		}, this.#s = (e) => {
 			/* v8 ignore else -- @preserve */
-			e.key === "Escape" && this.#r();
+			e.key === "Escape" && this.#a();
 		};
 	}
+	_defaultSlotContentChanged() {
+		for (let e of this._defaultSlotContent) e.id ||= `vwc-tooltip-content-${_()}`;
+		this._anchorEl && this.#t(this._anchorEl);
+	}
 	_kbdAriaShortcutsValueChanged() {
-		this._anchorEl && e.setAttribute(this._anchorEl, "aria-keyshortcuts", this._kbdAriaShortcutsValue);
+		this._anchorEl && t.setAttribute(this._anchorEl, "aria-keyshortcuts", this._kbdAriaShortcutsValue);
 	}
 	connectedCallback() {
-		super.connectedCallback(), this.#i();
+		super.connectedCallback(), this.#o();
 	}
 	disconnectedCallback() {
-		super.disconnectedCallback(), this.#i();
+		super.disconnectedCallback(), this.#o();
 	}
 	_anchorElChanged(e, t) {
-		e && this.#t(e), t && this.#e(t);
+		e && this.#r(e), t && this.#n(t);
+	}
+	#e() {
+		return [
+			this._descriptionId,
+			this._descriptionSecondaryId,
+			...this._defaultSlotContent.map((e) => e.id).filter(Boolean)
+		];
 	}
-	#e(t) {
-		t.addEventListener("mouseover", this.#n), t.addEventListener("mouseout", this.#r), t.addEventListener("focusin", this.#n), t.addEventListener("focusout", this.#r);
-		let n = t.getAttribute("aria-describedby") ?? t.ariaDescribedBy;
-		t.setAttribute("aria-describedby", n ? `${n} ${this._descriptionId}` : this._descriptionId), e.setAttribute(t, "aria-keyshortcuts", this._kbdAriaShortcutsValue);
+	#t(e) {
+		let t = e.getAttribute("aria-describedby") ?? e.ariaDescribedBy ?? "", n = new Set(this.#e()), r = t.split(" ").filter((e) => e && !n.has(e));
+		e.setAttribute("aria-describedby", [...r, ...this.#e()].join(" "));
 	}
-	#t(t) {
-		t.removeEventListener("mouseover", this.#n), t.removeEventListener("mouseout", this.#r), t.removeEventListener("focusin", this.#n), t.removeEventListener("focusout", this.#r);
-		let n = (t.getAttribute("aria-describedby") ?? t.ariaDescribedBy ?? "").split(" ").filter((e) => e !== this._descriptionId), r = n.length ? n.join(" ") : null;
-		t.hasAttribute("aria-describedby") ? e.setAttribute(t, "aria-describedby", r) : t.ariaDescribedBy = r, t.removeAttribute("aria-keyshortcuts");
+	#n(e) {
+		e.addEventListener("mouseover", this.#i), e.addEventListener("mouseout", this.#a), e.addEventListener("focusin", this.#i), e.addEventListener("focusout", this.#a), this.#t(e), t.setAttribute(e, "aria-keyshortcuts", this._kbdAriaShortcutsValue);
 	}
-	#n;
-	#r;
-	#i() {
-		document.removeEventListener("keydown", this.#a), this.open && this.isConnected && document.addEventListener("keydown", this.#a);
+	#r(e) {
+		e.removeEventListener("mouseover", this.#i), e.removeEventListener("mouseout", this.#a), e.removeEventListener("focusin", this.#i), e.removeEventListener("focusout", this.#a);
+		let n = e.getAttribute("aria-describedby") ?? e.ariaDescribedBy ?? "", r = new Set(this.#e()), i = n.split(" ").filter((e) => e && !r.has(e)), a = i.length ? i.join(" ") : null;
+		e.hasAttribute("aria-describedby") ? t.setAttribute(e, "aria-describedby", a) : e.ariaDescribedBy = a, e.removeAttribute("aria-keyshortcuts");
 	}
+	#i;
 	#a;
+	#o() {
+		document.removeEventListener("keydown", this.#s), this.open && this.isConnected && document.addEventListener("keydown", this.#s);
+	}
+	#s;
 	openChanged(e) {
-		e !== void 0 && this.#i();
+		e !== void 0 && this.#o();
 	}
 };
-c([n], y.prototype, "text", void 0), c([n({ mode: "fromView" })], y.prototype, "placement", void 0), c([n({ mode: "boolean" })], y.prototype, "open", void 0);
+u([r], x.prototype, "text", void 0), u([r({ attribute: "text-secondary" })], x.prototype, "textSecondary", void 0), u([r({ mode: "fromView" })], x.prototype, "placement", void 0), u([r({ mode: "boolean" })], x.prototype, "open", void 0), u([e], x.prototype, "_defaultSlotContent", void 0);
 //#endregion
 //#region src/lib/tooltip/definition.ts
-var b = a("tooltip", y, (e) => {
-	let t = e.tagFor(u);
-	return r`
-${f()}
-${g(r`<span slot="_description" id="${(e) => e._descriptionId}">${(e) => e.text}</span>`)}
-<${t} class="${(e) => l("control", ["open", e.open])}" arrow alternate
+var S = o("tooltip", x, (e) => {
+	let t = e.tagFor(f);
+	return i`
+${m()}
+${v(i`<span slot="_description" id="${(e) => e._descriptionId}">${(e) => e.text}</span><span slot="_description-secondary" id="${(e) => e._descriptionSecondaryId}">${(e) => e.textSecondary}</span>`)}
+<${t} class="${(e) => d("control", ["open", e.open])}" arrow alternate
 	:placement=${(e) => e.placement}
 	:anchor="${(e) => e._anchorEl}"
 	:open="${(e) => e.open}"
 	@keydown="${(e, t) => {
-		e.open && _(t.event) && (e.open = !1);
+		e.open && y(t.event) && (e.open = !1);
 	}}"
   exportparts="vvd-theme-alternate">
   <div part="vvd-theme-alternate" class="tooltip" role="tooltip">
 		<span class="text"><slot name="_description"></slot></span>
+		${l((e) => e.textSecondary, i`<span class="text-secondary"
+				><slot name="_description-secondary"></slot
+			></span>`)}
+		<slot
+			${c({
+		property: "_defaultSlotContent",
+		filter: s()
+	})}
+		></slot>
 		<slot name="kbd-shortcut"
-			${s({
+			${c({
 		property: "_kbdShortcutSlotted",
-		filter: o()
+		filter: s()
 	})}
 		></slot>
   </div>
 </${t}>`;
-}, [d], { styles: v }), x = t(b);
+}, [p], { styles: b }), C = n(S);
 //#endregion
-export { b as n, y as r, x as t };
+export { S as n, x as r, C as t };

package/bundled/extractOptions.cjs

@@ -1 +1 @@
-const e=require(`./definition17.cjs`),t=require(`./definition18.cjs`);function n(n){let r=[];for(let i of n)if(e.i(i))r.push(i);else if(t.r(i))for(let t of Array.from(i.children))e.i(t)&&r.push(t);return r}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});
+const e=require(`./option.cjs`),t=require(`./optgroup.cjs`);function n(n){let r=[];for(let i of n)if(e.n(i))r.push(i);else if(t.n(i))for(let t of Array.from(i.children))e.n(t)&&r.push(t);return r}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});

package/bundled/extractOptions.js

@@ -1,5 +1,5 @@
-import { i as e } from "./definition17.js";
-import { r as t } from "./definition18.js";
+import { n as e } from "./option.js";
+import { n as t } from "./optgroup.js";
 //#region src/shared/foundation/listbox/extractOptions.ts
 function n(n) {
 	let r = [];

package/bundled/icon.cjs

@@ -0,0 +1 @@
+const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`),n=require(`./numberConverter.cjs`);var r=500,i=2e3,a=class extends e.t{constructor(...e){super(...e),this.iconLoaded=!1,this.#e=0,this.#t=null}#e;#t;async nameChanged(){let e=++this.#e;this.#t&&this.#t.abort(),this.#t=new AbortController,this._svg=void 0,this.iconLoaded=!1;let t=setTimeout(()=>{this.#e===e&&(this._svg=n.r,t=setTimeout(()=>{this.#e===e&&this._svg===n.r&&(this._svg=void 0)},i))},r);try{let t=await n.n(this.name,this.#t.signal);this.#e===e&&(this._svg=t)}catch{this.#e===e&&(this._svg=void 0)}finally{this.#e===e&&(clearTimeout(t),this.iconLoaded=!0)}}};t.t([e.m],a.prototype,`connotation`,void 0),t.t([e.m({converter:n.t})],a.prototype,`size`,void 0),t.t([e.A],a.prototype,`_svg`,void 0),t.t([e.A],a.prototype,`iconLoaded`,void 0),t.t([e.m],a.prototype,`label`,void 0),t.t([e.m],a.prototype,`name`,void 0),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});

package/bundled/icon.js

@@ -0,0 +1,34 @@
+import { A as e, m as t, t as n } from "./vivid-element.js";
+import { t as r } from "./decorate.js";
+import { n as i, r as a, t as o } from "./numberConverter.js";
+//#region src/lib/icon/icon.ts
+var s = 500, c = 2e3, l = class extends n {
+	constructor(...e) {
+		super(...e), this.iconLoaded = !1, this.#e = 0, this.#t = null;
+	}
+	#e;
+	#t;
+	async nameChanged() {
+		let e = ++this.#e;
+		this.#t && this.#t.abort(), this.#t = new AbortController(), this._svg = void 0, this.iconLoaded = !1;
+		let t = setTimeout(() => {
+			/* v8 ignore else -- @preserve */
+			this.#e === e && (this._svg = a, t = setTimeout(() => {
+				/* v8 ignore else -- @preserve */
+				this.#e === e && this._svg === a && (this._svg = void 0);
+			}, c));
+		}, s);
+		try {
+			let t = await i(this.name, this.#t.signal);
+			/* v8 ignore else -- @preserve */
+			this.#e === e && (this._svg = t);
+		} catch {
+			this.#e === e && (this._svg = void 0);
+		} finally {
+			this.#e === e && (clearTimeout(t), this.iconLoaded = !0);
+		}
+	}
+};
+r([t], l.prototype, "connotation", void 0), r([t({ converter: o })], l.prototype, "size", void 0), r([e], l.prototype, "_svg", void 0), r([e], l.prototype, "iconLoaded", void 0), r([t], l.prototype, "label", void 0), r([t], l.prototype, "name", void 0);
+//#endregion
+export { l as t };

package/bundled/listbox.cjs

@@ -1 +1 @@
-const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`),n=require(`./key-codes.cjs`),r=require(`./aria-binding-directive.cjs`),i=require(`./definition17.cjs`),a=require(`./definition18.cjs`),o=require(`./extractOptions.cjs`);function s(e,t){let n=e.length;for(;n--;)if(t(e[n],n,e))return n;return-1}var c=class t extends e.t{constructor(...e){super(...e),this._options=[],this.selectedIndex=-1,this.selectedOptions=[],this.shouldSkipFocus=!1,this.typeaheadBuffer=``,this.typeaheadExpired=!0,this.typeaheadTimeout=-1,this._activeDescendant=null,this._onOptgroupChange=()=>{this.slottedOptionsChanged(void 0,this.slottedOptions)}}get firstSelectedOption(){return this.selectedOptions[0]??null}get length(){return this.options.length}get options(){return e.k.track(this,`options`),this._options}set options(t){let n=this._options;if(this._options=t,e.k.notify(this,`options`),this.$fastController.isConnected){let e=this._newDefaultSelectedIndex(n,t,this.selectedIndex);e!==null&&(this.selectedIndex=e)}}static{this.slottedOptionFilter=e=>i.i(e)&&!e.hidden||a.r(e)}static{this.TYPE_AHEAD_TIMEOUT_MS=1e3}clickHandler(e){let t=e.target.closest(`option,[role=option],[data-vvd-component=option]`);if(t&&!t.disabled)return this.selectedIndex=this.options.indexOf(t),!0}focusAndScrollOptionIntoView(e=this.firstSelectedOption){this.contains(document.activeElement)&&e!==null&&(e.focus(),requestAnimationFrame(()=>{e.scrollIntoView({block:`nearest`})}))}focusinHandler(e){!this.shouldSkipFocus&&e.target===e.currentTarget&&(this.setSelectedOptions(),this.focusAndScrollOptionIntoView()),this.shouldSkipFocus=!1}getTypeaheadMatches(){let e=this.typeaheadBuffer.replace(/[.*+\-?^${}()|[\]\\]/g,`\\$&`),t=RegExp(`^${e}`,`gi`);return this.options.filter(e=>e.text.trim().match(t))}getNextSelectableIndex(e){let t=this.options.reduce((t,n,r)=>!t&&!n.disabled&&r>=e?n:t,null);return this.options.indexOf(t)}getPreviousSelectableIndex(e){let t=this.options.reduceRight((t,n,r)=>!t&&!n.disabled&&r<=e?n:t,null);return this.options.indexOf(t)}handleChange(e,n){switch(n){case`selected`:t.slottedOptionFilter(e)&&(this.selectedIndex=this.options.indexOf(e)),this.setSelectedOptions();break}}handleTypeAhead(e){this.typeaheadTimeout&&window.clearTimeout(this.typeaheadTimeout),this.typeaheadTimeout=window.setTimeout(()=>this.typeaheadExpired=!0,t.TYPE_AHEAD_TIMEOUT_MS),this.typeaheadBuffer=`${this.typeaheadExpired?``:this.typeaheadBuffer}${e}`}keydownHandler(e){if(this.disabled)return!0;this.shouldSkipFocus=!1;let t=e.key;switch(t){case n.s:e.shiftKey||(e.preventDefault(),this.selectFirstOption());return;case n.t:e.shiftKey||(e.preventDefault(),this.selectNextOption());return;case n.i:e.shiftKey||(e.preventDefault(),this.selectPreviousOption());return;case`End`:e.preventDefault(),this.selectLastOption();return;case`Tab`:return this.focusAndScrollOptionIntoView(),!0;case n.a:case n.o:return!0;case` `:if(this.typeaheadExpired)return!0;default:return t.length===1&&this.handleTypeAhead(t),!0}}mousedownHandler(e){return this.shouldSkipFocus=!this.contains(document.activeElement),!0}selectedIndexChanged(e,t){let n=this._validSelectedIndex(t);if(t!==n){this.selectedIndex=n;return}this.setSelectedOptions()}_validSelectedIndex(e){return e>this.options.length-1||e<-1?-1:e}selectedOptionsChanged(n,r){let i=r.filter(t.slottedOptionFilter);this.options.forEach(t=>{let n=e.k.getNotifier(t);n.unsubscribe(this,`selected`),t.selected=i.includes(t),n.subscribe(this,`selected`)})}selectFirstOption(){this.disabled||(this.selectedIndex=this.options.findIndex(e=>!e.disabled))}selectLastOption(){this.disabled||(this.selectedIndex=s(this.options,e=>!e.disabled))}selectNextOption(){if(!this.disabled&&this.selectedIndex<this.options.length-1){let e=this.getNextSelectableIndex(this.selectedIndex+1);e!==-1&&(this.selectedIndex=e)}}selectPreviousOption(){if(!this.disabled&&this.selectedIndex>0){let e=this.getPreviousSelectableIndex(this.selectedIndex-1);e!==-1&&(this.selectedIndex=e)}}_newDefaultSelectedIndex(e,t,n){for(let[n,r]of t.entries())if(this._isDefaultSelected(r)&&!e.includes(r))return n;return null}_isDefaultSelected(e){return e.defaultSelected}setSelectedOptions(){this.selectedOptions=this.selectedIndex===-1?[]:[this.options[this.selectedIndex]],this._activeDescendant=this.firstSelectedOption?.id??``,this.focusAndScrollOptionIntoView()}static extractOptions(e){return o.t(e)}slottedOptionsChanged(e,n){this.options=t.extractOptions(n);let i=`${this.options.length}`;this.options.forEach((e,t)=>{e.id||=r.r(`option-`),e.ariaPosInSet=`${t+1}`,e.ariaSetSize=i})}typeaheadBufferChanged(e,t){if(this.$fastController.isConnected){let e=this.getTypeaheadMatches();if(e.length){let t=this.options.indexOf(e[0]);t>-1&&(this.selectedIndex=t)}this.typeaheadExpired=!1}}connectedCallback(){super.connectedCallback(),this.addEventListener(`optgroup-change`,this._onOptgroupChange)}disconnectedCallback(){this.removeEventListener(`optgroup-change`,this._onOptgroupChange),super.disconnectedCallback()}};t.t([e.m({mode:`boolean`})],c.prototype,`disabled`,void 0),t.t([e.A],c.prototype,`selectedIndex`,void 0),t.t([e.A],c.prototype,`selectedOptions`,void 0),t.t([e.A],c.prototype,`slottedOptions`,void 0),t.t([e.A],c.prototype,`typeaheadBuffer`,void 0),t.t([e.A],c.prototype,`_activeDescendant`,void 0),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return c}});
+const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`),n=require(`./key-codes.cjs`),r=require(`./aria-binding-directive.cjs`),i=require(`./option.cjs`),a=require(`./optgroup.cjs`),o=require(`./extractOptions.cjs`);function s(e,t){let n=e.length;for(;n--;)if(t(e[n],n,e))return n;return-1}var c=class t extends e.t{constructor(...e){super(...e),this._options=[],this.selectedIndex=-1,this.selectedOptions=[],this.shouldSkipFocus=!1,this.typeaheadBuffer=``,this.typeaheadExpired=!0,this.typeaheadTimeout=-1,this._activeDescendant=null,this._onOptgroupChange=()=>{this.slottedOptionsChanged(void 0,this.slottedOptions)}}get firstSelectedOption(){return this.selectedOptions[0]??null}get length(){return this.options.length}get options(){return e.k.track(this,`options`),this._options}set options(t){let n=this._options;if(this._options=t,e.k.notify(this,`options`),this.$fastController.isConnected){let e=this._newDefaultSelectedIndex(n,t,this.selectedIndex);e!==null&&(this.selectedIndex=e)}}static{this.slottedOptionFilter=e=>i.n(e)&&!e.hidden||a.n(e)}static{this.TYPE_AHEAD_TIMEOUT_MS=1e3}clickHandler(e){let t=e.target.closest(`option,[role=option],[data-vvd-component=option]`);if(t&&!t.disabled)return this.selectedIndex=this.options.indexOf(t),!0}focusAndScrollOptionIntoView(e=this.firstSelectedOption){this.contains(document.activeElement)&&e!==null&&(e.focus(),requestAnimationFrame(()=>{e.scrollIntoView({block:`nearest`})}))}focusinHandler(e){!this.shouldSkipFocus&&e.target===e.currentTarget&&(this.setSelectedOptions(),this.focusAndScrollOptionIntoView()),this.shouldSkipFocus=!1}getTypeaheadMatches(){let e=this.typeaheadBuffer.replace(/[.*+\-?^${}()|[\]\\]/g,`\\$&`),t=RegExp(`^${e}`,`gi`);return this.options.filter(e=>e.text.trim().match(t))}getNextSelectableIndex(e){let t=this.options.reduce((t,n,r)=>!t&&!n.disabled&&r>=e?n:t,null);return this.options.indexOf(t)}getPreviousSelectableIndex(e){let t=this.options.reduceRight((t,n,r)=>!t&&!n.disabled&&r<=e?n:t,null);return this.options.indexOf(t)}handleChange(e,n){switch(n){case`selected`:t.slottedOptionFilter(e)&&(this.selectedIndex=this.options.indexOf(e)),this.setSelectedOptions();break}}handleTypeAhead(e){this.typeaheadTimeout&&window.clearTimeout(this.typeaheadTimeout),this.typeaheadTimeout=window.setTimeout(()=>this.typeaheadExpired=!0,t.TYPE_AHEAD_TIMEOUT_MS),this.typeaheadBuffer=`${this.typeaheadExpired?``:this.typeaheadBuffer}${e}`}keydownHandler(e){if(this.disabled)return!0;this.shouldSkipFocus=!1;let t=e.key;switch(t){case n.s:e.shiftKey||(e.preventDefault(),this.selectFirstOption());return;case n.t:e.shiftKey||(e.preventDefault(),this.selectNextOption());return;case n.i:e.shiftKey||(e.preventDefault(),this.selectPreviousOption());return;case`End`:e.preventDefault(),this.selectLastOption();return;case`Tab`:return this.focusAndScrollOptionIntoView(),!0;case n.a:case n.o:return!0;case` `:if(this.typeaheadExpired)return!0;default:return t.length===1&&this.handleTypeAhead(t),!0}}mousedownHandler(e){return this.shouldSkipFocus=!this.contains(document.activeElement),!0}selectedIndexChanged(e,t){let n=this._validSelectedIndex(t);if(t!==n){this.selectedIndex=n;return}this.setSelectedOptions()}_validSelectedIndex(e){return e>this.options.length-1||e<-1?-1:e}selectedOptionsChanged(n,r){let i=r.filter(t.slottedOptionFilter);this.options.forEach(t=>{let n=e.k.getNotifier(t);n.unsubscribe(this,`selected`),t.selected=i.includes(t),n.subscribe(this,`selected`)})}selectFirstOption(){this.disabled||(this.selectedIndex=this.options.findIndex(e=>!e.disabled))}selectLastOption(){this.disabled||(this.selectedIndex=s(this.options,e=>!e.disabled))}selectNextOption(){if(!this.disabled&&this.selectedIndex<this.options.length-1){let e=this.getNextSelectableIndex(this.selectedIndex+1);e!==-1&&(this.selectedIndex=e)}}selectPreviousOption(){if(!this.disabled&&this.selectedIndex>0){let e=this.getPreviousSelectableIndex(this.selectedIndex-1);e!==-1&&(this.selectedIndex=e)}}_newDefaultSelectedIndex(e,t,n){for(let[n,r]of t.entries())if(this._isDefaultSelected(r)&&!e.includes(r))return n;return null}_isDefaultSelected(e){return e.defaultSelected}_activeDescendantChanged(e,t){if(this.$fastController?.isConnected)for(let e of this.options)e._highlighted=!!(t&&e.id===t)}setSelectedOptions(){this.selectedOptions=this.selectedIndex===-1?[]:[this.options[this.selectedIndex]],this._activeDescendant=this.firstSelectedOption?.id??``,this.focusAndScrollOptionIntoView()}static extractOptions(e){return o.t(e)}slottedOptionsChanged(e,n){this.options=t.extractOptions(n);let i=`${this.options.length}`;this.options.forEach((e,t)=>{e.id||=r.r(`option-`),e.ariaPosInSet=`${t+1}`,e.ariaSetSize=i})}typeaheadBufferChanged(e,t){if(this.$fastController.isConnected){let e=this.getTypeaheadMatches();if(e.length){let t=this.options.indexOf(e[0]);t>-1&&(this.selectedIndex=t)}this.typeaheadExpired=!1}}connectedCallback(){super.connectedCallback(),this.addEventListener(`optgroup-change`,this._onOptgroupChange)}disconnectedCallback(){this.removeEventListener(`optgroup-change`,this._onOptgroupChange),super.disconnectedCallback()}};t.t([e.m({mode:`boolean`})],c.prototype,`disabled`,void 0),t.t([e.A],c.prototype,`selectedIndex`,void 0),t.t([e.A],c.prototype,`selectedOptions`,void 0),t.t([e.A],c.prototype,`slottedOptions`,void 0),t.t([e.A],c.prototype,`typeaheadBuffer`,void 0),t.t([e.A],c.prototype,`_activeDescendant`,void 0),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return c}});

package/bundled/listbox.js

@@ -2,8 +2,8 @@ import { A as e, k as t, m as n, t as r } from "./vivid-element.js";
 import { t as i } from "./decorate.js";
 import { a, i as o, o as s, s as c, t as l } from "./key-codes.js";
 import { r as u } from "./aria-binding-directive.js";
-import { i as d } from "./definition17.js";
-import { r as f } from "./definition18.js";
+import { n as d } from "./option.js";
+import { n as f } from "./optgroup.js";
 import { t as p } from "./extractOptions.js";
 //#region ../../node_modules/.pnpm/@microsoft+fast-web-utilities@6.0.0/node_modules/@microsoft/fast-web-utilities/dist/array.js
 function m(e, t) {
@@ -154,6 +154,9 @@ var h = class e extends r {
 	_isDefaultSelected(e) {
 		return e.defaultSelected;
 	}
+	_activeDescendantChanged(e, t) {
+		if (this.$fastController?.isConnected) for (let e of this.options) e._highlighted = !!(t && e.id === t);
+	}
 	setSelectedOptions() {
 		this.selectedOptions = this.selectedIndex === -1 ? [] : [this.options[this.selectedIndex]], this._activeDescendant = this.firstSelectedOption?.id ?? "", this.focusAndScrollOptionIntoView();
 	}

package/bundled/mixins.cjs

@@ -1,11 +1,11 @@
-const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./slotted.cjs`),r=require(`./when.cjs`),i=require(`./definition.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./render-in-light-dom.cjs`);var l=`:host{display:contents}.message{contain:inline-size;font:var(--vvd-typography-base-condensed);grid-column:1/-1;gap:4px;display:flex}.message.none-message{display:none}.message.helper-message{color:var(--_low-ink-color)}.message.error-message,.message.success-message{color:var(--vvd-color-canvas-text)}slot{display:inline}.icon{font-size:16px}.error-message .icon{color:var(--vvd-color-alert-500)}.success-message .icon{color:var(--vvd-color-success-500)}.announcement{display:contents}`,u=class extends e.t(t.t){constructor(...e){super(...e),this.type=`none`}};a.t([t.m],u.prototype,`type`,void 0);function d(e,n,r){let i=e.tagFor(s.r);return t.p`<${i} class="icon" name="${n}" label="${e=>e.locale.feedbackMessage[r]}"></${i}>`}function f(e){let n={none:``,helper:``,error:d(e,`info-line`,`errorIconText`),success:d(e,`check-circle-line`,`successIconText`)};return t.p`${e=>n[e.type]}`}var p=e=>e===`error`,m=t.u(`feedback-message`,u,e=>{let n=t.p`<div
+const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./slotted.cjs`),r=require(`./when.cjs`),i=require(`./definition.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./icon.cjs`),l=require(`./render-in-light-dom.cjs`);var u=`:host{display:contents}.message{contain:inline-size;font:var(--vvd-typography-base-condensed);grid-column:1/-1;gap:4px;display:flex}.message.none-message{display:none}.message.helper-message{color:var(--_low-ink-color)}.message.error-message,.message.success-message{color:var(--vvd-color-canvas-text)}slot{display:inline}.icon{font-size:16px}.error-message .icon{color:var(--vvd-color-alert-500)}.success-message .icon{color:var(--vvd-color-success-500)}.announcement{display:contents}`,d=class extends e.t(t.t){constructor(...e){super(...e),this.type=`none`}};a.t([t.m],d.prototype,`type`,void 0);function f(e,n,r){let i=e.tagFor(c.t);return t.p`<${i} class="icon" name="${n}" label="${e=>e.locale.feedbackMessage[r]}"></${i}>`}function p(e){let n={none:``,helper:``,error:f(e,`info-line`,`errorIconText`),success:f(e,`check-circle-line`,`successIconText`)};return t.p`${e=>n[e.type]}`}var m=e=>e===`error`,h=t.u(`feedback-message`,d,e=>{let n=t.p`<div
 		class="${e=>o.t(`message`,`${e.type}-message`)}"
 	>
-		${f(e)}<slot></slot>
-	</div>`;return t.p`${r.t(e=>!p(e.type),n)}
+		${p(e)}<slot></slot>
+	</div>`;return t.p`${r.t(e=>!m(e.type),n)}
 		<span class="announcement" role="status" aria-live="polite">
-			${r.t(e=>p(e.type),n)}
-		</span>`},[s.t,i.n],{styles:l}),h=e=>{class r extends e{get _feedbackDescribedBy(){return`feedback slotted-helper-text-feedback`}_internalFeedback(){let e=this._helperTextSlottedContent?.length?``:this.helperText,t=this.errorValidationMessage,n=this.successText;return n?{type:`success`,message:n}:t?{type:`error`,message:t}:e?{type:`helper`,message:e}:{type:`none`,message:``}}_slottedHelperTextFeedbackType(){return this._internalFeedback().type===`none`&&this._helperTextSlottedContent?.length?`helper`:`none`}_getFeedbackTemplate(e){let r=e.tagFor(u);return t.p`
+			${r.t(e=>m(e.type),n)}
+		</span>`},[s.t,i.n],{styles:u}),g=e=>{class r extends e{get _feedbackDescribedBy(){return`feedback slotted-helper-text-feedback`}_internalFeedback(){let e=this._helperTextSlottedContent?.length?``:this.helperText,t=this.errorValidationMessage,n=this.successText;return n?{type:`success`,message:n}:t?{type:`error`,message:t}:e?{type:`helper`,message:e}:{type:`none`,message:``}}_slottedHelperTextFeedbackType(){return this._internalFeedback().type===`none`&&this._helperTextSlottedContent?.length?`helper`:`none`}_getFeedbackTemplate(e){let r=e.tagFor(d);return t.p`
 				<${r} id="feedback" :type="${e=>e._internalFeedback().type}">
 					${e=>e._internalFeedback().message}
 				</${r}>
@@ -15,9 +15,9 @@ const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`.
 				>
 					<slot name="helper-text" ${n.t(`_helperTextSlottedContent`)}></slot>
 				</${r}>
-			`}}return a.t([t.m({attribute:`helper-text`})],r.prototype,`helperText`,void 0),a.t([t.A],r.prototype,`_helperTextSlottedContent`,void 0),r},g=e=>{let r=()=>`vvd-feedback-${c.n()}`,i=()=>`vvd-slotted-feedback-${c.n()}`;class o extends h(e){constructor(...e){super(...e),this._slottedHelperTextIds=[],this._feedbackId=r()}_helperTextSlottedContentChanged(e,t){for(let e of t)e.id||=i();this._slottedHelperTextIds=t.map(e=>e.id)}get _feedbackDescribedBy(){return[this._feedbackId,...this._slottedHelperTextIds].join(` `)}_getFeedbackTemplate(e){let r=e.tagFor(u);return t.p`
+			`}}return a.t([t.m({attribute:`helper-text`})],r.prototype,`helperText`,void 0),a.t([t.A],r.prototype,`_helperTextSlottedContent`,void 0),r},_=e=>{let r=()=>`vvd-feedback-${l.n()}`,i=()=>`vvd-slotted-feedback-${l.n()}`;class o extends g(e){constructor(...e){super(...e),this._slottedHelperTextIds=[],this._feedbackId=r()}_helperTextSlottedContentChanged(e,t){for(let e of t)e.id||=i();this._slottedHelperTextIds=t.map(e=>e.id)}get _feedbackDescribedBy(){return[this._feedbackId,...this._slottedHelperTextIds].join(` `)}_getFeedbackTemplate(e){let r=e.tagFor(d);return t.p`
 				<slot name="_feedback"></slot>
-				${c.t(t.p`<${r}
+				${l.t(t.p`<${r}
 					slot="_feedback"
 					id="${e=>e._feedbackId}"
 					:type="${e=>e._internalFeedback().type}"
@@ -30,4 +30,4 @@ const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`.
 						${n.t(`_helperTextSlottedContent`)}
 					></slot>
 				</${r}>
-			`}}return a.t([t.A],o.prototype,`_slottedHelperTextIds`,void 0),o};Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return h}});
+			`}}return a.t([t.A],o.prototype,`_slottedHelperTextIds`,void 0),o};Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return g}});