@aceshooting/lyra-ui 14.3.2 → 15.0.0

package/dist/components/layout/app-rail/app-rail.class.d.ts

@@ -253,8 +253,13 @@ private get safeMaxRailWidthPx();
 *  assignment would otherwise reach `updated()`'s inline-size write and this resizer's own
 *  `aria-valuenow` exactly as given. */
 private get effectiveRailWidthPx();private resizeValueText;private get storageFullKey();private get persistFields();
-/** Restore the selected persisted fields. Runs once, before the first render. Effective `mode`
-*  remains breakpoint-derived; only the optional non-mobile `preferredMode` input is restorable. */
+/** Restore the selected persisted fields. Runs once, before the first render, and never
+*  overwrites a field the consumer already bound to an explicit, non-default value before this
+*  point (`changed.has(...)`) -- a controlled `.open=${false}`/`.railWidthPx=${240}` binding
+*  stays authoritative over stale `localStorage` state instead of being silently clobbered by
+*  it, with no `lr-toggle` (or equivalent) firing for a change the consumer never asked for.
+*  Effective `mode` remains breakpoint-derived; only the optional non-mobile `preferredMode`
+*  input is restorable. */
 private loadPersisted;private persistState;protected willUpdate(changed:PropertyValues):void;protected updated(changed:PropertyValues):void;connectedCallback():void;disconnectedCallback():void;adoptedCallback():void;private activateMobileOverlay;private deactivateMobileOverlay;private setupMediaQueries;private teardownMediaQueries;private onIconOnlyChange;private onMobileChange;private applyComputedMode;private setEffectiveMode;private setOpen;private onToggleClick;private onBackdropClick;private onNavItemClick;private onHeaderSlotChange;private onFooterSlotChange;private onNavSlotChange;private onResizerPointerDown;private onResizerPointerMove;private onResizerPointerUp;private endResizerGesture;
 /** Emits the cancelable proposal before committing, so a vetoed gesture never mutates width or
 *  triggers the existing post-commit resize notification. */

package/dist/components/layout/app-rail/app-rail.class.js

@@ -15,7 +15,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
       <line x1="4" y1="12" x2="20" y2="12"></line>
       <line x1="4" y1="17" x2="20" y2="17"></line>
     </svg>
-  `}function computeAppRailMode(iconOnlyMatches,mobileMatches,preferredMode){return mobileMatches?"mobile":preferredMode||(iconOnlyMatches?"icon-only":"full")}class LyraAppRail extends LyraElement{constructor(){super(...arguments),this.iconOnlyBreakpoint="960px",this.mobileBreakpoint="600px",this.open=!1,this.accessibleLabel=null,this.hideToggle=!1,this.resizable=!1,this.persist="open width",this.minRailWidthPx=190,this.maxRailWidthPx=440,this._dragging=!1,this.hasHeaderSlot=!1,this.hasFooterSlot=!1,this.persistReady=!1,this._mode="full",this.forced=!1,this.iconOnlyMatches=!1,this.mobileMatches=!1,this.overlayActive=!1,this.justOpened=!1,this.recoverInlineFocusAfterResponsiveClose=!1,this.navId=nextId("app-rail-nav"),this.resizeStartX=0,this.resizeStartWidth=0,this.resizeGestureChanged=!1,this.managedItems=new Set,this.onIconOnlyChange=e=>{this.iconOnlyMatches=e.matches,this.forced||this.applyComputedMode()},this.onMobileChange=e=>{this.mobileMatches=e.matches,this.forced||this.applyComputedMode()},this.onToggleClick=e=>{this.open||(this.explicitTrigger=e.currentTarget),this.setOpen(!this.open)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()},this.onNavItemClick=()=>{this.overlayActive&&this.setOpen(!1)},this.onHeaderSlotChange=e=>{this.hasHeaderSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onNavSlotChange=()=>{this.syncSlottedItems()},this.onResizerPointerDown=e=>{if(!e.isPrimary||e.button!==0||!this.resizable||this._mode!=="full"||this.resizePointerId!==void 0)return;const resizer=e.currentTarget,ownerWindow=resizer.ownerDocument.defaultView;ownerWindow&&(this.resizePointerId=e.pointerId,this.resizeOwnerWindow=ownerWindow,this.resizeStartX=e.clientX,this.resizeStartWidth=this.effectiveRailWidthPx,this.resizeGestureChanged=!1,resizer.setPointerCapture(e.pointerId),ownerWindow.addEventListener("pointermove",this.onResizerPointerMove),ownerWindow.addEventListener("pointerup",this.onResizerPointerUp),ownerWindow.addEventListener("pointercancel",this.onResizerPointerUp),ownerWindow.addEventListener("lostpointercapture",this.onResizerPointerUp),this.setDragging(!0))},this.onResizerPointerMove=e=>{if(e.pointerId!==this.resizePointerId)return;if(!this.resizable||this._mode!=="full"){this.endResizerGesture();return}let delta=e.clientX-this.resizeStartX;isRtl(this)&&(delta=-delta);const next=Math.min(this.safeMaxRailWidthPx,Math.max(this.safeMinRailWidthPx,this.resizeStartWidth+delta));this.requestRailResize(next,!1)},this.onResizerPointerUp=e=>{e.pointerId===this.resizePointerId&&this.endResizerGesture(e.type==="pointerup")},this.onResizerKeyDown=e=>{const rtl=isRtl(this),forwardKey=rtl?"ArrowLeft":"ArrowRight",backwardKey=rtl?"ArrowRight":"ArrowLeft",step=8;if(e.key===forwardKey){const next=Math.min(this.safeMaxRailWidthPx,this.effectiveRailWidthPx+step);next!==this.effectiveRailWidthPx&&(e.preventDefault(),this.requestRailResize(next))}else if(e.key===backwardKey){const next=Math.max(this.safeMinRailWidthPx,this.effectiveRailWidthPx-step);next!==this.effectiveRailWidthPx&&(e.preventDefault(),this.requestRailResize(next))}}}static{this.defaultStrings={...super.defaultStrings,closeNavigation:LYRA_DEFAULT_closeNavigation,navigation:LYRA_DEFAULT_navigation,openNavigation:LYRA_DEFAULT_openNavigation,resizeNavigation:LYRA_DEFAULT_resizeNavigation,resizeValuePixels:LYRA_DEFAULT_resizeValuePixels}}static{this.knownUnobservedAttributes=["mode","dragging"]}static{this.styles=[LyraElement.styles,styles]}get forceMode(){return this._forceMode}set forceMode(next){if(next!=null&&next!=="auto"&&next!=="full"&&next!=="icon-only")return;const old=this._forceMode;if(this._forceMode=next??void 0,this.requestUpdate("forceMode",old),next==null||next==="auto"){if(!this.forced)return;this.forced=!1,this.applyComputedMode();return}this.forced=!0,this.setEffectiveMode(next)}get dragging(){return this._dragging}setDragging(next){this._dragging=next,this.toggleAttribute("dragging",next)}syncSlottedItems(){const slot=this.shadowRoot?.querySelector('[part="nav"] > slot'),itemTag=tag("app-rail-item"),railTag=tag("app-rail"),next=new Set((slot?.assignedElements({flatten:!0})??[]).filter(item=>item.localName===itemTag));for(const item of this.managedItems){if(next.has(item))continue;const newOwner=item.closest(railTag);newOwner&&newOwner!==this&&item.parentElement===newOwner&&!item.hasAttribute("slot")?item.toggleAttribute("icon-only",newOwner.mode==="icon-only"):item.removeAttribute("icon-only")}for(const item of next)item.toggleAttribute("icon-only",this._mode==="icon-only");this.managedItems=next}get mode(){return this._mode}get safeMinRailWidthPx(){return finiteRange(this.minRailWidthPx,190,0)}get safeMaxRailWidthPx(){return Math.max(this.safeMinRailWidthPx,finiteRange(this.maxRailWidthPx,440,0))}get effectiveRailWidthPx(){return this.railWidthPx!=null?finiteRange(this.railWidthPx,this.safeMinRailWidthPx,this.safeMinRailWidthPx,this.safeMaxRailWidthPx):this.baseEl?.getBoundingClientRect().width??240}resizeValueText(widthPx){return this.localize("resizeValuePixels",void 0,{value:getNumberFormat(this.effectiveLocale).format(Math.round(widthPx))})}get storageFullKey(){return this.storageKey?`lr-app-rail:${this.storageKey}`:void 0}get persistFields(){const persist=typeof this.persist=="string"?this.persist:"";return new Set(persist.split(/\s+/).filter(field=>APP_RAIL_PERSIST_FIELDS.has(field)))}loadPersisted(){const parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);if(!parsed)return!1;const fields=this.persistFields;return fields.has("open")&&typeof parsed.open=="boolean"&&(this.open=parsed.open),fields.has("width")&&typeof parsed.railWidthPx=="number"&&Number.isFinite(parsed.railWidthPx)&&(this.railWidthPx=parsed.railWidthPx),fields.has("preferred-mode")&&(parsed.preferredMode==="full"||parsed.preferredMode==="icon-only")?(this.preferredMode=parsed.preferredMode,!0):!1}persistState(){const fields=this.persistFields;if(fields.size===0)return;const state2={};fields.has("open")&&(state2.open=this.open),fields.has("width")&&(state2.railWidthPx=this.railWidthPx),fields.has("preferred-mode")&&(state2.preferredMode=this.preferredMode??null),writePersistedState(this.storageFullKey,state2)}willUpdate(changed){if(super.willUpdate(changed),(changed.has("resizable")||changed.has("mode"))&&(!this.resizable||this._mode!=="full")&&this.endResizerGesture(),this.hasUpdated||(this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.loadPersisted()&&!this.forced&&(this._mode=computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.preferredMode))),this.hasUpdated&&(changed.has("iconOnlyBreakpoint")||changed.has("mobileBreakpoint"))&&(this.teardownMediaQueries(),this.setupMediaQueries()),this.hasUpdated&&changed.has("preferredMode")&&!this.forced&&this.applyComputedMode(),changed.has("open")||changed.has("mode")){const next=this._mode==="mobile"&&this.open;next!==this.overlayActive&&(this.overlayActive=next,next?(this.justOpened=!0,this.activateMobileOverlay()):this.deactivateMobileOverlay(this._mode==="mobile"))}}updated(changed){if(super.updated(changed),this._lastReflectedMode!==this._mode&&(this._lastReflectedMode=this._mode,this.setAttribute("mode",this._mode)),this.syncSlottedItems(),this.recoverInlineFocusAfterResponsiveClose){this.recoverInlineFocusAfterResponsiveClose=!1;const active=deepActiveElement(this.ownerDocument);this.baseEl&&!composedContains(this.baseEl,active)&&this.baseEl.focus()}this.justOpened&&(this.justOpened=!1,this.overlayHandle?.focusInitial()),this.persistReady&&(changed.has("open")||changed.has("railWidthPx")&&!this.dragging||changed.has("preferredMode")||changed.has("persist"))&&this.persistState(),this.persistReady=!0,(changed.has("railWidthPx")||changed.has("resizable")||changed.has("mode")||!this.hasUpdated)&&this.baseEl&&(this.resizable&&this.railWidthPx!=null&&this._mode==="full"?this.baseEl.style.setProperty("inline-size",`${this.effectiveRailWidthPx}px`):this.baseEl.style.removeProperty("inline-size"))}connectedCallback(){super.connectedCallback(),this.setupMediaQueries(),this.hasUpdated&&this._mode==="mobile"&&this.open&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateMobileOverlay(),queueMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&queueMicrotask(()=>{this.isConnected&&this.syncSlottedItems()})}disconnectedCallback(){super.disconnectedCallback(),this.teardownMediaQueries(),this.overlayHandle?.suspend(),this.endResizerGesture()}adoptedCallback(){super.adoptedCallback(),this.teardownMediaQueries(),this.endResizerGesture()}activateMobileOverlay(){this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="panel"]')??null,onEscape:()=>this.setOpen(!1),onBackdrop:()=>this.setOpen(!1),restoreFocusTo:this.explicitTrigger,lockScroll:!0,suspendWhenUnrendered:!0}),this.explicitTrigger=void 0}deactivateMobileOverlay(restoreFocus=!0){this.overlayHandle?.deactivate({restoreFocus}),this.overlayHandle=void 0}setupMediaQueries(){if(!this.isConnected)return;const view=this.ownerDocument.defaultView;if(!view?.matchMedia)return;const iconOnlyQuery=view.matchMedia(`(max-width: ${this.iconOnlyBreakpoint})`),mobileQuery=view.matchMedia(`(max-width: ${this.mobileBreakpoint})`),iconOnlyListener=event=>{this.mqIconOnly!==iconOnlyQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onIconOnlyChange(event)},mobileListener=event=>{this.mqMobile!==mobileQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onMobileChange(event)};this.mqIconOnly=iconOnlyQuery,this.mqMobile=mobileQuery,this.mqIconOnlyListener=iconOnlyListener,this.mqMobileListener=mobileListener,iconOnlyQuery.addEventListener("change",iconOnlyListener),mobileQuery.addEventListener("change",mobileListener),this.iconOnlyMatches=iconOnlyQuery.matches,this.mobileMatches=mobileQuery.matches,this.forced||this.applyComputedMode()}teardownMediaQueries(){this.mqIconOnly&&this.mqIconOnlyListener&&this.mqIconOnly.removeEventListener("change",this.mqIconOnlyListener),this.mqMobile&&this.mqMobileListener&&this.mqMobile.removeEventListener("change",this.mqMobileListener),this.mqIconOnly=void 0,this.mqMobile=void 0,this.mqIconOnlyListener=void 0,this.mqMobileListener=void 0}applyComputedMode(){this.setEffectiveMode(computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.preferredMode))}setEffectiveMode(next){if(this._mode===next)return;const old=this._mode;old==="mobile"&&next!=="mobile"&&this.open&&(this.recoverInlineFocusAfterResponsiveClose=!0),this._mode=next,this.requestUpdate("mode",old),this.emit("lr-mode-change",{mode:next}),next!=="mobile"&&this.open&&this.setOpen(!1,{force:!0})}setOpen(next,options){if(this.open===next)return;if(options?.force){this.open=next,this.emit("lr-toggle",{open:next});return}const mode=this._mode,open=this.open;this.emit("lr-toggle",{open:next},{cancelable:!0}).defaultPrevented||this._mode!==mode||this.open!==open||(this.open=next)}endResizerGesture(commit=!1){const ownerWindow=this.resizeOwnerWindow,changed=this.resizeGestureChanged,widthPx=this.effectiveRailWidthPx;this.resizePointerId=void 0,this.resizeOwnerWindow=void 0,this.resizeGestureChanged=!1,this.setDragging(!1),ownerWindow?.removeEventListener("pointermove",this.onResizerPointerMove),ownerWindow?.removeEventListener("pointerup",this.onResizerPointerUp),ownerWindow?.removeEventListener("pointercancel",this.onResizerPointerUp),ownerWindow?.removeEventListener("lostpointercapture",this.onResizerPointerUp),commit&&changed&&(this.emit("lr-rail-resize",{widthPx}),this.persistReady&&this.persistState())}requestRailResize(next,commit=!0){if(!this.resizable||this._mode!=="full"||!this.isConnected||next===this.effectiveRailWidthPx)return!1;const event=this.emit("lr-rail-resize-request",{widthPx:next},{cancelable:!0});return!this.resizable||this._mode!=="full"||!this.isConnected?(this.endResizerGesture(),!1):event.defaultPrevented?!1:(this.railWidthPx=next,commit?this.emit("lr-rail-resize",{widthPx:next}):this.resizeGestureChanged=!0,!0)}render(){const mobile=this._mode==="mobile",railWidthPx=this.effectiveRailWidthPx;return html`
+  `}function computeAppRailMode(iconOnlyMatches,mobileMatches,preferredMode){return mobileMatches?"mobile":preferredMode||(iconOnlyMatches?"icon-only":"full")}class LyraAppRail extends LyraElement{constructor(){super(...arguments),this.iconOnlyBreakpoint="960px",this.mobileBreakpoint="600px",this.open=!1,this.accessibleLabel=null,this.hideToggle=!1,this.resizable=!1,this.persist="open width",this.minRailWidthPx=190,this.maxRailWidthPx=440,this._dragging=!1,this.hasHeaderSlot=!1,this.hasFooterSlot=!1,this.persistReady=!1,this._mode="full",this.forced=!1,this.iconOnlyMatches=!1,this.mobileMatches=!1,this.overlayActive=!1,this.justOpened=!1,this.recoverInlineFocusAfterResponsiveClose=!1,this.navId=nextId("app-rail-nav"),this.resizeStartX=0,this.resizeStartWidth=0,this.resizeGestureChanged=!1,this.managedItems=new Set,this.onIconOnlyChange=e=>{this.iconOnlyMatches=e.matches,this.forced||this.applyComputedMode()},this.onMobileChange=e=>{this.mobileMatches=e.matches,this.forced||this.applyComputedMode()},this.onToggleClick=e=>{this.open||(this.explicitTrigger=e.currentTarget),this.setOpen(!this.open)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()},this.onNavItemClick=()=>{this.overlayActive&&this.setOpen(!1)},this.onHeaderSlotChange=e=>{this.hasHeaderSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onNavSlotChange=()=>{this.syncSlottedItems()},this.onResizerPointerDown=e=>{if(!e.isPrimary||e.button!==0||!this.resizable||this._mode!=="full"||this.resizePointerId!==void 0)return;const resizer=e.currentTarget,ownerWindow=resizer.ownerDocument.defaultView;ownerWindow&&(this.resizePointerId=e.pointerId,this.resizeOwnerWindow=ownerWindow,this.resizeStartX=e.clientX,this.resizeStartWidth=this.effectiveRailWidthPx,this.resizeGestureChanged=!1,resizer.setPointerCapture(e.pointerId),ownerWindow.addEventListener("pointermove",this.onResizerPointerMove),ownerWindow.addEventListener("pointerup",this.onResizerPointerUp),ownerWindow.addEventListener("pointercancel",this.onResizerPointerUp),ownerWindow.addEventListener("lostpointercapture",this.onResizerPointerUp),this.setDragging(!0))},this.onResizerPointerMove=e=>{if(e.pointerId!==this.resizePointerId)return;if(!this.resizable||this._mode!=="full"){this.endResizerGesture();return}let delta=e.clientX-this.resizeStartX;isRtl(this)&&(delta=-delta);const next=Math.min(this.safeMaxRailWidthPx,Math.max(this.safeMinRailWidthPx,this.resizeStartWidth+delta));this.requestRailResize(next,!1)},this.onResizerPointerUp=e=>{e.pointerId===this.resizePointerId&&this.endResizerGesture(e.type==="pointerup")},this.onResizerKeyDown=e=>{const rtl=isRtl(this),forwardKey=rtl?"ArrowLeft":"ArrowRight",backwardKey=rtl?"ArrowRight":"ArrowLeft",step=8;if(e.key===forwardKey){const next=Math.min(this.safeMaxRailWidthPx,this.effectiveRailWidthPx+step);next!==this.effectiveRailWidthPx&&(e.preventDefault(),this.requestRailResize(next))}else if(e.key===backwardKey){const next=Math.max(this.safeMinRailWidthPx,this.effectiveRailWidthPx-step);next!==this.effectiveRailWidthPx&&(e.preventDefault(),this.requestRailResize(next))}}}static{this.defaultStrings={...super.defaultStrings,closeNavigation:LYRA_DEFAULT_closeNavigation,navigation:LYRA_DEFAULT_navigation,openNavigation:LYRA_DEFAULT_openNavigation,resizeNavigation:LYRA_DEFAULT_resizeNavigation,resizeValuePixels:LYRA_DEFAULT_resizeValuePixels}}static{this.knownUnobservedAttributes=["mode","dragging"]}static{this.styles=[LyraElement.styles,styles]}get forceMode(){return this._forceMode}set forceMode(next){if(next!=null&&next!=="auto"&&next!=="full"&&next!=="icon-only")return;const old=this._forceMode;if(this._forceMode=next??void 0,this.requestUpdate("forceMode",old),next==null||next==="auto"){if(!this.forced)return;this.forced=!1,this.applyComputedMode();return}this.forced=!0,this.setEffectiveMode(next)}get dragging(){return this._dragging}setDragging(next){this._dragging=next,this.toggleAttribute("dragging",next)}syncSlottedItems(){const slot=this.shadowRoot?.querySelector('[part="nav"] > slot'),itemTag=tag("app-rail-item"),railTag=tag("app-rail"),next=new Set((slot?.assignedElements({flatten:!0})??[]).filter(item=>item.localName===itemTag));for(const item of this.managedItems){if(next.has(item))continue;const newOwner=item.closest(railTag);newOwner&&newOwner!==this&&item.parentElement===newOwner&&!item.hasAttribute("slot")?item.toggleAttribute("icon-only",newOwner.mode==="icon-only"):item.removeAttribute("icon-only")}for(const item of next)item.toggleAttribute("icon-only",this._mode==="icon-only");this.managedItems=next}get mode(){return this._mode}get safeMinRailWidthPx(){return finiteRange(this.minRailWidthPx,190,0)}get safeMaxRailWidthPx(){return Math.max(this.safeMinRailWidthPx,finiteRange(this.maxRailWidthPx,440,0))}get effectiveRailWidthPx(){return this.railWidthPx!=null?finiteRange(this.railWidthPx,this.safeMinRailWidthPx,this.safeMinRailWidthPx,this.safeMaxRailWidthPx):this.baseEl?.getBoundingClientRect().width??240}resizeValueText(widthPx){return this.localize("resizeValuePixels",void 0,{value:getNumberFormat(this.effectiveLocale).format(Math.round(widthPx))})}get storageFullKey(){return this.storageKey?`lr-app-rail:${this.storageKey}`:void 0}get persistFields(){const persist=typeof this.persist=="string"?this.persist:"";return new Set(persist.split(/\s+/).filter(field=>APP_RAIL_PERSIST_FIELDS.has(field)))}loadPersisted(changed){const parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);if(!parsed)return!1;const fields=this.persistFields;return fields.has("open")&&!changed.has("open")&&typeof parsed.open=="boolean"&&(this.open=parsed.open),fields.has("width")&&!changed.has("railWidthPx")&&typeof parsed.railWidthPx=="number"&&Number.isFinite(parsed.railWidthPx)&&(this.railWidthPx=parsed.railWidthPx),fields.has("preferred-mode")&&!changed.has("preferredMode")&&(parsed.preferredMode==="full"||parsed.preferredMode==="icon-only")?(this.preferredMode=parsed.preferredMode,!0):!1}persistState(){const fields=this.persistFields;if(fields.size===0)return;const state2={};fields.has("open")&&(state2.open=this.open),fields.has("width")&&(state2.railWidthPx=this.railWidthPx),fields.has("preferred-mode")&&(state2.preferredMode=this.preferredMode??null),writePersistedState(this.storageFullKey,state2)}willUpdate(changed){if(super.willUpdate(changed),(changed.has("resizable")||changed.has("mode"))&&(!this.resizable||this._mode!=="full")&&this.endResizerGesture(),this.hasUpdated||(this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.loadPersisted(changed)&&!this.forced&&(this._mode=computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.preferredMode))),this.hasUpdated&&(changed.has("iconOnlyBreakpoint")||changed.has("mobileBreakpoint"))&&(this.teardownMediaQueries(),this.setupMediaQueries()),this.hasUpdated&&changed.has("preferredMode")&&!this.forced&&this.applyComputedMode(),changed.has("open")||changed.has("mode")){const next=this._mode==="mobile"&&this.open;next!==this.overlayActive&&(this.overlayActive=next,next?(this.justOpened=!0,this.activateMobileOverlay()):this.deactivateMobileOverlay(this._mode==="mobile"))}}updated(changed){if(super.updated(changed),this._lastReflectedMode!==this._mode&&(this._lastReflectedMode=this._mode,this.setAttribute("mode",this._mode)),this.syncSlottedItems(),this.recoverInlineFocusAfterResponsiveClose){this.recoverInlineFocusAfterResponsiveClose=!1;const active=deepActiveElement(this.ownerDocument);this.baseEl&&!composedContains(this.baseEl,active)&&this.baseEl.focus()}this.justOpened&&(this.justOpened=!1,this.overlayHandle?.focusInitial()),this.persistReady&&(changed.has("open")||changed.has("railWidthPx")&&!this.dragging||changed.has("preferredMode")||changed.has("persist"))&&this.persistState(),this.persistReady=!0,(changed.has("railWidthPx")||changed.has("resizable")||changed.has("mode")||!this.hasUpdated)&&this.baseEl&&(this.resizable&&this.railWidthPx!=null&&this._mode==="full"?this.baseEl.style.setProperty("inline-size",`${this.effectiveRailWidthPx}px`):this.baseEl.style.removeProperty("inline-size"))}connectedCallback(){super.connectedCallback(),this.setupMediaQueries(),this.hasUpdated&&this._mode==="mobile"&&this.open&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateMobileOverlay(),queueMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&queueMicrotask(()=>{this.isConnected&&this.syncSlottedItems()})}disconnectedCallback(){super.disconnectedCallback(),this.teardownMediaQueries(),this.overlayHandle?.suspend(),this.endResizerGesture()}adoptedCallback(){super.adoptedCallback(),this.teardownMediaQueries(),this.endResizerGesture()}activateMobileOverlay(){this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="panel"]')??null,onEscape:()=>this.setOpen(!1),onBackdrop:()=>this.setOpen(!1),restoreFocusTo:this.explicitTrigger,lockScroll:!0,suspendWhenUnrendered:!0}),this.explicitTrigger=void 0}deactivateMobileOverlay(restoreFocus=!0){this.overlayHandle?.deactivate({restoreFocus}),this.overlayHandle=void 0}setupMediaQueries(){if(!this.isConnected)return;const view=this.ownerDocument.defaultView;if(!view?.matchMedia)return;const iconOnlyQuery=view.matchMedia(`(max-width: ${this.iconOnlyBreakpoint})`),mobileQuery=view.matchMedia(`(max-width: ${this.mobileBreakpoint})`),iconOnlyListener=event=>{this.mqIconOnly!==iconOnlyQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onIconOnlyChange(event)},mobileListener=event=>{this.mqMobile!==mobileQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onMobileChange(event)};this.mqIconOnly=iconOnlyQuery,this.mqMobile=mobileQuery,this.mqIconOnlyListener=iconOnlyListener,this.mqMobileListener=mobileListener,iconOnlyQuery.addEventListener("change",iconOnlyListener),mobileQuery.addEventListener("change",mobileListener),this.iconOnlyMatches=iconOnlyQuery.matches,this.mobileMatches=mobileQuery.matches,this.forced||this.applyComputedMode()}teardownMediaQueries(){this.mqIconOnly&&this.mqIconOnlyListener&&this.mqIconOnly.removeEventListener("change",this.mqIconOnlyListener),this.mqMobile&&this.mqMobileListener&&this.mqMobile.removeEventListener("change",this.mqMobileListener),this.mqIconOnly=void 0,this.mqMobile=void 0,this.mqIconOnlyListener=void 0,this.mqMobileListener=void 0}applyComputedMode(){this.setEffectiveMode(computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.preferredMode))}setEffectiveMode(next){if(this._mode===next)return;const old=this._mode;old==="mobile"&&next!=="mobile"&&this.open&&(this.recoverInlineFocusAfterResponsiveClose=!0),this._mode=next,this.requestUpdate("mode",old),this.emit("lr-mode-change",{mode:next}),next!=="mobile"&&this.open&&this.setOpen(!1,{force:!0})}setOpen(next,options){if(this.open===next)return;if(options?.force){this.open=next,this.emit("lr-toggle",{open:next});return}const mode=this._mode,open=this.open;this.emit("lr-toggle",{open:next},{cancelable:!0}).defaultPrevented||this._mode!==mode||this.open!==open||(this.open=next)}endResizerGesture(commit=!1){const ownerWindow=this.resizeOwnerWindow,changed=this.resizeGestureChanged,widthPx=this.effectiveRailWidthPx;this.resizePointerId=void 0,this.resizeOwnerWindow=void 0,this.resizeGestureChanged=!1,this.setDragging(!1),ownerWindow?.removeEventListener("pointermove",this.onResizerPointerMove),ownerWindow?.removeEventListener("pointerup",this.onResizerPointerUp),ownerWindow?.removeEventListener("pointercancel",this.onResizerPointerUp),ownerWindow?.removeEventListener("lostpointercapture",this.onResizerPointerUp),commit&&changed&&(this.emit("lr-rail-resize",{widthPx}),this.persistReady&&this.persistState())}requestRailResize(next,commit=!0){if(!this.resizable||this._mode!=="full"||!this.isConnected||next===this.effectiveRailWidthPx)return!1;const event=this.emit("lr-rail-resize-request",{widthPx:next},{cancelable:!0});return!this.resizable||this._mode!=="full"||!this.isConnected?(this.endResizerGesture(),!1):event.defaultPrevented?!1:(this.railWidthPx=next,commit?this.emit("lr-rail-resize",{widthPx:next}):this.resizeGestureChanged=!0,!0)}render(){const mobile=this._mode==="mobile",railWidthPx=this.effectiveRailWidthPx;return html`
       <button
         part="toggle"
         type="button"

package/dist/components/layout/card/card.class.js

@@ -1,9 +1,9 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{activeElementIn}from"../../../internal/active-element.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{declaredDefaultConverter}from"../../../internal/converters.js";import{bindAccessibleTextObserver,composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{LyraElement}from"../../../internal/lyra-element.js";import{safeLinkHref}from"../../../internal/safe-url.js";import{styles}from"./card.styles.js";const NESTED_CONTROL_SELECTOR=["a[href]","button","input","select","textarea","summary","audio[controls]","video[controls]","label",'[contenteditable]:not([contenteditable="false"])','[tabindex]:not([tabindex="-1"])','[role="button"]','[role="link"]','[role="checkbox"]','[role="switch"]','[role="radio"]','[role="menuitem"]','[role="option"]','[role="tab"]','[role="textbox"]','[role="slider"]','[role="spinbutton"]'].join(",");function isElementNode(value){return typeof value=="object"&&value!==null&&value.nodeType===1&&typeof value.matches=="function"}class LyraCard extends LyraElement{constructor(){super(...arguments),this.appearance="outlined",this.orientation="vertical",this.withHeader=!1,this.withHeaderActions=!1,this.withMedia=!1,this.withFooter=!1,this.withFooterActions=!1,this.actionable=!1,this.accessibleLabel=null,this.hasHeaderSlot=!1,this.hasMediaSlot=!1,this.hasImageSlot=!1,this.hasFooterSlot=!1,this.hasActionsSlot=!1,this.hasHeaderActionsSlot=!1,this.hasFooterActionsSlot=!1,this.accessibleContentText="",this.contentObserverGeneration=0,this.onHeaderSlotChange=e=>{this.hasHeaderSlot=e.target.assignedElements({flatten:!0}).length>0},this.onMediaSlotChange=e=>{this.hasMediaSlot=e.target.assignedElements({flatten:!0}).length>0},this.onImageSlotChange=e=>{this.hasImageSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onActionsSlotChange=e=>{this.hasActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onHeaderActionsSlotChange=e=>{this.hasHeaderActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterActionsSlotChange=e=>{this.hasFooterActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onBaseClick=e=>{const origin=e.composedPath()[0];if(isElementNode(origin)&&origin.getAttribute("part")==="activation-button"){this.emit("lr-card-activate",null);return}this.originatesInNestedControl(e,e.currentTarget)||this.emit("lr-card-activate",null)},this.onLinkedContentClick=e=>{e.defaultPrevented||this.originatesInNestedControl(e,e.currentTarget)||(e.stopPropagation(),this.renderRoot.querySelector('a[part~="base"][href]')?.click())}}static{this.styles=[LyraElement.styles,styles]}get resolvedRel(){const authored=(this.rel??"").split(/\s+/).filter(token=>token!==""&&token.toLowerCase()!=="opener"),tokens=new Set(authored);return this.target&&(tokens.add("noopener"),tokens.add("noreferrer")),tokens.size>0?[...tokens].join(" "):void 0}semanticOwner(){const root=this.renderRoot;return root?root.querySelector('a[part="base"]')??root.querySelector('button[part="activation-button"]')??root.querySelector('div[part="base"]'):null}willUpdate(changed){if(super.willUpdate(changed),changed.has("href")||changed.has("actionable")){const previous=this.semanticOwner(),nextKind=safeLinkHref(this.href)?"a":this.actionable?"button":"div";this.semanticFocusOrigin=previous!==null&&previous.localName!==nextKind&&activeElementIn(this.shadowRoot)===previous?previous:void 0}this.hasUpdated||(this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasMediaSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="media"),this.hasImageSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="image"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.hasActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="actions"),this.hasHeaderActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header-actions"),this.hasFooterActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer-actions"),this.recomputeAccessibleContentText())}updated(changed){super.updated(changed);const focusOrigin=this.semanticFocusOrigin;this.semanticFocusOrigin=void 0,focusOrigin&&this.scheduleAfterUpdate(()=>{const internalActive=activeElementIn(this.shadowRoot),documentActive=activeElementIn(this.ownerDocument);if(internalActive!==null&&internalActive!==focusOrigin||documentActive!==null&&documentActive!==this&&documentActive!==this.ownerDocument.body)return;this.semanticOwner()?.focus()},"card-owner-focus")}originatesInNestedControl(e,root){for(const node of e.composedPath()){if(node===root)return!1;if(isElementNode(node)&&node.matches(NESTED_CONTROL_SELECTOR))return!0}return!1}connectedCallback(){super.connectedCallback(),this.recomputeAccessibleContentText(),this.armContentObserver()}recomputeAccessibleContentText(){this.accessibleContentText=composedAccessibilityText(this.childNodes,{requireRendered:!1}).replace(/\s+/g," ").trim()}armContentObserver(){const ownerDocument=this.ownerDocument;if(!this.isConnected||this.contentObserver&&this.contentObserverDocument===ownerDocument)return;this.resetContentObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.contentObserverGeneration,observer=new MutationObserverCtor(()=>{this.contentObserver!==observer||this.contentObserverDocument!==ownerDocument||this.contentObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||this.recomputeAccessibleContentText()});this.contentObserver=observer,this.contentObserverDocument=ownerDocument,bindAccessibleTextObserver(observer,this,["alt","aria-labelledby","slot"])}disconnectedCallback(){super.disconnectedCallback(),this.semanticFocusOrigin=void 0,this.resetContentObserver()}adoptedCallback(){super.adoptedCallback(),this.resetContentObserver()}resetContentObserver(){this.contentObserverGeneration+=1,this.contentObserver?.disconnect(),this.contentObserver=void 0,this.contentObserverDocument=void 0}click(){this.renderRoot.querySelector('a[part~="base"], button[part~="activation-button"]')?.click()}render(){const hasMedia=this.withMedia||this.hasMediaSlot||this.hasImageSlot,hasHeaderActions=this.withHeaderActions||this.hasHeaderActionsSlot||this.hasActionsSlot,hasHeader=this.withHeader||this.hasHeaderSlot||hasHeaderActions,hasFooterActions=this.withFooterActions||this.hasFooterActionsSlot,hasFooter=this.withFooter||this.hasFooterSlot||hasFooterActions,href=safeLinkHref(this.href),activatable=this.actionable&&!href,accessibleLabel=hostAriaLabel(this)??this.accessibleLabel,body=html`
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{activeElementIn}from"../../../internal/active-element.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{declaredDefaultConverter}from"../../../internal/converters.js";import{bindAccessibleTextObserver,composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{LyraElement}from"../../../internal/lyra-element.js";import{safeLinkHref}from"../../../internal/safe-url.js";import{styles}from"./card.styles.js";import{LYRA_DEFAULT_open}from"../../../internal/default-strings.generated.js";const NESTED_CONTROL_SELECTOR=["a[href]","button","input","select","textarea","summary","audio[controls]","video[controls]","label",'[contenteditable]:not([contenteditable="false"])','[tabindex]:not([tabindex="-1"])','[role="button"]','[role="link"]','[role="checkbox"]','[role="switch"]','[role="radio"]','[role="menuitem"]','[role="option"]','[role="tab"]','[role="textbox"]','[role="slider"]','[role="spinbutton"]'].join(",");function isElementNode(value){return typeof value=="object"&&value!==null&&value.nodeType===1&&typeof value.matches=="function"}class LyraCard extends LyraElement{constructor(){super(...arguments),this.appearance="outlined",this.orientation="vertical",this.withHeader=!1,this.withHeaderActions=!1,this.withMedia=!1,this.withFooter=!1,this.withFooterActions=!1,this.actionable=!1,this.accessibleLabel=null,this.hasHeaderSlot=!1,this.hasMediaSlot=!1,this.hasImageSlot=!1,this.hasFooterSlot=!1,this.hasActionsSlot=!1,this.hasHeaderActionsSlot=!1,this.hasFooterActionsSlot=!1,this.accessibleContentText="",this.contentObserverGeneration=0,this.onHeaderSlotChange=e=>{this.hasHeaderSlot=e.target.assignedElements({flatten:!0}).length>0},this.onMediaSlotChange=e=>{this.hasMediaSlot=e.target.assignedElements({flatten:!0}).length>0},this.onImageSlotChange=e=>{this.hasImageSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onActionsSlotChange=e=>{this.hasActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onHeaderActionsSlotChange=e=>{this.hasHeaderActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterActionsSlotChange=e=>{this.hasFooterActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onBaseClick=e=>{const origin=e.composedPath()[0];if(isElementNode(origin)&&origin.getAttribute("part")==="activation-button"){this.emit("lr-card-activate",null);return}this.originatesInNestedControl(e,e.currentTarget)||this.emit("lr-card-activate",null)},this.onLinkedContentClick=e=>{e.defaultPrevented||this.originatesInNestedControl(e,e.currentTarget)||(e.stopPropagation(),this.renderRoot.querySelector('a[part~="base"][href]')?.click())}}static{this.defaultStrings={...super.defaultStrings,open:LYRA_DEFAULT_open}}static{this.styles=[LyraElement.styles,styles]}get resolvedRel(){const authored=(this.rel??"").split(/\s+/).filter(token=>token!==""&&token.toLowerCase()!=="opener"),tokens=new Set(authored);return this.target&&(tokens.add("noopener"),tokens.add("noreferrer")),tokens.size>0?[...tokens].join(" "):void 0}semanticOwner(){const root=this.renderRoot;return root?root.querySelector('a[part="base"]')??root.querySelector('button[part="activation-button"]')??root.querySelector('div[part="base"]'):null}willUpdate(changed){if(super.willUpdate(changed),changed.has("href")||changed.has("actionable")){const previous=this.semanticOwner(),nextKind=safeLinkHref(this.href)?"a":this.actionable?"button":"div";this.semanticFocusOrigin=previous!==null&&previous.localName!==nextKind&&activeElementIn(this.shadowRoot)===previous?previous:void 0}this.hasUpdated||(this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasMediaSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="media"),this.hasImageSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="image"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.hasActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="actions"),this.hasHeaderActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header-actions"),this.hasFooterActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer-actions"),this.recomputeAccessibleContentText())}updated(changed){super.updated(changed);const focusOrigin=this.semanticFocusOrigin;this.semanticFocusOrigin=void 0,focusOrigin&&this.scheduleAfterUpdate(()=>{const internalActive=activeElementIn(this.shadowRoot),documentActive=activeElementIn(this.ownerDocument);if(internalActive!==null&&internalActive!==focusOrigin||documentActive!==null&&documentActive!==this&&documentActive!==this.ownerDocument.body)return;this.semanticOwner()?.focus()},"card-owner-focus")}originatesInNestedControl(e,root){for(const node of e.composedPath()){if(node===root)return!1;if(isElementNode(node)&&node.matches(NESTED_CONTROL_SELECTOR))return!0}return!1}connectedCallback(){super.connectedCallback(),this.recomputeAccessibleContentText(),this.armContentObserver()}recomputeAccessibleContentText(){this.accessibleContentText=composedAccessibilityText(this.childNodes,{requireRendered:!1}).replace(/\s+/g," ").trim()}armContentObserver(){const ownerDocument=this.ownerDocument;if(!this.isConnected||this.contentObserver&&this.contentObserverDocument===ownerDocument)return;this.resetContentObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.contentObserverGeneration,observer=new MutationObserverCtor(()=>{this.contentObserver!==observer||this.contentObserverDocument!==ownerDocument||this.contentObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||this.recomputeAccessibleContentText()});this.contentObserver=observer,this.contentObserverDocument=ownerDocument,bindAccessibleTextObserver(observer,this,["alt","aria-labelledby","slot"])}disconnectedCallback(){super.disconnectedCallback(),this.semanticFocusOrigin=void 0,this.resetContentObserver()}adoptedCallback(){super.adoptedCallback(),this.resetContentObserver()}resetContentObserver(){this.contentObserverGeneration+=1,this.contentObserver?.disconnect(),this.contentObserver=void 0,this.contentObserverDocument=void 0}click(){this.renderRoot.querySelector('a[part~="base"], button[part~="activation-button"]')?.click()}render(){const hasMedia=this.withMedia||this.hasMediaSlot||this.hasImageSlot,hasHeaderActions=this.withHeaderActions||this.hasHeaderActionsSlot||this.hasActionsSlot,hasHeader=this.withHeader||this.hasHeaderSlot||hasHeaderActions,hasFooterActions=this.withFooterActions||this.hasFooterActionsSlot,hasFooter=this.withFooter||this.hasFooterSlot||hasFooterActions,href=safeLinkHref(this.href),activatable=this.actionable&&!href,accessibleLabel=hostAriaLabel(this)??this.accessibleLabel,fallbackAccessibleLabel=this.accessibleContentText||this.localize("open"),body=html`
       ${activatable?html`<button
             part="activation-button"
             type="button"
             tabindex="0"
-            aria-label=${accessibleLabel??(this.accessibleContentText||nothing)}
+            aria-label=${accessibleLabel??fallbackAccessibleLabel}
           ></button>`:nothing}
       <div part="media image" ?hidden=${!hasMedia}>
         <slot name="media" @slotchange=${this.onMediaSlotChange}></slot>

package/dist/components/layout/card/card.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{contain-intrinsic-inline-size:var(--lr-size-20rem);min-inline-size:0;display:block;container-type:inline-size}[part=base]{border:var(--border-width,var(--lr-border-width-thin)) solid var(--border-color,var(--lr-color-border));border-radius:var(--border-radius,var(--lr-radius));background:var(--lr-color-surface);box-sizing:border-box;block-size:100%;color:inherit;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.linked-shell{block-size:100%;min-inline-size:0;max-inline-size:100%;position:relative}.linked-shell>[part=base]{z-index:var(--lr-layer-base);position:absolute;inset:0}.linked-content{z-index:var(--lr-layer-content);box-sizing:border-box;block-size:100%;min-inline-size:0;max-inline-size:100%;color:inherit;border-radius:var(--border-radius,var(--lr-radius));pointer-events:none;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.linked-content slot,.linked-content [title]{pointer-events:auto}:host([appearance=filled]) [part=base]{background:var(--lr-card-filled-bg,var(--lr-color-brand-quiet));border-color:#0000}:host([appearance=filled-outlined]) [part=base]{background:var(--lr-card-filled-outlined-bg,var(--lr-color-brand-quiet))}:host([appearance=accent]) [part=base]{border-color:#0000;border-inline-start:var(--lr-size-3px) solid var(--lr-card-accent-border-color,var(--lr-color-brand))}:host([appearance=plain]) [part=base]{background:0 0;border-color:#0000}[part=base][data-actionable=true]{cursor:pointer;transition:border-color var(--lr-transition-fast)}[part=base][data-actionable=true]:hover,.linked-shell:hover>[part=base][data-actionable=true]{border-color:var(--lr-card-interactive-hover-border-color,var(--lr-color-brand))}[part=base][data-actionable=true]:active,.linked-shell:active>[part=base][data-actionable=true]{border-color:var(--lr-card-interactive-active-border-color,var(--lr-color-brand));background-image:linear-gradient(var(--lr-card-interactive-active-overlay,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active))), var(--lr-card-interactive-active-overlay,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active))))}[part=activation-button]{z-index:var(--lr-layer-content);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border-radius:inherit;pointer-events:none;background:0 0;border:0;padding:0;position:absolute;inset:0}[part=activation-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(var(--lr-focus-ring-offset) * -1)}[part=base][href]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part~=media][hidden],[part=header][hidden],[part=footer][hidden]{display:none}[part~=media] ::slotted(*){inline-size:100%;display:block}[part~=media] ::slotted([hidden]:not([hidden=until-found i])){display:none}[part=header]{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));min-inline-size:0;padding:var(--spacing,var(--padding,var(--lr-space-m)));border-block-end:var(--border-width,var(--lr-border-width-thin)) solid var(--border-color,var(--lr-color-border));flex-wrap:wrap;display:flex}::slotted([slot=header]){overflow-wrap:break-word;flex:auto;min-inline-size:0}[part=actions]{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));flex:none;margin-inline-start:auto;display:flex}[part=actions][hidden]{display:none}[part=body]{padding:var(--spacing,var(--padding,var(--lr-space-m)));overflow-wrap:break-word;flex:auto;min-inline-size:0}[part=footer]{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));padding:var(--spacing,var(--padding,var(--lr-space-m)));border-block-start:var(--border-width,var(--lr-border-width-thin)) solid var(--border-color,var(--lr-color-border));flex-wrap:wrap;display:flex}.footer-actions{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));margin-inline-start:auto;display:inline-flex}.footer-actions[hidden]{display:none}:host([orientation=horizontal]) [part=base],:host([orientation=horizontal]) .linked-content{flex-direction:row;align-items:stretch}:host([orientation=horizontal]) [part~=media]{flex:0 auto;min-inline-size:0}:host([orientation=horizontal]) [part=header]:not([hidden]){display:contents}:host([orientation=horizontal]) [part=header]>slot[name=header],:host([orientation=horizontal]) [part=header]>[part=actions]>slot[name=header-actions],:host([orientation=horizontal]) [part=footer]{display:none}:host([orientation=horizontal]) [part=body]{order:2}:host([orientation=horizontal]) [part=actions]{padding:var(--spacing,var(--padding,var(--lr-space-m)));order:3;margin-inline-start:0}@container (inline-size<=30rem){:host([orientation=horizontal]) [part=base],:host([orientation=horizontal]) .linked-content{flex-direction:column}:host([orientation=horizontal]) [part~=media]{inline-size:100%}}`;export{styles};
+import{css}from"lit";const styles=css`:host{contain-intrinsic-inline-size:var(--lr-size-20rem);min-inline-size:0;display:block;container-type:inline-size}[part=base]{border:var(--border-width,var(--lr-border-width-thin)) solid var(--border-color,var(--lr-color-border));border-radius:var(--border-radius,var(--lr-radius));background:var(--lr-color-surface);box-sizing:border-box;block-size:100%;color:inherit;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.linked-shell{block-size:100%;min-inline-size:0;max-inline-size:100%;position:relative}.linked-shell>[part=base]{z-index:var(--lr-layer-base);position:absolute;inset:0}.linked-content{z-index:var(--lr-layer-content);box-sizing:border-box;block-size:100%;min-inline-size:0;max-inline-size:100%;color:inherit;border-radius:var(--border-radius,var(--lr-radius));pointer-events:none;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.linked-content slot,.linked-content [title]{pointer-events:auto}:host([appearance=filled]) [part=base]{background:var(--lr-card-filled-bg,var(--lr-color-brand-quiet));border-color:#0000}:host([appearance=filled-outlined]) [part=base]{background:var(--lr-card-filled-outlined-bg,var(--lr-color-brand-quiet))}:host([appearance=accent]) [part=base]{border-color:#0000;border-inline-start:var(--lr-border-width-thick) solid var(--lr-card-accent-border-color,var(--lr-color-brand))}:host([appearance=plain]) [part=base]{background:0 0;border-color:#0000}[part=base][data-actionable=true]{cursor:pointer;transition:border-color var(--lr-transition-fast)}[part=base][data-actionable=true]:hover,.linked-shell:hover>[part=base][data-actionable=true]{border-color:var(--lr-card-interactive-hover-border-color,var(--lr-color-brand))}[part=base][data-actionable=true]:active,.linked-shell:active>[part=base][data-actionable=true]{border-color:var(--lr-card-interactive-active-border-color,var(--lr-color-brand));background-image:linear-gradient(var(--lr-card-interactive-active-overlay,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active))), var(--lr-card-interactive-active-overlay,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active))))}[part=activation-button]{z-index:var(--lr-layer-content);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);border-radius:inherit;pointer-events:none;background:0 0;border:0;padding:0;position:absolute;inset:0}[part=activation-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(var(--lr-focus-ring-offset) * -1)}[part=base][href]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part~=media][hidden],[part=header][hidden],[part=footer][hidden]{display:none}[part~=media] ::slotted(*){inline-size:100%;display:block}[part~=media] ::slotted([hidden]:not([hidden=until-found i])){display:none}[part=header]{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));min-inline-size:0;padding:var(--spacing,var(--padding,var(--lr-space-m)));border-block-end:var(--border-width,var(--lr-border-width-thin)) solid var(--border-color,var(--lr-color-border));flex-wrap:wrap;display:flex}::slotted([slot=header]){overflow-wrap:break-word;flex:auto;min-inline-size:0}[part=actions]{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));flex:none;margin-inline-start:auto;display:flex}[part=actions][hidden]{display:none}[part=body]{padding:var(--spacing,var(--padding,var(--lr-space-m)));overflow-wrap:break-word;flex:auto;min-inline-size:0}[part=footer]{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));padding:var(--spacing,var(--padding,var(--lr-space-m)));border-block-start:var(--border-width,var(--lr-border-width-thin)) solid var(--border-color,var(--lr-color-border));flex-wrap:wrap;display:flex}.footer-actions{align-items:center;gap:var(--spacing,var(--padding,var(--lr-space-m)));margin-inline-start:auto;display:inline-flex}.footer-actions[hidden]{display:none}:host([orientation=horizontal]) [part=base],:host([orientation=horizontal]) .linked-content{flex-direction:row;align-items:stretch}:host([orientation=horizontal]) [part~=media]{flex:0 auto;min-inline-size:0}:host([orientation=horizontal]) [part=header]:not([hidden]){display:contents}:host([orientation=horizontal]) [part=header]>slot[name=header],:host([orientation=horizontal]) [part=header]>[part=actions]>slot[name=header-actions],:host([orientation=horizontal]) [part=footer]{display:none}:host([orientation=horizontal]) [part=body]{order:2}:host([orientation=horizontal]) [part=actions]{padding:var(--spacing,var(--padding,var(--lr-space-m)));order:3;margin-inline-start:0}@container (inline-size<=30rem){:host([orientation=horizontal]) [part=base],:host([orientation=horizontal]) .linked-content{flex-direction:column}:host([orientation=horizontal]) [part~=media]{inline-size:100%}}`;export{styles};

package/dist/components/layout/control-group/control-group.class.js

@@ -1 +1 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{styles}from"./control-group.styles.js";class LyraControlGroup extends LyraElement{constructor(){super(...arguments),this.label="",this.responsive=!1}static{this.styles=[LyraElement.styles,styles]}render(){const accessibleLabel=this.getAttribute("aria-label")??(this.label||nothing);return html`<div part="base" role="group" aria-label=${accessibleLabel}><slot></slot></div>`}}__decorate([property()],LyraControlGroup.prototype,"label",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraControlGroup.prototype,"responsive",void 0);export{LyraControlGroup};
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{LyraElement}from"../../../internal/lyra-element.js";import{styles}from"./control-group.styles.js";class LyraControlGroup extends LyraElement{constructor(){super(...arguments),this.label="",this.responsive=!1}static{this.styles=[LyraElement.styles,styles]}render(){const accessibleLabel=hostAriaLabel(this)??(this.label||nothing);return html`<div part="base" role="group" aria-label=${accessibleLabel}><slot></slot></div>`}}__decorate([property()],LyraControlGroup.prototype,"label",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraControlGroup.prototype,"responsive",void 0);export{LyraControlGroup};

package/dist/components/layout/dashboard-grid/dashboard-grid.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{contain-intrinsic-inline-size:var(--lr-size-20rem);overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%;display:block;container-type:inline-size}[part=base]{grid-template-columns:repeat(var(--lr-dashboard-grid-columns,var(--_lr-dashboard-grid-computed-columns,12)), minmax(0, 1fr));grid-auto-rows:var(--lr-dashboard-grid-row-height,var(--_lr-dashboard-grid-computed-row-height,var(--lr-size-5rem)));gap:var(--lr-dashboard-grid-gap,var(--_lr-dashboard-grid-computed-gap,var(--lr-space-m)));align-items:stretch;min-inline-size:0;max-inline-size:100%;display:grid}[part=empty]{grid-column:1/-1}[part=cell]{border-radius:var(--lr-radius);overflow-wrap:anywhere;min-block-size:0;min-inline-size:0;max-inline-size:100%;display:flex;position:relative}[part=cell][data-resizable]{min-block-size:var(--lr-icon-button-size)}[part=cell]:hover{outline:var(--lr-border-width-thin) solid var(--lr-dashboard-grid-cell-hover-outline-color,var(--lr-color-border-strong));outline-offset:calc(-1 * var(--lr-border-width-thin))}[part=cell]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=cell] ::slotted(*){overflow-wrap:anywhere;min-block-size:0;inline-size:100%;min-inline-size:0;max-inline-size:100%}[part=cell][data-dragging],[part=cell][data-resizing]{z-index:var(--lr-layer-content);box-shadow:var(--lr-dashboard-grid-interaction-shadow,var(--lr-shadow-m))}[part=cell][data-collision]{outline:var(--lr-size-2px) solid var(--lr-dashboard-grid-collision-outline-color,var(--lr-color-danger));outline-offset:var(--lr-size-2px)}[part=cell][data-collision]:focus-visible{box-shadow:0 0 0 var(--lr-focus-ring-width) var(--lr-focus-ring-color), var(--lr-dashboard-grid-interaction-shadow,var(--lr-shadow-m))}[part=resize-handle]{inline-size:var(--lr-space-l);block-size:var(--lr-space-l);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:nwse-resize;touch-action:none;background:0 0;border:none;padding:0;position:absolute;inset-block-end:0;inset-inline-end:0}[part=resize-handle]:hover{background:var(--lr-color-brand-quiet)}[part=resize-handle]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}:host(:dir(rtl)) [part=resize-handle]{cursor:nesw-resize}@container (inline-size<=40rem){[part=base]{flex-direction:column;display:flex}[part=cell]{inline-size:100%}}`;export{styles};
+import{css}from"lit";const styles=css`:host{contain-intrinsic-inline-size:var(--lr-size-20rem);overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%;display:block;container-type:inline-size}[part=base]{grid-template-columns:repeat(var(--lr-dashboard-grid-columns,var(--_lr-dashboard-grid-computed-columns,12)), minmax(0, 1fr));grid-auto-rows:var(--lr-dashboard-grid-row-height,var(--_lr-dashboard-grid-computed-row-height,var(--lr-size-5rem)));gap:var(--lr-dashboard-grid-gap,var(--_lr-dashboard-grid-computed-gap,var(--lr-space-m)));align-items:stretch;min-inline-size:0;max-inline-size:100%;display:grid}[part=empty]{grid-column:1/-1}[part=cell]{border-radius:var(--lr-radius);overflow-wrap:anywhere;min-block-size:0;min-inline-size:0;max-inline-size:100%;display:flex;position:relative}[part=cell][data-resizable]{min-block-size:var(--lr-icon-button-size)}[part=cell]:hover{outline:var(--lr-border-width-thin) solid var(--lr-dashboard-grid-cell-hover-outline-color,var(--lr-color-border-strong));outline-offset:calc(-1 * var(--lr-border-width-thin))}[part=cell]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=cell] ::slotted(*){overflow-wrap:anywhere;min-block-size:0;inline-size:100%;min-inline-size:0;max-inline-size:100%}[part=cell][data-dragging],[part=cell][data-resizing]{z-index:var(--lr-layer-content);box-shadow:var(--lr-dashboard-grid-interaction-shadow,var(--lr-shadow-m))}[part=cell][data-collision]{outline:var(--lr-border-width-medium) solid var(--lr-dashboard-grid-collision-outline-color,var(--lr-color-danger));outline-offset:var(--lr-border-width-medium)}[part=cell][data-collision]:focus-visible{box-shadow:0 0 0 var(--lr-focus-ring-width) var(--lr-focus-ring-color), var(--lr-dashboard-grid-interaction-shadow,var(--lr-shadow-m))}[part=resize-handle]{inline-size:var(--lr-space-l);block-size:var(--lr-space-l);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:nwse-resize;touch-action:none;background:0 0;border:none;padding:0;position:absolute;inset-block-end:0;inset-inline-end:0}[part=resize-handle]:hover{background:var(--lr-color-brand-quiet)}[part=resize-handle]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}:host(:dir(rtl)) [part=resize-handle]{cursor:nesw-resize}@container (inline-size<=40rem){[part=base]{flex-direction:column;display:flex}[part=cell]{inline-size:100%}}`;export{styles};

package/dist/components/layout/details/details.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{--_lr-details-font-size:var(--lr-form-control-font-size);--_lr-details-spacing:var(--lr-form-control-padding-inline);min-inline-size:0;max-inline-size:100%;display:block}[part~=base]{border:var(--lr-border-width-thin) solid var(--lr-details-outlined-border-color,var(--lr-color-border));border-radius:var(--lr-details-radius,var(--lr-radius));background:var(--lr-details-outlined-bg,var(--lr-color-surface));min-inline-size:0;max-inline-size:100%;font-size:var(--lr-details-font-size,var(--_lr-details-font-size));overflow:clip}:host([appearance=filled]) [part~=base]{border-color:var(--lr-details-filled-border-color,transparent);background:var(--lr-details-filled-bg,var(--lr-color-brand-quiet))}:host([appearance=filled-outlined]) [part~=base]{border-color:var(--lr-details-filled-outlined-border-color,var(--lr-color-border));background:var(--lr-details-filled-outlined-bg,var(--lr-color-brand-quiet))}:host([appearance=plain]) [part~=base]{background:0 0;border-color:#0000}[part=header]{align-items:center;gap:var(--lr-details-gap,var(--lr-space-s));flex-wrap:wrap;min-inline-size:0;max-inline-size:100%;display:flex}.native-details{flex:auto;min-inline-size:0;max-inline-size:100%;display:block}[part=summary]{align-items:center;gap:var(--lr-details-gap,var(--lr-space-s));min-block-size:var(--lr-icon-button-size);padding-block:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));padding-inline:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));color:var(--lr-color-text);cursor:pointer;font-weight:var(--lr-font-weight-semibold);overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%;list-style:none;display:flex;overflow:clip}.summary-content{overflow-wrap:anywhere;flex:auto;min-inline-size:0}[part=summary]::marker,[part=summary]::-webkit-details-marker{display:none}:host(:not([disabled])) [part=summary]:hover{background:var(--lr-details-summary-hover-bg,var(--lr-color-brand-quiet))}:host(:not([disabled])) [part=summary]:active{background:var(--lr-details-summary-active-bg,color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)))}[part=summary]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-width))}[part~=icon]{flex:none;justify-content:center;align-items:center;display:inline-flex}:host([icon-placement=start]) [part~=icon]{order:-1}.icon-fallback{transition:transform var(--hide-duration,var(--lr-duration-base)) var(--lr-easing-standard);display:inline-flex;transform:rotate(90deg)}:host([open]) .icon-fallback{transition-duration:var(--show-duration,var(--lr-duration-base));transform:rotate(-90deg)}.icon-fallback svg{inline-size:var(--lr-size-1rem);block-size:var(--lr-size-1rem)}:host([disabled]) [part=summary]{cursor:not-allowed;opacity:var(--lr-opacity-disabled)}[part~=header-actions]{overflow-wrap:anywhere;flex:0 auto;align-items:center;min-inline-size:0;max-inline-size:100%;display:flex}.content-gate:where([hidden=until-found]){box-sizing:border-box;contain:layout;pointer-events:none;border:0;block-size:0;min-block-size:0;max-block-size:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;display:block;overflow:clip}[part=content]{padding-block-end:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));padding-inline:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%}@media (prefers-reduced-motion:reduce){.icon-fallback{transition:none}}`;export{styles};
+import{css}from"lit";const styles=css`:host{--_lr-details-font-size:var(--lr-form-control-font-size);--_lr-details-spacing:var(--lr-form-control-padding-inline);min-inline-size:0;max-inline-size:100%;display:block}[part~=base]{border:var(--lr-border-width-thin) solid var(--lr-details-outlined-border-color,var(--lr-color-border));border-radius:var(--lr-details-radius,var(--lr-radius));background:var(--lr-details-outlined-bg,var(--lr-color-surface));min-inline-size:0;max-inline-size:100%;font-size:var(--lr-details-font-size,var(--_lr-details-font-size));overflow:clip}:host([appearance=filled]) [part~=base]{border-color:var(--lr-details-filled-border-color,transparent);background:var(--lr-details-filled-bg,var(--lr-color-brand-quiet))}:host([appearance=filled-outlined]) [part~=base]{border-color:var(--lr-details-filled-outlined-border-color,var(--lr-color-border));background:var(--lr-details-filled-outlined-bg,var(--lr-color-brand-quiet))}:host([appearance=plain]) [part~=base]{background:0 0;border-color:#0000}[part=header]{align-items:center;gap:var(--lr-details-gap,var(--lr-space-s));flex-wrap:wrap;min-inline-size:0;max-inline-size:100%;display:flex}.native-details{flex:auto;min-inline-size:0;max-inline-size:100%;display:block}[part=summary]{align-items:center;gap:var(--lr-details-gap,var(--lr-space-s));min-block-size:max(var(--lr-size-24px), min(var(--lr-icon-button-size), var(--lr-form-control-height)));padding-block:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));padding-inline:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));color:var(--lr-color-text);cursor:pointer;font-weight:var(--lr-font-weight-semibold);overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%;list-style:none;display:flex;overflow:clip}.summary-content{overflow-wrap:anywhere;flex:auto;min-inline-size:0}[part=summary]::marker,[part=summary]::-webkit-details-marker{display:none}:host(:not([disabled])) [part=summary]:hover{background:var(--lr-details-summary-hover-bg,var(--lr-color-brand-quiet))}:host(:not([disabled])) [part=summary]:active{background:var(--lr-details-summary-active-bg,color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)))}[part=summary]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-width))}[part~=icon]{flex:none;justify-content:center;align-items:center;display:inline-flex}:host([icon-placement=start]) [part~=icon]{order:-1}.icon-fallback{transition:transform var(--hide-duration,var(--lr-duration-base)) var(--lr-easing-standard);display:inline-flex;transform:rotate(90deg)}:host([open]) .icon-fallback{transition-duration:var(--show-duration,var(--lr-duration-base));transform:rotate(-90deg)}.icon-fallback svg{inline-size:var(--lr-size-1rem);block-size:var(--lr-size-1rem)}:host([disabled]) [part=summary]{cursor:not-allowed;opacity:var(--lr-opacity-disabled)}[part~=header-actions]{overflow-wrap:anywhere;flex:0 auto;align-items:center;min-inline-size:0;max-inline-size:100%;display:flex}.content-gate:where([hidden=until-found]){box-sizing:border-box;contain:layout;pointer-events:none;border:0;block-size:0;min-block-size:0;max-block-size:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;display:block;overflow:clip}[part=content]{padding-block-end:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));padding-inline:var(--spacing,var(--lr-details-spacing,var(--_lr-details-spacing)));overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%}@media (prefers-reduced-motion:reduce){.icon-fallback{transition:none}}`;export{styles};

package/dist/components/layout/filter-bar/filter-bar.class.d.ts

@@ -35,8 +35,12 @@ readonly clearValue:LyraFilterBarFieldValue;
 * used (with shallow string-array equality for array clear values). */
 readonly isEmpty?:(value:LyraFilterBarFieldValue)=>boolean;
 /** Formats the stored value for the active-filter chip. When omitted, strings and arrays use
-* the same list formatting as built-in choice filters and booleans render as `true`/`false`. */
-readonly formatValue?:(value:LyraFilterBarFieldValue)=>string;}
+* the same list formatting as built-in choice filters and booleans render as `true`/`false`.
+* `locale` is `effectiveLocale`, the same value every built-in filter type's own chip formatting
+* (`getListFormat`/`getDateTimeFormat`) already receives -- an existing single-argument
+* `formatValue` implementation keeps working unchanged, since JS simply ignores a second
+* argument it never declared. */
+readonly formatValue?:(value:LyraFilterBarFieldValue,locale:string)=>string;}
 /** Context supplied to a custom filter renderer. The renderer owns the custom control's markup
 * and should bind `value`, `disabled`, `required`, and `errorText` as appropriate for that
 * control, then attach `onValueChange` (or the more specific `onInput`/`onChange`) to its
@@ -222,7 +226,13 @@ loading:boolean;
 *  inline-error presentation on each composed control, matching every other form control in
 *  this library (`lr-select`/`lr-combobox`/`lr-tool-param-form` all avoid flashing red before
 *  the user has touched anything). */
-private touchedFilters;private _filters;private _value;private debounceTimers;private pendingText;private chipFocusGeneration;private lastValidityKey;private schemaGeneration;private schemaAbortController?;
+private touchedFilters;private _filters;private _value;
+/** The last value passed to the `value` setter, cloned but NOT yet filtered down to the filter
+*  ids known at that moment. `filters`'s setter re-derives `_value` from this (not from the
+*  already-filtered `_value`) so a `value` assignment landing before its matching `filters`
+*  assignment -- same microtask/script order, or the same Lit template's binding order -- never
+*  permanently drops fields for filters that simply hadn't been declared yet. */
+private rawValue;private debounceTimers;private pendingText;private chipFocusGeneration;private lastValidityKey;private schemaGeneration;private schemaAbortController?;
 /** Host-declared filter definitions, rendered in array order. The first 10,000 definitions and
 * nested collection entries are deeply snapshotted and frozen; reassign after changing them.
 * `null`/`undefined` is treated as an empty array rather than throwing. Choice options require

package/dist/components/layout/filter-bar/filter-bar.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{activeElementIn}from"../../../internal/active-element.js";import{collectFocusableElements,deepActiveElement}from"../../../internal/overlay-manager.js";import{getDateTimeFormat,getListFormat}from"../../../internal/intl-cache.js";import{styles}from"./filter-bar.styles.js";import"../../forms/select/select.class.js";import"../../forms/combobox/combobox.class.js";import"../../forms/combobox/option.class.js";import"../../forms/date-picker/date-input.class.js";import"../../forms/input/input.class.js";import"../../overlays/chip/chip.class.js";import"../../overlays/chip/chip-group.class.js";import"../../forms/button/button.class.js";import"../../overlays/spinner/spinner.class.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_filterBarActiveFilters,LYRA_DEFAULT_filterBarReset}from"../../../internal/default-strings.generated.js";const MAX_FILTER_COLLECTION_ENTRIES=1e4,MAX_FILTER_COLLECTION_NODES=5e4,MAX_FILTER_COLLECTION_DEPTH=16,OMIT_FILTER_VALUE=Symbol("omit-filter-value"),EMPTY_FILTERS=Object.freeze([]),EMPTY_VALUE=Object.freeze({}),EMPTY_DATE_PRESETS=Object.freeze([]);function isPlainFilterRecord(value){try{const prototype=Object.getPrototypeOf(value);return prototype===null||Object.getPrototypeOf(prototype)===null}catch{return!1}}function snapshotFilterEntry(value,budget,depth){if(value===null||typeof value!="object"&&typeof value!="function"||typeof value=="function")return value;if(depth>MAX_FILTER_COLLECTION_DEPTH||budget.remaining<=0)return OMIT_FILTER_VALUE;const existing=budget.seen.get(value);if(existing!==void 0)return existing;let isArray=!1;try{isArray=Array.isArray(value)}catch{return OMIT_FILTER_VALUE}if(isArray){const output2=[];budget.seen.set(value,output2);let length=0;try{const descriptor=Object.getOwnPropertyDescriptor(value,"length");descriptor&&"value"in descriptor&&typeof descriptor.value=="number"&&Number.isSafeInteger(descriptor.value)&&descriptor.value>=0&&(length=Math.min(descriptor.value,MAX_FILTER_COLLECTION_ENTRIES))}catch{return Object.freeze(output2)}for(let index=0;index<length&&budget.remaining>0;index+=1){let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value,String(index))}catch{continue}if(!descriptor||!("value"in descriptor))continue;budget.remaining-=1;const entry=snapshotFilterEntry(descriptor.value,budget,depth+1);entry!==OMIT_FILTER_VALUE&&output2.push(entry)}return Object.freeze(output2)}if(!isPlainFilterRecord(value))return value;const output={};budget.seen.set(value,output);let descriptors;try{descriptors=Object.getOwnPropertyDescriptors(value)}catch{return OMIT_FILTER_VALUE}let retained=0;for(const key of Reflect.ownKeys(descriptors)){if(retained>=MAX_FILTER_COLLECTION_ENTRIES||budget.remaining<=0)break;const descriptor=descriptors[key];if(!descriptor?.enumerable||!("value"in descriptor))continue;retained+=1,budget.remaining-=1;const entry=key==="icon"?descriptor.value:snapshotFilterEntry(descriptor.value,budget,depth+1);entry!==OMIT_FILTER_VALUE&&Object.defineProperty(output,key,{value:entry,enumerable:!0,configurable:!1,writable:!1})}return Object.freeze(output)}function snapshotFilterDefinitions(value){let isArray=!1;try{isArray=Array.isArray(value)}catch{return EMPTY_FILTERS}return isArray?snapshotFilterEntry(value,{remaining:MAX_FILTER_COLLECTION_NODES,seen:new WeakMap},0):EMPTY_FILTERS}function snapshotFilterFieldValue(value){let isArray=!1;try{isArray=Array.isArray(value)}catch{return}if(!isArray)return typeof value=="string"||typeof value=="boolean"||value===void 0?value:void 0;const output=[];let sourceLength=0;try{const descriptor=Object.getOwnPropertyDescriptor(value,"length");descriptor&&"value"in descriptor&&typeof descriptor.value=="number"&&Number.isSafeInteger(descriptor.value)&&descriptor.value>=0&&(sourceLength=descriptor.value)}catch{return Object.freeze(output)}const length=Math.min(sourceLength,MAX_FILTER_COLLECTION_ENTRIES);for(let index=0;index<length;index+=1){let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value,String(index))}catch{continue}descriptor&&"value"in descriptor&&typeof descriptor.value=="string"&&output.push(descriptor.value)}return Object.freeze(output)}const SELECT_EXPORT_PARTS=["form-control-label: filter-control-label","trigger: filter-control-field","display-input: filter-control-input","start: filter-control-start","end: filter-control-end","listbox: filter-control-listbox","option: filter-control-option","clear-button: filter-control-clear-button","expand-icon: filter-control-expand-icon","error: filter-control-error","hint: filter-control-hint"].join(", "),COMBOBOX_EXPORT_PARTS=["form-control-label: filter-control-label","combobox: filter-control-field","combobox-input: filter-control-input","start: filter-control-start","end: filter-control-end","listbox: filter-control-listbox","option: filter-control-option","clear-button: filter-control-clear-button","expand-icon: filter-control-expand-icon","error: filter-control-error","hint: filter-control-hint"].join(", "),INPUT_EXPORT_PARTS=["form-control-label: filter-control-label","input-wrapper: filter-control-field","input: filter-control-input","start: filter-control-start","end: filter-control-end","clear-button: filter-control-clear-button","error: filter-control-error","hint: filter-control-hint"].join(", "),DATE_INPUT_EXPORT_PARTS=["form-control-label: filter-control-label","input-wrapper: filter-control-field","input: filter-control-input","start: filter-control-start","end: filter-control-end","clear-button: filter-control-clear-button","expand-button: filter-control-expand-button","expand-icon: filter-control-expand-icon","popup: filter-control-popup","error: filter-control-error","hint: filter-control-hint"].join(", ");function isBuiltInSet(value){return value==null?!1:typeof value=="boolean"?value:Array.isArray(value)?value.length>0:value!==""}function defineFilterValueEntry(record,key,value){Object.defineProperty(record,key,{value,enumerable:!0,configurable:!0,writable:!0})}function cloneFilterValueRecord(value){const clone={},descriptors=Object.getOwnPropertyDescriptors(value);let retained=0;for(const key of Reflect.ownKeys(descriptors)){if(retained>=MAX_FILTER_COLLECTION_ENTRIES)break;const descriptor=descriptors[key];if(typeof key!="string"||!descriptor?.enumerable||!("value"in descriptor))continue;retained+=1;const fieldValue=snapshotFilterFieldValue(descriptor.value);fieldValue!==void 0&&defineFilterValueEntry(clone,key,fieldValue)}return clone}function cloneFilterValue(value){return Object.freeze(cloneFilterValueRecord(value))}class LyraFilterBar extends LyraElement{constructor(){super(...arguments),this.label="",this.disabled=!1,this.loading=!1,this.touchedFilters=new Set,this._filters=EMPTY_FILTERS,this._value=EMPTY_VALUE,this.debounceTimers=new Map,this.pendingText=new Map,this.chipFocusGeneration=0,this.schemaGeneration=0,this.onControlChange=(id,e)=>{const control=e.target;this.setFilterValue(id,control.value,control.appliedPreset)},this.stopControlAlias=event=>{event.stopPropagation()},this.onCustomControlChange=(def,generation,e)=>{e.stopPropagation(),this.setCustomContextValue(def,generation,def.custom.adapter.valueFromEvent(e))}}static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,filterBarActiveFilters:LYRA_DEFAULT_filterBarActiveFilters,filterBarReset:LYRA_DEFAULT_filterBarReset}}static{this.styles=[LyraElement.styles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-validity-change"])}static{this.properties={filters:{attribute:!1,noAccessor:!0},value:{attribute:!1,noAccessor:!0}}}get filters(){return this._filters}set filters(next){const old=this._filters;this.cancelDebounce(),this.renewSchemaContext();const seen=new Set;this._filters=Object.freeze(snapshotFilterDefinitions(next).filter(definition=>{try{return!definition||typeof definition.filterId!="string"||definition.filterId.length===0||definition.filterId!==definition.filterId.trim()||typeof definition.label!="string"||definition.label.trim().length===0||seen.has(definition.filterId)||(definition.type==="select"||definition.type==="combobox")&&!Array.isArray(definition.options)||definition.type==="custom"&&(!definition.custom?.adapter||typeof definition.custom.render!="function")?!1:(seen.add(definition.filterId),!0)}catch{return!1}}).map(definition=>{if(definition.type!=="select"&&definition.type!=="combobox")return definition;const options=definition.options.filter(option=>{try{return option!==null&&typeof option=="object"&&typeof Object.getOwnPropertyDescriptor(option,"value")?.value=="string"&&typeof Object.getOwnPropertyDescriptor(option,"label")?.value=="string"}catch{return!1}});return Object.freeze({...definition,options:Object.freeze(options)})}));const ids=new Set(this._filters.map(definition=>definition.filterId));this.touchedFilters=new Set([...this.touchedFilters].filter(id=>ids.has(id)));const oldValue=this._value;this._value=this.normalizeValue(this._value),this.requestUpdate("filters",old),this._value!==oldValue&&this.requestUpdate("value",oldValue)}get value(){return cloneFilterValue(this._value)}set value(next){const old=this._value;this._value=this.normalizeValue(next),this.requestUpdate("value",old)}renewSchemaContext(){this.schemaAbortController?.abort();const AbortControllerCtor=this.ownerDocument.defaultView?.AbortController??AbortController;this.schemaAbortController=new AbortControllerCtor,this.schemaGeneration+=1}get schemaSignal(){return this.schemaAbortController||this.renewSchemaContext(),this.schemaAbortController.signal}isEmpty(def,value){if(def.type!=="custom")return!isBuiltInSet(value);const{adapter}=def.custom;if(adapter.isEmpty)return adapter.isEmpty(value);const clear=adapter.clearValue;return Array.isArray(value)&&Array.isArray(clear)?value.length===clear.length&&value.every((entry,index)=>entry===clear[index]):Object.is(value,clear)}valueFor(def){return Object.prototype.hasOwnProperty.call(this._value,def.filterId)?this._value[def.filterId]:def.type==="custom"?def.custom.adapter.clearValue:void 0}normalizeValue(value){const normalized={};for(const def of this._filters){let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value??{},def.filterId)}catch{continue}if(!descriptor||!("value"in descriptor))continue;const fieldValue=snapshotFilterFieldValue(descriptor.value);this.isEmpty(def,fieldValue)||defineFilterValueEntry(normalized,def.filterId,fieldValue)}return Object.freeze(normalized)}get hasActiveFilters(){return this._filters.some(def=>!this.isEmpty(def,this.valueFor(def)))}get invalidFilterIds(){return Object.freeze(this._filters.filter(def=>def.required&&this.isEmpty(def,this.valueFor(def))).map(def=>def.filterId))}checkValidity(){return this.invalidFilterIds.length===0}reportValidity(){const invalid=this.invalidFilterIds;return invalid.length&&(this.touchedFilters=new Set([...this.touchedFilters,...invalid])),invalid.length===0}reset(){this.disabled||(this.cancelDebounce(),this.touchedFilters=new Set,this.value=this.resetValue,this.emit("lr-input",Object.freeze({value:this.value,filterId:void 0,appliedPreset:void 0})),this.emit("lr-reset",Object.freeze({value:this.value})))}get resetValue(){const out={};for(const def of this._filters)if(def.defaultValue!==void 0&&!this.isEmpty(def,def.defaultValue)){const value=Array.isArray(def.defaultValue)?Object.freeze([...def.defaultValue]):def.defaultValue;defineFilterValueEntry(out,def.filterId,value)}return Object.freeze(out)}setFilterValue(id,value,appliedPreset){const definition=this._filters.find(candidate=>candidate.filterId===id);if(this.disabled||!definition)return;const next={...this._value};this.isEmpty(definition,value)?delete next[id]:defineFilterValueEntry(next,id,value),this.value=next,this.emit("lr-input",Object.freeze({value:this.value,filterId:id,appliedPreset}))}setCustomContextValue(definition,generation,value){generation!==this.schemaGeneration||this.schemaSignal.aborted||!this.isConnected||!this._filters.includes(definition)||this.setFilterValue(definition.filterId,value)}markTouched(id){this.disabled||this.touchedFilters.has(id)||(this.touchedFilters=new Set(this.touchedFilters).add(id))}onTextInput(def,e){if(this.disabled)return;const next=e.target.value??"",delay=def.debounce;if(typeof delay!="number"||!Number.isFinite(delay)||delay<=0){this.cancelDebounce(def.filterId),this.setFilterValue(def.filterId,next);return}this.pendingText.set(def.filterId,next);const existing=this.debounceTimers.get(def.filterId);existing!==void 0&&clearTimeout(existing),this.debounceTimers.set(def.filterId,setTimeout(()=>this.flushDebounce(def.filterId),delay))}flushDebounce(id){const timer=this.debounceTimers.get(id);if(timer===void 0)return;clearTimeout(timer),this.debounceTimers.delete(id);const pending=this.pendingText.get(id);this.pendingText.delete(id),pending!==void 0&&this.setFilterValue(id,pending)}cancelDebounce(id){for(const[key,timer]of this.debounceTimers)id!==void 0&&key!==id||(clearTimeout(timer),this.debounceTimers.delete(key),this.pendingText.delete(key))}onTextFocusout(id){this.flushDebounce(id),this.markTouched(id)}repairFocusAfterChipRemoval(index,filterId,shouldRepairFocus){const generation=++this.chipFocusGeneration;shouldRepairFocus&&this.updateComplete.then(()=>{if(!this.isConnected||this.disabled||generation!==this.chipFocusGeneration||deepActiveElement(this.ownerDocument)!==this.ownerDocument.body)return;const chips=this.renderRoot.querySelectorAll('[part="chip"]'),chip=chips[Math.min(index,chips.length-1)],target=chip?collectFocusableElements(chip)[0]:void 0;if(target){target.focus();return}for(const control of this.renderRoot.querySelectorAll("[data-filter-id]"))if(control.dataset.filterId===filterId){collectFocusableElements(control)[0]?.focus();return}})}clearFilter(id,shouldRepairFocus=!1){if(this.disabled)return;this.cancelDebounce(id);const index=this.activeEntries.findIndex(entry=>entry.def.filterId===id),def=this._filters.find(f=>f.filterId===id);if(!def)return;const clearValue=def.type==="custom"?def.custom.adapter.clearValue:def.type==="combobox"&&def.multiple?[]:"";this.setFilterValue(id,clearValue),this.repairFocusAfterChipRemoval(Math.max(0,index),id,shouldRepairFocus)}displayValueFor(def,value){if(def.type==="custom"){const formatted=def.custom?.adapter.formatValue?.(value);return formatted!==void 0?formatted:Array.isArray(value)?getListFormat(this.effectiveLocale,{style:"long",type:"conjunction"}).format(value):value===void 0?"":String(value)}if(def.type==="select"||def.type==="combobox"){const labels=(Array.isArray(value)?value.filter(entry=>typeof entry=="string"):typeof value=="string"?[value]:[]).map(v=>def.options?.find(o=>o.value===v)?.label??v);return labels.length>1?getListFormat(this.effectiveLocale,{style:"long",type:"conjunction"}).format(labels):labels[0]??""}if(def.type==="text")return typeof value=="string"?value:"";if(typeof value!="string")return"";const formatter=getDateTimeFormat(this.effectiveLocale,{year:"numeric",month:"short",day:"numeric",timeZone:"UTC"}),parseIso=input=>{const match=/^(\d{4})-(\d{2})-(\d{2})$/.exec(input);if(!match)return;const year=Number(match[1]),month=Number(match[2]),day=Number(match[3]),date=new Date(0);return date.setUTCHours(0,0,0,0),date.setUTCFullYear(year,month-1,day),date.getUTCFullYear()===year&&date.getUTCMonth()===month-1&&date.getUTCDate()===day?date:void 0},segments=value.split("/");if(def.type==="date"&&segments.length!==1||def.type==="date-range"&&segments.length!==2)return value;const[startText,endText]=segments,start=parseIso(startText??""),end=endText===void 0?void 0:parseIso(endText);return!start||endText!==void 0&&(!end||end.getTime()<start.getTime())?value:end?formatter.formatRange(start,end):formatter.format(start)}get activeEntries(){return this._filters.filter(def=>!this.isEmpty(def,this.valueFor(def))).map(def=>({def,display:this.displayValueFor(def,this.valueFor(def))}))}disconnectedCallback(){super.disconnectedCallback(),this.cancelDebounce(),this.schemaAbortController?.abort(),this.schemaAbortController=void 0,this.schemaGeneration+=1}connectedCallback(){super.connectedCallback(),(!this.schemaAbortController||this.schemaAbortController.signal.aborted)&&(this.renewSchemaContext(),this.hasUpdated&&this.requestUpdate()),this.hasUpdated&&queueMicrotask(()=>{this.isConnected&&this.syncTextControls()})}syncTextControls(){if(!this._filters.some(def=>def.type==="text"))return;const fields=new Map;for(const node of this.renderRoot.querySelectorAll("lr-input[data-filter-id]")){const element=node,id=element.dataset.filterId;id!==void 0&&fields.set(id,element)}for(const def of this._filters){if(def.type!=="text"||this.debounceTimers.has(def.filterId))continue;const field=fields.get(def.filterId);if(!field)continue;const raw=this._value[def.filterId],next=typeof raw=="string"?raw:"";field.value!==next&&(field.value=next)}}willUpdate(changed){super.willUpdate(changed),changed.has("disabled")&&this.disabled&&this.cancelDebounce()}updated(changed){if(super.updated(changed),this.syncTextControls(),changed.has("value")||changed.has("filters")){const invalidFilterIds=this.invalidFilterIds,valid=invalidFilterIds.length===0,key=JSON.stringify({valid,invalidFilterIds});key!==this.lastValidityKey&&(this.lastValidityKey=key,this.emit("lr-validity-change",Object.freeze({valid,invalidFilterIds:Object.freeze([...invalidFilterIds])})))}}renderOption(option){return html`<lr-option value=${option.value}
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{activeElementIn}from"../../../internal/active-element.js";import{collectFocusableElements,deepActiveElement}from"../../../internal/overlay-manager.js";import{getDateTimeFormat,getListFormat}from"../../../internal/intl-cache.js";import{styles}from"./filter-bar.styles.js";import"../../forms/select/select.class.js";import"../../forms/combobox/combobox.class.js";import"../../forms/combobox/option.class.js";import"../../forms/date-picker/date-input.class.js";import"../../forms/input/input.class.js";import"../../overlays/chip/chip.class.js";import"../../overlays/chip/chip-group.class.js";import"../../forms/button/button.class.js";import"../../overlays/spinner/spinner.class.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_filterBarActiveFilters,LYRA_DEFAULT_filterBarReset}from"../../../internal/default-strings.generated.js";const MAX_FILTER_COLLECTION_ENTRIES=1e4,MAX_FILTER_COLLECTION_NODES=5e4,MAX_FILTER_COLLECTION_DEPTH=16,OMIT_FILTER_VALUE=Symbol("omit-filter-value"),EMPTY_FILTERS=Object.freeze([]),EMPTY_VALUE=Object.freeze({}),EMPTY_DATE_PRESETS=Object.freeze([]);function isPlainFilterRecord(value){try{const prototype=Object.getPrototypeOf(value);return prototype===null||Object.getPrototypeOf(prototype)===null}catch{return!1}}function snapshotFilterEntry(value,budget,depth){if(value===null||typeof value!="object"&&typeof value!="function"||typeof value=="function")return value;if(depth>MAX_FILTER_COLLECTION_DEPTH||budget.remaining<=0)return OMIT_FILTER_VALUE;const existing=budget.seen.get(value);if(existing!==void 0)return existing;let isArray=!1;try{isArray=Array.isArray(value)}catch{return OMIT_FILTER_VALUE}if(isArray){const output2=[];budget.seen.set(value,output2);let length=0;try{const descriptor=Object.getOwnPropertyDescriptor(value,"length");descriptor&&"value"in descriptor&&typeof descriptor.value=="number"&&Number.isSafeInteger(descriptor.value)&&descriptor.value>=0&&(length=Math.min(descriptor.value,MAX_FILTER_COLLECTION_ENTRIES))}catch{return Object.freeze(output2)}for(let index=0;index<length&&budget.remaining>0;index+=1){let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value,String(index))}catch{continue}if(!descriptor||!("value"in descriptor))continue;budget.remaining-=1;const entry=snapshotFilterEntry(descriptor.value,budget,depth+1);entry!==OMIT_FILTER_VALUE&&output2.push(entry)}return Object.freeze(output2)}if(!isPlainFilterRecord(value))return value;const output={};budget.seen.set(value,output);let descriptors;try{descriptors=Object.getOwnPropertyDescriptors(value)}catch{return OMIT_FILTER_VALUE}let retained=0;for(const key of Reflect.ownKeys(descriptors)){if(retained>=MAX_FILTER_COLLECTION_ENTRIES||budget.remaining<=0)break;const descriptor=descriptors[key];if(!descriptor?.enumerable||!("value"in descriptor))continue;retained+=1,budget.remaining-=1;const entry=key==="icon"?descriptor.value:snapshotFilterEntry(descriptor.value,budget,depth+1);entry!==OMIT_FILTER_VALUE&&Object.defineProperty(output,key,{value:entry,enumerable:!0,configurable:!1,writable:!1})}return Object.freeze(output)}function snapshotFilterDefinitions(value){let isArray=!1;try{isArray=Array.isArray(value)}catch{return EMPTY_FILTERS}return isArray?snapshotFilterEntry(value,{remaining:MAX_FILTER_COLLECTION_NODES,seen:new WeakMap},0):EMPTY_FILTERS}function snapshotFilterFieldValue(value){let isArray=!1;try{isArray=Array.isArray(value)}catch{return}if(!isArray)return typeof value=="string"||typeof value=="boolean"||value===void 0?value:void 0;const output=[];let sourceLength=0;try{const descriptor=Object.getOwnPropertyDescriptor(value,"length");descriptor&&"value"in descriptor&&typeof descriptor.value=="number"&&Number.isSafeInteger(descriptor.value)&&descriptor.value>=0&&(sourceLength=descriptor.value)}catch{return Object.freeze(output)}const length=Math.min(sourceLength,MAX_FILTER_COLLECTION_ENTRIES);for(let index=0;index<length;index+=1){let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value,String(index))}catch{continue}descriptor&&"value"in descriptor&&typeof descriptor.value=="string"&&output.push(descriptor.value)}return Object.freeze(output)}const SELECT_EXPORT_PARTS=["form-control-label: filter-control-label","trigger: filter-control-field","display-input: filter-control-input","start: filter-control-start","end: filter-control-end","listbox: filter-control-listbox","option: filter-control-option","clear-button: filter-control-clear-button","expand-icon: filter-control-expand-icon","error: filter-control-error","hint: filter-control-hint"].join(", "),COMBOBOX_EXPORT_PARTS=["form-control-label: filter-control-label","combobox: filter-control-field","combobox-input: filter-control-input","start: filter-control-start","end: filter-control-end","listbox: filter-control-listbox","option: filter-control-option","clear-button: filter-control-clear-button","expand-icon: filter-control-expand-icon","error: filter-control-error","hint: filter-control-hint"].join(", "),INPUT_EXPORT_PARTS=["form-control-label: filter-control-label","input-wrapper: filter-control-field","input: filter-control-input","start: filter-control-start","end: filter-control-end","clear-button: filter-control-clear-button","error: filter-control-error","hint: filter-control-hint"].join(", "),DATE_INPUT_EXPORT_PARTS=["form-control-label: filter-control-label","input-wrapper: filter-control-field","input: filter-control-input","start: filter-control-start","end: filter-control-end","clear-button: filter-control-clear-button","expand-button: filter-control-expand-button","expand-icon: filter-control-expand-icon","popup: filter-control-popup","error: filter-control-error","hint: filter-control-hint"].join(", ");function isBuiltInSet(value){return value==null?!1:typeof value=="boolean"?value:Array.isArray(value)?value.length>0:value!==""}function defineFilterValueEntry(record,key,value){Object.defineProperty(record,key,{value,enumerable:!0,configurable:!0,writable:!0})}function cloneFilterValueRecord(value){const clone={},descriptors=Object.getOwnPropertyDescriptors(value);let retained=0;for(const key of Reflect.ownKeys(descriptors)){if(retained>=MAX_FILTER_COLLECTION_ENTRIES)break;const descriptor=descriptors[key];if(typeof key!="string"||!descriptor?.enumerable||!("value"in descriptor))continue;retained+=1;const fieldValue=snapshotFilterFieldValue(descriptor.value);fieldValue!==void 0&&defineFilterValueEntry(clone,key,fieldValue)}return clone}function cloneFilterValue(value){return Object.freeze(cloneFilterValueRecord(value))}class LyraFilterBar extends LyraElement{constructor(){super(...arguments),this.label="",this.disabled=!1,this.loading=!1,this.touchedFilters=new Set,this._filters=EMPTY_FILTERS,this._value=EMPTY_VALUE,this.rawValue=EMPTY_VALUE,this.debounceTimers=new Map,this.pendingText=new Map,this.chipFocusGeneration=0,this.schemaGeneration=0,this.onControlChange=(id,e)=>{const control=e.target;this.setFilterValue(id,control.value,control.appliedPreset)},this.stopControlAlias=event=>{event.stopPropagation()},this.onCustomControlChange=(def,generation,e)=>{e.stopPropagation(),this.setCustomContextValue(def,generation,def.custom.adapter.valueFromEvent(e))}}static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,filterBarActiveFilters:LYRA_DEFAULT_filterBarActiveFilters,filterBarReset:LYRA_DEFAULT_filterBarReset}}static{this.styles=[LyraElement.styles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-validity-change"])}static{this.properties={filters:{attribute:!1,noAccessor:!0},value:{attribute:!1,noAccessor:!0}}}get filters(){return this._filters}set filters(next){const old=this._filters;this.cancelDebounce(),this.renewSchemaContext();const seen=new Set;this._filters=Object.freeze(snapshotFilterDefinitions(next).filter(definition=>{try{return!definition||typeof definition.filterId!="string"||definition.filterId.length===0||definition.filterId!==definition.filterId.trim()||typeof definition.label!="string"||definition.label.trim().length===0||seen.has(definition.filterId)||(definition.type==="select"||definition.type==="combobox")&&!Array.isArray(definition.options)||definition.type==="custom"&&(!definition.custom?.adapter||typeof definition.custom.render!="function")?!1:(seen.add(definition.filterId),!0)}catch{return!1}}).map(definition=>{if(definition.type!=="select"&&definition.type!=="combobox")return definition;const options=definition.options.filter(option=>{try{return option!==null&&typeof option=="object"&&typeof Object.getOwnPropertyDescriptor(option,"value")?.value=="string"&&typeof Object.getOwnPropertyDescriptor(option,"label")?.value=="string"}catch{return!1}});return Object.freeze({...definition,options:Object.freeze(options)})}));const ids=new Set(this._filters.map(definition=>definition.filterId));this.touchedFilters=new Set([...this.touchedFilters].filter(id=>ids.has(id)));const oldValue=this._value;this._value=this.normalizeValue(this.rawValue),this.requestUpdate("filters",old),this._value!==oldValue&&this.requestUpdate("value",oldValue)}get value(){return cloneFilterValue(this._value)}set value(next){const old=this._value;try{this.rawValue=cloneFilterValue(next??EMPTY_VALUE)}catch{this.rawValue=EMPTY_VALUE}this._value=this.normalizeValue(next),this.requestUpdate("value",old)}renewSchemaContext(){this.schemaAbortController?.abort();const AbortControllerCtor=this.ownerDocument.defaultView?.AbortController??AbortController;this.schemaAbortController=new AbortControllerCtor,this.schemaGeneration+=1}get schemaSignal(){return this.schemaAbortController||this.renewSchemaContext(),this.schemaAbortController.signal}isEmpty(def,value){if(def.type!=="custom")return!isBuiltInSet(value);const{adapter}=def.custom;if(adapter.isEmpty)return adapter.isEmpty(value);const clear=adapter.clearValue;return Array.isArray(value)&&Array.isArray(clear)?value.length===clear.length&&value.every((entry,index)=>entry===clear[index]):Object.is(value,clear)}valueFor(def){return Object.prototype.hasOwnProperty.call(this._value,def.filterId)?this._value[def.filterId]:def.type==="custom"?def.custom.adapter.clearValue:void 0}normalizeValue(value){const normalized={};for(const def of this._filters){let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value??{},def.filterId)}catch{continue}if(!descriptor||!("value"in descriptor))continue;const fieldValue=snapshotFilterFieldValue(descriptor.value);this.isEmpty(def,fieldValue)||defineFilterValueEntry(normalized,def.filterId,fieldValue)}return Object.freeze(normalized)}get hasActiveFilters(){return this._filters.some(def=>!this.isEmpty(def,this.valueFor(def)))}get invalidFilterIds(){return Object.freeze(this._filters.filter(def=>def.required&&this.isEmpty(def,this.valueFor(def))).map(def=>def.filterId))}checkValidity(){return this.invalidFilterIds.length===0}reportValidity(){const invalid=this.invalidFilterIds;return invalid.length&&(this.touchedFilters=new Set([...this.touchedFilters,...invalid])),invalid.length===0}reset(){this.disabled||(this.cancelDebounce(),this.touchedFilters=new Set,this.value=this.resetValue,this.emit("lr-input",Object.freeze({value:this.value,filterId:void 0,appliedPreset:void 0})),this.emit("lr-reset",Object.freeze({value:this.value})))}get resetValue(){const out={};for(const def of this._filters)if(def.defaultValue!==void 0&&!this.isEmpty(def,def.defaultValue)){const value=Array.isArray(def.defaultValue)?Object.freeze([...def.defaultValue]):def.defaultValue;defineFilterValueEntry(out,def.filterId,value)}return Object.freeze(out)}setFilterValue(id,value,appliedPreset){const definition=this._filters.find(candidate=>candidate.filterId===id);if(this.disabled||!definition)return;const next={...this._value};this.isEmpty(definition,value)?delete next[id]:defineFilterValueEntry(next,id,value),this.value=next,this.emit("lr-input",Object.freeze({value:this.value,filterId:id,appliedPreset}))}setCustomContextValue(definition,generation,value){generation!==this.schemaGeneration||this.schemaSignal.aborted||!this.isConnected||!this._filters.includes(definition)||this.setFilterValue(definition.filterId,value)}markTouched(id){this.disabled||this.touchedFilters.has(id)||(this.touchedFilters=new Set(this.touchedFilters).add(id))}onTextInput(def,e){if(this.disabled)return;const next=e.target.value??"",delay=def.debounce;if(typeof delay!="number"||!Number.isFinite(delay)||delay<=0){this.cancelDebounce(def.filterId),this.setFilterValue(def.filterId,next);return}this.pendingText.set(def.filterId,next);const existing=this.debounceTimers.get(def.filterId);existing!==void 0&&clearTimeout(existing),this.debounceTimers.set(def.filterId,setTimeout(()=>this.flushDebounce(def.filterId),delay))}flushDebounce(id){const timer=this.debounceTimers.get(id);if(timer===void 0)return;clearTimeout(timer),this.debounceTimers.delete(id);const pending=this.pendingText.get(id);this.pendingText.delete(id),pending!==void 0&&this.setFilterValue(id,pending)}cancelDebounce(id){for(const[key,timer]of this.debounceTimers)id!==void 0&&key!==id||(clearTimeout(timer),this.debounceTimers.delete(key),this.pendingText.delete(key))}onTextFocusout(id){this.flushDebounce(id),this.markTouched(id)}repairFocusAfterChipRemoval(index,filterId,shouldRepairFocus){const generation=++this.chipFocusGeneration;shouldRepairFocus&&this.updateComplete.then(()=>{if(!this.isConnected||this.disabled||generation!==this.chipFocusGeneration||deepActiveElement(this.ownerDocument)!==this.ownerDocument.body)return;const chips=this.renderRoot.querySelectorAll('[part="chip"]'),chip=chips[Math.min(index,chips.length-1)],target=chip?collectFocusableElements(chip)[0]:void 0;if(target){target.focus();return}for(const control of this.renderRoot.querySelectorAll("[data-filter-id]"))if(control.dataset.filterId===filterId){collectFocusableElements(control)[0]?.focus();return}})}clearFilter(id,shouldRepairFocus=!1){if(this.disabled)return;this.cancelDebounce(id);const index=this.activeEntries.findIndex(entry=>entry.def.filterId===id),def=this._filters.find(f=>f.filterId===id);if(!def)return;const clearValue=def.type==="custom"?def.custom.adapter.clearValue:def.type==="combobox"&&def.multiple?[]:"";this.setFilterValue(id,clearValue),this.repairFocusAfterChipRemoval(Math.max(0,index),id,shouldRepairFocus)}displayValueFor(def,value){if(def.type==="custom"){const formatted=def.custom?.adapter.formatValue?.(value,this.effectiveLocale);return formatted!==void 0?formatted:Array.isArray(value)?getListFormat(this.effectiveLocale,{style:"long",type:"conjunction"}).format(value):value===void 0?"":String(value)}if(def.type==="select"||def.type==="combobox"){const labels=(Array.isArray(value)?value.filter(entry=>typeof entry=="string"):typeof value=="string"?[value]:[]).map(v=>def.options?.find(o=>o.value===v)?.label??v);return labels.length>1?getListFormat(this.effectiveLocale,{style:"long",type:"conjunction"}).format(labels):labels[0]??""}if(def.type==="text")return typeof value=="string"?value:"";if(typeof value!="string")return"";const formatter=getDateTimeFormat(this.effectiveLocale,{year:"numeric",month:"short",day:"numeric",timeZone:"UTC"}),parseIso=input=>{const match=/^(\d{4})-(\d{2})-(\d{2})$/.exec(input);if(!match)return;const year=Number(match[1]),month=Number(match[2]),day=Number(match[3]),date=new Date(0);return date.setUTCHours(0,0,0,0),date.setUTCFullYear(year,month-1,day),date.getUTCFullYear()===year&&date.getUTCMonth()===month-1&&date.getUTCDate()===day?date:void 0},segments=value.split("/");if(def.type==="date"&&segments.length!==1||def.type==="date-range"&&segments.length!==2)return value;const[startText,endText]=segments,start=parseIso(startText??""),end=endText===void 0?void 0:parseIso(endText);return!start||endText!==void 0&&(!end||end.getTime()<start.getTime())?value:end?formatter.formatRange(start,end):formatter.format(start)}get activeEntries(){return this._filters.filter(def=>!this.isEmpty(def,this.valueFor(def))).map(def=>({def,display:this.displayValueFor(def,this.valueFor(def))}))}disconnectedCallback(){super.disconnectedCallback(),this.cancelDebounce(),this.schemaAbortController?.abort(),this.schemaAbortController=void 0,this.schemaGeneration+=1}connectedCallback(){super.connectedCallback(),(!this.schemaAbortController||this.schemaAbortController.signal.aborted)&&(this.renewSchemaContext(),this.hasUpdated&&this.requestUpdate()),this.hasUpdated&&queueMicrotask(()=>{this.isConnected&&this.syncTextControls()})}syncTextControls(){if(!this._filters.some(def=>def.type==="text"))return;const fields=new Map;for(const node of this.renderRoot.querySelectorAll("lr-input[data-filter-id]")){const element=node,id=element.dataset.filterId;id!==void 0&&fields.set(id,element)}for(const def of this._filters){if(def.type!=="text"||this.debounceTimers.has(def.filterId))continue;const field=fields.get(def.filterId);if(!field)continue;const raw=this._value[def.filterId],next=typeof raw=="string"?raw:"";field.value!==next&&(field.value=next)}}willUpdate(changed){super.willUpdate(changed),changed.has("disabled")&&this.disabled&&this.cancelDebounce()}updated(changed){if(super.updated(changed),this.syncTextControls(),changed.has("value")||changed.has("filters")){const invalidFilterIds=this.invalidFilterIds,valid=invalidFilterIds.length===0,key=JSON.stringify({valid,invalidFilterIds});key!==this.lastValidityKey&&(this.lastValidityKey=key,this.emit("lr-validity-change",Object.freeze({valid,invalidFilterIds:Object.freeze([...invalidFilterIds])})))}}renderOption(option){return html`<lr-option value=${option.value}
       >${option.icon===void 0||option.icon===null?nothing:html`<span slot="start" aria-hidden="true" inert>${option.icon}</span>`}${option.label}</lr-option
     >`}renderControl(def){const value=this.valueFor(def),missing=!!def.required&&this.isEmpty(def,value),errorText=this.touchedFilters.has(def.filterId)&&missing?this.localize("fieldRequired"):"",onChange=e=>this.onControlChange(def.filterId,e),onFocusout=()=>this.markTouched(def.filterId);if(def.type==="custom"){const custom=def.custom,generation=this.schemaGeneration,signal=this.schemaSignal,onCustomValueChange=e=>this.onCustomControlChange(def,generation,e),context={filterId:def.filterId,label:def.label,definition:def,value,disabled:this.disabled,required:!!def.required,errorText,signal,generation,setValue:next=>this.setCustomContextValue(def,generation,next),onValueChange:onCustomValueChange,onInput:onCustomValueChange,onChange:onCustomValueChange,onFocusout:()=>{generation===this.schemaGeneration&&!signal.aborted&&this._filters.includes(def)&&onFocusout()}};return html`<div
         part="filter-control"

package/dist/components/layout/menu/dropdown-item.class.d.ts

@@ -4,6 +4,8 @@ import type{PropertyValues}from'lit';import{LyraMenuItem,type LyraMenuItemEventM
 * It is intentionally a subclass of `<lr-menu-item>`, so it participates in
 * the same roving focus, checkbox, selection, and menu event contracts — and
 * in the same `size` ladder, including the `small`/`medium`/`large` spellings.
+* It also inherits `<lr-menu-item>`'s `href`/`target`/`rel`/`download` link-item support, mirroring
+* `wa-dropdown-item`'s identical navigation surface — see that class's doc.
 *
 * @customElement lr-dropdown-item
 * @slot - The item's visual label content. Its flattened subtree is inert and hidden from assistive

package/dist/components/layout/menu/menu-item.class.d.ts

@@ -153,7 +153,34 @@ type:MenuItemType;
 /** Whether a `type="checkbox"` item is checked. Meaningless (ignored) for `type="normal"`. */
 checked:boolean;
 /** Shows progress and makes the row interaction-disabled while an action is pending. */
-loading:boolean;private hasIconSlot;private hasDetailsSlot;private hasSuffixSlot;private submenuAssigned;private submenuExpanded;private submenuKind;private slottedLabel;private submenuPanel;private submenuPanelAttached;
+loading:boolean;
+/** When set to a safe link URL (`http:`/`https:`/`blob:`/`mailto:`/relative — see
+*  `safeLinkHref`, or `safeDownloadHref` which drops `mailto:` when `download` is set),
+*  `[part="base"]` renders as a real `<a href=…>` instead of a `<span>`, and activation (click,
+*  or the parent's Enter/Space handling, which forwards through `click()` for a link item so the
+*  anchor's own native default action runs) navigates there in addition to firing the usual
+*  `select()`/`lr-select` contract. An unsafe/unparseable `href` falls back to the plain `<span>`,
+*  matching `lr-button`'s identical fallback. Mirrors `wa-dropdown-item`'s link-item support. */
+href?:string;
+/** Native anchor `target`, used only while `href` resolves to a link. Setting this to `'_blank'`
+*  (or any other target) always contributes `noopener noreferrer` to the rendered anchor's `rel`
+*  — matching `lr-button`'s identical pattern. */
+target?:string;
+/** Independently settable author relationship tokens for the rendered link (no default).
+*  `opener` is always stripped, and any `target` force-adds the non-removable
+*  `noopener noreferrer` guard — see `target`. */
+rel?:string;
+/** Native anchor `download` attribute, used only while `href` resolves to a link. Narrows the
+*  safe-URL allowlist to `safeDownloadHref`'s, which drops `mailto:` — a mail handoff names no
+*  retrievable bytes, so it cannot be a download target. */
+download?:string;
+/** Resolved `rel` for the rendered anchor: author tokens minus `opener`, plus the
+*  `noopener noreferrer` guard whenever `target` is set. `undefined` when nothing remains, so the
+*  attribute is omitted entirely rather than rendered empty. */
+private get resolvedRel();
+/** Resolved, safety-checked `href` for the rendered anchor, or `undefined` when `href` is unset
+*  or fails the allowlist for its sink (`download` present narrows to `safeDownloadHref`). */
+private get resolvedHref();private hasIconSlot;private hasDetailsSlot;private hasSuffixSlot;private submenuAssigned;private submenuExpanded;private submenuKind;private slottedLabel;private submenuPanel;private submenuPanelAttached;
 /** Increments whenever the owned submenu identity becomes stale, so async show/hide continuations
 * cannot write disclosure state or popup ownership back onto a replacement panel. */
 private submenuPanelGeneration;

package/dist/components/layout/menu/menu-item.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing,svg}from"lit";import{html as staticHtml,unsafeStatic}from"lit/static-html.js";import{property,state}from"lit/decorators.js";import{composedParentElement,isAccessibilitySubtreeExcluded}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{LyraElement}from"../../../internal/lyra-element.js";import{chevronIcon,spinnerIcon}from"../../../internal/icons.js";import{tag}from"../../../internal/prefix.js";import{sizes}from"../../../internal/sizes.styles.js";import{menuItemOwner,submenuPanelController}from"./menu-shared.js";import{styles}from"./menu-item.styles.js";import{activeElementIn}from"../../../internal/active-element.js";const menuTag=unsafeStatic(tag("menu")),GLYPH_VIEW_BOX="0 0 24 24",GLYPH_STROKE_WIDTH="1.75";function checkmarkGlyph(){return svg`
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing,svg}from"lit";import{html as staticHtml,unsafeStatic}from"lit/static-html.js";import{property,state}from"lit/decorators.js";import{composedParentElement,isAccessibilitySubtreeExcluded}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{LyraElement}from"../../../internal/lyra-element.js";import{chevronIcon,spinnerIcon}from"../../../internal/icons.js";import{tag}from"../../../internal/prefix.js";import{safeDownloadHref,safeLinkHref}from"../../../internal/safe-url.js";import{sizes}from"../../../internal/sizes.styles.js";import{menuItemOwner,submenuPanelController}from"./menu-shared.js";import{styles}from"./menu-item.styles.js";import{activeElementIn}from"../../../internal/active-element.js";const menuTag=unsafeStatic(tag("menu")),GLYPH_VIEW_BOX="0 0 24 24",GLYPH_STROKE_WIDTH="1.75";function checkmarkGlyph(){return svg`
     <svg
       part="checkmark"
       width="1em"
@@ -12,41 +12,51 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
       aria-hidden="true"
       focusable="false"
     ><polyline points="5 12.5 10 17.5 19 6.5"></polyline></svg>
-  `}class LyraMenuItem extends LyraElement{constructor(){super(...arguments),this.value="",this.size="m",this.disabled=!1,this.variant="default",this.type="normal",this.checked=!1,this.loading=!1,this.hasIconSlot=!1,this.hasDetailsSlot=!1,this.hasSuffixSlot=!1,this.submenuAssigned=!1,this.submenuExpanded=!1,this.slottedLabel="",this.submenuPanel=null,this.submenuPanelAttached=!1,this.submenuPanelGeneration=0,this.labelObservationGeneration=0,this.announcedNativeState="",this.owningMenu=null,this.ownsAriaLabel=!1,this.ownedAriaLabelValue=null,this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null,this.onNativeStateMutation=()=>{const signature=this.nativeStateSignature();signature!==this.announcedNativeState&&(this.announcedNativeState=signature,this.emitStateChange())},this.onIconSlotChange=()=>{this.hasIconSlot=[...this.renderRoot.querySelectorAll('slot[name="icon"], slot[name="prefix"]')].some(slot=>slot.assignedElements({flatten:!0}).length>0)},this.onDetailsSlotChange=e=>{this.hasDetailsSlot=e.target.assignedNodes({flatten:!0}).some(node=>(node.textContent??"").trim()!=="")},this.onSuffixSlotChange=e=>{this.hasSuffixSlot=e.target.assignedElements({flatten:!0}).length>0},this.onLabelSlotChange=event=>{this.observeLabelContent(),this.syncSlottedLabel(event.target)},this.onForwardedLabelSlotChange=event=>{const slot=event.target;this.labelForwardingSlots().includes(slot)&&(this.observeLabelContent(),this.syncSlottedLabel())},this.onSubmenuSlotChange=e=>{this.syncSubmenuSlot(e.target)},this.onPanelStateChange=open=>{this.submenuExpanded=open}}static{this.knownUnobservedAttributes=["submenu-open"]}static{this.styles=[LyraElement.styles,sizes,styles]}get hasSubmenu(){return this.submenuAssigned}get submenuOpen(){return this.submenuExpanded}[menuItemOwner](owner,expectedOwner){owner===null&&expectedOwner&&this.owningMenu!==expectedOwner||(this.owningMenu=owner)}set submenuOpen(next){!!next!==this.submenuExpanded&&(next?this.openSubmenu("none"):this.closeSubmenu())}get interactionDisabled(){return this.disabled||this.loading}connectedCallback(){super.connectedCallback();const initialLabel=this.readSlottedLabel(null,!1);initialLabel!==this.slottedLabel&&(this.slottedLabel=initialLabel),this.applyComputedName(),this.tabIndex!==0&&(this.tabIndex=-1),this.announcedNativeState=this.nativeStateSignature();const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;MutationObserverCtor&&(this.nativeStateObserver=new MutationObserverCtor(this.onNativeStateMutation),this.nativeStateObserver.observe(this,{attributes:!0,attributeFilter:["hidden","inert","aria-hidden"]}),this.labelObserver=new MutationObserverCtor(()=>{this.observeLabelContent(),this.syncSlottedLabel()}),this.observeLabelContent()),this.addEventListener("slotchange",this.onForwardedLabelSlotChange);const labelGeneration=++this.labelObservationGeneration;this.updateComplete.then(()=>{if(!this.isConnected||labelGeneration!==this.labelObservationGeneration)return;this.observeLabelContent(),this.syncSlottedLabel();const submenuSlot=this.renderRoot.querySelector('slot[name="submenu"]');submenuSlot&&this.syncSubmenuSlot(submenuSlot)})}disconnectedCallback(){super.disconnectedCallback(),this.submenuPanelGeneration+=1,this.submenuExpanded=!1,this.nativeStateObserver?.disconnect(),this.nativeStateObserver=void 0,this.labelObservationGeneration+=1,this.removeEventListener("slotchange",this.onForwardedLabelSlotChange),this.labelObserver?.disconnect(),this.labelObserver=void 0,this.submenuPanel&&this.submenuPanelAttached&&(this.submenuPanel[submenuPanelController].detach(this),this.submenuPanelAttached=!1)}nativeStateSignature(){return`${this.hidden}|${this.inert}|${this.getAttribute("aria-hidden")}`}emitStateChange(){this.emit("lr-menu-item-state-change",{disabled:this.interactionDisabled,hidden:!!this.hidden,inert:this.inert})}willUpdate(changed){super.willUpdate(changed);const isCheckbox=this.type==="checkbox"&&!this.submenuAssigned;this.setAttribute("role",isCheckbox?"menuitemcheckbox":"menuitem"),isCheckbox?this.setAttribute("aria-checked",this.checked?"true":"false"):this.removeAttribute("aria-checked"),this.submenuAssigned?(this.setAttribute("aria-haspopup","menu"),this.setAttribute("aria-expanded",this.submenuExpanded?"true":"false")):(this.removeAttribute("aria-haspopup"),this.removeAttribute("aria-expanded")),this.applyComputedName(),this.toggleAttribute("submenu-open",this.submenuExpanded),this.setAttribute("aria-disabled",String(this.interactionDisabled)),this.interactionDisabled&&(changed.has("disabled")||changed.has("loading"))&&(this.tabIndex=-1,activeElementIn(this.ownerDocument)===this&&this.blur()),(changed.has("disabled")||changed.has("loading"))&&this.emitStateChange()}click(){this.interactionDisabled||this.renderRoot.querySelector('[part~="base"]')?.click()}select(){if(!this.interactionDisabled){if(this.submenuPanel){this.openSubmenu("none");return}if(this.type==="checkbox"){const checked=!this.checked;this.emit("lr-menu-item-change",{value:this.value,checked},{cancelable:!0}).defaultPrevented||(this.checked=checked)}this.owningMenu?.activate(this)}}async openSubmenu(focus="first"){const panel=this.submenuPanel,generation=this.submenuPanelGeneration;if(!panel||this.interactionDisabled||!this.isCurrentSubmenuPanel(panel,generation))return;const controller=panel[submenuPanelController],shown=controller.show(focus);this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await shown,this.isCurrentSubmenuPanel(panel,generation)&&(panel.updateComplete&&await panel.updateComplete,this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await this.updateComplete)))}async closeSubmenu(){const panel=this.submenuPanel,generation=this.submenuPanelGeneration;if(!panel||!this.isCurrentSubmenuPanel(panel,generation))return;const controller=panel[submenuPanelController],hidden=controller.hide();this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await hidden,this.isCurrentSubmenuPanel(panel,generation)&&(panel.updateComplete&&await panel.updateComplete,this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await this.updateComplete)))}defaultLabelSlot(){return this.renderRoot?.querySelector("slot:not([name])")??null}isDefaultLabelBranch(node){let top=node;for(;top.parentNode&&top.parentNode!==this;)top=top.parentNode;return top.parentNode!==this?!1:top.nodeType!==1||(top.getAttribute("slot")??"")===""}labelForwardingSlots(){return Array.from(this.querySelectorAll("slot")).filter(slot=>this.isDefaultLabelBranch(slot))}composedParentForNode(node){const assignedSlot=node.assignedSlot;if(assignedSlot)return assignedSlot;if(node.parentElement)return node.parentElement;const root=node.getRootNode();return"host"in root&&root.host.nodeType===1?root.host:null}isLabelSubtreeExcluded(element){return!(element.getRootNode()===this.renderRoot&&element.matches('[part~="label"][aria-hidden="true"][inert]:not([hidden])'))&&isAccessibilitySubtreeExcluded(element)}readSlottedLabel(slot=this.defaultLabelSlot(),requireRendered=!0){const nodes=slot?slot.assignedNodes({flatten:!0}):Array.from(this.childNodes).filter(node=>this.isDefaultLabelBranch(node));return composedAccessibilityText(nodes,{ancestorBoundary:this,isSubtreeExcluded:element=>this.isLabelSubtreeExcluded(element),requireRendered,ignoreInheritedVisibility:!0}).replace(/\s+/g," ").trim()}observeLabelAncestors(node,options){const observer=this.labelObserver;if(!observer)return;let current=this.composedParentForNode(node);for(;current;)current!==this&&!this.contains(current)&&observer.observe(current,options),current=composedParentElement(current)}observeLabelContent(){const observer=this.labelObserver;if(!observer)return;observer.disconnect();const options={attributes:!0,attributeFilter:["aria-hidden","aria-label","aria-labelledby","alt","class","data-hidden","hidden","inert","id","label","open","slot","style"],characterData:!0,childList:!0,subtree:!0};observer.observe(this,options);const slot=this.defaultLabelSlot();for(const assigned of slot?.assignedNodes({flatten:!0})??[])this.contains(assigned)||observer.observe(assigned,options),this.observeLabelAncestors(assigned,{attributes:!0,attributeFilter:options.attributeFilter})}syncSlottedLabel(slot=this.defaultLabelSlot()){const next=this.readSlottedLabel(slot);next!==this.slottedLabel&&(this.slottedLabel=next),this.applyComputedName(),this.applyPanelName()}syncSubmenuSlot(submenuSlot){if(!submenuSlot.isConnected||submenuSlot.getRootNode()!==this.renderRoot)return;const assigned=submenuSlot.assignedElements({flatten:!0}),authoredPanel=assigned.find(element=>element.localName===tag("menu")),hasDirectItems=assigned.some(element=>element.localName===tag("menu-item")||element.localName===tag("dropdown-item")),kind=authoredPanel?"panel":hasDirectItems?"items":void 0;if(this.submenuKind=kind,this.submenuAssigned=kind!==void 0,kind==="items"){const generated=this.renderRoot.querySelector("[data-generated-submenu]");generated&&this.connectSubmenuPanel(generated);return}this.connectSubmenuPanel(authoredPanel??null)}connectSubmenuPanel(next){const samePanel=next===this.submenuPanel;if(samePanel&&(next===null||this.submenuPanelAttached))return;const previous=this.submenuPanel;if(++this.submenuPanelGeneration,previous&&this.submenuPanelAttached&&previous[submenuPanelController].detach(this),this.submenuPanelAttached=!1,samePanel||(this.submenuPanel=next,this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null),!this.submenuPanel){this.submenuExpanded=!1;return}const controller=this.submenuPanel[submenuPanelController];controller.attach(this,this.onPanelStateChange),this.submenuPanelAttached=!0,this.submenuExpanded=controller.open,this.applyPanelName()}isCurrentSubmenuPanel(panel,generation){return this.isConnected&&this.submenuPanel===panel&&this.submenuPanelGeneration===generation}updated(changed){if(super.updated(changed),changed.has("submenuKind")&&this.submenuKind==="items"){const generated=this.renderRoot.querySelector("[data-generated-submenu]");this.connectSubmenuPanel(generated)}}applyComputedName(){if(this.ownsAriaLabel&&this.getAttribute("aria-label")!==this.ownedAriaLabelValue&&(this.ownsAriaLabel=!1,this.ownedAriaLabelValue=null),this.hasAttribute("aria-labelledby")){this.ownsAriaLabel&&this.removeAttribute("aria-label"),this.ownsAriaLabel=!1,this.ownedAriaLabelValue=null;return}if(!(this.hasAttribute("aria-label")&&!this.ownsAriaLabel)){if(this.ownsAriaLabel=!0,this.slottedLabel===""){this.ownedAriaLabelValue=null,this.hasAttribute("aria-label")&&this.removeAttribute("aria-label");return}this.ownedAriaLabelValue=this.slottedLabel,this.getAttribute("aria-label")!==this.slottedLabel&&this.setAttribute("aria-label",this.slottedLabel)}}applyPanelName(){const panel=this.submenuPanel;if(panel){if(this.ownsPanelAriaLabel&&panel.getAttribute("aria-label")!==this.ownedPanelAriaLabelValue&&(this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null),panel.hasAttribute("label")){this.ownsPanelAriaLabel&&(panel.removeAttribute("aria-label"),this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null);return}if(!(panel.hasAttribute("aria-label")&&!this.ownsPanelAriaLabel)){if(this.ownsPanelAriaLabel=!0,this.slottedLabel===""){this.ownedPanelAriaLabelValue=null,panel.hasAttribute("aria-label")&&panel.removeAttribute("aria-label");return}this.ownedPanelAriaLabelValue=this.slottedLabel,panel.getAttribute("aria-label")!==this.slottedLabel&&panel.setAttribute("aria-label",this.slottedLabel)}}}getTextLabel(){return this.readSlottedLabel()}render(){return html`
-      <span part="base" @click=${()=>this.select()}>
-        <span part="icon" aria-hidden="true" inert ?hidden=${!this.hasIconSlot}>
-          <slot name="icon" @slotchange=${this.onIconSlotChange}></slot>
-          <span part="prefix"
-            ><slot name="prefix" @slotchange=${this.onIconSlotChange}></slot
-          ></span>
-        </span>
-        <span part="label" aria-hidden="true" inert
-          ><slot @slotchange=${this.onLabelSlotChange}></slot
+  `}class LyraMenuItem extends LyraElement{constructor(){super(...arguments),this.value="",this.size="m",this.disabled=!1,this.variant="default",this.type="normal",this.checked=!1,this.loading=!1,this.hasIconSlot=!1,this.hasDetailsSlot=!1,this.hasSuffixSlot=!1,this.submenuAssigned=!1,this.submenuExpanded=!1,this.slottedLabel="",this.submenuPanel=null,this.submenuPanelAttached=!1,this.submenuPanelGeneration=0,this.labelObservationGeneration=0,this.announcedNativeState="",this.owningMenu=null,this.ownsAriaLabel=!1,this.ownedAriaLabelValue=null,this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null,this.onNativeStateMutation=()=>{const signature=this.nativeStateSignature();signature!==this.announcedNativeState&&(this.announcedNativeState=signature,this.emitStateChange())},this.onIconSlotChange=()=>{this.hasIconSlot=[...this.renderRoot.querySelectorAll('slot[name="icon"], slot[name="prefix"]')].some(slot=>slot.assignedElements({flatten:!0}).length>0)},this.onDetailsSlotChange=e=>{this.hasDetailsSlot=e.target.assignedNodes({flatten:!0}).some(node=>(node.textContent??"").trim()!=="")},this.onSuffixSlotChange=e=>{this.hasSuffixSlot=e.target.assignedElements({flatten:!0}).length>0},this.onLabelSlotChange=event=>{this.observeLabelContent(),this.syncSlottedLabel(event.target)},this.onForwardedLabelSlotChange=event=>{const slot=event.target;this.labelForwardingSlots().includes(slot)&&(this.observeLabelContent(),this.syncSlottedLabel())},this.onSubmenuSlotChange=e=>{this.syncSubmenuSlot(e.target)},this.onPanelStateChange=open=>{this.submenuExpanded=open}}static{this.knownUnobservedAttributes=["submenu-open"]}static{this.styles=[LyraElement.styles,sizes,styles]}get resolvedRel(){const authored=(this.rel??"").split(/\s+/).filter(token=>token&&token!=="opener");if(this.target)for(const guard of["noopener","noreferrer"])authored.includes(guard)||authored.push(guard);return authored.length?authored.join(" "):void 0}get resolvedHref(){return(this.download!==void 0?safeDownloadHref(this.href):safeLinkHref(this.href))??void 0}get isLinkItem(){return this.resolvedHref!==void 0}get hasSubmenu(){return this.submenuAssigned}get submenuOpen(){return this.submenuExpanded}[menuItemOwner](owner,expectedOwner){owner===null&&expectedOwner&&this.owningMenu!==expectedOwner||(this.owningMenu=owner)}set submenuOpen(next){!!next!==this.submenuExpanded&&(next?this.openSubmenu("none"):this.closeSubmenu())}get interactionDisabled(){return this.disabled||this.loading}connectedCallback(){super.connectedCallback();const initialLabel=this.readSlottedLabel(null,!1);initialLabel!==this.slottedLabel&&(this.slottedLabel=initialLabel),this.applyComputedName(),this.tabIndex!==0&&(this.tabIndex=-1),this.announcedNativeState=this.nativeStateSignature();const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;MutationObserverCtor&&(this.nativeStateObserver=new MutationObserverCtor(this.onNativeStateMutation),this.nativeStateObserver.observe(this,{attributes:!0,attributeFilter:["hidden","inert","aria-hidden"]}),this.labelObserver=new MutationObserverCtor(()=>{this.observeLabelContent(),this.syncSlottedLabel()}),this.observeLabelContent()),this.addEventListener("slotchange",this.onForwardedLabelSlotChange);const labelGeneration=++this.labelObservationGeneration;this.updateComplete.then(()=>{if(!this.isConnected||labelGeneration!==this.labelObservationGeneration)return;this.observeLabelContent(),this.syncSlottedLabel();const submenuSlot=this.renderRoot.querySelector('slot[name="submenu"]');submenuSlot&&this.syncSubmenuSlot(submenuSlot)})}disconnectedCallback(){super.disconnectedCallback(),this.submenuPanelGeneration+=1,this.submenuExpanded=!1,this.nativeStateObserver?.disconnect(),this.nativeStateObserver=void 0,this.labelObservationGeneration+=1,this.removeEventListener("slotchange",this.onForwardedLabelSlotChange),this.labelObserver?.disconnect(),this.labelObserver=void 0,this.submenuPanel&&this.submenuPanelAttached&&(this.submenuPanel[submenuPanelController].detach(this),this.submenuPanelAttached=!1)}nativeStateSignature(){return`${this.hidden}|${this.inert}|${this.getAttribute("aria-hidden")}`}emitStateChange(){this.emit("lr-menu-item-state-change",{disabled:this.interactionDisabled,hidden:!!this.hidden,inert:this.inert})}willUpdate(changed){super.willUpdate(changed);const isCheckbox=this.type==="checkbox"&&!this.submenuAssigned;this.setAttribute("role",isCheckbox?"menuitemcheckbox":"menuitem"),isCheckbox?this.setAttribute("aria-checked",this.checked?"true":"false"):this.removeAttribute("aria-checked"),this.submenuAssigned?(this.setAttribute("aria-haspopup","menu"),this.setAttribute("aria-expanded",this.submenuExpanded?"true":"false")):(this.removeAttribute("aria-haspopup"),this.removeAttribute("aria-expanded")),this.applyComputedName(),this.toggleAttribute("submenu-open",this.submenuExpanded),this.setAttribute("aria-disabled",String(this.interactionDisabled)),this.interactionDisabled&&(changed.has("disabled")||changed.has("loading"))&&(this.tabIndex=-1,activeElementIn(this.ownerDocument)===this&&this.blur()),(changed.has("disabled")||changed.has("loading"))&&this.emitStateChange()}click(){this.interactionDisabled||this.renderRoot.querySelector('[part~="base"]')?.click()}select(){if(!this.interactionDisabled){if(this.submenuPanel){this.openSubmenu("none");return}if(this.type==="checkbox"){const checked=!this.checked;this.emit("lr-menu-item-change",{value:this.value,checked},{cancelable:!0}).defaultPrevented||(this.checked=checked)}this.owningMenu?.activate(this)}}async openSubmenu(focus="first"){const panel=this.submenuPanel,generation=this.submenuPanelGeneration;if(!panel||this.interactionDisabled||!this.isCurrentSubmenuPanel(panel,generation))return;const controller=panel[submenuPanelController],shown=controller.show(focus);this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await shown,this.isCurrentSubmenuPanel(panel,generation)&&(panel.updateComplete&&await panel.updateComplete,this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await this.updateComplete)))}async closeSubmenu(){const panel=this.submenuPanel,generation=this.submenuPanelGeneration;if(!panel||!this.isCurrentSubmenuPanel(panel,generation))return;const controller=panel[submenuPanelController],hidden=controller.hide();this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await hidden,this.isCurrentSubmenuPanel(panel,generation)&&(panel.updateComplete&&await panel.updateComplete,this.isCurrentSubmenuPanel(panel,generation)&&(this.submenuExpanded=controller.open,await this.updateComplete)))}defaultLabelSlot(){return this.renderRoot?.querySelector("slot:not([name])")??null}isDefaultLabelBranch(node){let top=node;for(;top.parentNode&&top.parentNode!==this;)top=top.parentNode;return top.parentNode!==this?!1:top.nodeType!==1||(top.getAttribute("slot")??"")===""}labelForwardingSlots(){return Array.from(this.querySelectorAll("slot")).filter(slot=>this.isDefaultLabelBranch(slot))}composedParentForNode(node){const assignedSlot=node.assignedSlot;if(assignedSlot)return assignedSlot;if(node.parentElement)return node.parentElement;const root=node.getRootNode();return"host"in root&&root.host.nodeType===1?root.host:null}isLabelSubtreeExcluded(element){return!(element.getRootNode()===this.renderRoot&&element.matches('[part~="label"][aria-hidden="true"][inert]:not([hidden])'))&&isAccessibilitySubtreeExcluded(element)}readSlottedLabel(slot=this.defaultLabelSlot(),requireRendered=!0){const nodes=slot?slot.assignedNodes({flatten:!0}):Array.from(this.childNodes).filter(node=>this.isDefaultLabelBranch(node));return composedAccessibilityText(nodes,{ancestorBoundary:this,isSubtreeExcluded:element=>this.isLabelSubtreeExcluded(element),requireRendered,ignoreInheritedVisibility:!0}).replace(/\s+/g," ").trim()}observeLabelAncestors(node,options){const observer=this.labelObserver;if(!observer)return;let current=this.composedParentForNode(node);for(;current;)current!==this&&!this.contains(current)&&observer.observe(current,options),current=composedParentElement(current)}observeLabelContent(){const observer=this.labelObserver;if(!observer)return;observer.disconnect();const options={attributes:!0,attributeFilter:["aria-hidden","aria-label","aria-labelledby","alt","class","data-hidden","hidden","inert","id","label","open","slot","style"],characterData:!0,childList:!0,subtree:!0};observer.observe(this,options);const slot=this.defaultLabelSlot();for(const assigned of slot?.assignedNodes({flatten:!0})??[])this.contains(assigned)||observer.observe(assigned,options),this.observeLabelAncestors(assigned,{attributes:!0,attributeFilter:options.attributeFilter})}syncSlottedLabel(slot=this.defaultLabelSlot()){const next=this.readSlottedLabel(slot);next!==this.slottedLabel&&(this.slottedLabel=next),this.applyComputedName(),this.applyPanelName()}syncSubmenuSlot(submenuSlot){if(!submenuSlot.isConnected||submenuSlot.getRootNode()!==this.renderRoot)return;const assigned=submenuSlot.assignedElements({flatten:!0}),authoredPanel=assigned.find(element=>element.localName===tag("menu")),hasDirectItems=assigned.some(element=>element.localName===tag("menu-item")||element.localName===tag("dropdown-item")),kind=authoredPanel?"panel":hasDirectItems?"items":void 0;if(this.submenuKind=kind,this.submenuAssigned=kind!==void 0,kind==="items"){const generated=this.renderRoot.querySelector("[data-generated-submenu]");generated&&this.connectSubmenuPanel(generated);return}this.connectSubmenuPanel(authoredPanel??null)}connectSubmenuPanel(next){const samePanel=next===this.submenuPanel;if(samePanel&&(next===null||this.submenuPanelAttached))return;const previous=this.submenuPanel;if(++this.submenuPanelGeneration,previous&&this.submenuPanelAttached&&previous[submenuPanelController].detach(this),this.submenuPanelAttached=!1,samePanel||(this.submenuPanel=next,this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null),!this.submenuPanel){this.submenuExpanded=!1;return}const controller=this.submenuPanel[submenuPanelController];controller.attach(this,this.onPanelStateChange),this.submenuPanelAttached=!0,this.submenuExpanded=controller.open,this.applyPanelName()}isCurrentSubmenuPanel(panel,generation){return this.isConnected&&this.submenuPanel===panel&&this.submenuPanelGeneration===generation}updated(changed){if(super.updated(changed),changed.has("submenuKind")&&this.submenuKind==="items"){const generated=this.renderRoot.querySelector("[data-generated-submenu]");this.connectSubmenuPanel(generated)}}applyComputedName(){if(this.ownsAriaLabel&&this.getAttribute("aria-label")!==this.ownedAriaLabelValue&&(this.ownsAriaLabel=!1,this.ownedAriaLabelValue=null),this.hasAttribute("aria-labelledby")){this.ownsAriaLabel&&this.removeAttribute("aria-label"),this.ownsAriaLabel=!1,this.ownedAriaLabelValue=null;return}if(!(this.hasAttribute("aria-label")&&!this.ownsAriaLabel)){if(this.ownsAriaLabel=!0,this.slottedLabel===""){this.ownedAriaLabelValue=null,this.hasAttribute("aria-label")&&this.removeAttribute("aria-label");return}this.ownedAriaLabelValue=this.slottedLabel,this.getAttribute("aria-label")!==this.slottedLabel&&this.setAttribute("aria-label",this.slottedLabel)}}applyPanelName(){const panel=this.submenuPanel;if(panel){if(this.ownsPanelAriaLabel&&panel.getAttribute("aria-label")!==this.ownedPanelAriaLabelValue&&(this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null),panel.hasAttribute("label")){this.ownsPanelAriaLabel&&(panel.removeAttribute("aria-label"),this.ownsPanelAriaLabel=!1,this.ownedPanelAriaLabelValue=null);return}if(!(panel.hasAttribute("aria-label")&&!this.ownsPanelAriaLabel)){if(this.ownsPanelAriaLabel=!0,this.slottedLabel===""){this.ownedPanelAriaLabelValue=null,panel.hasAttribute("aria-label")&&panel.removeAttribute("aria-label");return}this.ownedPanelAriaLabelValue=this.slottedLabel,panel.getAttribute("aria-label")!==this.slottedLabel&&panel.setAttribute("aria-label",this.slottedLabel)}}}getTextLabel(){return this.readSlottedLabel()}render(){const baseContent=html`
+      <span part="icon" aria-hidden="true" inert ?hidden=${!this.hasIconSlot}>
+        <slot name="icon" @slotchange=${this.onIconSlotChange}></slot>
+        <span part="prefix"
+          ><slot name="prefix" @slotchange=${this.onIconSlotChange}></slot
         ></span>
-        <span
-          part="details"
-          aria-hidden="true"
-          inert
-          ?hidden=${!this.hasDetailsSlot}
-        >
-          <slot name="details" @slotchange=${this.onDetailsSlotChange}></slot>
-        </span>
-        <span
-          part="suffix"
-          aria-hidden="true"
-          inert
-          ?hidden=${!this.hasSuffixSlot}
-        >
-          <slot name="suffix" @slotchange=${this.onSuffixSlotChange}></slot>
-        </span>
-        ${this.loading?html`<span part="spinner spinner__base" aria-hidden="true"
-              >${spinnerIcon()}</span
-            >`:nothing}
-        ${this.type==="checkbox"&&this.checked?html`<span part="checked-icon">${checkmarkGlyph()}</span>`:nothing}
-        ${this.submenuAssigned?html`<span part="submenu-icon" aria-hidden="true"
-              >${chevronIcon()}</span
-            >`:nothing}
       </span>
+      <span part="label" aria-hidden="true" inert
+        ><slot @slotchange=${this.onLabelSlotChange}></slot
+      ></span>
+      <span
+        part="details"
+        aria-hidden="true"
+        inert
+        ?hidden=${!this.hasDetailsSlot}
+      >
+        <slot name="details" @slotchange=${this.onDetailsSlotChange}></slot>
+      </span>
+      <span
+        part="suffix"
+        aria-hidden="true"
+        inert
+        ?hidden=${!this.hasSuffixSlot}
+      >
+        <slot name="suffix" @slotchange=${this.onSuffixSlotChange}></slot>
+      </span>
+      ${this.loading?html`<span part="spinner spinner__base" aria-hidden="true"
+            >${spinnerIcon()}</span
+          >`:nothing}
+      ${this.type==="checkbox"&&this.checked?html`<span part="checked-icon">${checkmarkGlyph()}</span>`:nothing}
+      ${this.submenuAssigned?html`<span part="submenu-icon" aria-hidden="true"
+            >${chevronIcon()}</span
+          >`:nothing}
+    `,href=this.resolvedHref,base=href!==void 0?html`<a
+            part="base"
+            href=${href}
+            target=${this.target||nothing}
+            rel=${this.resolvedRel??nothing}
+            download=${this.download!==void 0?this.download??"":nothing}
+            tabindex="-1"
+            @click=${()=>this.select()}
+          >
+            ${baseContent}
+          </a>`:html`<span part="base" @click=${()=>this.select()}>${baseContent}</span>`;return html`
+      ${base}
       <!-- Outside [part='base'] on purpose: a click inside the submenu must not read as an
            activation of the row that owns it. -->
       ${this.submenuKind==="items"?staticHtml`
@@ -59,4 +69,4 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
             name="submenu"
             @slotchange=${this.onSubmenuSlotChange}
           ></slot>`}
-    `}}__decorate([property()],LyraMenuItem.prototype,"value",void 0),__decorate([property({reflect:!0})],LyraMenuItem.prototype,"size",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraMenuItem.prototype,"disabled",void 0),__decorate([property({reflect:!0})],LyraMenuItem.prototype,"variant",void 0),__decorate([property({reflect:!0})],LyraMenuItem.prototype,"type",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraMenuItem.prototype,"checked",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraMenuItem.prototype,"loading",void 0),__decorate([state()],LyraMenuItem.prototype,"hasIconSlot",void 0),__decorate([state()],LyraMenuItem.prototype,"hasDetailsSlot",void 0),__decorate([state()],LyraMenuItem.prototype,"hasSuffixSlot",void 0),__decorate([state()],LyraMenuItem.prototype,"submenuAssigned",void 0),__decorate([state()],LyraMenuItem.prototype,"submenuExpanded",void 0),__decorate([state()],LyraMenuItem.prototype,"submenuKind",void 0),__decorate([state()],LyraMenuItem.prototype,"slottedLabel",void 0);export{LyraMenuItem};
+    `}}__decorate([property()],LyraMenuItem.prototype,"value",void 0),__decorate([property({reflect:!0})],LyraMenuItem.prototype,"size",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraMenuItem.prototype,"disabled",void 0),__decorate([property({reflect:!0})],LyraMenuItem.prototype,"variant",void 0),__decorate([property({reflect:!0})],LyraMenuItem.prototype,"type",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraMenuItem.prototype,"checked",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraMenuItem.prototype,"loading",void 0),__decorate([property({reflect:!0})],LyraMenuItem.prototype,"href",void 0),__decorate([property()],LyraMenuItem.prototype,"target",void 0),__decorate([property()],LyraMenuItem.prototype,"rel",void 0),__decorate([property()],LyraMenuItem.prototype,"download",void 0),__decorate([state()],LyraMenuItem.prototype,"hasIconSlot",void 0),__decorate([state()],LyraMenuItem.prototype,"hasDetailsSlot",void 0),__decorate([state()],LyraMenuItem.prototype,"hasSuffixSlot",void 0),__decorate([state()],LyraMenuItem.prototype,"submenuAssigned",void 0),__decorate([state()],LyraMenuItem.prototype,"submenuExpanded",void 0),__decorate([state()],LyraMenuItem.prototype,"submenuKind",void 0),__decorate([state()],LyraMenuItem.prototype,"slottedLabel",void 0);export{LyraMenuItem};

package/dist/components/layout/menu/menu-item.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{--_lr-menu-item-submenu-translation:calc(var(--submenu-offset,calc(-1 * var(--lr-size-2px))) - var(--lr-size-4px));border-radius:var(--lr-menu-item-radius,var(--lr-form-control-radius));outline:none;display:block}:host(:focus-visible) [part=base]{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-width))}[part=base]{box-sizing:border-box;align-items:center;gap:var(--lr-menu-item-gap,var(--lr-space-xs));min-block-size:max(var(--lr-form-control-height), var(--lr-size-24px));padding-block:var(--lr-form-control-padding-block);padding-inline:var(--lr-form-control-padding-inline);border-radius:var(--lr-menu-item-radius,var(--lr-form-control-radius));cursor:pointer;font:inherit;font-size:var(--lr-form-control-font-size);color:inherit;line-height:var(--lr-line-height-snug);display:flex}[part=base]:hover{background:var(--lr-color-brand-quiet)}[part=base]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}:host([disabled]) [part=base],:host([loading]) [part=base]{opacity:var(--lr-opacity-disabled);cursor:not-allowed}:host([disabled]) [part=base]:hover,:host([loading]) [part=base]:hover,:host([disabled]) [part=base]:active,:host([loading]) [part=base]:active{background:0 0}:host([variant=danger]) [part=base]{color:var(--lr-menu-item-danger-color,var(--lr-color-danger))}:host([variant=danger]:not([disabled]):not([loading])) [part=base]:hover{background:var(--lr-menu-item-danger-hover-bg,var(--lr-color-danger-quiet))}:host([variant=danger]:not([disabled]):not([loading])) [part=base]:active{background:var(--lr-menu-item-danger-active-bg,color-mix(in oklab, var(--lr-color-danger-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)))}[part~=icon]{line-height:var(--lr-line-height-none);flex:none;justify-content:center;align-items:center;display:inline-flex}[part~=icon][hidden]{display:none}[part=label]{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}[part=details],[part=suffix]{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;max-inline-size:50%;color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-sm);unicode-bidi:plaintext;flex:0 auto;overflow:hidden}[part=details] ::slotted(*),[part=suffix] ::slotted(*){text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}[part=details][hidden],[part=suffix][hidden]{display:none}[part~=spinner]{color:var(--lr-color-text-quiet);animation:lr-menu-item-spin var(--lr-transition-ambient) linear infinite;flex:none;display:inline-flex}@keyframes lr-menu-item-spin{to{transform:rotate(360deg)}}[part=checkmark]{color:var(--lr-color-brand);flex:none}[part=submenu-icon]{color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-sm);line-height:var(--lr-line-height-none);flex:none;justify-content:center;align-items:center;margin-inline-start:auto;display:inline-flex}:host(:dir(rtl)) [part=submenu-icon]{transform:scaleX(-1)}:host(:dir(rtl)){--_lr-menu-item-submenu-translation:calc(var(--lr-size-4px) - var(--submenu-offset,calc(-1 * var(--lr-size-2px))))}[part=submenu]{display:contents}@media (prefers-reduced-motion:reduce){[part~=spinner]{animation:none}}`;export{styles};
+import{css}from"lit";const styles=css`:host{--_lr-menu-item-submenu-translation:calc(var(--submenu-offset,calc(-1 * var(--lr-size-2px))) - var(--lr-size-4px));border-radius:var(--lr-menu-item-radius,var(--lr-form-control-radius));outline:none;display:block}:host(:focus-visible) [part=base]{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(-1 * var(--lr-focus-ring-width))}[part=base]{box-sizing:border-box;align-items:center;gap:var(--lr-menu-item-gap,var(--lr-space-xs));min-block-size:max(var(--lr-form-control-height), var(--lr-size-24px));padding-block:var(--lr-form-control-padding-block);padding-inline:var(--lr-form-control-padding-inline);border-radius:var(--lr-menu-item-radius,var(--lr-form-control-radius));cursor:pointer;font:inherit;font-size:var(--lr-form-control-font-size);color:inherit;line-height:var(--lr-line-height-snug);text-decoration:none;display:flex}[part=base]:hover{background:var(--lr-color-brand-quiet)}[part=base]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active))}:host([disabled]) [part=base],:host([loading]) [part=base]{opacity:var(--lr-opacity-disabled);cursor:not-allowed}:host([disabled]) [part=base]:hover,:host([loading]) [part=base]:hover,:host([disabled]) [part=base]:active,:host([loading]) [part=base]:active{background:0 0}:host([variant=danger]) [part=base]{color:var(--lr-menu-item-danger-color,var(--lr-color-danger))}:host([variant=danger]:not([disabled]):not([loading])) [part=base]:hover{background:var(--lr-menu-item-danger-hover-bg,var(--lr-color-danger-quiet))}:host([variant=danger]:not([disabled]):not([loading])) [part=base]:active{background:var(--lr-menu-item-danger-active-bg,color-mix(in oklab, var(--lr-color-danger-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)))}[part~=icon]{line-height:var(--lr-line-height-none);flex:none;justify-content:center;align-items:center;display:inline-flex}[part~=icon][hidden]{display:none}[part=label]{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-inline-size:0;overflow:hidden}[part=details],[part=suffix]{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;max-inline-size:50%;color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-sm);unicode-bidi:plaintext;flex:0 auto;overflow:hidden}[part=details] ::slotted(*),[part=suffix] ::slotted(*){text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}[part=details][hidden],[part=suffix][hidden]{display:none}[part~=spinner]{color:var(--lr-color-text-quiet);animation:lr-menu-item-spin var(--lr-transition-ambient) linear infinite;flex:none;display:inline-flex}@keyframes lr-menu-item-spin{to{transform:rotate(360deg)}}[part=checkmark]{color:var(--lr-color-brand);flex:none}[part=submenu-icon]{color:var(--lr-color-text-quiet);font-size:var(--lr-font-size-sm);line-height:var(--lr-line-height-none);flex:none;justify-content:center;align-items:center;margin-inline-start:auto;display:inline-flex}:host(:dir(rtl)) [part=submenu-icon]{transform:scaleX(-1)}:host(:dir(rtl)){--_lr-menu-item-submenu-translation:calc(var(--lr-size-4px) - var(--submenu-offset,calc(-1 * var(--lr-size-2px))))}[part=submenu]{display:contents}@media (prefers-reduced-motion:reduce){[part~=spinner]{animation:none}}`;export{styles};