@vonage/vivid 5.15.1 → 5.17.0

package/bundled/definition6.cjs

@@ -1,31 +1,29 @@
-"use strict";const f=require("./definition9.cjs"),c=require("./definition7.cjs"),i=require("./vivid-element.cjs"),v=require("./anchored.cjs"),x=require("./delegates-aria.cjs"),b=require("./divider.cjs"),u=require("./key-codes.cjs"),I=require("./index.cjs"),y=require("./ref.cjs"),h=require("./slotted.cjs"),E=require("./class-names.cjs"),k=":host{display:var(--_popup-display, inline)}:host([slotted-anchor]){--_popup-display: contents}.base{display:flex;overflow:hidden auto;box-sizing:border-box;flex-direction:column;padding:4px;gap:8px;inline-size:max-content;max-block-size:var(--menu-block-size, 408px);min-inline-size:var(--menu-min-inline-size)}@media not all and (width>=600px){.base{max-inline-size:var(--menu-max-inline-size, 300px)}}@media(width>=600px){.base{max-inline-size:var(--menu-max-inline-size)}}::slotted(a){color:var(--vvd-color-canvas-text);text-decoration:none}::slotted(a[data-vvd-component=menuitem]: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));--focus-stroke-gap-color: transparent;display:block}.header{padding:4px}.hide-header .header{display:none}.body{display:flex;flex-direction:column;row-gap:1px}.hide-body .body{display:none}.action-items{display:flex;justify-content:flex-end;gap:8px;padding-block-end:4px;padding-inline:12px}.hide-actions .action-items{display:none}";var C=Object.defineProperty,d=(o,e,n,r)=>{for(var t=void 0,s=o.length-1,l;s>=0;s--)(l=o[s])&&(t=l(e,n,t)||t);return t&&C(e,n,t),t};const $=o=>o instanceof c.MenuItem&&o.controlType==="checkbox",p=o=>o instanceof c.MenuItem&&o.controlType==="radio",m=o=>o instanceof b.Divider?!0:o.role==="separator",_=o=>o instanceof c.MenuItem?!0:!!(o.role&&o.role in c.MenuItemRole);class a extends v.Anchored(x.DelegatesAria(i.VividElement)){constructor(){super(...arguments),this.offset=null,this.expandedItem=null,this.focusIndex=-1,this.handleFocusOut=e=>{!this.contains(e.relatedTarget)&&this.menuItems!==void 0&&this.menuItems.length&&(this.collapseExpandedItem(),this.menuItems[this.focusIndex].setAttribute("tabindex","-1"),this.menuItems[0].setAttribute("tabindex","0"),this.focusIndex=0)},this.handleItemFocus=e=>{const n=e.target;this.menuItems!==void 0&&n!==this.menuItems[this.focusIndex]&&(this.menuItems[this.focusIndex].setAttribute("tabindex","-1"),this.focusIndex=this.menuItems.indexOf(n),n.setAttribute("tabindex","0"))},this.handleExpandedChanged=e=>{const n=e.target;this.expandedItem!==null&&n===this.expandedItem&&n.expanded===!1&&(this.expandedItem=null),n.expanded&&(this.expandedItem=n)},this.removeItemListeners=()=>{this.menuItems!==void 0&&this.menuItems.forEach(e=>{e.removeEventListener("expanded-change",this.handleExpandedChanged),e.removeEventListener("focus",this.handleItemFocus)})},this.setItems=()=>{const e=this.domChildren();this.removeItemListeners(),this.menuItems=e.filter(_),this.menuItems.length&&(this.focusIndex=0),this.menuItems.forEach((n,r)=>{n instanceof c.MenuItem&&(n._isPresentational=!1),n.setAttribute("tabindex",r===0?"0":"-1"),n.addEventListener("expanded-change",this.handleExpandedChanged),n.addEventListener("focus",this.handleItemFocus)})},this.placement="bottom",this.autoDismiss=!1,this.positionStrategy="fixed",this.open=!1,this.#t=()=>{if(this.#e==="off"||this.#e==="legacy"&&this.open)return;const e=!this.open;i.Updates.enqueue(()=>this.open=e)},this._onFocusout=e=>{const n=e.relatedTarget,r=!this.contains(n)&&!this._anchorEl?.contains(n);this.autoDismiss&&r&&(this.open=!1)}}itemsChanged(){this.$fastController.isConnected&&this.menuItems!==void 0&&this.setItems()}connectedCallback(){super.connectedCallback(),i.Updates.enqueue(()=>{this.setItems()})}disconnectedCallback(){super.disconnectedCallback(),this.removeItemListeners(),this.menuItems=void 0}focus(){const e=this.querySelector('[autofocus]:not([slot="anchor"])');e instanceof HTMLElement?e.focus():this.setFocus(0)}collapseExpandedItem(){this.expandedItem!==null&&(this.expandedItem.expanded=!1,this.expandedItem=null)}handleMenuKeyDown(e){if(!(e.defaultPrevented||this.menuItems===void 0))switch(e.key){case u.keyArrowDown:this.setFocus(this.focusIndex+1);return;case u.keyArrowUp:this.setFocus(this.focusIndex-1);return;case u.keyEnd:this.setFocus(this.menuItems.length-1);return;case u.keyHome:this.setFocus(0);return;default:return!0}}domChildren(){return Array.from(this.children).filter(e=>!e.hasAttribute("hidden")).filter(e=>!e.hasAttribute("slot"))}setFocus(e){if(this.menuItems!==void 0&&e>=0&&e<this.menuItems.length){const n=this.menuItems[e];this.focusIndex>-1&&this.menuItems.length>=this.focusIndex-1&&this.menuItems[this.focusIndex].setAttribute("tabindex","-1"),this.focusIndex=e,n.setAttribute("tabindex","0"),n.focus()}}get#e(){return this.trigger??"auto"}openChanged(e,n){n&&this._popupEl?.show().then(()=>this.focus()),n?this.$emit("open",void 0,{bubbles:!1}):this.$emit("close",void 0,{bubbles:!1}),this._anchorEl&&this.#n(this._anchorEl)}_anchorElChanged(e,n){e&&this.#o(e),n&&this.#s(n)}#s(e){e.addEventListener("click",this.#t,!0),e.addEventListener("focusout",this._onFocusout),e.ariaHasPopup="menu",this.#n(e)}#n(e){e.ariaExpanded=this.open.toString(),e.dataset.expanded=this.open.toString()}#o(e){e.removeEventListener("click",this.#t,!0),e.removeEventListener("focusout",this._onFocusout),e.ariaHasPopup=null,e.ariaExpanded=null,delete e.dataset.expanded}#t;_onBodyChange(e){if(this.menuItems===void 0||!(e.target instanceof Element))return;this.#e==="auto"&&!$(e.target)&&(this.open=!1);const n=this.domChildren(),r=n.indexOf(e.target);if(r!==-1){if(p(e.target)&&e.target.checked){for(let t=r-1;t>=0;--t){const s=n[t];if(p(s)&&(s.checked=!1),m(s))break}for(let t=r+1;t<=n.length-1;++t){const s=n[t];if(p(s)&&(s.checked=!1),m(s))break}}return!0}}}d([i.attr({attribute:"offset",converter:i.nullableNumberConverter})],a.prototype,"offset");d([i.observable],a.prototype,"items");d([i.attr({mode:"fromView"})],a.prototype,"placement");d([i.attr],a.prototype,"trigger");d([i.attr({mode:"boolean",attribute:"auto-dismiss"})],a.prototype,"autoDismiss");d([i.attr({mode:"fromView",attribute:"position-strategy"})],a.prototype,"positionStrategy");d([i.attr({mode:"boolean"})],a.prototype,"open");d([i.observable],a.prototype,"headerSlottedContent");d([i.observable],a.prototype,"actionItemsSlottedContent");d([i.observable],a.prototype,"_popupOffset");const A=({headerSlottedContent:o,actionItemsSlottedContent:e,items:n})=>E.classNames("base",["hide-header",!o?.length],["hide-actions",!e?.length],["hide-body",n&&!n.length]);function w(o,e){return o.open&&I.handleEscapeKeyAndStopPropogation(e)&&(o.open=!1),!0}const F=o=>{const e=o.tagFor(f.Popup),n=v.anchorSlotTemplateFactory();function r(t,s,l){s.stopPropagation(),t.open=l}return i.html`
-		<template @focusout="${(t,s)=>t._onFocusout(s.event)}">
-			${n}
-			<${e}
-				${y.ref("_popupEl")}
-				:placement=${t=>t.placement}
-				:open=${t=>t.open}
-				:anchor=${t=>t._anchorEl}
-				:strategy="${t=>t.positionStrategy}"
-				:offset=${t=>t.offset||t._popupOffset}
-				@keydown="${(t,s)=>w(t,s.event)}"
-				@vwc-popup:open="${(t,s)=>r(t,s.event,!0)}"
-				@vwc-popup:close="${(t,s)=>r(t,s.event,!1)}"
+const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./ref.cjs`),r=require(`./when.cjs`),i=require(`./enums.cjs`),a=require(`./definition2.cjs`),o=require(`./decorate.cjs`),s=require(`./affix.cjs`),c=require(`./delegates-aria.cjs`),l=require(`./linkable.cjs`),u=require(`./class-names.cjs`),d=require(`./definition5.cjs`),f=require(`./button.cjs`);var p=class extends s.n(e.t(l.t(f.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}}};o.t([t.l({converter:{fromView:e=>e||null,toView:e=>e||null}})],p.prototype,`title`,void 0),o.t([t.l],p.prototype,`connotation`,void 0),o.t([t.l],p.prototype,`shape`,void 0),o.t([t.l],p.prototype,`appearance`,void 0),o.t([t.l],p.prototype,`size`,void 0),o.t([t.l({mode:`boolean`,attribute:`stacked`})],p.prototype,`stacked`,void 0),o.t([t.l({mode:`boolean`,attribute:`pending`})],p.prototype,`pending`,void 0),o.t([t.l({mode:`boolean`,attribute:`dropdown-indicator`})],p.prototype,`dropdownIndicator`,void 0),o.t([t.l({mode:`boolean`,attribute:`active`})],p.prototype,`active`,void 0),o.t([t.l],p.prototype,`label`,void 0);var m=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;transition:transform .2s;display:flex;transform:rotate(0)}: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))}.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))}.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))}.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))}.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))}.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)}@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-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: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-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: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-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{--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}@supports (user-select:none){.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(a.r);return t.d`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`},g=({connotation:e,appearance:t,shape:n,iconTrailing:r,icon:i,label:a,disabled:o,pending:s,stacked:c,size:l,iconSlottedContent:d,ariaExpanded:f,active:p,dropdownIndicator:m})=>u.t(`control`,[`connotation-${e}`,!!e],[`appearance-${t}`,!!t],[`disabled`,o||s],[`shape-${n}`,!!n],[`size-${l}`,!!l],[`icon-only`,!a&&!!(i||d?.length)&&!m],[`icon-trailing`,r],[`stacked`,!!c],[`active`,f===`true`||p]);function _(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(d.r),o={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.d`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return u.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${o[a]}"></${r}></span>`}else return s.a(e)(n,s.i.Slot)}var v=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,y=e=>{let n=h(e);return t.d`<span class="content">
+			${t=>_(e,t.icon,t.pending,t.size)}
+			${r.t(e=>e.label,t.d`<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
 			>
-			<div class="${A}">
-				<div class="header">
-					<slot name="header" ${h.slotted("headerSlottedContent")}></slot>
-				</div>
-				<div
-					class="body"
-					${x.delegateAria({role:"menu"})}
-					@change="${(t,s)=>t._onBodyChange(s.event)}"
-					@keydown="${(t,s)=>t.handleMenuKeyDown(s.event)}"
-					@focusout="${(t,s)=>t.handleFocusOut(s.event)}"
-				>
-					<slot ${h.slotted("items")}></slot>
-				</div>
-				<footer class="action-items"><slot name="action-items"  ${h.slotted("actionItemsSlottedContent")}></slot></footer>
-			</div>
-		</${e}>
-	</template>`},g=i.defineVividComponent(c.menuName,a,F,[f.popupDefinition,c.menuItemDefinition],{styles:k}),M=i.createRegisterFunction(g);exports.Menu=a;exports.menuDefinition=g;exports.registerMenu=M;
+		</span>
+		${r.t(e=>e.dropdownIndicator,n)}`};function b(e){return t.d` <button
+		class="${g}"
+		?autofocus="${e=>e.autofocus}"
+		form="${e=>e.formId}"
+		formaction="${e=>e.formaction}"
+		formenctype="${e=>e.formenctype}"
+		formmethod="${e=>e.formmethod}"
+		formnovalidate="${e=>e.formnovalidate}"
+		formtarget="${e=>e.formtarget}"
+		name="${e=>e.name}"
+		type="${e=>v(e.type)}"
+		value="${e=>e.value}"
+		title="${e=>e.title}"
+		${c.n({ariaLabel:null,ariaDisabled:e=>e.disabled||e.pending})}
+		${n.t(`control`)}
+		@click="${(e,t)=>e.clickHandler(t.event)}"
+	>
+		${y(e)}
+	</button>`}function x(e){return t.d`${t=>t._renderLinkElement(y(e),g,{ariaLabel:null})}`}var S=t.o(`button`,p,e=>t.d` <template>
+		${r.t(e=>!e.href,t.d`${b(e)}`)}
+		${r.t(e=>e.href,x(e))}
+	</template>`,[a.t,d.t],{styles:m,shadowOptions:{delegatesFocus:!0}}),C=t.s(S);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return C}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return S}});

package/bundled/definition6.js

@@ -1,268 +1,114 @@
-import { P as x, p as v } from "./definition9.js";
-import { M as l, a as g, m as I, b } from "./definition7.js";
-import { U as m, V as y, a as d, n as E, o as h, h as k, c as C, d as $ } from "./vivid-element.js";
-import { A as _, a as A } from "./anchored.js";
-import { D as w, d as F } from "./delegates-aria.js";
-import { D as S } from "./divider.js";
-import { a as D, k as L, c as M, b as P } from "./key-codes.js";
-import { h as z } from "./index.js";
-import { r as T } from "./ref.js";
-import { s as u } from "./slotted.js";
-import { c as O } from "./class-names.js";
-const B = ":host{display:var(--_popup-display, inline)}:host([slotted-anchor]){--_popup-display: contents}.base{display:flex;overflow:hidden auto;box-sizing:border-box;flex-direction:column;padding:4px;gap:8px;inline-size:max-content;max-block-size:var(--menu-block-size, 408px);min-inline-size:var(--menu-min-inline-size)}@media not all and (width>=600px){.base{max-inline-size:var(--menu-max-inline-size, 300px)}}@media(width>=600px){.base{max-inline-size:var(--menu-max-inline-size)}}::slotted(a){color:var(--vvd-color-canvas-text);text-decoration:none}::slotted(a[data-vvd-component=menuitem]: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));--focus-stroke-gap-color: transparent;display:block}.header{padding:4px}.hide-header .header{display:none}.body{display:flex;flex-direction:column;row-gap:1px}.hide-body .body{display:none}.action-items{display:flex;justify-content:flex-end;gap:8px;padding-block-end:4px;padding-inline:12px}.hide-actions .action-items{display:none}";
-var H = Object.defineProperty, r = (o, e, s, i) => {
-  for (var t = void 0, n = o.length - 1, c; n >= 0; n--)
-    (c = o[n]) && (t = c(e, s, t) || t);
-  return t && H(e, s, t), t;
+import { t as e } from "./localized.js";
+import { d as t, l as n, o as r, s as i } from "./vivid-element.js";
+import { t as a } from "./ref.js";
+import { t as o } from "./when.js";
+import { a as s } from "./enums.js";
+import { r as c, t as l } from "./definition2.js";
+import { t as u } from "./decorate.js";
+import { a as d, i as f, n as p } from "./affix.js";
+import { n as m } from "./delegates-aria.js";
+import { t as h } from "./linkable.js";
+import { t as g } from "./class-names.js";
+import { r as _, t as v } from "./definition5.js";
+import { t as y } from "./button.js";
+//#region src/lib/button/button.ts
+var b = class extends p(e(h(y))) {
+	constructor() {
+		super(), this.stacked = !1, this.pending = !1, this.dropdownIndicator = !1, this.active = !1, this.title = "";
+	}
+	clickHandler(e) {
+		/* v8 ignore else -- @preserve */
+		if (this.disabled || this.pending) {
+			e.preventDefault(), e.stopImmediatePropagation();
+			return;
+		}
+	}
 };
-const K = (o) => o instanceof l && o.controlType === "checkbox", p = (o) => o instanceof l && o.controlType === "radio", f = (o) => o instanceof S ? !0 : o.role === "separator", q = (o) => o instanceof l ? !0 : !!(o.role && o.role in g);
-class a extends _(w(y)) {
-  constructor() {
-    super(...arguments), this.offset = null, this.expandedItem = null, this.focusIndex = -1, this.handleFocusOut = (e) => {
-      !this.contains(e.relatedTarget) && this.menuItems !== void 0 && this.menuItems.length && (this.collapseExpandedItem(), this.menuItems[this.focusIndex].setAttribute("tabindex", "-1"), this.menuItems[0].setAttribute("tabindex", "0"), this.focusIndex = 0);
-    }, this.handleItemFocus = (e) => {
-      const s = e.target;
-      this.menuItems !== void 0 && s !== this.menuItems[this.focusIndex] && (this.menuItems[this.focusIndex].setAttribute("tabindex", "-1"), this.focusIndex = this.menuItems.indexOf(s), s.setAttribute("tabindex", "0"));
-    }, this.handleExpandedChanged = (e) => {
-      const s = e.target;
-      this.expandedItem !== null && s === this.expandedItem && s.expanded === !1 && (this.expandedItem = null), s.expanded && (this.expandedItem = s);
-    }, this.removeItemListeners = () => {
-      this.menuItems !== void 0 && this.menuItems.forEach((e) => {
-        e.removeEventListener("expanded-change", this.handleExpandedChanged), e.removeEventListener(
-          "focus",
-          this.handleItemFocus
-        );
-      });
-    }, this.setItems = () => {
-      const e = this.domChildren();
-      this.removeItemListeners(), this.menuItems = e.filter(q), this.menuItems.length && (this.focusIndex = 0), this.menuItems.forEach((s, i) => {
-        s instanceof l && (s._isPresentational = !1), s.setAttribute("tabindex", i === 0 ? "0" : "-1"), s.addEventListener("expanded-change", this.handleExpandedChanged), s.addEventListener("focus", this.handleItemFocus);
-      });
-    }, this.placement = "bottom", this.autoDismiss = !1, this.positionStrategy = "fixed", this.open = !1, this.#t = () => {
-      if (this.#e === "off" || this.#e === "legacy" && this.open)
-        return;
-      const e = !this.open;
-      m.enqueue(() => this.open = e);
-    }, this._onFocusout = (e) => {
-      const s = e.relatedTarget, i = !this.contains(s) && !this._anchorEl?.contains(s);
-      this.autoDismiss && i && (this.open = !1);
-    };
-  }
-  /**
-   * @internal
-   */
-  itemsChanged() {
-    this.$fastController.isConnected && this.menuItems !== void 0 && this.setItems();
-  }
-  /**
-   * @internal
-   */
-  connectedCallback() {
-    super.connectedCallback(), m.enqueue(() => {
-      this.setItems();
-    });
-  }
-  /**
-   * @internal
-   */
-  disconnectedCallback() {
-    super.disconnectedCallback(), this.removeItemListeners(), this.menuItems = void 0;
-  }
-  /**
-   * Moves focus into the menu. If there is a child with the `autofocus` attribute, it will be focused.
-   * Otherwise, the first focusable child will be focused.
-   *
-   * @public
-   */
-  focus() {
-    const e = this.querySelector(
-      '[autofocus]:not([slot="anchor"])'
-    );
-    e instanceof HTMLElement ? e.focus() : this.setFocus(0);
-  }
-  /**
-   * Collapses any expanded Menu Items.
-   *
-   * @public
-   */
-  collapseExpandedItem() {
-    this.expandedItem !== null && (this.expandedItem.expanded = !1, this.expandedItem = null);
-  }
-  /**
-   * @internal
-   */
-  handleMenuKeyDown(e) {
-    if (!(e.defaultPrevented || this.menuItems === void 0))
-      switch (e.key) {
-        case P:
-          this.setFocus(this.focusIndex + 1);
-          return;
-        case M:
-          this.setFocus(this.focusIndex - 1);
-          return;
-        case L:
-          this.setFocus(this.menuItems.length - 1);
-          return;
-        case D:
-          this.setFocus(0);
-          return;
-        default:
-          return !0;
-      }
-  }
-  /**
-   * get an array of valid DOM children
-   */
-  domChildren() {
-    return Array.from(this.children).filter((e) => !e.hasAttribute("hidden")).filter((e) => !e.hasAttribute("slot"));
-  }
-  setFocus(e) {
-    if (this.menuItems !== void 0 && e >= 0 && e < this.menuItems.length) {
-      const s = this.menuItems[e];
-      this.focusIndex > -1 && this.menuItems.length >= this.focusIndex - 1 && this.menuItems[this.focusIndex].setAttribute("tabindex", "-1"), this.focusIndex = e, s.setAttribute("tabindex", "0"), s.focus();
-    }
-  }
-  get #e() {
-    return this.trigger ?? "auto";
-  }
-  openChanged(e, s) {
-    s && this._popupEl?.show().then(() => this.focus()), s ? this.$emit("open", void 0, { bubbles: !1 }) : this.$emit("close", void 0, { bubbles: !1 }), this._anchorEl && this.#s(this._anchorEl);
-  }
-  /**
-   * @internal
-   */
-  _anchorElChanged(e, s) {
-    e && this.#o(e), s && this.#n(s);
-  }
-  #n(e) {
-    e.addEventListener("click", this.#t, !0), e.addEventListener("focusout", this._onFocusout), e.ariaHasPopup = "menu", this.#s(e);
-  }
-  #s(e) {
-    e.ariaExpanded = this.open.toString(), e.dataset.expanded = this.open.toString();
-  }
-  #o(e) {
-    e.removeEventListener("click", this.#t, !0), e.removeEventListener("focusout", this._onFocusout), e.ariaHasPopup = null, e.ariaExpanded = null, delete e.dataset.expanded;
-  }
-  #t;
-  /**
-   * @internal
-   */
-  _onBodyChange(e) {
-    if (this.menuItems === void 0 || !(e.target instanceof Element))
-      return;
-    this.#e === "auto" && !K(e.target) && (this.open = !1);
-    const s = this.domChildren(), i = s.indexOf(e.target);
-    if (i !== -1) {
-      if (p(e.target) && e.target.checked) {
-        for (let t = i - 1; t >= 0; --t) {
-          const n = s[t];
-          if (p(n) && (n.checked = !1), f(n))
-            break;
-        }
-        for (let t = i + 1; t <= s.length - 1; ++t) {
-          const n = s[t];
-          if (p(n) && (n.checked = !1), f(n))
-            break;
-        }
-      }
-      return !0;
-    }
-  }
+u([n({ converter: {
+	fromView: (e) => e || null,
+	toView: (e) => e || null
+} })], b.prototype, "title", void 0), u([n], b.prototype, "connotation", void 0), u([n], b.prototype, "shape", void 0), u([n], b.prototype, "appearance", void 0), u([n], b.prototype, "size", void 0), u([n({
+	mode: "boolean",
+	attribute: "stacked"
+})], b.prototype, "stacked", void 0), u([n({
+	mode: "boolean",
+	attribute: "pending"
+})], b.prototype, "pending", void 0), u([n({
+	mode: "boolean",
+	attribute: "dropdown-indicator"
+})], b.prototype, "dropdownIndicator", void 0), u([n({
+	mode: "boolean",
+	attribute: "active"
+})], b.prototype, "active", void 0), u([n], b.prototype, "label", void 0);
+//#endregion
+//#region src/lib/button/button.scss?inline
+var x = ".chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;transition:transform .2s;display:flex;transform:rotate(0)}: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))}.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))}.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))}.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))}.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))}.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)}@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-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: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-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: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-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{--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}@supports (user-select:none){.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 n = e.tagFor(c);
+	return t`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`;
+}, C = ({ connotation: e, appearance: t, shape: n, iconTrailing: r, icon: i, label: a, disabled: o, pending: s, stacked: c, size: l, iconSlottedContent: u, ariaExpanded: d, active: f, dropdownIndicator: p }) => g("control", [`connotation-${e}`, !!e], [`appearance-${t}`, !!t], ["disabled", o || s], [`shape-${n}`, !!n], [`size-${l}`, !!l], ["icon-only", !a && !!(i || u?.length) && !p], ["icon-trailing", r], ["stacked", !!c], ["active", d === "true" || f]);
+function w(e, n, r, i = s.Normal) {
+	if (r && i != s.SuperCondensed) {
+		let r = e.tagFor(_);
+		return t`<span class="${(e) => {
+			let t = e.querySelector("[slot=\"icon\"]");
+			return g("icon", "pending", ["pending-no-icon", !(n || t)]);
+		}}" aria-hidden="true"><${r} size="${{
+			[s.Condensed]: "-6",
+			[s.Normal]: "-5",
+			[s.Expanded]: "-4"
+		}[i]}"></${r}></span>`;
+	} else return d(e)(n, f.Slot);
 }
-r([
-  d({ attribute: "offset", converter: E })
-], a.prototype, "offset");
-r([
-  h
-], a.prototype, "items");
-r([
-  d({ mode: "fromView" })
-], a.prototype, "placement");
-r([
-  d
-], a.prototype, "trigger");
-r([
-  d({ mode: "boolean", attribute: "auto-dismiss" })
-], a.prototype, "autoDismiss");
-r([
-  d({ mode: "fromView", attribute: "position-strategy" })
-], a.prototype, "positionStrategy");
-r([
-  d({ mode: "boolean" })
-], a.prototype, "open");
-r([
-  h
-], a.prototype, "headerSlottedContent");
-r([
-  h
-], a.prototype, "actionItemsSlottedContent");
-r([
-  h
-], a.prototype, "_popupOffset");
-const N = ({
-  headerSlottedContent: o,
-  actionItemsSlottedContent: e,
-  items: s
-}) => O(
-  "base",
-  ["hide-header", !o?.length],
-  ["hide-actions", !e?.length],
-  ["hide-body", s && !s.length]
-);
-function R(o, e) {
-  return o.open && z(e) && (o.open = !1), !0;
-}
-const U = (o) => {
-  const e = o.tagFor(x), s = A();
-  function i(t, n, c) {
-    n.stopPropagation(), t.open = c;
-  }
-  return k`
-		<template @focusout="${(t, n) => t._onFocusout(n.event)}">
-			${s}
-			<${e}
-				${T("_popupEl")}
-				:placement=${(t) => t.placement}
-				:open=${(t) => t.open}
-				:anchor=${(t) => t._anchorEl}
-				:strategy="${(t) => t.positionStrategy}"
-				:offset=${(t) => t.offset || t._popupOffset}
-				@keydown="${(t, n) => R(t, n.event)}"
-				@vwc-popup:open="${(t, n) => i(t, n.event, !0)}"
-				@vwc-popup:close="${(t, n) => i(t, n.event, !1)}"
+var T = (e) => [
+	"submit",
+	"button",
+	"reset"
+].indexOf(e) > -1 ? e : "submit", E = (e) => {
+	let n = S(e);
+	return t`<span class="content">
+			${(t) => w(e, t.icon, t.pending, t.size)}
+			${o((e) => e.label, t`<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
 			>
-			<div class="${N}">
-				<div class="header">
-					<slot name="header" ${u("headerSlottedContent")}></slot>
-				</div>
-				<div
-					class="body"
-					${F({
-    role: "menu"
-  })}
-					@change="${(t, n) => t._onBodyChange(n.event)}"
-					@keydown="${(t, n) => t.handleMenuKeyDown(n.event)}"
-					@focusout="${(t, n) => t.handleFocusOut(n.event)}"
-				>
-					<slot ${u("items")}></slot>
-				</div>
-				<footer class="action-items"><slot name="action-items"  ${u(
-    "actionItemsSlottedContent"
-  )}></slot></footer>
-			</div>
-		</${e}>
-	</template>`;
-}, V = $(
-  b,
-  a,
-  U,
-  [v, I],
-  {
-    styles: B
-  }
-), ne = C(V);
-export {
-  a as M,
-  V as m,
-  ne as r
+		</span>
+		${o((e) => e.dropdownIndicator, n)}`;
 };
+function D(e) {
+	return t` <button
+		class="${C}"
+		?autofocus="${(e) => e.autofocus}"
+		form="${(e) => e.formId}"
+		formaction="${(e) => e.formaction}"
+		formenctype="${(e) => e.formenctype}"
+		formmethod="${(e) => e.formmethod}"
+		formnovalidate="${(e) => e.formnovalidate}"
+		formtarget="${(e) => e.formtarget}"
+		name="${(e) => e.name}"
+		type="${(e) => T(e.type)}"
+		value="${(e) => e.value}"
+		title="${(e) => e.title}"
+		${m({
+		ariaLabel: null,
+		ariaDisabled: (e) => e.disabled || e.pending
+	})}
+		${a("control")}
+		@click="${(e, t) => e.clickHandler(t.event)}"
+	>
+		${E(e)}
+	</button>`;
+}
+function O(e) {
+	return t`${(t) => t._renderLinkElement(E(e), C, { ariaLabel: null })}`;
+}
+//#endregion
+//#region src/lib/button/definition.ts
+var k = r("button", b, (e) => t` <template>
+		${o((e) => !e.href, t`${D(e)}`)}
+		${o((e) => e.href, O(e))}
+	</template>`, [l, v], {
+	styles: x,
+	shadowOptions: { delegatesFocus: !0 }
+}), A = i(k);
+//#endregion
+export { b as i, A as n, S as r, k as t };

package/bundled/definition7.cjs

@@ -1,30 +1,6 @@
-"use strict";const u=require("./definition2.cjs"),a=require("./vivid-element.cjs"),p=require("./key-codes.cjs"),h=require("./affix.cjs"),b=require("./host-semantics.cjs"),v=require("./slotted.cjs"),s=require("./when.cjs"),k=require("./class-names.cjs"),g=":host(:focus-visible){outline:none}:host([disabled]){pointer-events:none}.base{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media(hover:hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}@media(hover:hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base.connotation-cta{--_connotation-color-primary: var(--vvd-menu-item-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-menu-item-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-menu-item-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-firm: var(--vvd-menu-item-cta-firm, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-menu-item-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-menu-item-cta-soft, var(--vvd-color-cta-100));--_connotation-color-pale: var(--vvd-menu-item-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-menu-item-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-menu-item-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-menu-item-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-menu-item-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-firm: var(--vvd-menu-item-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-menu-item-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-menu-item-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-pale: var(--vvd-menu-item-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-menu-item-accent-dim, var(--vvd-color-neutral-200))}.base{--_menu-item-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) }.base{display:flex;box-sizing:border-box;align-items:center;border-radius:8px;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);inline-size:100%}.base:not(.two-lines){gap:12px;min-block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));padding-block:8px;padding-inline:var(--_menu-item-padding-inline)}.base.two-lines{gap:16px;min-block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)) + 1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)));padding-block:12px;padding-inline:var(--_menu-item-padding-inline)}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}:host(:not([role=presentation]):focus-visible) .base{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));--focus-stroke-gap-color: transparent}.icon{flex-shrink:0;font-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2))/2);line-height:1}.action,.decorative{display:flex;place-content:center}.action{color:var(--_appearance-color-text)}.base.trailing .action,.base.has-meta .action{order:2}:host(:not([check-appearance],[checked],[disabled])) .action{color:var(--vvd-color-neutral-500)}.base:not(.disabled) .decorative{color:var(--vvd-color-neutral-600)}.base.disabled .decorative{color:var(--vvd-color-neutral-200)}.base.has-meta .decorative{order:1}.chevron{order:3}.text{display:flex;overflow:hidden;flex-direction:column;gap:4px;margin-inline-end:auto}.text-primary,.text-secondary{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font:var(--vvd-typography-base)}.text-primary{font:var(--vvd-typography-base);-webkit-line-clamp:var(--text-primary-line-clamp, 1)}.base:not(.disabled) .text-primary{color:var(--vvd-color-canvas-text)}.base.disabled .text-primary{color:var(--_appearance-color-text)}.base.two-lines .text-primary{font:var(--vvd-typography-base-bold)}.text-secondary{color:var(--vvd-color-neutral-800);font:var(--vvd-typography-base-condensed);-webkit-line-clamp:var(--text-secondary-line-clamp, 1)}.base.two-lines .text-secondary{color:var(--vvd-color-neutral-600)}.base.disabled .text-secondary{color:var(--_appearance-color-text)}.base.selected:not(.disabled) .text-secondary{color:var(--vvd-color-neutral-800)}:host([internal-part]) .text-primary{font:var(--_text-primary-custom-size, var--vvd-typography-base)}",m={menuitem:"menuitem",menuitemcheckbox:"menuitemcheckbox",menuitemradio:"menuitemradio",presentation:"presentation"};var w=Object.defineProperty,c=(e,o,i,t)=>{for(var n=void 0,l=e.length-1,d;l>=0;l--)(d=e[l])&&(n=d(o,i,n)||n);return n&&w(o,i,n),n};class r extends b.HostSemantics(h.AffixIcon(a.VividElement)){constructor(){super(),this.role=m.menuitem,this.checked=!1,this.handleMenuItemClick=o=>this._isSyntheticClickEvent(o)?!0:(this.invoke(),!!this._isPresentational),this.handleMouseOver=o=>(this.disabled||!this.submenu||this.expanded||(this.expanded=!0),!1),this.handleMouseOut=o=>(!this.expanded||this.contains(document.activeElement)||(this.expanded=!1),!1),this.invoke=()=>{if(!(this.disabled||this._isPresentational))switch(this.controlType){case"checkbox":this.checked=!this.checked;break;case"radio":this.checked||(this.checked=!0);break;default:this.submenu?this.expanded=!0:this.$emit("change");break}},this.checkTrailing=!1,this.handleMenuItemKeyDown=o=>{if(o.defaultPrevented)return!1;switch(o.key){case p.keyEnter:case p.keySpace:return this.invoke(),this.disabled||this.#t(),!1;case p.keyArrowRight:return this.submenu&&(this.expanded=!0,this.#t()),!1;case p.keyArrowLeft:if(this.expanded)return this.#t(),this.expanded=!1,this.focus(),!1}return!0},this.#e=new WeakSet,this.addEventListener("expanded-change",this.#n)}expandedChanged(){this.$fastController.isConnected&&(this.submenu&&!this.expanded&&this.submenu.collapseExpandedItem(),this.$emit("expanded-change",this,{bubbles:!1}))}#a(){this._isPresentational?this.role==="menuitem"&&(this.role="presentation"):this.role==="presentation"&&(this.role=m.menuitem)}_isPresentationalChanged(){this.$fastController.isConnected&&this.#a()}checkedChanged(){this.$fastController.isConnected&&this.$emit("change")}connectedCallback(){super.connectedCallback(),a.Updates.enqueue(()=>{this._isPresentational=this._isPresentational??!0,this.#a()})}slottedSubmenuChanged(){this.submenu&&(this.submenu.anchor=this,this.submenu.placement="right-start",this.submenu.collapseExpandedItem=()=>this.#o(),this.submenu._popupOffset=5)}get submenu(){return this.slottedSubmenu?.length?this.slottedSubmenu[0]:null}get hasSubmenu(){return this.submenu!==null}#o(){this.expanded=!1}#n(){this.submenu&&(this.submenu.open=this.expanded)}#e;_isSyntheticClickEvent(o){return this.#e.has(o)}#t(){const o=new MouseEvent("click",{bubbles:!0,composed:!0});this.#e.add(o),this.dispatchEvent(o)}}c([a.attr({mode:"boolean"})],r.prototype,"disabled");c([a.attr({mode:"boolean"})],r.prototype,"expanded");c([a.observable],r.prototype,"_isPresentational");c([a.replaces({deprecatedPropertyName:"role",fromDeprecated:e=>{switch(e){case"menuitemcheckbox":return"checkbox";case"menuitemradio":return"radio";default:return}},toDeprecated:e=>{switch(e){case"checkbox":return"menuitemcheckbox";case"radio":return"menuitemradio";default:return"menuitem"}}}),a.attr({attribute:"control-type"})],r.prototype,"controlType");c([a.attr({mode:"boolean"})],r.prototype,"checked");c([a.attr],r.prototype,"text");c([a.attr({attribute:"text-secondary"})],r.prototype,"textSecondary");c([a.attr],r.prototype,"connotation");c([a.attr({mode:"boolean",attribute:"check-trailing"})],r.prototype,"checkTrailing");c([a.attr({attribute:"check-appearance"})],r.prototype,"checkedAppearance");c([a.observable],r.prototype,"metaSlottedContent");c([a.observable],r.prototype,"trailingMetaSlottedContent");c([a.observable],r.prototype,"slottedSubmenu");const f="menu",$=e=>{if(e.checkedAppearance==="tick-only")return e.checked?"check-line":"";const o=e.controlType==="checkbox"?"checkbox":"radio",i=e.checked?"checked":"unchecked";return`${o}-${i}-2-line`},C=({connotation:e,disabled:o,checked:i,controlType:t,text:n,textSecondary:l,icon:d,metaSlottedContent:y,checkTrailing:_})=>k.classNames("base",[`connotation-${e}`,!!e],["disabled",!!o],["selected",!!(t&&i)],["trailing",!!(t&&(_||d))],["item-checkbox",t==="checkbox"],["item-radio",t==="radio"],["two-lines",!!n?.length&&!!l?.length],["has-meta",!!y?.length]);function S(e){const o=e.tagFor(u.Icon);return a.html`${s.when(i=>!!i.controlType,a.html`<span class="action"><${o} class="icon" name="${i=>$(i)}"></${o}></span>`)}`}function I(){return a.html`${s.when(e=>e.text||e.textSecondary,a.html`<span class="text">
-			${s.when(e=>e.text,a.html`<span class="text-primary">${e=>e.text}</span>`)}
-			${s.when(e=>e.textSecondary,a.html`<span class="text-secondary">${e=>e.textSecondary}</span>`)}
-		</span>`)}`}const M=e=>{const o=h.affixIconTemplateFactory(e),i=e.tagFor(u.Icon);return a.html`
-		<template
-			${b.applyHostSemantics({role:m.menuitem,ariaHasPopup:t=>t.hasSubmenu?"menu":void 0,ariaChecked:t=>t.controlType?t.checked:void 0,ariaDisabled:t=>t.disabled,ariaExpanded:t=>t.expanded})}
-			@keydown="${(t,n)=>t.handleMenuItemKeyDown(n.event)}"
-			@click="${(t,n)=>t.handleMenuItemClick(n.event)}"
-			@mouseover="${(t,n)=>t.handleMouseOver(n.event)}"
-			@mouseout="${(t,n)=>t.handleMouseOut(n.event)}"
-		>
-			<div class="${C}">
-				<slot name="meta" ${v.slotted("metaSlottedContent")}></slot>
-				${S(e)}
-				${s.when(t=>t.icon,a.html`<span class="decorative"
-						>${t=>o(t.icon)}</span
-					>`)}
-				${I()}
-				<slot
-					name="trailing-meta"
-					${v.slotted("trailingMetaSlottedContent")}
-				></slot>
-				${s.when(t=>t.hasSubmenu,a.html`<${i} class="chevron" name="chevron-right-line"></${i}>`)}
-			</div>
-			<slot
-				name="submenu"
-				${v.slotted({property:"slottedSubmenu",filter:v.elements(e.tagForNonDependency(f))})}
-			></slot>
-		</template>
-	`},x=a.defineVividComponent("menu-item",r,M,[u.iconDefinition],{styles:g}),E=a.createRegisterFunction(x);exports.MenuItem=r;exports.MenuItemRole=m;exports.menuItemDefinition=x;exports.menuName=f;exports.registerMenuItem=E;
+const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`),n=require(`./class-names.cjs`);var r=class extends e.t{};t.t([e.l],r.prototype,`dp`,void 0),t.t([e.l({attribute:`no-shadow`,mode:`boolean`})],r.prototype,`noShadow`,void 0),t.t([e.l({attribute:`not-relative`,mode:`boolean`})],r.prototype,`notRelative`,void 0);var i=`:host,.control{display:contents}.control.dp-0{--_elevation-fill:var(--_vvd-tinted-color-surface-0dp,var(--vvd-color-surface-0dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-0dp,var(--vvd-shadow-surface-0dp))}.control.dp-4{--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp))}.control.dp-8{--_elevation-fill:var(--_vvd-tinted-color-surface-8dp,var(--vvd-color-surface-8dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-8dp,var(--vvd-shadow-surface-8dp))}.control.dp-12{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}.control.dp-16{--_elevation-fill:var(--_vvd-tinted-color-surface-16dp,var(--vvd-color-surface-16dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-16dp,var(--vvd-shadow-surface-16dp))}.control.dp-24{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}.control:not(.dp-0,.dp-4,.dp-8,.dp-12,.dp-16,.dp-24){--_elevation-fill:var(--_vvd-tinted-color-surface-2dp,var(--vvd-color-surface-2dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-2dp,var(--vvd-shadow-surface-2dp))}.control ::slotted(*){isolation:isolate}.control ::slotted(*):before{z-index:-1;border-radius:inherit;background:var(--_elevation-fill);content:"";block-size:100%;filter:var(--_elevation-shadow);inline-size:100%;transition:background-color .15s linear,filter .15s linear;position:absolute;inset-block-start:0;inset-inline-start:0}.control:not(.not-relative) ::slotted(*){position:relative}.control.no-shadow ::slotted(*):before{filter:none}`,a=e.d` <div
+	class="${({dp:e,noShadow:t,notRelative:r})=>n.t(`control`,[`dp-${e}`,!!e],[`no-shadow`,!!t],[`not-relative`,!!r])}"
+	part="base"
+>
+	<slot></slot>
+</div>`,o=e.o(`elevation`,r,a,[],{styles:i}),s=e.s(o);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return o}});