@editora/ui-core 0.1.12 → 0.1.13

package/dist/menu.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("./ElementBase-1b301e7f.js"),y=require("./portal-d8d7fbca.js"),x=require("./dismissable-layer-193e3bed.js"),A=require("./positioner-accc6e5f.js"),E=require("./menu-item-styles-83ad1e22.js");function g(r){return r==="top"||r==="left"||r==="right"?r:"bottom"}function k(r){return r==="sm"||r==="1"||r==="compact"?"sm":r==="lg"||r==="3"||r==="comfortable"?"lg":"md"}function S(r){return!r||r==="default"?null:r==="none"?"0px":r==="sm"?"8px":r==="md"?"12px":r==="lg"?"16px":r==="full"?"999px":r==="square"?"6px":r==="soft"?"14px":/^\d+(\.\d+)?$/.test(r)?`${r}px`:/^\d+(\.\d+)?(px|rem|em|%)$/.test(r)?r:null}function l(r,e){return r.getAttribute(e)||""}function h(r,e){if(r==null)return e;const t=String(r).toLowerCase();return t!=="false"&&t!=="0"}function u(){return['[role="menuitem"]','[role="menuitemcheckbox"]','[role="menuitemradio"]',".item","[data-menu-item]"].join(", ")}function m(r){return r.hasAttribute("disabled")||r.getAttribute("aria-disabled")==="true"||!!r.disabled}function p(r){const e=typeof r.composedPath=="function"?r.composedPath():[];for(const i of e)if(i instanceof HTMLElement&&i.matches(u()))return i;const t=r.target;return t instanceof HTMLElement?t.closest(u()):null}const w=new Set(["variant","density","shape","elevation","tone","size","radius"]),I=["--ui-menu-bg","--ui-menu-color","--ui-menu-border-color","--ui-menu-border","--ui-menu-shadow","--ui-menu-radius","--ui-menu-padding","--ui-menu-min-width","--ui-menu-ring","--ui-menu-backdrop","--ui-menu-z","--ui-menu-item-radius","--ui-menu-item-gap","--ui-menu-item-min-height","--ui-menu-item-pad-y","--ui-menu-item-pad-x","--ui-menu-item-font-size","--ui-menu-item-line-height","--ui-menu-separator-margin","--ui-menu-item-hover-bg","--ui-menu-item-active-color"],C=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("./ElementBase-1b301e7f.js"),y=require("./portal-d9bae456.js"),x=require("./dismissable-layer-193e3bed.js"),A=require("./positioner-43b1c75a.js"),E=require("./menu-item-styles-83ad1e22.js");function g(n){return n==="top"||n==="left"||n==="right"?n:"bottom"}function k(n){return n==="sm"||n==="1"||n==="compact"?"sm":n==="lg"||n==="3"||n==="comfortable"?"lg":"md"}function S(n){return!n||n==="default"?null:n==="none"?"0px":n==="sm"?"8px":n==="md"?"12px":n==="lg"?"16px":n==="full"?"999px":n==="square"?"6px":n==="soft"?"14px":/^\d+(\.\d+)?$/.test(n)?`${n}px`:/^\d+(\.\d+)?(px|rem|em|%)$/.test(n)?n:null}function l(n,e){return n.getAttribute(e)||""}function h(n,e){if(n==null)return e;const i=String(n).toLowerCase();return i!=="false"&&i!=="0"}function u(){return['[role="menuitem"]','[role="menuitemcheckbox"]','[role="menuitemradio"]',".item","[data-menu-item]"].join(", ")}function m(n){return n.hasAttribute("disabled")||n.getAttribute("aria-disabled")==="true"||!!n.disabled}function p(n){const e=typeof n.composedPath=="function"?n.composedPath():[];for(const t of e)if(t instanceof HTMLElement&&t.matches(u()))return t;const i=n.target;return i instanceof HTMLElement?i.closest(u()):null}const w=new Set(["variant","density","shape","elevation","tone","size","radius"]),I=["--ui-menu-bg","--ui-menu-color","--ui-menu-border-color","--ui-menu-border","--ui-menu-shadow","--ui-menu-radius","--ui-menu-padding","--ui-menu-min-width","--ui-menu-ring","--ui-menu-backdrop","--ui-menu-z","--ui-menu-item-radius","--ui-menu-item-gap","--ui-menu-item-min-height","--ui-menu-item-pad-y","--ui-menu-item-pad-x","--ui-menu-item-font-size","--ui-menu-item-line-height","--ui-menu-separator-margin","--ui-menu-item-hover-bg","--ui-menu-item-active-color"],C=`
   :host {
     --ui-menu-bg: var(--base-menu-bg, var(--color-panel-solid, var(--ui-color-surface, var(--ui-surface, #ffffff))));
     --ui-menu-color: var(--ui-color-text, var(--ui-text, #0f172a));
@@ -262,7 +262,7 @@
       box-shadow: none;
     }
   }
-`;class _ extends v.ElementBase{constructor(){super(),this._isOpen=!1,this._portalEl=null,this._positioner=null,this._dismissableLayer=null,this._restoreFocusEl=null,this._typeaheadBuffer="",this._typeaheadTimer=null,this._globalListenersBound=!1,this._menuClickHandler=null,this._menuId=`ui-menu-${Math.random().toString(36).slice(2,10)}`,this._onHostClick=this._onHostClick.bind(this),this._onDocumentKeyDown=this._onDocumentKeyDown.bind(this),this._onDocumentScroll=this._onDocumentScroll.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return["open","disabled","placement","variant","size","density","radius","shape","elevation","tone","close-on-select","close-on-scroll","typeahead"]}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onHostClick),this.root.addEventListener("slotchange",this._onSlotChange),this._syncOpenState(),this._syncTriggerA11y()}disconnectedCallback(){this.removeEventListener("click",this._onHostClick),this.root.removeEventListener("slotchange",this._onSlotChange),this._unbindGlobalListeners(),this._teardownPortal(),super.disconnectedCallback()}attributeChangedCallback(e,t,i){if(t!==i){if(e==="open"){this._syncOpenState();return}if(!(e==="close-on-select"||e==="close-on-scroll"||e==="typeahead")){if(e==="disabled"){this.hasAttribute("disabled")&&this.close(),this._syncTriggerA11y();return}if(e==="placement"&&this._isOpen){this._rebuildPositioner();return}w.has(e)&&this._isOpen&&this._syncPortalVisualState()}}}open(){this.hasAttribute("disabled")||this.setAttribute("open","")}close(){this.removeAttribute("open")}toggle(){this.hasAttribute("open")?this.close():this.open()}get closeOnSelect(){return h(this.getAttribute("close-on-select"),!0)}set closeOnSelect(e){this.setAttribute("close-on-select",e?"true":"false")}get closeOnScroll(){return h(this.getAttribute("close-on-scroll"),!0)}set closeOnScroll(e){this.setAttribute("close-on-scroll",e?"true":"false")}get typeahead(){return h(this.getAttribute("typeahead"),!0)}set typeahead(e){this.setAttribute("typeahead",e?"true":"false")}_getTrigger(){return this.querySelector('[slot="trigger"]')}_getContentSource(){return this.querySelector('[slot="content"]')}_getItemSources(){return Array.from(this.querySelectorAll('[slot="item"]'))}_onSlotChange(){this._isOpen&&this._rebuildPortalContent()}_syncTriggerA11y(){const e=this._getTrigger();if(e){if(e.setAttribute("aria-haspopup","menu"),e.setAttribute("aria-expanded",this._isOpen?"true":"false"),e.setAttribute("aria-controls",this._menuId),this.hasAttribute("disabled")){e.setAttribute("aria-disabled","true"),e.setAttribute("tabindex","-1");return}e.getAttribute("aria-disabled")==="true"&&e.removeAttribute("aria-disabled"),e.getAttribute("tabindex")==="-1"&&e.removeAttribute("tabindex")}}_syncOpenState(){var i;const e=this.hasAttribute("open")&&!this.hasAttribute("disabled");if(e===this._isOpen){this._syncTriggerA11y(),e&&!this._portalEl?this._mountPortal():e&&((i=this._positioner)==null||i.update());return}if(this._isOpen=e,this._syncTriggerA11y(),e){this._bindGlobalListeners(),this._restoreFocusEl=document.activeElement,this._mountPortal(),this.dispatchEvent(new CustomEvent("open",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:{open:!0}})),requestAnimationFrame(()=>this._focusFirstItem());return}this._unbindGlobalListeners(),this._teardownPortal(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:{open:!1}}));const t=this._getTrigger();if(t)try{t.focus({preventScroll:!0})}catch{t.focus()}this._restoreFocusEl=null}_bindGlobalListeners(){this._globalListenersBound||(document.addEventListener("keydown",this._onDocumentKeyDown),document.addEventListener("scroll",this._onDocumentScroll,!0),this._globalListenersBound=!0)}_unbindGlobalListeners(){this._globalListenersBound&&(document.removeEventListener("keydown",this._onDocumentKeyDown),document.removeEventListener("scroll",this._onDocumentScroll,!0),this._globalListenersBound=!1)}_clearActiveState(){this._portalEl&&this._portalEl.querySelectorAll(u()).forEach(e=>e.removeAttribute("data-active"))}_queryItems(){return this._portalEl?Array.from(this._portalEl.querySelectorAll(u())).filter(e=>!m(e)):[]}_focusItem(e){if(e){this._clearActiveState(),e.setAttribute("data-active","true");try{e.focus({preventScroll:!0})}catch{e.focus()}typeof e.scrollIntoView=="function"&&e.scrollIntoView({block:"nearest"})}}_focusFirstItem(){this._focusItem(this._queryItems()[0]||null)}_focusLastItem(){const e=this._queryItems();this._focusItem(e[e.length-1]||null)}_moveFocus(e){const t=this._queryItems();if(!t.length)return;const i=document.activeElement,n=i?t.findIndex(o=>o===i||o.contains(i)):-1,a=n===-1?0:Math.max(0,Math.min(t.length-1,n+e));this._focusItem(t[a]||null)}_resetTypeahead(){this._typeaheadBuffer="",this._typeaheadTimer!=null&&(window.clearTimeout(this._typeaheadTimer),this._typeaheadTimer=null)}_isTypeaheadKey(e){return e.ctrlKey||e.metaKey||e.altKey?!1:e.key.length===1&&/\S/.test(e.key)}_handleTypeahead(e){if(!this.typeahead||!this._isTypeaheadKey(e))return!1;this._typeaheadBuffer=`${this._typeaheadBuffer}${e.key.toLowerCase()}`.slice(0,24),this._typeaheadTimer!=null&&window.clearTimeout(this._typeaheadTimer),this._typeaheadTimer=window.setTimeout(()=>this._resetTypeahead(),420);const t=document.activeElement,i=this._queryItems();if(!i.length)return!1;const n=t?i.findIndex(s=>s===t||s.contains(t)):-1,o=(n>=0?[...i.slice(n+1),...i.slice(0,n+1)]:i).find(s=>(s.textContent||"").trim().toLowerCase().startsWith(this._typeaheadBuffer));return o?(e.preventDefault(),this._focusItem(o),!0):!1}_applySelectionBehavior(e){const t=e.getAttribute("role");if(t==="menuitemcheckbox"){const n=e.getAttribute("aria-checked")==="true";e.setAttribute("aria-checked",n?"false":"true"),e.setAttribute("data-state",n?"unchecked":"checked");return}if(t!=="menuitemradio"||!this._portalEl)return;const i=e.getAttribute("data-group")||e.getAttribute("name")||"";this._portalEl.querySelectorAll('[role="menuitemradio"]').forEach(n=>{const a=n.getAttribute("data-group")||n.getAttribute("name")||"";i&&a!==i||(n.setAttribute("aria-checked",n===e?"true":"false"),n.setAttribute("data-state",n===e?"checked":"unchecked"))})}_handleItemSelect(e){var n;this._applySelectionBehavior(e);const t=e.getAttribute("data-index"),i=t!=null&&!Number.isNaN(Number(t))?Number(t):void 0;this.dispatchEvent(new CustomEvent("select",{bubbles:!0,detail:{index:i,value:e.getAttribute("data-value")||e.getAttribute("value")||void 0,label:e.getAttribute("aria-label")||((n=e.textContent)==null?void 0:n.trim())||void 0,checked:e.getAttribute("aria-checked")==="true",item:e}})),this.closeOnSelect?this.close():this._focusItem(e)}_buildLegacyItems(e){const t=this._getItemSources();return t.forEach((i,n)=>{const a=i.cloneNode(!0);a.removeAttribute("slot"),a.getAttribute("role")||a.setAttribute("role","menuitem"),a.classList.contains("item")||a.classList.add("item"),a.hasAttribute("tabindex")||a.setAttribute("tabindex","-1"),a.hasAttribute("data-index")||a.setAttribute("data-index",String(n)),e.appendChild(a)}),t.length}_hydrateMenuItems(e){const t=Array.from(e.querySelectorAll(u()));return t.forEach((i,n)=>{i.getAttribute("role")||i.setAttribute("role","menuitem"),i.hasAttribute("tabindex")||i.setAttribute("tabindex","-1"),i.classList.contains("item")||i.classList.add("item"),i.hasAttribute("data-index")||i.setAttribute("data-index",String(n))}),t.length}_applyPortalTokens(e){const t=window.getComputedStyle(this);I.forEach(i=>{const n=t.getPropertyValue(i).trim();n?e.style.setProperty(i,n):e.style.removeProperty(i)})}_applyPortalVariantData(e){const t=l(this,"variant"),i=k(this.getAttribute("size")||this.getAttribute("density")),n=l(this,"density"),a=this.getAttribute("radius"),o=l(this,"shape"),s=l(this,"elevation"),c=l(this,"tone"),f=t==="default"||t===""?"":t==="line"?"outline":t==="glass"?"soft":t;f?e.setAttribute("data-variant",f):e.removeAttribute("data-variant"),i!=="md"?e.setAttribute("data-size",i):e.removeAttribute("data-size"),n&&n!=="default"?e.setAttribute("data-density",n):e.removeAttribute("data-density"),s&&s!=="default"?e.setAttribute("data-elevation",s):e.removeAttribute("data-elevation");const b=c==="default"||c==="brand"||c===""?"":c;b?e.setAttribute("data-tone",b):e.removeAttribute("data-tone");const d=S(a||o||null);d?(e.style.setProperty("--ui-menu-radius",d),e.style.setProperty("--ui-menu-item-radius",d==="999px"?"999px":`calc(${d} - 2px)`)):(e.style.removeProperty("--ui-menu-radius"),e.style.removeProperty("--ui-menu-item-radius"))}_syncPortalVisualState(){this._portalEl&&(this._applyPortalTokens(this._portalEl),this._applyPortalVariantData(this._portalEl),this._portalEl.setAttribute("aria-hidden","false"),this._portalEl.setAttribute("aria-busy","false"),this._portalEl.style.display="block",this._portalEl.style.visibility="visible",this._portalEl.style.opacity="1",this._portalEl.style.transform="translateY(0px) scale(1)",this._portalEl.style.pointerEvents="auto")}_attachMenuEvents(e){this._menuClickHandler=t=>{const i=p(t);!i||m(i)||this._handleItemSelect(i)},e.addEventListener("click",this._menuClickHandler),e.addEventListener("mouseover",t=>{const i=p(t);!i||m(i)||this._focusItem(i)}),e.addEventListener("focusin",t=>{const i=p(t);!i||m(i)||this._focusItem(i)}),e.addEventListener("mouseleave",()=>this._clearActiveState())}_buildPortalElement(){const e=document.createElement("div");e.className="surface menu",e.id=this._menuId,e.setAttribute("part","menu"),e.setAttribute("role","menu"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","false"),e.setAttribute("aria-busy","false"),e.setAttribute("data-placement",g(this.getAttribute("placement")));const t=document.createElement("style");t.textContent=T,e.appendChild(t);const i=this._getContentSource();let n=0;if(i){const a=i.cloneNode(!0);a.removeAttribute("slot"),e.appendChild(a)}else n=this._buildLegacyItems(e);if(n=this._hydrateMenuItems(e)||n,n===0){const a=document.createElement("div");a.className="empty-state",a.textContent="No items",e.appendChild(a)}return this._applyPortalTokens(e),this._applyPortalVariantData(e),e.style.display="block",e.style.visibility="visible",e.style.opacity="1",e.style.transform="translateY(0px) scale(1)",e.style.pointerEvents="auto",this._attachMenuEvents(e),e}_rebuildPortalContent(){if(!this._portalEl)return;const e=this._portalEl.parentElement;if(!e)return;const t=this._portalEl,i=this._buildPortalElement();e.replaceChild(i,t),this._portalEl=i,this._rebuildPositioner()}_rebuildPositioner(){var t;const e=this._getTrigger();!this._portalEl||!e||((t=this._positioner)==null||t.destroy(),this._positioner=A.createPositioner({anchor:e,floating:this._portalEl,placement:g(this.getAttribute("placement")),offset:6,flip:!0,shift:!0,fitViewport:!0,observeScroll:!1}))}_mountPortal(){var t;const e=this._getTrigger();if(e){if(this._portalEl)this._syncPortalVisualState();else{this._portalEl=this._buildPortalElement();const i=y.createPortalContainer();if(!i){this._portalEl=null;return}i.appendChild(this._portalEl)}this._rebuildPositioner(),(t=this._dismissableLayer)==null||t.destroy(),this._dismissableLayer=x.createDismissableLayer({node:this._portalEl,trigger:e,closeOnEscape:!0,closeOnPointerOutside:!0,onDismiss:()=>this.close()})}}_teardownPortal(){var e,t,i;if((e=this._dismissableLayer)==null||e.destroy(),this._dismissableLayer=null,(t=this._positioner)==null||t.destroy(),this._positioner=null,(i=this._portalEl)!=null&&i.parentElement)try{this._portalEl.parentElement.removeChild(this._portalEl)}catch{}this._portalEl=null,this._menuClickHandler=null,this._resetTypeahead()}_isEventInsideTrigger(e){const t=this._getTrigger();return!!t&&e.composedPath().includes(t)}_isEventInsideMenu(e){return!!this._portalEl&&e.composedPath().includes(this._portalEl)}_onHostClick(e){this.hasAttribute("disabled")||this._isEventInsideTrigger(e)&&(e.preventDefault(),this.toggle())}_onDocumentScroll(e){if(!this._isOpen||!this.closeOnScroll)return;const t=typeof e.composedPath=="function"?e.composedPath():[];this._portalEl&&t.includes(this._portalEl)||this.close()}_onDocumentKeyDown(e){var t;if(!this._isOpen){if(e.key!=="ArrowDown"&&e.key!=="ArrowUp"||!this._isEventInsideTrigger(e))return;e.preventDefault(),this.open(),requestAnimationFrame(()=>{e.key==="ArrowUp"?this._focusLastItem():this._focusFirstItem()});return}if(!(!this._isEventInsideTrigger(e)&&!this._isEventInsideMenu(e))&&!this._handleTypeahead(e)){if(e.key==="Escape"){e.preventDefault(),e.stopPropagation(),this.close();return}if(e.key==="ArrowDown"){e.preventDefault(),this._moveFocus(1);return}if(e.key==="ArrowUp"){e.preventDefault(),this._moveFocus(-1);return}if(e.key==="Home"){e.preventDefault(),this._focusFirstItem();return}if(e.key==="End"){e.preventDefault(),this._focusLastItem();return}if(e.key==="Tab"){this.close();return}if(e.key==="Enter"||e.key===" "){const i=document.activeElement;if(!i||!((t=this._portalEl)!=null&&t.contains(i)))return;const n=i.closest(u());if(!n||m(n))return;e.preventDefault(),this._handleItemSelect(n)}}}render(){var e;this.setContent(`
+`;class _ extends v.ElementBase{constructor(){super(),this._isOpen=!1,this._portalEl=null,this._positioner=null,this._dismissableLayer=null,this._restoreFocusEl=null,this._typeaheadBuffer="",this._typeaheadTimer=null,this._globalListenersBound=!1,this._menuClickHandler=null,this._menuId=`ui-menu-${Math.random().toString(36).slice(2,10)}`,this._onHostClick=this._onHostClick.bind(this),this._onDocumentKeyDown=this._onDocumentKeyDown.bind(this),this._onDocumentScroll=this._onDocumentScroll.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return["open","disabled","placement","variant","size","density","radius","shape","elevation","tone","close-on-select","close-on-scroll","typeahead"]}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onHostClick),this.root.addEventListener("slotchange",this._onSlotChange),this._syncOpenState(),this._syncTriggerA11y()}disconnectedCallback(){this.removeEventListener("click",this._onHostClick),this.root.removeEventListener("slotchange",this._onSlotChange),this._unbindGlobalListeners(),this._teardownPortal(),super.disconnectedCallback()}attributeChangedCallback(e,i,t){if(i!==t){if(e==="open"){this._syncOpenState();return}if(!(e==="close-on-select"||e==="close-on-scroll"||e==="typeahead")){if(e==="disabled"){this.hasAttribute("disabled")&&this.close(),this._syncTriggerA11y();return}if(e==="placement"&&this._isOpen){this._rebuildPositioner();return}w.has(e)&&this._isOpen&&this._syncPortalVisualState()}}}open(){this.hasAttribute("disabled")||this.setAttribute("open","")}close(){this.removeAttribute("open")}toggle(){this.hasAttribute("open")?this.close():this.open()}get closeOnSelect(){return h(this.getAttribute("close-on-select"),!0)}set closeOnSelect(e){this.setAttribute("close-on-select",e?"true":"false")}get closeOnScroll(){return h(this.getAttribute("close-on-scroll"),!0)}set closeOnScroll(e){this.setAttribute("close-on-scroll",e?"true":"false")}get typeahead(){return h(this.getAttribute("typeahead"),!0)}set typeahead(e){this.setAttribute("typeahead",e?"true":"false")}_getTrigger(){return this.querySelector('[slot="trigger"]')}_getContentSource(){return this.querySelector('[slot="content"]')}_getItemSources(){return Array.from(this.querySelectorAll('[slot="item"]'))}_onSlotChange(){this._isOpen&&this._rebuildPortalContent()}_syncTriggerA11y(){const e=this._getTrigger();if(e){if(e.setAttribute("aria-haspopup","menu"),e.setAttribute("aria-expanded",this._isOpen?"true":"false"),e.setAttribute("aria-controls",this._menuId),this.hasAttribute("disabled")){e.setAttribute("aria-disabled","true"),e.setAttribute("tabindex","-1");return}e.getAttribute("aria-disabled")==="true"&&e.removeAttribute("aria-disabled"),e.getAttribute("tabindex")==="-1"&&e.removeAttribute("tabindex")}}_syncOpenState(){var t;const e=this.hasAttribute("open")&&!this.hasAttribute("disabled");if(e===this._isOpen){this._syncTriggerA11y(),e&&!this._portalEl?this._mountPortal():e&&((t=this._positioner)==null||t.update());return}if(this._isOpen=e,this._syncTriggerA11y(),e){this._bindGlobalListeners(),this._restoreFocusEl=document.activeElement,this._mountPortal(),this.dispatchEvent(new CustomEvent("open",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:{open:!0}})),requestAnimationFrame(()=>this._focusFirstItem());return}this._unbindGlobalListeners(),this._teardownPortal(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:{open:!1}}));const i=this._getTrigger();if(i)try{i.focus({preventScroll:!0})}catch{i.focus()}this._restoreFocusEl=null}_bindGlobalListeners(){this._globalListenersBound||(document.addEventListener("keydown",this._onDocumentKeyDown),document.addEventListener("scroll",this._onDocumentScroll,{passive:!0,capture:!0}),this._globalListenersBound=!0)}_unbindGlobalListeners(){this._globalListenersBound&&(document.removeEventListener("keydown",this._onDocumentKeyDown),document.removeEventListener("scroll",this._onDocumentScroll,!0),this._globalListenersBound=!1)}_clearActiveState(){this._portalEl&&this._portalEl.querySelectorAll(u()).forEach(e=>e.removeAttribute("data-active"))}_queryItems(){return this._portalEl?Array.from(this._portalEl.querySelectorAll(u())).filter(e=>!m(e)):[]}_focusItem(e){if(e){this._clearActiveState(),e.setAttribute("data-active","true");try{e.focus({preventScroll:!0})}catch{e.focus()}typeof e.scrollIntoView=="function"&&e.scrollIntoView({block:"nearest"})}}_focusFirstItem(){this._focusItem(this._queryItems()[0]||null)}_focusLastItem(){const e=this._queryItems();this._focusItem(e[e.length-1]||null)}_moveFocus(e){const i=this._queryItems();if(!i.length)return;const t=document.activeElement,r=t?i.findIndex(o=>o===t||o.contains(t)):-1,a=r===-1?0:Math.max(0,Math.min(i.length-1,r+e));this._focusItem(i[a]||null)}_resetTypeahead(){this._typeaheadBuffer="",this._typeaheadTimer!=null&&(window.clearTimeout(this._typeaheadTimer),this._typeaheadTimer=null)}_isTypeaheadKey(e){return e.ctrlKey||e.metaKey||e.altKey?!1:e.key.length===1&&/\S/.test(e.key)}_handleTypeahead(e){if(!this.typeahead||!this._isTypeaheadKey(e))return!1;this._typeaheadBuffer=`${this._typeaheadBuffer}${e.key.toLowerCase()}`.slice(0,24),this._typeaheadTimer!=null&&window.clearTimeout(this._typeaheadTimer),this._typeaheadTimer=window.setTimeout(()=>this._resetTypeahead(),420);const i=document.activeElement,t=this._queryItems();if(!t.length)return!1;const r=i?t.findIndex(s=>s===i||s.contains(i)):-1,o=(r>=0?[...t.slice(r+1),...t.slice(0,r+1)]:t).find(s=>(s.textContent||"").trim().toLowerCase().startsWith(this._typeaheadBuffer));return o?(e.preventDefault(),this._focusItem(o),!0):!1}_applySelectionBehavior(e){const i=e.getAttribute("role");if(i==="menuitemcheckbox"){const r=e.getAttribute("aria-checked")==="true";e.setAttribute("aria-checked",r?"false":"true"),e.setAttribute("data-state",r?"unchecked":"checked");return}if(i!=="menuitemradio"||!this._portalEl)return;const t=e.getAttribute("data-group")||e.getAttribute("name")||"";this._portalEl.querySelectorAll('[role="menuitemradio"]').forEach(r=>{const a=r.getAttribute("data-group")||r.getAttribute("name")||"";t&&a!==t||(r.setAttribute("aria-checked",r===e?"true":"false"),r.setAttribute("data-state",r===e?"checked":"unchecked"))})}_handleItemSelect(e){var r;this._applySelectionBehavior(e);const i=e.getAttribute("data-index"),t=i!=null&&!Number.isNaN(Number(i))?Number(i):void 0;this.dispatchEvent(new CustomEvent("select",{bubbles:!0,detail:{index:t,value:e.getAttribute("data-value")||e.getAttribute("value")||void 0,label:e.getAttribute("aria-label")||((r=e.textContent)==null?void 0:r.trim())||void 0,checked:e.getAttribute("aria-checked")==="true",item:e}})),this.closeOnSelect?this.close():this._focusItem(e)}_buildLegacyItems(e){const i=this._getItemSources();return i.forEach((t,r)=>{const a=t.cloneNode(!0);a.removeAttribute("slot"),a.getAttribute("role")||a.setAttribute("role","menuitem"),a.classList.contains("item")||a.classList.add("item"),a.hasAttribute("tabindex")||a.setAttribute("tabindex","-1"),a.hasAttribute("data-index")||a.setAttribute("data-index",String(r)),e.appendChild(a)}),i.length}_hydrateMenuItems(e){const i=Array.from(e.querySelectorAll(u()));return i.forEach((t,r)=>{t.getAttribute("role")||t.setAttribute("role","menuitem"),t.hasAttribute("tabindex")||t.setAttribute("tabindex","-1"),t.classList.contains("item")||t.classList.add("item"),t.hasAttribute("data-index")||t.setAttribute("data-index",String(r))}),i.length}_applyPortalTokens(e){const i=window.getComputedStyle(this);I.forEach(t=>{const r=i.getPropertyValue(t).trim();r?e.style.setProperty(t,r):e.style.removeProperty(t)})}_applyPortalVariantData(e){const i=l(this,"variant"),t=k(this.getAttribute("size")||this.getAttribute("density")),r=l(this,"density"),a=this.getAttribute("radius"),o=l(this,"shape"),s=l(this,"elevation"),c=l(this,"tone"),f=i==="default"||i===""?"":i==="line"?"outline":i==="glass"?"soft":i;f?e.setAttribute("data-variant",f):e.removeAttribute("data-variant"),t!=="md"?e.setAttribute("data-size",t):e.removeAttribute("data-size"),r&&r!=="default"?e.setAttribute("data-density",r):e.removeAttribute("data-density"),s&&s!=="default"?e.setAttribute("data-elevation",s):e.removeAttribute("data-elevation");const b=c==="default"||c==="brand"||c===""?"":c;b?e.setAttribute("data-tone",b):e.removeAttribute("data-tone");const d=S(a||o||null);d?(e.style.setProperty("--ui-menu-radius",d),e.style.setProperty("--ui-menu-item-radius",d==="999px"?"999px":`calc(${d} - 2px)`)):(e.style.removeProperty("--ui-menu-radius"),e.style.removeProperty("--ui-menu-item-radius"))}_syncPortalVisualState(){this._portalEl&&(this._applyPortalTokens(this._portalEl),this._applyPortalVariantData(this._portalEl),this._portalEl.setAttribute("aria-hidden","false"),this._portalEl.setAttribute("aria-busy","false"),this._portalEl.style.display="block",this._portalEl.style.visibility="visible",this._portalEl.style.opacity="1",this._portalEl.style.transform="translateY(0px) scale(1)",this._portalEl.style.pointerEvents="auto")}_attachMenuEvents(e){this._menuClickHandler=i=>{const t=p(i);!t||m(t)||this._handleItemSelect(t)},e.addEventListener("click",this._menuClickHandler),e.addEventListener("mouseover",i=>{const t=p(i);!t||m(t)||this._focusItem(t)}),e.addEventListener("focusin",i=>{const t=p(i);!t||m(t)||this._focusItem(t)}),e.addEventListener("mouseleave",()=>this._clearActiveState())}_buildPortalElement(){const e=document.createElement("div");e.className="surface menu",e.id=this._menuId,e.setAttribute("part","menu"),e.setAttribute("role","menu"),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","false"),e.setAttribute("aria-busy","false"),e.setAttribute("data-placement",g(this.getAttribute("placement")));const i=document.createElement("style");i.textContent=T,e.appendChild(i);const t=this._getContentSource();let r=0;if(t){const a=t.cloneNode(!0);a.removeAttribute("slot"),e.appendChild(a)}else r=this._buildLegacyItems(e);if(r=this._hydrateMenuItems(e)||r,r===0){const a=document.createElement("div");a.className="empty-state",a.textContent="No items",e.appendChild(a)}return this._applyPortalTokens(e),this._applyPortalVariantData(e),e.style.display="block",e.style.visibility="visible",e.style.opacity="1",e.style.transform="translateY(0px) scale(1)",e.style.pointerEvents="auto",this._attachMenuEvents(e),e}_rebuildPortalContent(){if(!this._portalEl)return;const e=this._portalEl.parentElement;if(!e)return;const i=this._portalEl,t=this._buildPortalElement();e.replaceChild(t,i),this._portalEl=t,this._rebuildPositioner()}_rebuildPositioner(){var i;const e=this._getTrigger();!this._portalEl||!e||((i=this._positioner)==null||i.destroy(),this._positioner=A.createPositioner({anchor:e,floating:this._portalEl,placement:g(this.getAttribute("placement")),offset:6,flip:!0,shift:!0,fitViewport:!0,observeScroll:!1}))}_mountPortal(){var i;const e=this._getTrigger();if(e){if(this._portalEl)this._syncPortalVisualState();else{this._portalEl=this._buildPortalElement();const t=y.createPortalContainer();if(!t){this._portalEl=null;return}t.appendChild(this._portalEl)}this._rebuildPositioner(),(i=this._dismissableLayer)==null||i.destroy(),this._dismissableLayer=x.createDismissableLayer({node:this._portalEl,trigger:e,closeOnEscape:!0,closeOnPointerOutside:!0,onDismiss:()=>this.close()})}}_teardownPortal(){var e,i,t;if((e=this._dismissableLayer)==null||e.destroy(),this._dismissableLayer=null,(i=this._positioner)==null||i.destroy(),this._positioner=null,(t=this._portalEl)!=null&&t.parentElement)try{this._portalEl.parentElement.removeChild(this._portalEl)}catch{}this._portalEl=null,this._menuClickHandler=null,this._resetTypeahead()}_isEventInsideTrigger(e){const i=this._getTrigger();return!!i&&e.composedPath().includes(i)}_isEventInsideMenu(e){return!!this._portalEl&&e.composedPath().includes(this._portalEl)}_isInternalScrollEvent(e){var a;const i=typeof e.composedPath=="function"?e.composedPath():[];if(this._portalEl&&i.includes(this._portalEl))return!0;const t=this._getTrigger();if(t&&i.includes(t))return!0;const r=e.target;return!!(r instanceof Node&&((a=this._portalEl)!=null&&a.contains(r)||t!=null&&t.contains(r)))}_onHostClick(e){this.hasAttribute("disabled")||this._isEventInsideTrigger(e)&&(e.preventDefault(),this.toggle())}_onDocumentScroll(e){!this._isOpen||!this.closeOnScroll||this._isInternalScrollEvent(e)||this.close()}_onDocumentKeyDown(e){var i;if(!this._isOpen){if(e.key!=="ArrowDown"&&e.key!=="ArrowUp"||!this._isEventInsideTrigger(e))return;e.preventDefault(),this.open(),requestAnimationFrame(()=>{e.key==="ArrowUp"?this._focusLastItem():this._focusFirstItem()});return}if(!(!this._isEventInsideTrigger(e)&&!this._isEventInsideMenu(e))&&!this._handleTypeahead(e)){if(e.key==="Escape"){e.preventDefault(),e.stopPropagation(),this.close();return}if(e.key==="ArrowDown"){e.preventDefault(),this._moveFocus(1);return}if(e.key==="ArrowUp"){e.preventDefault(),this._moveFocus(-1);return}if(e.key==="Home"){e.preventDefault(),this._focusFirstItem();return}if(e.key==="End"){e.preventDefault(),this._focusLastItem();return}if(e.key==="Tab"){this.close();return}if(e.key==="Enter"||e.key===" "){const t=document.activeElement;if(!t||!((i=this._portalEl)!=null&&i.contains(t)))return;const r=t.closest(u());if(!r||m(r))return;e.preventDefault(),this._handleItemSelect(r)}}}render(){var e;this.setContent(`
       <style>${C}</style>
       <div class="trigger" part="trigger">
         <slot name="trigger"></slot>

package/dist/menu.esm.js

@@ -1,25 +1,25 @@
 import { E as _ } from "./ElementBase-909688f3.mjs";
-import { c as v } from "./portal-1cf392ca.mjs";
+import { c as v } from "./portal-9060f7a6.mjs";
 import { c as y } from "./dismissable-layer-9c7e6b58.mjs";
-import { a as x } from "./positioner-fbd61bf1.mjs";
+import { a as x } from "./positioner-16f3cca1.mjs";
 import { c as A } from "./menu-item-styles-27fdbac4.mjs";
-function g(r) {
-  return r === "top" || r === "left" || r === "right" ? r : "bottom";
+function g(n) {
+  return n === "top" || n === "left" || n === "right" ? n : "bottom";
 }
-function E(r) {
-  return r === "sm" || r === "1" || r === "compact" ? "sm" : r === "lg" || r === "3" || r === "comfortable" ? "lg" : "md";
+function E(n) {
+  return n === "sm" || n === "1" || n === "compact" ? "sm" : n === "lg" || n === "3" || n === "comfortable" ? "lg" : "md";
 }
-function k(r) {
-  return !r || r === "default" ? null : r === "none" ? "0px" : r === "sm" ? "8px" : r === "md" ? "12px" : r === "lg" ? "16px" : r === "full" ? "999px" : r === "square" ? "6px" : r === "soft" ? "14px" : /^\d+(\.\d+)?$/.test(r) ? `${r}px` : /^\d+(\.\d+)?(px|rem|em|%)$/.test(r) ? r : null;
+function k(n) {
+  return !n || n === "default" ? null : n === "none" ? "0px" : n === "sm" ? "8px" : n === "md" ? "12px" : n === "lg" ? "16px" : n === "full" ? "999px" : n === "square" ? "6px" : n === "soft" ? "14px" : /^\d+(\.\d+)?$/.test(n) ? `${n}px` : /^\d+(\.\d+)?(px|rem|em|%)$/.test(n) ? n : null;
 }
-function l(r, e) {
-  return r.getAttribute(e) || "";
+function l(n, e) {
+  return n.getAttribute(e) || "";
 }
-function h(r, e) {
-  if (r == null)
+function h(n, e) {
+  if (n == null)
     return e;
-  const t = String(r).toLowerCase();
-  return t !== "false" && t !== "0";
+  const i = String(n).toLowerCase();
+  return i !== "false" && i !== "0";
 }
 function u() {
   return [
@@ -30,16 +30,16 @@ function u() {
     "[data-menu-item]"
   ].join(", ");
 }
-function m(r) {
-  return r.hasAttribute("disabled") || r.getAttribute("aria-disabled") === "true" || !!r.disabled;
+function m(n) {
+  return n.hasAttribute("disabled") || n.getAttribute("aria-disabled") === "true" || !!n.disabled;
 }
-function p(r) {
-  const e = typeof r.composedPath == "function" ? r.composedPath() : [];
-  for (const i of e)
-    if (i instanceof HTMLElement && i.matches(u()))
-      return i;
-  const t = r.target;
-  return t instanceof HTMLElement ? t.closest(u()) : null;
+function p(n) {
+  const e = typeof n.composedPath == "function" ? n.composedPath() : [];
+  for (const t of e)
+    if (t instanceof HTMLElement && t.matches(u()))
+      return t;
+  const i = n.target;
+  return i instanceof HTMLElement ? i.closest(u()) : null;
 }
 const w = /* @__PURE__ */ new Set(["variant", "density", "shape", "elevation", "tone", "size", "radius"]), S = [
   "--ui-menu-bg",
@@ -63,7 +63,7 @@ const w = /* @__PURE__ */ new Set(["variant", "density", "shape", "elevation", "
   "--ui-menu-separator-margin",
   "--ui-menu-item-hover-bg",
   "--ui-menu-item-active-color"
-], C = `
+], I = `
   :host {
     --ui-menu-bg: var(--base-menu-bg, var(--color-panel-solid, var(--ui-color-surface, var(--ui-surface, #ffffff))));
     --ui-menu-color: var(--ui-color-text, var(--ui-text, #0f172a));
@@ -105,7 +105,7 @@ const w = /* @__PURE__ */ new Set(["variant", "density", "shape", "elevation", "
     pointer-events: none;
     opacity: 0.62;
   }
-`, I = `
+`, C = `
   .menu {
     position: absolute;
     display: flex;
@@ -366,8 +366,8 @@ class T extends _ {
   disconnectedCallback() {
     this.removeEventListener("click", this._onHostClick), this.root.removeEventListener("slotchange", this._onSlotChange), this._unbindGlobalListeners(), this._teardownPortal(), super.disconnectedCallback();
   }
-  attributeChangedCallback(e, t, i) {
-    if (t !== i) {
+  attributeChangedCallback(e, i, t) {
+    if (i !== t) {
       if (e === "open") {
         this._syncOpenState();
         return;
@@ -435,10 +435,10 @@ class T extends _ {
     }
   }
   _syncOpenState() {
-    var i;
+    var t;
     const e = this.hasAttribute("open") && !this.hasAttribute("disabled");
     if (e === this._isOpen) {
-      this._syncTriggerA11y(), e && !this._portalEl ? this._mountPortal() : e && ((i = this._positioner) == null || i.update());
+      this._syncTriggerA11y(), e && !this._portalEl ? this._mountPortal() : e && ((t = this._positioner) == null || t.update());
       return;
     }
     if (this._isOpen = e, this._syncTriggerA11y(), e) {
@@ -446,17 +446,17 @@ class T extends _ {
       return;
     }
     this._unbindGlobalListeners(), this._teardownPortal(), this.dispatchEvent(new CustomEvent("close", { bubbles: !0 })), this.dispatchEvent(new CustomEvent("change", { bubbles: !0, detail: { open: !1 } }));
-    const t = this._getTrigger();
-    if (t)
+    const i = this._getTrigger();
+    if (i)
       try {
-        t.focus({ preventScroll: !0 });
+        i.focus({ preventScroll: !0 });
       } catch {
-        t.focus();
+        i.focus();
       }
     this._restoreFocusEl = null;
   }
   _bindGlobalListeners() {
-    this._globalListenersBound || (document.addEventListener("keydown", this._onDocumentKeyDown), document.addEventListener("scroll", this._onDocumentScroll, !0), this._globalListenersBound = !0);
+    this._globalListenersBound || (document.addEventListener("keydown", this._onDocumentKeyDown), document.addEventListener("scroll", this._onDocumentScroll, { passive: !0, capture: !0 }), this._globalListenersBound = !0);
   }
   _unbindGlobalListeners() {
     this._globalListenersBound && (document.removeEventListener("keydown", this._onDocumentKeyDown), document.removeEventListener("scroll", this._onDocumentScroll, !0), this._globalListenersBound = !1);
@@ -486,11 +486,11 @@ class T extends _ {
     this._focusItem(e[e.length - 1] || null);
   }
   _moveFocus(e) {
-    const t = this._queryItems();
-    if (!t.length)
+    const i = this._queryItems();
+    if (!i.length)
       return;
-    const i = document.activeElement, n = i ? t.findIndex((o) => o === i || o.contains(i)) : -1, a = n === -1 ? 0 : Math.max(0, Math.min(t.length - 1, n + e));
-    this._focusItem(t[a] || null);
+    const t = document.activeElement, r = t ? i.findIndex((o) => o === t || o.contains(t)) : -1, a = r === -1 ? 0 : Math.max(0, Math.min(i.length - 1, r + e));
+    this._focusItem(i[a] || null);
   }
   _resetTypeahead() {
     this._typeaheadBuffer = "", this._typeaheadTimer != null && (window.clearTimeout(this._typeaheadTimer), this._typeaheadTimer = null);
@@ -502,38 +502,38 @@ class T extends _ {
     if (!this.typeahead || !this._isTypeaheadKey(e))
       return !1;
     this._typeaheadBuffer = `${this._typeaheadBuffer}${e.key.toLowerCase()}`.slice(0, 24), this._typeaheadTimer != null && window.clearTimeout(this._typeaheadTimer), this._typeaheadTimer = window.setTimeout(() => this._resetTypeahead(), 420);
-    const t = document.activeElement, i = this._queryItems();
-    if (!i.length)
+    const i = document.activeElement, t = this._queryItems();
+    if (!t.length)
       return !1;
-    const n = t ? i.findIndex((s) => s === t || s.contains(t)) : -1, o = (n >= 0 ? [...i.slice(n + 1), ...i.slice(0, n + 1)] : i).find((s) => (s.textContent || "").trim().toLowerCase().startsWith(this._typeaheadBuffer));
+    const r = i ? t.findIndex((s) => s === i || s.contains(i)) : -1, o = (r >= 0 ? [...t.slice(r + 1), ...t.slice(0, r + 1)] : t).find((s) => (s.textContent || "").trim().toLowerCase().startsWith(this._typeaheadBuffer));
     return o ? (e.preventDefault(), this._focusItem(o), !0) : !1;
   }
   _applySelectionBehavior(e) {
-    const t = e.getAttribute("role");
-    if (t === "menuitemcheckbox") {
-      const n = e.getAttribute("aria-checked") === "true";
-      e.setAttribute("aria-checked", n ? "false" : "true"), e.setAttribute("data-state", n ? "unchecked" : "checked");
+    const i = e.getAttribute("role");
+    if (i === "menuitemcheckbox") {
+      const r = e.getAttribute("aria-checked") === "true";
+      e.setAttribute("aria-checked", r ? "false" : "true"), e.setAttribute("data-state", r ? "unchecked" : "checked");
       return;
     }
-    if (t !== "menuitemradio" || !this._portalEl)
+    if (i !== "menuitemradio" || !this._portalEl)
       return;
-    const i = e.getAttribute("data-group") || e.getAttribute("name") || "";
-    this._portalEl.querySelectorAll('[role="menuitemradio"]').forEach((n) => {
-      const a = n.getAttribute("data-group") || n.getAttribute("name") || "";
-      i && a !== i || (n.setAttribute("aria-checked", n === e ? "true" : "false"), n.setAttribute("data-state", n === e ? "checked" : "unchecked"));
+    const t = e.getAttribute("data-group") || e.getAttribute("name") || "";
+    this._portalEl.querySelectorAll('[role="menuitemradio"]').forEach((r) => {
+      const a = r.getAttribute("data-group") || r.getAttribute("name") || "";
+      t && a !== t || (r.setAttribute("aria-checked", r === e ? "true" : "false"), r.setAttribute("data-state", r === e ? "checked" : "unchecked"));
     });
   }
   _handleItemSelect(e) {
-    var n;
+    var r;
     this._applySelectionBehavior(e);
-    const t = e.getAttribute("data-index"), i = t != null && !Number.isNaN(Number(t)) ? Number(t) : void 0;
+    const i = e.getAttribute("data-index"), t = i != null && !Number.isNaN(Number(i)) ? Number(i) : void 0;
     this.dispatchEvent(
       new CustomEvent("select", {
         bubbles: !0,
         detail: {
-          index: i,
+          index: t,
           value: e.getAttribute("data-value") || e.getAttribute("value") || void 0,
-          label: e.getAttribute("aria-label") || ((n = e.textContent) == null ? void 0 : n.trim()) || void 0,
+          label: e.getAttribute("aria-label") || ((r = e.textContent) == null ? void 0 : r.trim()) || void 0,
           checked: e.getAttribute("aria-checked") === "true",
           item: e
         }
@@ -541,28 +541,28 @@ class T extends _ {
     ), this.closeOnSelect ? this.close() : this._focusItem(e);
   }
   _buildLegacyItems(e) {
-    const t = this._getItemSources();
-    return t.forEach((i, n) => {
-      const a = i.cloneNode(!0);
-      a.removeAttribute("slot"), a.getAttribute("role") || a.setAttribute("role", "menuitem"), a.classList.contains("item") || a.classList.add("item"), a.hasAttribute("tabindex") || a.setAttribute("tabindex", "-1"), a.hasAttribute("data-index") || a.setAttribute("data-index", String(n)), e.appendChild(a);
-    }), t.length;
+    const i = this._getItemSources();
+    return i.forEach((t, r) => {
+      const a = t.cloneNode(!0);
+      a.removeAttribute("slot"), a.getAttribute("role") || a.setAttribute("role", "menuitem"), a.classList.contains("item") || a.classList.add("item"), a.hasAttribute("tabindex") || a.setAttribute("tabindex", "-1"), a.hasAttribute("data-index") || a.setAttribute("data-index", String(r)), e.appendChild(a);
+    }), i.length;
   }
   _hydrateMenuItems(e) {
-    const t = Array.from(e.querySelectorAll(u()));
-    return t.forEach((i, n) => {
-      i.getAttribute("role") || i.setAttribute("role", "menuitem"), i.hasAttribute("tabindex") || i.setAttribute("tabindex", "-1"), i.classList.contains("item") || i.classList.add("item"), i.hasAttribute("data-index") || i.setAttribute("data-index", String(n));
-    }), t.length;
+    const i = Array.from(e.querySelectorAll(u()));
+    return i.forEach((t, r) => {
+      t.getAttribute("role") || t.setAttribute("role", "menuitem"), t.hasAttribute("tabindex") || t.setAttribute("tabindex", "-1"), t.classList.contains("item") || t.classList.add("item"), t.hasAttribute("data-index") || t.setAttribute("data-index", String(r));
+    }), i.length;
   }
   _applyPortalTokens(e) {
-    const t = window.getComputedStyle(this);
-    S.forEach((i) => {
-      const n = t.getPropertyValue(i).trim();
-      n ? e.style.setProperty(i, n) : e.style.removeProperty(i);
+    const i = window.getComputedStyle(this);
+    S.forEach((t) => {
+      const r = i.getPropertyValue(t).trim();
+      r ? e.style.setProperty(t, r) : e.style.removeProperty(t);
     });
   }
   _applyPortalVariantData(e) {
-    const t = l(this, "variant"), i = E(this.getAttribute("size") || this.getAttribute("density")), n = l(this, "density"), a = this.getAttribute("radius"), o = l(this, "shape"), s = l(this, "elevation"), c = l(this, "tone"), f = t === "default" || t === "" ? "" : t === "line" ? "outline" : t === "glass" ? "soft" : t;
-    f ? e.setAttribute("data-variant", f) : e.removeAttribute("data-variant"), i !== "md" ? e.setAttribute("data-size", i) : e.removeAttribute("data-size"), n && n !== "default" ? e.setAttribute("data-density", n) : e.removeAttribute("data-density"), s && s !== "default" ? e.setAttribute("data-elevation", s) : e.removeAttribute("data-elevation");
+    const i = l(this, "variant"), t = E(this.getAttribute("size") || this.getAttribute("density")), r = l(this, "density"), a = this.getAttribute("radius"), o = l(this, "shape"), s = l(this, "elevation"), c = l(this, "tone"), f = i === "default" || i === "" ? "" : i === "line" ? "outline" : i === "glass" ? "soft" : i;
+    f ? e.setAttribute("data-variant", f) : e.removeAttribute("data-variant"), t !== "md" ? e.setAttribute("data-size", t) : e.removeAttribute("data-size"), r && r !== "default" ? e.setAttribute("data-density", r) : e.removeAttribute("data-density"), s && s !== "default" ? e.setAttribute("data-elevation", s) : e.removeAttribute("data-elevation");
     const b = c === "default" || c === "brand" || c === "" ? "" : c;
     b ? e.setAttribute("data-tone", b) : e.removeAttribute("data-tone");
     const d = k(a || o || null);
@@ -572,30 +572,30 @@ class T extends _ {
     this._portalEl && (this._applyPortalTokens(this._portalEl), this._applyPortalVariantData(this._portalEl), this._portalEl.setAttribute("aria-hidden", "false"), this._portalEl.setAttribute("aria-busy", "false"), this._portalEl.style.display = "block", this._portalEl.style.visibility = "visible", this._portalEl.style.opacity = "1", this._portalEl.style.transform = "translateY(0px) scale(1)", this._portalEl.style.pointerEvents = "auto");
   }
   _attachMenuEvents(e) {
-    this._menuClickHandler = (t) => {
-      const i = p(t);
-      !i || m(i) || this._handleItemSelect(i);
-    }, e.addEventListener("click", this._menuClickHandler), e.addEventListener("mouseover", (t) => {
-      const i = p(t);
-      !i || m(i) || this._focusItem(i);
-    }), e.addEventListener("focusin", (t) => {
-      const i = p(t);
-      !i || m(i) || this._focusItem(i);
+    this._menuClickHandler = (i) => {
+      const t = p(i);
+      !t || m(t) || this._handleItemSelect(t);
+    }, e.addEventListener("click", this._menuClickHandler), e.addEventListener("mouseover", (i) => {
+      const t = p(i);
+      !t || m(t) || this._focusItem(t);
+    }), e.addEventListener("focusin", (i) => {
+      const t = p(i);
+      !t || m(t) || this._focusItem(t);
     }), e.addEventListener("mouseleave", () => this._clearActiveState());
   }
   _buildPortalElement() {
     const e = document.createElement("div");
     e.className = "surface menu", e.id = this._menuId, e.setAttribute("part", "menu"), e.setAttribute("role", "menu"), e.setAttribute("tabindex", "-1"), e.setAttribute("aria-hidden", "false"), e.setAttribute("aria-busy", "false"), e.setAttribute("data-placement", g(this.getAttribute("placement")));
-    const t = document.createElement("style");
-    t.textContent = I, e.appendChild(t);
-    const i = this._getContentSource();
-    let n = 0;
-    if (i) {
-      const a = i.cloneNode(!0);
+    const i = document.createElement("style");
+    i.textContent = C, e.appendChild(i);
+    const t = this._getContentSource();
+    let r = 0;
+    if (t) {
+      const a = t.cloneNode(!0);
       a.removeAttribute("slot"), e.appendChild(a);
     } else
-      n = this._buildLegacyItems(e);
-    if (n = this._hydrateMenuItems(e) || n, n === 0) {
+      r = this._buildLegacyItems(e);
+    if (r = this._hydrateMenuItems(e) || r, r === 0) {
       const a = document.createElement("div");
       a.className = "empty-state", a.textContent = "No items", e.appendChild(a);
     }
@@ -607,13 +607,13 @@ class T extends _ {
     const e = this._portalEl.parentElement;
     if (!e)
       return;
-    const t = this._portalEl, i = this._buildPortalElement();
-    e.replaceChild(i, t), this._portalEl = i, this._rebuildPositioner();
+    const i = this._portalEl, t = this._buildPortalElement();
+    e.replaceChild(t, i), this._portalEl = t, this._rebuildPositioner();
   }
   _rebuildPositioner() {
-    var t;
+    var i;
     const e = this._getTrigger();
-    !this._portalEl || !e || ((t = this._positioner) == null || t.destroy(), this._positioner = x({
+    !this._portalEl || !e || ((i = this._positioner) == null || i.destroy(), this._positioner = x({
       anchor: e,
       floating: this._portalEl,
       placement: g(this.getAttribute("placement")),
@@ -625,21 +625,21 @@ class T extends _ {
     }));
   }
   _mountPortal() {
-    var t;
+    var i;
     const e = this._getTrigger();
     if (e) {
       if (this._portalEl)
         this._syncPortalVisualState();
       else {
         this._portalEl = this._buildPortalElement();
-        const i = v();
-        if (!i) {
+        const t = v();
+        if (!t) {
           this._portalEl = null;
           return;
         }
-        i.appendChild(this._portalEl);
+        t.appendChild(this._portalEl);
       }
-      this._rebuildPositioner(), (t = this._dismissableLayer) == null || t.destroy(), this._dismissableLayer = y({
+      this._rebuildPositioner(), (i = this._dismissableLayer) == null || i.destroy(), this._dismissableLayer = y({
         node: this._portalEl,
         trigger: e,
         closeOnEscape: !0,
@@ -649,8 +649,8 @@ class T extends _ {
     }
   }
   _teardownPortal() {
-    var e, t, i;
-    if ((e = this._dismissableLayer) == null || e.destroy(), this._dismissableLayer = null, (t = this._positioner) == null || t.destroy(), this._positioner = null, (i = this._portalEl) != null && i.parentElement)
+    var e, i, t;
+    if ((e = this._dismissableLayer) == null || e.destroy(), this._dismissableLayer = null, (i = this._positioner) == null || i.destroy(), this._positioner = null, (t = this._portalEl) != null && t.parentElement)
       try {
         this._portalEl.parentElement.removeChild(this._portalEl);
       } catch {
@@ -658,23 +658,31 @@ class T extends _ {
     this._portalEl = null, this._menuClickHandler = null, this._resetTypeahead();
   }
   _isEventInsideTrigger(e) {
-    const t = this._getTrigger();
-    return !!t && e.composedPath().includes(t);
+    const i = this._getTrigger();
+    return !!i && e.composedPath().includes(i);
   }
   _isEventInsideMenu(e) {
     return !!this._portalEl && e.composedPath().includes(this._portalEl);
   }
+  _isInternalScrollEvent(e) {
+    var a;
+    const i = typeof e.composedPath == "function" ? e.composedPath() : [];
+    if (this._portalEl && i.includes(this._portalEl))
+      return !0;
+    const t = this._getTrigger();
+    if (t && i.includes(t))
+      return !0;
+    const r = e.target;
+    return !!(r instanceof Node && ((a = this._portalEl) != null && a.contains(r) || t != null && t.contains(r)));
+  }
   _onHostClick(e) {
     this.hasAttribute("disabled") || this._isEventInsideTrigger(e) && (e.preventDefault(), this.toggle());
   }
   _onDocumentScroll(e) {
-    if (!this._isOpen || !this.closeOnScroll)
-      return;
-    const t = typeof e.composedPath == "function" ? e.composedPath() : [];
-    this._portalEl && t.includes(this._portalEl) || this.close();
+    !this._isOpen || !this.closeOnScroll || this._isInternalScrollEvent(e) || this.close();
   }
   _onDocumentKeyDown(e) {
-    var t;
+    var i;
     if (!this._isOpen) {
       if (e.key !== "ArrowDown" && e.key !== "ArrowUp" || !this._isEventInsideTrigger(e))
         return;
@@ -709,20 +717,20 @@ class T extends _ {
         return;
       }
       if (e.key === "Enter" || e.key === " ") {
-        const i = document.activeElement;
-        if (!i || !((t = this._portalEl) != null && t.contains(i)))
+        const t = document.activeElement;
+        if (!t || !((i = this._portalEl) != null && i.contains(t)))
           return;
-        const n = i.closest(u());
-        if (!n || m(n))
+        const r = t.closest(u());
+        if (!r || m(r))
           return;
-        e.preventDefault(), this._handleItemSelect(n);
+        e.preventDefault(), this._handleItemSelect(r);
       }
     }
   }
   render() {
     var e;
     this.setContent(`
-      <style>${C}</style>
+      <style>${I}</style>
       <div class="trigger" part="trigger">
         <slot name="trigger"></slot>
       </div>