@aceshooting/lyra-ui 14.3.2 → 15.0.0

package/dist/components/layout/menu/menu.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},_a;import{html}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{deferredPlaceReady as place,waitForDeferredPlacement}from"../../../internal/anchored-overlay-runtime.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{collectFocusableElements,composedContains}from"../../../internal/overlay-manager.js";import{styles}from"./menu.styles.js";import{menuItemOwner,submenuPanelController}from"./menu-shared.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{tag}from"../../../internal/prefix.js";import{activeElementIn}from"../../../internal/active-element.js";import"./menu-item.class.js";import{LYRA_DEFAULT_menuLabel}from"../../../internal/default-strings.generated.js";const SUBMENU_PLACEMENT="right-start",SUBMENU_OPEN_DELAY=150,SUBMENU_CLOSE_DELAY=300;function isLyraMenuItemElement(value){return isHtmlElement(value)?value.localName===tag("menu-item")||value.localName===tag("dropdown-item"):!1}function isLyraMenuElement(value){return isHtmlElement(value)&&value.localName===tag("menu")}function isUsableActiveElement(value){if(typeof value!="object"&&typeof value!="function"||value===null)return!1;try{const candidate=value;if(candidate.nodeType!==1)return!1;const NodeConstructor=candidate.ownerDocument?.defaultView?.Node??(typeof Node>"u"?void 0:Node);return NodeConstructor?(NodeConstructor.prototype.getRootNode.call(candidate),!0):!1}catch{return!1}}function safeDeepActiveElement(root){const initial=activeElementIn(root);if(!isUsableActiveElement(initial))return null;let active=initial;for(;;){let shadowRoot;try{shadowRoot=active.shadowRoot}catch{return null}if(!shadowRoot)return active;const nested=activeElementIn(shadowRoot);if(nested===null)return active;if(!isUsableActiveElement(nested))return null;active=nested}}class LyraMenu extends LyraElement{constructor(){super(...arguments),this.presentationOpen=!1,this.submenuAnchor=null,this.submenuStateChange=null,this.dropdownContained=!1,this.dropdownOwner=null,this._dropdownOpen=!1,this.dropdownRendersMenuRole=!1,this.dropdownStayOpenOnSelect=!1,this.items=[],this.activeIndex=-1,this.presentationPositioned=!1,this.pendingFocus="first",this.listId=nextId("menu-list"),this.owningMenu={activate:item=>this.onOwnedItemSelect(item)},this.typeAheadBuffer="",this[_a]=this.createSubmenuController(),this.onRegionSlotChange=()=>{this.syncRegionState()},this.onDocPointer=e=>{const path=e.composedPath();path.includes(this)||this.submenuAnchor&&path.includes(this.submenuAnchor)||this.closePresentation()},this.onItemsSlotChange=e=>{this.syncItemsFromSlot(e.target)},this.onItemStateChange=event=>{event?.stopPropagation();const navigable=this.items.filter(item=>this.isNavigable(item));if(this.activeIndex>=0&&!this.isNavigable(this.items[this.activeIndex])){const current=this.activeIndex,displaced=this.items[current],focused=safeDeepActiveElement(this.ownerDocument),displacedHadFocus=focused===null||focused===this.ownerDocument.body||focused===displaced||composedContains(displaced,focused),next=navigable.find(item=>this.items.indexOf(item)>current)??navigable.find(item=>this.items.indexOf(item)<current);next?this.setActiveItem(next,displacedHadFocus):(this.activeIndex=-1,this.applyRovingTabIndex(),displacedHadFocus&&this.rehomeZeroSurvivorFocus());return}this.applyRovingTabIndex()},this.onListFocusIn=e=>{const target=e.target;if(!isLyraMenuItemElement(target))return;const index=this.items.indexOf(target);index===-1||index===this.activeIndex||(this.activeIndex=index,this.applyRovingTabIndex(),this.closeSubmenus(target))},this.onListKeyDown=e=>{if(this.isForeignEvent(e))return;const isItemTarget=isLyraMenuItemElement(e.target);if(e.key==="Escape"&&isItemTarget&&!this.hasStandalonePresentation){e.preventDefault(),this.closePresentation({focusTrigger:!0});return}if(!isItemTarget)return;const navigable=this.items.filter(i=>this.isNavigable(i)),current=this.activeIndex>=0?this.items[this.activeIndex]:void 0,currentNavIndex=current?navigable.indexOf(current):-1,intoSubmenuKey=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight";switch(e.key){case"ArrowRight":case"ArrowLeft":e.key===intoSubmenuKey?current?.hasSubmenu&&this.isNavigable(current)&&(e.preventDefault(),this.closeSubmenus(current),current.openSubmenu("first")):this.submenuAnchor&&(e.preventDefault(),this.closePresentation({focusTrigger:!0}));break;case"ArrowDown":if(e.preventDefault(),navigable.length){const next=navigable[(currentNavIndex+1+navigable.length)%navigable.length];next&&this.setActiveItem(next)}break;case"ArrowUp":if(e.preventDefault(),navigable.length){const prevIndex=currentNavIndex<=0?navigable.length-1:currentNavIndex-1,prev=navigable[prevIndex];prev&&this.setActiveItem(prev)}break;case"Home":e.preventDefault(),navigable.length&&this.setActiveItem(navigable[0]);break;case"End":e.preventDefault(),navigable.length&&this.setActiveItem(navigable[navigable.length-1]);break;case"Enter":case" ":e.preventDefault(),current?.hasSubmenu?(this.closeSubmenus(current),current.openSubmenu("first")):current?.select();break;default:e.key.length===1&&!e.altKey&&!e.ctrlKey&&!e.metaKey&&this.typeAhead(e.key);return}},this.onPopupPointerOver=e=>{if(!this.interactionOpen)return;const hovered=this.ownItemFromEvent(e);this.clearOwnedTimeout(this.submenuOpenTimer),this.submenuOpenTimer=void 0;const opened=this.openSubmenuItem();opened&&opened===hovered?(this.clearOwnedTimeout(this.submenuCloseTimer),this.submenuCloseTimer=void 0):opened&&this.scheduleSubmenuClose(opened),!(!hovered||hovered===opened||!hovered.hasSubmenu||!this.isNavigable(hovered))&&(this.submenuOpenTimer=this.scheduleOwnedTimeout(()=>{this.submenuOpenTimer=void 0,!(!this.interactionOpen||!this.items.includes(hovered))&&(this.closeSubmenus(hovered),hovered.openSubmenu("none"))},SUBMENU_OPEN_DELAY))},this.onPopupPointerLeave=()=>{this.clearOwnedTimeout(this.submenuOpenTimer),this.submenuOpenTimer=void 0;const opened=this.openSubmenuItem();opened&&this.scheduleSubmenuClose(opened)},this.onNestedSelect=e=>{if(e.target===this)return;const event=e;this.dropdownStayOpenOnSelect&&event.preventDefault(),queueMicrotask(()=>{event.defaultPrevented||this.dismissAfterSelection(!0)})},this.onPopupKeyDown=e=>{const listEl=this.popupPart("list");if(e.key==="Escape"){if(listEl&&e.composedPath().includes(listEl)||this.hasStandalonePresentation)return;e.preventDefault(),this.closePresentation({focusTrigger:!0});return}e.key==="Tab"&&this.tabWouldLeavePopup(e)&&this.closePresentation()}}static{_a=submenuPanelController}static{this.defaultStrings={...super.defaultStrings,menuLabel:LYRA_DEFAULT_menuLabel}}static{this.immutableEventDetails=Object.freeze(["lr-select"])}static{this.identityEventDetailProperties=Object.freeze({"lr-select":Object.freeze(["item"])})}static{this.styles=[LyraElement.styles,styles]}get dropdownOpen(){return this._dropdownOpen}set dropdownOpen(next){const normalized=!!next;if(normalized===this._dropdownOpen)return;const old=this._dropdownOpen;this._dropdownOpen=normalized,this.presentationOpen=normalized,this.requestUpdate("dropdownOpen",old)}createSubmenuController(){const menu=this;return{get open(){return menu.submenuAnchor!==null&&menu.presentationOpen},attach(anchor,onStateChange){menu.submenuAnchor&&menu.submenuAnchor!==anchor&&menu.closePresentation(),menu.submenuAnchor=anchor,menu.submenuStateChange=onStateChange,menu.syncPresentationState(),menu.requestUpdate()},detach(anchor){menu.submenuAnchor===anchor&&(menu.closePresentation(),menu.submenuAnchor=null,menu.submenuStateChange=null,menu.cleanup?.(),menu.cleanup=void 0,menu.syncPresentationState(),menu.requestUpdate())},async show(focus="first"){menu.submenuAnchor&&(menu.openPresentation(focus),await menu.updateComplete,await menu.focusAfterPlacement(focus))},async hide(options){menu.closePresentation(options),await menu.updateComplete}}}connectedCallback(){if(super.connectedCallback(),this.hasUpdated){const slot=this.renderRoot.querySelector("slot:not([name])");slot&&this.syncItemsFromSlot(slot)}}firstUpdated(changed){super.firstUpdated(changed),this.syncRegionState(),this.syncPresentationState()}get hasStandalonePresentation(){return!this.dropdownContained&&!this.submenuAnchor}get interactionOpen(){return this.hasStandalonePresentation||this.presentationOpen}syncPresentationState(){const standalone=this.hasStandalonePresentation;if(this.toggleAttribute("data-inline",standalone),this.toggleAttribute("data-submenu",this.submenuAnchor!==null),this.toggleAttribute("data-contained",this.dropdownContained),standalone){const active=this.activeIndex>=0?this.items[this.activeIndex]:void 0;if(!active||!this.isNavigable(active)){const first=this.items.find(item=>this.isNavigable(item));this.activeIndex=first?this.items.indexOf(first):-1}}else this.presentationOpen||(this.activeIndex=-1);this.applyRovingTabIndex()}syncRegionState(){const assigned=selector=>this.renderRoot.querySelector(selector)?.assignedElements({flatten:!0}).length??0;this.toggleAttribute("data-has-header",assigned('slot[name="header"]')>0),this.toggleAttribute("data-has-footer",assigned('slot[name="footer"]')>0),this.toggleAttribute("data-list-empty",assigned("slot:not([name])")===0)}updated(changed){super.updated(changed),(changed.has("presentationOpen")||changed.has("dropdownOpen")||changed.has("dropdownContained"))&&(this.cleanup?.(),this.cleanup=void 0,this.presentationPositioned=!1,this.presentationOpen?this.submenuAnchor?(this.bindDocumentPointer(),this.reposition()):(this.unbindDocumentPointer(),this.presentationPositioned=!0,this.focusRoving(this.pendingFocus)):(this.unbindDocumentPointer(),this.resetTypeAhead(),this.activeIndex=-1,this.applyRovingTabIndex(),this.clearSubmenuTimers(),this.closeSubmenus())),changed.has("dropdownContained")&&this.syncPresentationState(),changed.has("dropdownSize")&&this.applyDropdownSize()}reposition(){this.cleanup?.(),this.cleanup=void 0,this.presentationPositioned=!1;const popup=this.renderRoot.querySelector(".submenu-surface");if(this.submenuAnchor&&popup){const placement=rtlAwarePlacement(SUBMENU_PLACEMENT,this);this.cleanup=place(this.submenuAnchor,popup,{placement})}}async focusAfterPlacement(focus){if(!this.presentationOpen||!this.submenuAnchor)return;const positioned=this.cleanup!==void 0&&(this.presentationPositioned||await waitForDeferredPlacement(()=>this.cleanup));if(!(!this.presentationOpen||!this.submenuAnchor)){if(!positioned){this.closePresentation(),await this.updateComplete;return}this.presentationPositioned=!0,this.focusRoving(focus)}}disconnectedCallback(){super.disconnectedCallback(),this.cleanup?.(),this.cleanup=void 0,this.presentationPositioned=!1,this.clearOwnedTimeout(this.typeAheadTimer),this.typeAheadTimer=void 0,this.typeAheadBuffer="",this.clearSubmenuTimers(),this.itemStateObserver?.disconnect(),this.itemStateObserver=void 0,this.unbindDocumentPointer();for(const item of this.items)this.releaseItemOwner(item);this._dropdownOpen=!1,this.presentationOpen=!1,this.submenuStateChange?.(!1)}bindDocumentPointer(){const owner=this.ownerDocument;this.pointerDocument!==owner&&(this.unbindDocumentPointer(),owner.addEventListener("pointerdown",this.onDocPointer),this.pointerDocument=owner)}unbindDocumentPointer(){this.pointerDocument?.removeEventListener("pointerdown",this.onDocPointer),this.pointerDocument=void 0}scheduleOwnedTimeout(callback,delay){const owner=this.ownerDocument.defaultView;if(owner)return{owner,handle:owner.setTimeout(callback,delay)}}clearOwnedTimeout(timer){timer&&timer.owner.clearTimeout(timer.handle)}focusContained(focus="first"){if(this.dropdownContained&&this.dropdownOwner)if(this.dropdownOwner.open)this.pendingFocus=focus,this.focusRoving(focus);else{const transition=this.dropdownOwner.show();this.dropdownOwner.open&&(this.pendingFocus=focus)}}openPresentation(focus="first"){if(this.dropdownContained&&this.dropdownOwner){this.focusContained(focus);return}this.pendingFocus=focus,this.presentationOpen?(!this.submenuAnchor||this.presentationPositioned)&&this.focusRoving(focus):(this.presentationOpen=!0,this.submenuStateChange?.(!0))}closePresentation(options){if(this.dropdownContained&&this.dropdownOwner){this.dropdownOwner.hide(options);return}this.presentationOpen&&(this.presentationOpen=!1,this.submenuStateChange?.(!1),options?.focusTrigger&&this.submenuAnchor&&resolveAccessibleTrigger(this.submenuAnchor).focus())}syncItemsFromSlot(slot){this.itemStateObserver?.disconnect();const previousItems=this.items,previouslyActive=this.activeIndex>=0?this.items[this.activeIndex]:void 0,focusedBefore=safeDeepActiveElement(this.ownerDocument),activeItemLostFocus=!!previouslyActive&&(focusedBefore===null||focusedBefore===this.ownerDocument.body||focusedBefore===previouslyActive||composedContains(previouslyActive,focusedBefore));this.items=slot.assignedElements({flatten:!0}).filter(isLyraMenuItemElement);for(const item of previousItems)this.items.includes(item)||this.releaseItemOwner(item);for(const item of this.items)this.acquireItemOwner(item);this.applyDropdownSize();const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;if(MutationObserverCtor){const owner=this.ownerDocument;let observer;observer=new MutationObserverCtor(()=>{this.itemStateObserver!==observer||this.ownerDocument!==owner||this.onItemStateChange()}),this.itemStateObserver=observer;for(const item of this.items)this.itemStateObserver.observe(item,{attributes:!0,attributeFilter:["disabled","hidden","aria-hidden","inert"]})}if(this.activeIndex=previouslyActive?this.items.indexOf(previouslyActive):-1,this.syncPresentationState(),this.syncRegionState(),this.interactionOpen)if(this.activeIndex===-1){const successor=this.items.find(item=>this.isNavigable(item));previouslyActive&&successor?this.setActiveItem(successor,activeItemLostFocus):this.focusRoving(this.pendingFocus),activeItemLostFocus&&!this.items.some(item=>this.isNavigable(item))&&this.rehomeZeroSurvivorFocus()}else{const active=activeElementIn(this.ownerDocument);!(isUsableActiveElement(active)&&this.contains(active))&&activeItemLostFocus&&this.items[this.activeIndex].focus()}}acquireItemOwner(item){item[menuItemOwner]?.(this.owningMenu)}releaseItemOwner(item){item[menuItemOwner]?.(null,this.owningMenu)}isNavigable(item){return!item.interactionDisabled&&!item.hidden&&item.getAttribute("aria-hidden")!=="true"&&!item.inert&&!item.closest("[inert]")}applyDropdownSize(){if(this.dropdownSize)for(const item of this.items)item.size=this.dropdownSize}rehomeZeroSurvivorFocus(){if(this.dropdownContained&&this.dropdownOwner){this.dropdownOwner.hide({focusTrigger:!0});return}if(this.submenuAnchor){this.closePresentation({focusTrigger:!0});return}const list=this.renderRoot.querySelector('[part~="list"]');list&&(list.tabIndex=-1,list.focus({preventScroll:!0}))}onOwnedItemSelect(item){if(!isLyraMenuItemElement(item)||!this.items.includes(item))return;!this.emit("lr-select",{item},{cancelable:!0}).defaultPrevented&&!this.dropdownStayOpenOnSelect&&this.dismissAfterSelection(!0)}dismissAfterSelection(focusTrigger){this.closeSubmenus(),this.dropdownContained?this.dropdownOwner&&this.dropdownOwner.hide({focusTrigger}):this.submenuAnchor&&this.closePresentation({focusTrigger})}applyRovingTabIndex(){this.items.forEach((item,i)=>{item.tabIndex=i===this.activeIndex?0:-1})}focusRoving(which){if(which==="none")return;const navigable=this.items.filter(i=>this.isNavigable(i));if(!navigable.length)return;const item=which==="first"?navigable[0]:navigable[navigable.length-1];item&&this.setActiveItem(item)}setActiveItem(item,moveFocus=!0){this.activeIndex=this.items.indexOf(item),this.applyRovingTabIndex(),this.closeSubmenus(item),moveFocus&&item.focus()}closeSubmenus(keep){for(const item of this.items)item!==keep&&item.submenuOpen&&item.closeSubmenu()}openSubmenuItem(){return this.items.find(item=>item.submenuOpen)}clearSubmenuTimers(){this.clearOwnedTimeout(this.submenuOpenTimer),this.clearOwnedTimeout(this.submenuCloseTimer),this.submenuOpenTimer=void 0,this.submenuCloseTimer=void 0}ownItemFromEvent(e){let owner;for(const node of e.composedPath()){if(node===this)break;isLyraMenuItemElement(node)&&(owner=node)}return owner}isForeignEvent(e){for(const node of e.composedPath()){if(node===this)return!1;if(isLyraMenuElement(node))return!0}return!1}scheduleSubmenuClose(item){this.submenuCloseTimer||(this.submenuCloseTimer=this.scheduleOwnedTimeout(()=>{this.submenuCloseTimer=void 0,item.submenuOpen&&(composedContains(item,safeDeepActiveElement(this.ownerDocument))||item.closeSubmenu())},SUBMENU_CLOSE_DELAY))}popupPart(name){return this.renderRoot.querySelector(`[part="${name}"]`)}tabWouldLeavePopup(e){const header=this.popupPart("header"),footer=this.popupPart("footer"),listEl=this.popupPart("list"),backwards=e.shiftKey,active=safeDeepActiveElement(this.ownerDocument),headerStops=header?collectFocusableElements(header):[],footerStops=footer?collectFocusableElements(footer):[],listStops=listEl?collectFocusableElements(listEl):[],hasNeighbor=stops=>{const index=active?stops.indexOf(active):-1;return index===-1?!1:backwards?index>0:index<stops.length-1},path=e.composedPath();return footer&&path.includes(footer)?hasNeighbor(footerStops)?!1:backwards?listStops.length===0&&headerStops.length===0:!0:header&&path.includes(header)?hasNeighbor(headerStops)?!1:backwards?!0:listStops.length===0&&footerStops.length===0:!isLyraMenuItemElement(e.target)&&hasNeighbor(listStops)?!1:backwards?headerStops.length===0:footerStops.length===0}typeAhead(char){this.clearOwnedTimeout(this.typeAheadTimer),this.typeAheadBuffer+=char.toLocaleLowerCase(this.effectiveLocale),this.typeAheadTimer=this.scheduleOwnedTimeout(()=>{this.typeAheadBuffer=""},500);const navigable=this.items.filter(i=>this.isNavigable(i));if(!navigable.length)return;const current=this.activeIndex>=0?this.items[this.activeIndex]:void 0,currentIndex=current?navigable.indexOf(current):-1,n=navigable.length;for(let step=1;step<=n;step++){const candidate=navigable[(currentIndex+step+n)%n];if(candidate&&this.itemText(candidate).toLocaleLowerCase(this.effectiveLocale).startsWith(this.typeAheadBuffer)){this.setActiveItem(candidate);return}}}resetTypeAhead(){this.clearOwnedTimeout(this.typeAheadTimer),this.typeAheadTimer=void 0,this.typeAheadBuffer=""}itemText(item){return composedAccessibilityText(item).trim()}get effectiveLabel(){const hostLabel=this.getAttribute("aria-label");return hostLabel!==null?hostLabel:this.label!==void 0?this.label:this.dropdownLabel!==void 0?this.dropdownLabel:this.localize("menuLabel")}renderContents(){return 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},_a;import{html}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{deferredPlaceReady as place,waitForDeferredPlacement}from"../../../internal/anchored-overlay-runtime.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{collectFocusableElements,composedContains}from"../../../internal/overlay-manager.js";import{styles}from"./menu.styles.js";import{menuItemOwner,submenuPanelController}from"./menu-shared.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{tag}from"../../../internal/prefix.js";import{activeElementIn}from"../../../internal/active-element.js";import{syncAriaDescribedByElements}from"../../../internal/aria-reflection.js";import"./menu-item.class.js";import{LYRA_DEFAULT_menuLabel}from"../../../internal/default-strings.generated.js";const SUBMENU_PLACEMENT="right-start",SUBMENU_OPEN_DELAY=150,SUBMENU_CLOSE_DELAY=300;function isLyraMenuItemElement(value){return isHtmlElement(value)?value.localName===tag("menu-item")||value.localName===tag("dropdown-item"):!1}function isLyraMenuElement(value){return isHtmlElement(value)&&value.localName===tag("menu")}function isUsableActiveElement(value){if(typeof value!="object"&&typeof value!="function"||value===null)return!1;try{const candidate=value;if(candidate.nodeType!==1)return!1;const NodeConstructor=candidate.ownerDocument?.defaultView?.Node??(typeof Node>"u"?void 0:Node);return NodeConstructor?(NodeConstructor.prototype.getRootNode.call(candidate),!0):!1}catch{return!1}}function safeDeepActiveElement(root){const initial=activeElementIn(root);if(!isUsableActiveElement(initial))return null;let active=initial;for(;;){let shadowRoot;try{shadowRoot=active.shadowRoot}catch{return null}if(!shadowRoot)return active;const nested=activeElementIn(shadowRoot);if(nested===null)return active;if(!isUsableActiveElement(nested))return null;active=nested}}class LyraMenu extends LyraElement{constructor(){super(...arguments),this.presentationOpen=!1,this.submenuAnchor=null,this.submenuStateChange=null,this.dropdownContained=!1,this.dropdownOwner=null,this._dropdownOpen=!1,this.dropdownRendersMenuRole=!1,this.dropdownStayOpenOnSelect=!1,this.items=[],this.activeIndex=-1,this.presentationPositioned=!1,this.pendingFocus="first",this.listId=nextId("menu-list"),this.owningMenu={activate:item=>this.onOwnedItemSelect(item)},this.typeAheadBuffer="",this[_a]=this.createSubmenuController(),this.onRegionSlotChange=()=>{this.syncRegionState()},this.onDocPointer=e=>{const path=e.composedPath();path.includes(this)||this.submenuAnchor&&path.includes(this.submenuAnchor)||this.closePresentation()},this.onItemsSlotChange=e=>{this.syncItemsFromSlot(e.target)},this.onItemStateChange=event=>{event?.stopPropagation();const navigable=this.items.filter(item=>this.isNavigable(item));if(this.activeIndex>=0&&!this.isNavigable(this.items[this.activeIndex])){const current=this.activeIndex,displaced=this.items[current],focused=safeDeepActiveElement(this.ownerDocument),displacedHadFocus=focused===null||focused===this.ownerDocument.body||focused===displaced||composedContains(displaced,focused),next=navigable.find(item=>this.items.indexOf(item)>current)??navigable.find(item=>this.items.indexOf(item)<current);next?this.setActiveItem(next,displacedHadFocus):(this.activeIndex=-1,this.applyRovingTabIndex(),displacedHadFocus&&this.rehomeZeroSurvivorFocus());return}this.applyRovingTabIndex()},this.onListFocusIn=e=>{const target=e.target;if(!isLyraMenuItemElement(target))return;const index=this.items.indexOf(target);index===-1||index===this.activeIndex||(this.activeIndex=index,this.applyRovingTabIndex(),this.closeSubmenus(target))},this.onListKeyDown=e=>{if(this.isForeignEvent(e))return;const isItemTarget=isLyraMenuItemElement(e.target);if(e.key==="Escape"&&isItemTarget&&!this.hasStandalonePresentation){e.preventDefault(),this.closePresentation({focusTrigger:!0});return}if(!isItemTarget)return;const navigable=this.items.filter(i=>this.isNavigable(i)),current=this.activeIndex>=0?this.items[this.activeIndex]:void 0,currentNavIndex=current?navigable.indexOf(current):-1,intoSubmenuKey=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight";switch(e.key){case"ArrowRight":case"ArrowLeft":e.key===intoSubmenuKey?current?.hasSubmenu&&this.isNavigable(current)&&(e.preventDefault(),this.closeSubmenus(current),current.openSubmenu("first")):this.submenuAnchor&&(e.preventDefault(),this.closePresentation({focusTrigger:!0}));break;case"ArrowDown":if(e.preventDefault(),navigable.length){const next=navigable[(currentNavIndex+1+navigable.length)%navigable.length];next&&this.setActiveItem(next)}break;case"ArrowUp":if(e.preventDefault(),navigable.length){const prevIndex=currentNavIndex<=0?navigable.length-1:currentNavIndex-1,prev=navigable[prevIndex];prev&&this.setActiveItem(prev)}break;case"Home":e.preventDefault(),navigable.length&&this.setActiveItem(navigable[0]);break;case"End":e.preventDefault(),navigable.length&&this.setActiveItem(navigable[navigable.length-1]);break;case"Enter":case" ":e.preventDefault(),current?.hasSubmenu?(this.closeSubmenus(current),current.openSubmenu("first")):current?.isLinkItem?current.click():current?.select();break;default:e.key.length===1&&!e.altKey&&!e.ctrlKey&&!e.metaKey&&this.typeAhead(e.key);return}},this.onPopupPointerOver=e=>{if(!this.interactionOpen)return;const hovered=this.ownItemFromEvent(e);this.clearOwnedTimeout(this.submenuOpenTimer),this.submenuOpenTimer=void 0;const opened=this.openSubmenuItem();opened&&opened===hovered?(this.clearOwnedTimeout(this.submenuCloseTimer),this.submenuCloseTimer=void 0):opened&&this.scheduleSubmenuClose(opened),!(!hovered||hovered===opened||!hovered.hasSubmenu||!this.isNavigable(hovered))&&(this.submenuOpenTimer=this.scheduleOwnedTimeout(()=>{this.submenuOpenTimer=void 0,!(!this.interactionOpen||!this.items.includes(hovered))&&(this.closeSubmenus(hovered),hovered.openSubmenu("none"))},SUBMENU_OPEN_DELAY))},this.onPopupPointerLeave=()=>{this.clearOwnedTimeout(this.submenuOpenTimer),this.submenuOpenTimer=void 0;const opened=this.openSubmenuItem();opened&&this.scheduleSubmenuClose(opened)},this.onNestedSelect=e=>{if(e.target===this)return;const event=e;this.dropdownStayOpenOnSelect&&event.preventDefault(),queueMicrotask(()=>{event.defaultPrevented||this.dismissAfterSelection(!0)})},this.onPopupKeyDown=e=>{const listEl=this.popupPart("list");if(e.key==="Escape"){if(listEl&&e.composedPath().includes(listEl)||this.hasStandalonePresentation)return;e.preventDefault(),this.closePresentation({focusTrigger:!0});return}e.key==="Tab"&&this.tabWouldLeavePopup(e)&&this.closePresentation()}}static{_a=submenuPanelController}static{this.defaultStrings={...super.defaultStrings,menuLabel:LYRA_DEFAULT_menuLabel}}static{this.immutableEventDetails=Object.freeze(["lr-select"])}static{this.identityEventDetailProperties=Object.freeze({"lr-select":Object.freeze(["item"])})}static{this.styles=[LyraElement.styles,styles]}get dropdownOpen(){return this._dropdownOpen}set dropdownOpen(next){const normalized=!!next;if(normalized===this._dropdownOpen)return;const old=this._dropdownOpen;this._dropdownOpen=normalized,this.presentationOpen=normalized,this.requestUpdate("dropdownOpen",old)}createSubmenuController(){const menu=this;return{get open(){return menu.submenuAnchor!==null&&menu.presentationOpen},attach(anchor,onStateChange){menu.submenuAnchor&&menu.submenuAnchor!==anchor&&menu.closePresentation(),menu.submenuAnchor=anchor,menu.submenuStateChange=onStateChange,menu.syncPresentationState(),menu.requestUpdate()},detach(anchor){menu.submenuAnchor===anchor&&(menu.closePresentation(),menu.submenuAnchor=null,menu.submenuStateChange=null,menu.cleanup?.(),menu.cleanup=void 0,menu.syncPresentationState(),menu.requestUpdate())},async show(focus="first"){menu.submenuAnchor&&(menu.openPresentation(focus),await menu.updateComplete,await menu.focusAfterPlacement(focus))},async hide(options){menu.closePresentation(options),await menu.updateComplete}}}connectedCallback(){if(super.connectedCallback(),this.hasUpdated){const slot=this.renderRoot.querySelector("slot:not([name])");slot&&this.syncItemsFromSlot(slot)}}firstUpdated(changed){super.firstUpdated(changed),this.syncRegionState(),this.syncPresentationState()}get hasStandalonePresentation(){return!this.dropdownContained&&!this.submenuAnchor}get interactionOpen(){return this.hasStandalonePresentation||this.presentationOpen}syncPresentationState(){const standalone=this.hasStandalonePresentation;if(this.toggleAttribute("data-inline",standalone),this.toggleAttribute("data-submenu",this.submenuAnchor!==null),this.toggleAttribute("data-contained",this.dropdownContained),standalone){const active=this.activeIndex>=0?this.items[this.activeIndex]:void 0;if(!active||!this.isNavigable(active)){const first=this.items.find(item=>this.isNavigable(item));this.activeIndex=first?this.items.indexOf(first):-1}}else this.presentationOpen||(this.activeIndex=-1);this.applyRovingTabIndex()}syncRegionState(){const assigned=selector=>this.renderRoot.querySelector(selector)?.assignedElements({flatten:!0}).length??0;this.toggleAttribute("data-has-header",assigned('slot[name="header"]')>0),this.toggleAttribute("data-has-footer",assigned('slot[name="footer"]')>0),this.toggleAttribute("data-list-empty",assigned("slot:not([name])")===0)}updated(changed){super.updated(changed);const list=this.renderRoot.querySelector('[part~="list"]')??void 0;syncAriaDescribedByElements(this,list,this.getAttribute("aria-describedby")),(changed.has("presentationOpen")||changed.has("dropdownOpen")||changed.has("dropdownContained"))&&(this.cleanup?.(),this.cleanup=void 0,this.presentationPositioned=!1,this.presentationOpen?this.submenuAnchor?(this.bindDocumentPointer(),this.reposition()):(this.unbindDocumentPointer(),this.presentationPositioned=!0,this.focusRoving(this.pendingFocus)):(this.unbindDocumentPointer(),this.resetTypeAhead(),this.activeIndex=-1,this.applyRovingTabIndex(),this.clearSubmenuTimers(),this.closeSubmenus())),changed.has("dropdownContained")&&this.syncPresentationState(),changed.has("dropdownSize")&&this.applyDropdownSize()}reposition(){this.cleanup?.(),this.cleanup=void 0,this.presentationPositioned=!1;const popup=this.renderRoot.querySelector(".submenu-surface");if(this.submenuAnchor&&popup){const placement=rtlAwarePlacement(SUBMENU_PLACEMENT,this);this.cleanup=place(this.submenuAnchor,popup,{placement})}}async focusAfterPlacement(focus){if(!this.presentationOpen||!this.submenuAnchor)return;const positioned=this.cleanup!==void 0&&(this.presentationPositioned||await waitForDeferredPlacement(()=>this.cleanup));if(!(!this.presentationOpen||!this.submenuAnchor)){if(!positioned){this.closePresentation(),await this.updateComplete;return}this.presentationPositioned=!0,this.focusRoving(focus)}}disconnectedCallback(){super.disconnectedCallback(),this.cleanup?.(),this.cleanup=void 0,this.presentationPositioned=!1,this.clearOwnedTimeout(this.typeAheadTimer),this.typeAheadTimer=void 0,this.typeAheadBuffer="",this.clearSubmenuTimers(),this.itemStateObserver?.disconnect(),this.itemStateObserver=void 0,this.unbindDocumentPointer();for(const item of this.items)this.releaseItemOwner(item);this._dropdownOpen=!1,this.presentationOpen=!1,this.submenuStateChange?.(!1)}bindDocumentPointer(){const owner=this.ownerDocument;this.pointerDocument!==owner&&(this.unbindDocumentPointer(),owner.addEventListener("pointerdown",this.onDocPointer),this.pointerDocument=owner)}unbindDocumentPointer(){this.pointerDocument?.removeEventListener("pointerdown",this.onDocPointer),this.pointerDocument=void 0}scheduleOwnedTimeout(callback,delay){const owner=this.ownerDocument.defaultView;if(owner)return{owner,handle:owner.setTimeout(callback,delay)}}clearOwnedTimeout(timer){timer&&timer.owner.clearTimeout(timer.handle)}focusContained(focus="first"){if(this.dropdownContained&&this.dropdownOwner)if(this.dropdownOwner.open)this.pendingFocus=focus,this.focusRoving(focus);else{const transition=this.dropdownOwner.show();this.dropdownOwner.open&&(this.pendingFocus=focus)}}openPresentation(focus="first"){if(this.dropdownContained&&this.dropdownOwner){this.focusContained(focus);return}this.pendingFocus=focus,this.presentationOpen?(!this.submenuAnchor||this.presentationPositioned)&&this.focusRoving(focus):(this.presentationOpen=!0,this.submenuStateChange?.(!0))}closePresentation(options){if(this.dropdownContained&&this.dropdownOwner){this.dropdownOwner.hide(options);return}this.presentationOpen&&(this.presentationOpen=!1,this.submenuStateChange?.(!1),options?.focusTrigger&&this.submenuAnchor&&resolveAccessibleTrigger(this.submenuAnchor).focus())}syncItemsFromSlot(slot){this.itemStateObserver?.disconnect();const previousItems=this.items,previouslyActive=this.activeIndex>=0?this.items[this.activeIndex]:void 0,focusedBefore=safeDeepActiveElement(this.ownerDocument),activeItemLostFocus=!!previouslyActive&&(focusedBefore===null||focusedBefore===this.ownerDocument.body||focusedBefore===previouslyActive||composedContains(previouslyActive,focusedBefore));this.items=slot.assignedElements({flatten:!0}).filter(isLyraMenuItemElement);for(const item of previousItems)this.items.includes(item)||this.releaseItemOwner(item);for(const item of this.items)this.acquireItemOwner(item);this.applyDropdownSize();const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;if(MutationObserverCtor){const owner=this.ownerDocument;let observer;observer=new MutationObserverCtor(()=>{this.itemStateObserver!==observer||this.ownerDocument!==owner||this.onItemStateChange()}),this.itemStateObserver=observer;for(const item of this.items)this.itemStateObserver.observe(item,{attributes:!0,attributeFilter:["disabled","hidden","aria-hidden","inert"]})}if(this.activeIndex=previouslyActive?this.items.indexOf(previouslyActive):-1,this.syncPresentationState(),this.syncRegionState(),this.interactionOpen)if(this.activeIndex===-1){const successor=this.items.find(item=>this.isNavigable(item));previouslyActive&&successor?this.setActiveItem(successor,activeItemLostFocus):this.focusRoving(this.pendingFocus),activeItemLostFocus&&!this.items.some(item=>this.isNavigable(item))&&this.rehomeZeroSurvivorFocus()}else{const active=activeElementIn(this.ownerDocument);!(isUsableActiveElement(active)&&this.contains(active))&&activeItemLostFocus&&this.items[this.activeIndex].focus()}}acquireItemOwner(item){item[menuItemOwner]?.(this.owningMenu)}releaseItemOwner(item){item[menuItemOwner]?.(null,this.owningMenu)}isNavigable(item){return!item.interactionDisabled&&!item.hidden&&item.getAttribute("aria-hidden")!=="true"&&!item.inert&&!item.closest("[inert]")}applyDropdownSize(){if(this.dropdownSize)for(const item of this.items)item.size=this.dropdownSize}rehomeZeroSurvivorFocus(){if(this.dropdownContained&&this.dropdownOwner){this.dropdownOwner.hide({focusTrigger:!0});return}if(this.submenuAnchor){this.closePresentation({focusTrigger:!0});return}const list=this.renderRoot.querySelector('[part~="list"]');list&&(list.tabIndex=-1,list.focus({preventScroll:!0}))}onOwnedItemSelect(item){if(!isLyraMenuItemElement(item)||!this.items.includes(item))return;!this.emit("lr-select",{item},{cancelable:!0}).defaultPrevented&&!this.dropdownStayOpenOnSelect&&this.dismissAfterSelection(!0)}dismissAfterSelection(focusTrigger){this.closeSubmenus(),this.dropdownContained?this.dropdownOwner&&this.dropdownOwner.hide({focusTrigger}):this.submenuAnchor&&this.closePresentation({focusTrigger})}applyRovingTabIndex(){this.items.forEach((item,i)=>{item.tabIndex=i===this.activeIndex?0:-1})}focusRoving(which){if(which==="none")return;const navigable=this.items.filter(i=>this.isNavigable(i));if(!navigable.length)return;const item=which==="first"?navigable[0]:navigable[navigable.length-1];item&&this.setActiveItem(item)}setActiveItem(item,moveFocus=!0){this.activeIndex=this.items.indexOf(item),this.applyRovingTabIndex(),this.closeSubmenus(item),moveFocus&&item.focus()}closeSubmenus(keep){for(const item of this.items)item!==keep&&item.submenuOpen&&item.closeSubmenu()}openSubmenuItem(){return this.items.find(item=>item.submenuOpen)}clearSubmenuTimers(){this.clearOwnedTimeout(this.submenuOpenTimer),this.clearOwnedTimeout(this.submenuCloseTimer),this.submenuOpenTimer=void 0,this.submenuCloseTimer=void 0}ownItemFromEvent(e){let owner;for(const node of e.composedPath()){if(node===this)break;isLyraMenuItemElement(node)&&(owner=node)}return owner}isForeignEvent(e){for(const node of e.composedPath()){if(node===this)return!1;if(isLyraMenuElement(node))return!0}return!1}scheduleSubmenuClose(item){this.submenuCloseTimer||(this.submenuCloseTimer=this.scheduleOwnedTimeout(()=>{this.submenuCloseTimer=void 0,item.submenuOpen&&(composedContains(item,safeDeepActiveElement(this.ownerDocument))||item.closeSubmenu())},SUBMENU_CLOSE_DELAY))}popupPart(name){return this.renderRoot.querySelector(`[part="${name}"]`)}tabWouldLeavePopup(e){const header=this.popupPart("header"),footer=this.popupPart("footer"),listEl=this.popupPart("list"),backwards=e.shiftKey,active=safeDeepActiveElement(this.ownerDocument),headerStops=header?collectFocusableElements(header):[],footerStops=footer?collectFocusableElements(footer):[],listStops=listEl?collectFocusableElements(listEl):[],hasNeighbor=stops=>{const index=active?stops.indexOf(active):-1;return index===-1?!1:backwards?index>0:index<stops.length-1},path=e.composedPath();return footer&&path.includes(footer)?hasNeighbor(footerStops)?!1:backwards?listStops.length===0&&headerStops.length===0:!0:header&&path.includes(header)?hasNeighbor(headerStops)?!1:backwards?!0:listStops.length===0&&footerStops.length===0:!isLyraMenuItemElement(e.target)&&hasNeighbor(listStops)?!1:backwards?headerStops.length===0:footerStops.length===0}typeAhead(char){this.clearOwnedTimeout(this.typeAheadTimer),this.typeAheadBuffer+=char.toLocaleLowerCase(this.effectiveLocale),this.typeAheadTimer=this.scheduleOwnedTimeout(()=>{this.typeAheadBuffer=""},500);const navigable=this.items.filter(i=>this.isNavigable(i));if(!navigable.length)return;const current=this.activeIndex>=0?this.items[this.activeIndex]:void 0,currentIndex=current?navigable.indexOf(current):-1,n=navigable.length;for(let step=1;step<=n;step++){const candidate=navigable[(currentIndex+step+n)%n];if(candidate&&this.itemText(candidate).toLocaleLowerCase(this.effectiveLocale).startsWith(this.typeAheadBuffer)){this.setActiveItem(candidate);return}}}resetTypeAhead(){this.clearOwnedTimeout(this.typeAheadTimer),this.typeAheadTimer=void 0,this.typeAheadBuffer=""}itemText(item){return composedAccessibilityText(item).trim()}get effectiveLabel(){const hostLabel=this.getAttribute("aria-label");return hostLabel!==null?hostLabel:this.label!==void 0?this.label:this.dropdownLabel!==void 0?this.dropdownLabel:this.localize("menuLabel")}renderContents(){return html`
       <div part="header">
         <slot name="header" @slotchange=${this.onRegionSlotChange}></slot>
       </div>

package/dist/components/layout/multi-split/multi-split.class.d.ts

@@ -159,7 +159,14 @@ orientationBreakpoint?:number|string;
 *  a rule across browser zoom and user font-size preferences. */
 orientationBreakpointBasis:BreakpointBasis;
 /** Layout/resize axis used below `orientationBreakpoint`. */
-narrowOrientation:LyraOrientation;storageKey?:string;
+narrowOrientation:LyraOrientation;
+/** When set, this instance's panel sizes are persisted to `localStorage`, keyed by this value
+*  plus each panel's identity (`panel-id`, falling back to DOM order), and restored on the next
+*  mount. Initialization-time precedence, highest first: an already-valid `sizes` binding (an
+*  explicit authored layout for THIS mount always wins and is never silently replaced), then a
+*  valid persisted layout, then `defaultSizes`, then equal distribution. Restoring persisted
+*  state never fires an event -- read `sizes` after the component's first update to observe it. */
+storageKey?:string;
 /** Optional px and/or percent min/max per panel, index-aligned with `sizes`. A
 *  `null`/missing entry leaves that panel purely percent-based (the
 *  existing `min`-only behavior). `sizes`, the `lr-resize` payload, and
@@ -242,7 +249,10 @@ open:boolean;
 dividerLabel?:(index:number,panelCount:number)=>string;
 /** Internal hydration seed reflected into declarative output so a property-driven server render
 * and the browser's first reuse pass agree before assigned children can be observed. */
-private panelCount;private sizesReconciledForMembership;private _collapseState;private _forced;private overlayActive;private justOpened;private overlayHandle?;private drags;private dragOwnerWindow?;private ownedPanels;private readonly panelOwnership;private panelOwnershipObserver?;private panelOwnershipObserverDocument?;private panelOwnershipObserverGeneration;private constraintIssueKey;private initializedSizes;private measuredInlineSize;private _effectiveOrientation;private baseEl?;private collapseResizeObserver?;private collapseObservedElement?;private collapseObserverOwnerDocument?;private collapseObserverGeneration;private gutterResizeObserver?;private gutterObserverFrame?;private gutterObserverDocument?;private gutterObservedDividers;private gutterObservedContainerSize;
+private panelCount;private sizesReconciledForMembership;private _collapseState;private _forced;private overlayActive;private justOpened;private overlayHandle?;
+/** The panel `role`/`aria-modal` were last overwritten on and their prior values, so closing the
+*  drawer restores exactly what the consumer had authored rather than assuming it was unset. */
+private floatingDialogPanel;private floatingDialogPreviousRole;private floatingDialogPreviousAriaModal;private drags;private dragOwnerWindow?;private ownedPanels;private readonly panelOwnership;private panelOwnershipObserver?;private panelOwnershipObserverDocument?;private panelOwnershipObserverGeneration;private constraintIssueKey;private initializedSizes;private measuredInlineSize;private _effectiveOrientation;private baseEl?;private collapseResizeObserver?;private collapseObservedElement?;private collapseObserverOwnerDocument?;private collapseObserverGeneration;private gutterResizeObserver?;private gutterObserverFrame?;private gutterObserverDocument?;private gutterObservedDividers;private gutterObservedContainerSize;
 /** Owns breakpoint resolution, basis selection, and the viewport `MediaQueryList` lifecycle
 *  (including teardown on disconnect) — see `OrientationBreakpointController`. */
 private orientationBreakpoints;

package/dist/components/layout/multi-split/multi-split.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,query}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{activateOverlay}from"../../../internal/overlay-manager.js";import{isRtl}from"../../../internal/rtl.js";import{finiteRange}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{CollapseBreakpointController,OrientationBreakpointController}from"../../../internal/orientation-breakpoint.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{resolveCssLength}from"../../../internal/css-length.js";import{styles}from"./multi-split.styles.js";import{LYRA_DEFAULT_resizeDivider,LYRA_DEFAULT_resizeValuePercent}from"../../../internal/default-strings.generated.js";const KEYBOARD_STEP=2;function isPersistedPanelLayout(value){if(typeof value!="object"||value===null)return!1;const candidate=value;return candidate.version!==1||!Array.isArray(candidate.panels)?!1:candidate.panels.every(panel=>{if(typeof panel!="object"||panel===null)return!1;const record=panel;return typeof record.panelId=="string"&&record.panelId!==""&&record.panelId.trim()===record.panelId&&typeof record.size=="number"&&Number.isFinite(record.size)&&record.size>=0})}const NO_MIN_PX=0,NO_MAX_PX=1e6,OWNED_PANEL_STYLE_PROPERTIES=["flex","order","inline-size","--_lr-multi-split-panel-min"];class LyraMultiSplit extends LyraElement{constructor(){super(...arguments),this.toggleProposalDepth=0,this.toggleProposalMutationVersion=0,this.forcedCloseVersion=0,this.sizes=[],this.defaultSizes=[],this.min=10,this.orientation="horizontal",this.orientationBreakpointBasis="container",this.narrowOrientation="vertical",this.panelConstraints=[],this.collapse="none",this.railWidth="3.5rem",this.railBreakpoint=640,this.floatBreakpoint=400,this.collapseBreakpointBasis="container",this.open=!1,this.panelCount=0,this.sizesReconciledForMembership=!1,this._collapseState="wide",this._forced=!1,this.overlayActive=!1,this.justOpened=!1,this.drags=new Map,this.ownedPanels=[],this.panelOwnership=new Map,this.panelOwnershipObserverGeneration=0,this.constraintIssueKey="",this.initializedSizes=!1,this.measuredInlineSize=Number.POSITIVE_INFINITY,this._effectiveOrientation="horizontal",this.collapseObserverGeneration=0,this.gutterObservedDividers=[],this.gutterObservedContainerSize=0,this.orientationBreakpoints=new OrientationBreakpointController(this,()=>this.updateEffectiveOrientation(this.measuredInlineSize,!0)),this.collapseBreakpoints=new CollapseBreakpointController(this,()=>this.updateCollapseState(this.measuredInlineSize,!0)),this.onSlotChange=()=>{this.updateBrowserDerivedState(()=>this.syncPanelMembership())},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()},this.onModalLayerClick=event=>{event.target===this.baseEl&&this.overlayHandle?.dismissBackdrop()},this.onPointerDown=(e,index)=>{if(e.button!==0||this.isDividerDisabled(index))return;const divider=e.currentTarget,ownerWindow=divider.ownerDocument.defaultView;ownerWindow&&(this.drags.size>0&&this.dragOwnerWindow!==ownerWindow||(this.drags.set(e.pointerId,{index,startPos:this.effectiveOrientation==="vertical"?e.clientY:e.clientX,base:this.baseEl,appliedDelta:0,acceptedResize:!1}),divider.setPointerCapture(e.pointerId),this.drags.size===1&&(this.dragOwnerWindow=ownerWindow,ownerWindow.addEventListener("pointermove",this.onPointerMove),ownerWindow.addEventListener("pointerup",this.onPointerUp),ownerWindow.addEventListener("pointercancel",this.onPointerUp),ownerWindow.addEventListener("lostpointercapture",this.onPointerUp))))},this.onPointerMove=e=>{const drag=this.drags.get(e.pointerId);if(!drag)return;if(this.isDividerDisabled(drag.index)){this.endDragGestures();return}const total=this.effectiveOrientation==="vertical"?drag.base.clientHeight:drag.base.clientWidth;if(!Number.isFinite(total)||total<=0){this.endDragGestures();return}let cumulativeDelta=((this.effectiveOrientation==="vertical"?e.clientY:e.clientX)-drag.startPos)/total*100;this.effectiveOrientation==="horizontal"&&isRtl(this)&&(cumulativeDelta=-cumulativeDelta);const incremental=cumulativeDelta-drag.appliedDelta,priorValue=this.sizes[drag.index];if(priorValue===void 0)return;const paired=this.clampPair(this.sizes,drag.index,incremental,total),pairedA=paired[drag.index],pairedB=paired[drag.index+1];if(pairedA===void 0||pairedB===void 0)return;const next=[...this.sizes];next[drag.index]=pairedA,next[drag.index+1]=pairedB,this.requestResize(next,!1)&&(drag.appliedDelta+=pairedA-priorValue,drag.acceptedResize=!0)},this.onPointerUp=e=>{const drag=this.drags.get(e.pointerId);drag&&(this.drags.delete(e.pointerId),e.type==="pointerup"&&drag.acceptedResize&&this.persist(),this.drags.size===0&&this.removeDragListeners())},this.onDividerKeyDown=(e,index)=>{if(this.isDividerDisabled(index))return;const rtl=this.effectiveOrientation==="horizontal"&&isRtl(this),forwardKey=this.effectiveOrientation==="vertical"?"ArrowDown":rtl?"ArrowLeft":"ArrowRight",backwardKey=this.effectiveOrientation==="vertical"?"ArrowUp":rtl?"ArrowRight":"ArrowLeft";if(e.key==="Home"||e.key==="End"){const{min,max}=this.dividerValueRange(index),current=this.sizes[index];if(current!==void 0){const target=e.key==="Home"?min:max;this.applyDelta(index,target-current,!0)&&e.preventDefault()}}else e.key===forwardKey?this.applyDelta(index,KEYBOARD_STEP,!0)&&e.preventDefault():e.key===backwardKey&&this.applyDelta(index,-KEYBOARD_STEP,!0)&&e.preventDefault()}}static{this.defaultStrings={...super.defaultStrings,resizeDivider:LYRA_DEFAULT_resizeDivider,resizeValuePercent:LYRA_DEFAULT_resizeValuePercent}}static{this.ownedCollectionProperties=Object.freeze(["sizes","defaultSizes","panelConstraints"])}static{this.styles=[LyraElement.styles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-resize-request","lr-resize"])}static{this.properties={collapseState:{reflect:!0,attribute:"collapse-state",noAccessor:!0}}}connectedCallback(){super.connectedCallback();const hostWidth=this.getBoundingClientRect().width;hostWidth>0&&(this.measuredInlineSize=hostWidth),this.seedFirstRenderState(()=>this.syncPanelMembership(!1)),this.hasUpdated&&this.syncPanelMembership(!1),this.initializedSizes&&this.ensureSizes(),this.responsiveObservationEnabled&&this.armCollapseObserver(),this.hasUpdated&&this.overlayActive&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateFloatingOverlay(),queueMicrotask(()=>this.overlayHandle?.focusInitial()))}disconnectedCallback(){super.disconnectedCallback(),this.endDragGestures(),this.resetCollapseObserver(),this.resetGutterObserver(),this.overlayHandle?.suspend(),this.releaseOwnedPanels()}adoptedCallback(){super.adoptedCallback(),this.endDragGestures(),this.resetCollapseObserver(),this.resetGutterObserver(),this.releaseOwnedPanels()}firstUpdated(changed){super.firstUpdated(changed),this.responsiveObservationEnabled&&this.armCollapseObserver()}willUpdate(changed){if(super.willUpdate(changed),!this.ownerDocument&&this.panelCount===0&&(this.panelCount=Math.max(this.sizes.length,this.defaultSizes.length,this.panelConstraints.length)),!this.initializedSizes)this.initializeSizes(),this.initializedSizes=!0;else if(changed.has("sizes")){const previous=changed.get("sizes");this.sizesReconciledForMembership?this.sizesReconciledForMembership=!1:this.validLiveSizes(this.sizes)||(Array.isArray(previous)&&this.validLiveSizes(previous)?this.sizes=[...previous]:(this.sizes=[],this.ensureSizes()))}else this.sizes.length===0&&this.ensureSizes();if((changed.has("orientationBreakpoint")||changed.has("orientationBreakpointBasis"))&&this.orientationBreakpoints.configure(this.orientationBreakpoint,this.orientationBreakpointBasis),(changed.has("orientation")||changed.has("narrowOrientation")||changed.has("orientationBreakpoint")||changed.has("orientationBreakpointBasis"))&&this.updateEffectiveOrientation(this.measuredInlineSize,this.hasUpdated&&this.orientationBreakpointBasis==="viewport"),changed.has("collapse")||changed.has("railBreakpoint")||changed.has("floatBreakpoint")||changed.has("collapseBreakpointBasis")){const previousEffective=changed.has("collapse")?this.effectiveCollapseStateFor(changed.get("collapse")??"none"):this.collapseState;changed.has("collapse")&&previousEffective!=="wide"&&this.endDragGestures(),this.collapseBreakpoints.configure(this.railBreakpoint,this.floatBreakpoint,this.collapseBreakpointBasis),this.collapsingIndex!==-1&&!this._forced&&(this._collapseState=this.collapseBreakpoints.classify(this.measuredInlineSize)),this.applyEffectiveCollapseTransition(previousEffective,this.collapseState,this.hasUpdated)}if(changed.has("open")||changed.has("collapseState")||changed.has("collapse")||changed.has("panelCount")){const next=this.collapseState==="floating"&&this.open;next!==this.overlayActive&&(this.overlayActive=next,next?(this.justOpened=!0,this.activateFloatingOverlay()):this.deactivateFloatingOverlay())}}get collapseState(){return this.effectiveCollapseStateFor(this.collapse)}set collapseState(next){if(next==="auto"){this._forced=!1,this.updateCollapseState(this.currentMeasuredWidth());return}this._forced=!0,this.setRequestedCollapseState(next)}get effectiveOrientation(){return this._effectiveOrientation}get responsiveObservationEnabled(){return this.collapse!=="none"||this.orientationBreakpoints.containerObservationEnabled}updateEffectiveOrientation(width,shouldEmit){const next=this.orientationBreakpoints.isBelow(width)?this.narrowOrientation:this.orientation;next!==this._effectiveOrientation&&(this.endDragGestures(),this._effectiveOrientation=next,this.requestUpdate(),shouldEmit&&this.emit("lr-multi-split-orientation-change",{orientation:next}))}currentMeasuredWidth(){return this.baseEl?.clientWidth??0}effectiveCollapseStateFor(collapse){return collapse!=="none"&&this.panelCount>=2?this._collapseState:"wide"}applyEffectiveCollapseTransition(previous,next,shouldEmit=!0){if(previous===next)return;this.endDragGestures(),this.requestUpdate("collapseState",previous);const forceClose=previous==="floating"&&next!=="floating"&&this.open,forcedCloseVersion=this.forcedCloseVersion;shouldEmit&&this.emit("lr-multi-split-collapse-change",{state:next}),forceClose&&this.forcedCloseVersion===forcedCloseVersion&&this.collapseState!=="floating"&&this.setOpen(!1,{force:!0})}setOpen(next,options){if(options?.force){this.open=next,this.forcedCloseVersion+=1,this.emit("lr-toggle",{open:next});return}if(this.open===next)return;const collapseState=this.collapseState,open=this.open,mutationVersion=this.toggleProposalMutationVersion;this.toggleProposalDepth+=1;try{if(this.emit("lr-toggle",{open:next},{cancelable:!0}).defaultPrevented||this.toggleProposalMutationVersion!==mutationVersion||this.collapseState!==collapseState||this.open!==open)return}finally{this.toggleProposalDepth-=1}this.open=next}requestUpdate(name,oldValue,options){this.toggleProposalDepth>0&&(name==="open"&&oldValue!==this.open||name==="collapse"&&oldValue!==this.collapse||name==="collapseState"&&oldValue!==this.collapseState)&&(this.toggleProposalMutationVersion+=1),super.requestUpdate(name,oldValue,options)}setRequestedCollapseState(next,shouldEmit=!0){const previousEffective=this.collapseState;if(next===this._collapseState)return;this._collapseState=next;const nextEffective=this.collapseState;this.applyEffectiveCollapseTransition(previousEffective,nextEffective,shouldEmit),previousEffective===nextEffective&&next!==nextEffective&&this.requestUpdate("collapseState",next)}get storageFullKey(){return this.storageKey?`lr-multi-split:${this.storageKey}:panels`:void 0}panelIdsFor(panels){const ids=[],seen=new Set;for(const panel of panels){const panelId=panel.getAttribute("panel-id")??"";if(!panelId||panelId.trim()!==panelId||seen.has(panelId))return null;seen.add(panelId),ids.push(panelId)}return ids}reconcileIdentitySizes(previousIds,previousValues,nextIds){if(previousIds.length!==previousValues.length||nextIds.length===0)return null;const previousSizes=new Map;previousIds.forEach((panelId,index)=>{previousSizes.set(panelId,previousValues[index])});const retainedTotal=nextIds.reduce((total,panelId)=>total+(previousSizes.get(panelId)??0),0),missingCount=nextIds.filter(panelId=>!previousSizes.has(panelId)).length;if(!(retainedTotal>0)){const equal=100/nextIds.length;return nextIds.map(()=>equal)}const newShare=100/nextIds.length,retainedScale=(100-newShare*missingCount)/retainedTotal;return nextIds.map(panelId=>{const previous=previousSizes.get(panelId);return previous===void 0?newShare:previous*retainedScale})}reconcileSizesByPanelId(previousPanels,nextPanels){if(previousPanels.length!==this.sizes.length||nextPanels.length===0)return null;const previousIds=this.panelIdsFor(previousPanels),nextIds=this.panelIdsFor(nextPanels);return!previousIds||!nextIds?null:this.reconcileIdentitySizes(previousIds,this.sizes,nextIds)}validInitialSizes(value){return!Array.isArray(value)||value.length!==this.panelCount||!value.every(size=>Number.isFinite(size)&&size>=this.safeMin)?!1:Math.abs(value.reduce((sum,size)=>sum+size,0)-100)<.01}validLiveSizes(value){if(!Array.isArray(value)||value.length!==this.panelCount)return!1;const floor=this.normalizedDefaultMin();return value.every(size=>Number.isFinite(size)&&size>=floor)?Math.abs(value.reduce((sum,size)=>sum+size,0)-100)<.01:!1}resolveDefaultSizes(){if(this.defaultSizes.length===0)return null;if(!this.defaultSizes.some(entry=>typeof entry=="string")){const numbers=this.defaultSizes;return this.validInitialSizes(numbers)?[...numbers]:null}const containerSize=this.currentMeasuredWidth()||this.getBoundingClientRect().width;if(!(containerSize>0))return null;const resolvedPx=[];for(const entry of this.defaultSizes){if(typeof entry=="number"){if(!Number.isFinite(entry))return null;resolvedPx.push(entry/100*containerSize);continue}const px=resolveCssLength(entry,{host:this,percentBase:containerSize,viewportBasis:this.ownerDocument.defaultView??void 0});if(px==null||!(px>=0))return null;resolvedPx.push(px)}const sum=resolvedPx.reduce((total,size)=>total+size,0);if(!(sum>0))return null;const normalized=resolvedPx.map(size=>size/sum*100);return this.validInitialSizes(normalized)?normalized:null}initializeSizes(){if(this.loadPersisted()||this.validInitialSizes(this.sizes))return;const resolved=this.resolveDefaultSizes();if(resolved){this.sizes=resolved;return}this.sizes=[],this.ensureSizes()}loadPersisted(){const panelIds=this.panelIdsFor(this.ownedPanels);if(!panelIds)return!1;const parsed=readPersistedState(this.storageFullKey,isPersistedPanelLayout);if(!parsed||parsed.panels.length===0)return!1;const persistedIds=[],persistedSizes=[],seen=new Set;for(const panel of parsed.panels){if(seen.has(panel.panelId))return!1;seen.add(panel.panelId),persistedIds.push(panel.panelId),persistedSizes.push(panel.size)}if(Math.abs(persistedSizes.reduce((sum,size)=>sum+size,0)-100)>=.01)return!1;const normalized=this.reconcileIdentitySizes(persistedIds,persistedSizes,panelIds);return normalized&&this.validInitialSizes(normalized)?(this.sizes=normalized,!0):!1}persist(){const panelIds=this.panelIdsFor(this.ownedPanels);if(!panelIds||panelIds.length!==this.sizes.length)return;const layout={version:1,panels:panelIds.map((panelId,index)=>({panelId,size:this.sizes[index]}))};writePersistedState(this.storageFullKey,layout)}ensureSizes(){if(this.panelCount===this.sizes.length)return;if(this.panelCount<=0){this.sizes=[];return}if(this.sizes.length===0){const equal=100/this.panelCount;this.sizes=Array.from({length:this.panelCount},()=>equal);return}const diff=this.panelCount-this.sizes.length;if(diff>0){const newShare=100/this.panelCount,scale=(100-newShare*diff)/100;this.sizes=[...this.sizes.map(s=>s*scale),...Array.from({length:diff},()=>newShare)]}else{const kept=this.sizes.slice(0,this.panelCount),removedTotal=this.sizes.slice(this.panelCount).reduce((sum,s)=>sum+s,0),keptTotal=kept.reduce((sum,s)=>sum+s,0)||1;this.sizes=kept.map(s=>s+s/keptTotal*removedTotal)}}readPanelStyle(panel,property2){return{value:panel.style.getPropertyValue(property2),priority:panel.style.getPropertyPriority(property2)}}samePanelStyle(left,right){return left.value===right.value&&left.priority===right.priority}snapshotPanelOwnership(panel){const styles2=new Map;for(const property2 of OWNED_PANEL_STYLE_PROPERTIES)styles2.set(property2,this.readPanelStyle(panel,property2));return{styles:styles2,appliedStyles:new Map,hidden:panel.hidden,collapseState:panel.getAttribute("data-collapse-state")}}adoptPanelOwnership(panel,snapshot){for(const property2 of OWNED_PANEL_STYLE_PROPERTIES){const current=this.readPanelStyle(panel,property2),applied=snapshot.appliedStyles.get(property2);(applied&&!this.samePanelStyle(current,applied)||!applied&&!this.samePanelStyle(current,snapshot.styles.get(property2)))&&snapshot.styles.set(property2,current)}(snapshot.appliedHidden!==void 0&&panel.hidden!==snapshot.appliedHidden||snapshot.appliedHidden===void 0&&panel.hidden!==snapshot.hidden)&&(snapshot.hidden=panel.hidden);const collapseState=panel.getAttribute("data-collapse-state");(snapshot.appliedCollapseState!==void 0&&collapseState!==snapshot.appliedCollapseState||snapshot.appliedCollapseState===void 0&&collapseState!==snapshot.collapseState)&&(snapshot.collapseState=collapseState)}applyOwnedPanelStyle(panel,snapshot,property2,value){value.value===""?panel.style.removeProperty(property2):panel.style.setProperty(property2,value.value,value.priority),snapshot.appliedStyles.set(property2,this.readPanelStyle(panel,property2))}applyOwnedPanelStyleValue(panel,snapshot,property2,value){this.applyOwnedPanelStyle(panel,snapshot,property2,{value,priority:""})}applyOwnedPanelHidden(panel,snapshot,hidden){panel.hidden=hidden,snapshot.appliedHidden=panel.hidden}applyOwnedPanelCollapseState(panel,snapshot,state){state===null?panel.removeAttribute("data-collapse-state"):panel.setAttribute("data-collapse-state",state),snapshot.appliedCollapseState=panel.getAttribute("data-collapse-state")}restorePanelOwnership(panel,snapshot){this.adoptPanelOwnership(panel,snapshot);for(const property2 of OWNED_PANEL_STYLE_PROPERTIES){const value=snapshot.styles.get(property2);value.value===""?panel.style.removeProperty(property2):panel.style.setProperty(property2,value.value,value.priority)}panel.hidden=snapshot.hidden,snapshot.collapseState===null?panel.removeAttribute("data-collapse-state"):panel.setAttribute("data-collapse-state",snapshot.collapseState)}panelProjectionDiverged(panel,snapshot){for(const property2 of OWNED_PANEL_STYLE_PROPERTIES){const current=this.readPanelStyle(panel,property2),expected=snapshot.appliedStyles.get(property2)??snapshot.styles.get(property2);if(!this.samePanelStyle(current,expected))return!0}if(panel.hidden!==(snapshot.appliedHidden??snapshot.hidden))return!0;const expectedCollapseState=snapshot.appliedCollapseState!==void 0?snapshot.appliedCollapseState:snapshot.collapseState;return panel.getAttribute("data-collapse-state")!==expectedCollapseState}resetPanelOwnershipObserver(){this.panelOwnershipObserverGeneration+=1,this.panelOwnershipObserver?.disconnect(),this.panelOwnershipObserver=void 0,this.panelOwnershipObserverDocument=void 0}observeOwnedPanels(){this.resetPanelOwnershipObserver();const ownerDocument=this.ownerDocument,MutationObserverConstructor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverConstructor||!this.isConnected||this.ownedPanels.length===0)return;const generation=this.panelOwnershipObserverGeneration,observer=new MutationObserverConstructor(records=>{if(this.panelOwnershipObserver!==observer||this.panelOwnershipObserverDocument!==this.ownerDocument||this.panelOwnershipObserverGeneration!==generation||!this.isConnected)return;records.some(record=>{const panel=record.target,snapshot=this.panelOwnership.get(panel);return snapshot?this.panelProjectionDiverged(panel,snapshot):!1})&&this.requestUpdate()});this.panelOwnershipObserver=observer,this.panelOwnershipObserverDocument=ownerDocument;for(const panel of this.ownedPanels)observer.observe(panel,{attributes:!0,attributeFilter:["style","hidden","data-collapse-state"]})}samePanelSequence(next){return next.length===this.ownedPanels.length&&next.every((panel,index)=>panel===this.ownedPanels[index])}syncPanelMembership(reconcileSizes=!0){const next=[...this.children];if(this.samePanelSequence(next))return;const previousPanels=this.ownedPanels,identitySizes=reconcileSizes?this.reconcileSizesByPanelId(previousPanels,next):null,previousEffective=this.collapseState,nextSet=new Set(next);for(const panel of this.ownedPanels){if(nextSet.has(panel))continue;const snapshot=this.panelOwnership.get(panel);snapshot&&this.restorePanelOwnership(panel,snapshot),this.panelOwnership.delete(panel)}for(const panel of next)this.panelOwnership.has(panel)||this.panelOwnership.set(panel,this.snapshotPanelOwnership(panel));const countChanged=next.length!==this.panelCount;this.ownedPanels=next,this.panelCount=next.length,this.collapsingIndex!==-1&&!this._forced&&(this._collapseState=this.collapseBreakpoints.classify(this.currentMeasuredWidth())),this.applyEffectiveCollapseTransition(previousEffective,this.collapseState,this.hasUpdated),identitySizes?(this.sizesReconciledForMembership=!0,this.sizes=identitySizes):countChanged&&reconcileSizes&&(this.sizesReconciledForMembership=!0,this.ensureSizes()),this.observeOwnedPanels(),this.hasUpdated&&this.requestUpdate()}releaseOwnedPanels(){this.resetPanelOwnershipObserver();for(const panel of this.ownedPanels){const snapshot=this.panelOwnership.get(panel);snapshot&&this.restorePanelOwnership(panel,snapshot)}this.ownedPanels=[],this.panelOwnership.clear()}getContainerSize(){return this.baseEl?this.effectiveOrientation==="vertical"?this.baseEl.clientHeight:this.baseEl.clientWidth:0}resetGutterObserver(){this.gutterObserverFrame!==void 0&&(this.gutterObserverDocument?.defaultView?.cancelAnimationFrame(this.gutterObserverFrame),this.gutterObserverFrame=void 0),this.gutterResizeObserver?.disconnect(),this.gutterResizeObserver=void 0,this.gutterObserverDocument=void 0,this.gutterObservedDividers=[],this.baseEl?.style.removeProperty("--_lr-multi-split-gutters")}updateGutterBudget(){const view=this.ownerDocument.defaultView,base=this.baseEl;if(!view||!base)return;const vertical=this.effectiveOrientation==="vertical",value=`${this.gutterObservedDividers.reduce((total,divider)=>{const style=view.getComputedStyle(divider),properties=vertical?["height","padding-top","padding-bottom","border-top-width","border-bottom-width"]:["width","padding-left","padding-right","border-left-width","border-right-width"],boxProperties=style.boxSizing==="border-box"?properties.slice(0,1):properties;return total+boxProperties.reduce((size,property2)=>size+finiteRange(parseFloat(style.getPropertyValue(property2)),0,0),0)},0)}px`;base.style.getPropertyValue("--_lr-multi-split-gutters")!==value&&base.style.setProperty("--_lr-multi-split-gutters",value)}syncGutterObserver(enabled){const base=this.baseEl;if(!enabled||!this.isConnected||!base){this.resetGutterObserver();return}const ownerDocument=this.ownerDocument,dividers=[...base.querySelectorAll('[part="divider"]')];if(this.gutterResizeObserver&&this.gutterObserverDocument===ownerDocument&&dividers.length===this.gutterObservedDividers.length&&dividers.every((divider,index)=>divider===this.gutterObservedDividers[index])){this.updateGutterBudget();return}this.resetGutterObserver(),this.gutterObservedDividers=dividers,this.gutterObserverDocument=ownerDocument,this.gutterObservedContainerSize=this.getContainerSize(),this.updateGutterBudget();const ownerWindow=ownerDocument.defaultView,ResizeObserverConstructor=ownerWindow?.ResizeObserver;if(!ownerWindow||!ResizeObserverConstructor)return;const observer=new ResizeObserverConstructor(()=>{if(this.gutterResizeObserver!==observer||!this.isConnected||this.ownerDocument!==ownerDocument)return;this.updateGutterBudget();const size=this.getContainerSize();size!==this.gutterObservedContainerSize&&(this.gutterObservedContainerSize=size,this.requestUpdate())});this.gutterResizeObserver=observer;const frame=ownerWindow.requestAnimationFrame(()=>{if(!(this.gutterObserverFrame!==frame||this.gutterResizeObserver!==observer||!this.isConnected||this.ownerDocument!==ownerDocument||this.baseEl!==base)){this.gutterObserverFrame=void 0,observer.observe(base,{box:"border-box"});for(const divider of dividers)observer.observe(divider,{box:"border-box"})}});this.gutterObserverFrame=frame}get collapsingIndex(){return this.collapse==="none"||this.panelCount<2?-1:this.collapse==="start"?0:this.panelCount-1}get collapseActive(){return this.collapsingIndex!==-1&&this.collapseState!=="wide"}isDividerDisabled(index){if(!this.collapseActive)return!1;const adjacent=this.collapsingIndex===0?0:this.panelCount-2;return index===adjacent}updateCollapseState(width,shouldEmit=!0){this.collapse!=="none"&&(this._forced||this.setRequestedCollapseState(this.collapseBreakpoints.classify(width),shouldEmit))}armCollapseObserver(){const observedElement=this.baseEl;if(!this.isConnected||!observedElement)return;const ownerDocument=this.ownerDocument;if(this.collapseResizeObserver&&this.collapseObservedElement===observedElement&&this.collapseObserverOwnerDocument===ownerDocument)return;this.resetCollapseObserver();const ResizeObserverConstructor=ownerDocument.defaultView?.ResizeObserver;if(!ResizeObserverConstructor)return;const generation=this.collapseObserverGeneration,observer=new ResizeObserverConstructor(entries=>{if(this.collapseResizeObserver!==observer||this.collapseObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||this.baseEl!==observedElement)return;const box=entries[0]?.contentBoxSize?.[0],width=box?box.inlineSize:observedElement.getBoundingClientRect().width;this.measuredInlineSize=width,this.updateCollapseState(width),this.updateEffectiveOrientation(width,!0)});this.collapseResizeObserver=observer,this.collapseObservedElement=observedElement,this.collapseObserverOwnerDocument=ownerDocument,observer.observe(observedElement)}resetCollapseObserver(){this.collapseObserverGeneration+=1,this.collapseResizeObserver?.disconnect(),this.collapseResizeObserver=void 0,this.collapseObservedElement=void 0,this.collapseObserverOwnerDocument=void 0}syncCollapseObserver(){if(!this.responsiveObservationEnabled){this.resetCollapseObserver();return}this.armCollapseObserver()}get safeMin(){return finiteRange(this.min,10,0)}normalizedDefaultMin(){if(this.panelCount<=0)return 0;const requested=this.safeMin,available=Math.max(0,100-KEYBOARD_STEP);return Math.min(requested,available/this.panelCount)}resolveConstraintBounds(containerSize){const fallbackMin=this.normalizedDefaultMin(),fallback=Array.from({length:this.panelCount},()=>({min:fallbackMin,max:1/0}));if(this.panelCount<=0)return{bounds:[],usePanelConstraints:!0};const bounds=[];let minimumTotal=0,maximumTotal=0,hasUnboundedMaximum=!1,issueReason;for(let index=0;index<this.panelCount;index++){const constraint=this.panelConstraints[index];let min=this.safeMin,max=1/0,minSet=!1,maxSet=!1;constraint&&(constraint.minPx!=null&&Number.isFinite(constraint.minPx)&&constraint.minPx>=0&&containerSize>0&&(min=constraint.minPx/containerSize*100,minSet=!0),constraint.minPercent!=null&&Number.isFinite(constraint.minPercent)&&constraint.minPercent>=0&&(min=minSet?Math.max(min,constraint.minPercent):constraint.minPercent,minSet=!0),constraint.maxPx!=null&&Number.isFinite(constraint.maxPx)&&constraint.maxPx>=0&&containerSize>0&&(max=constraint.maxPx/containerSize*100,maxSet=!0),constraint.maxPercent!=null&&Number.isFinite(constraint.maxPercent)&&constraint.maxPercent>=0&&(max=maxSet?Math.min(max,constraint.maxPercent):constraint.maxPercent,maxSet=!0),(constraint.minPx!=null&&(!Number.isFinite(constraint.minPx)||constraint.minPx<0)||constraint.maxPx!=null&&(!Number.isFinite(constraint.maxPx)||constraint.maxPx<0)||constraint.minPercent!=null&&(!Number.isFinite(constraint.minPercent)||constraint.minPercent<0)||constraint.maxPercent!=null&&(!Number.isFinite(constraint.maxPercent)||constraint.maxPercent<0))&&(issueReason??="minimum-exceeds-maximum")),min>max&&(issueReason??="minimum-exceeds-maximum"),bounds.push({min,max}),minimumTotal+=min,Number.isFinite(max)?maximumTotal+=max:hasUnboundedMaximum=!0}return issueReason==null&&minimumTotal>100+1e-9&&(issueReason="minimum-total"),issueReason==null&&!hasUnboundedMaximum&&maximumTotal<100-1e-9&&(issueReason="maximum-total"),issueReason==null?{bounds,usePanelConstraints:!0}:{bounds:fallback,usePanelConstraints:!1,issue:{reason:issueReason,panelCount:this.panelCount,minimumTotal,maximumTotal:hasUnboundedMaximum?null:maximumTotal,containerSize}}}percentBounds(index,containerSize){return this.resolveConstraintBounds(containerSize).bounds[index]??{min:0,max:1/0}}hasClampConstraint(constraint){return!!constraint&&(constraint.minPx!=null||constraint.maxPx!=null||constraint.minPercent!=null||constraint.maxPercent!=null)}minSideExpr(constraint){const terms=[];return constraint?.minPx!=null&&Number.isFinite(constraint.minPx)&&constraint.minPx>=0&&terms.push(`${constraint.minPx}px`),constraint?.minPercent!=null&&Number.isFinite(constraint.minPercent)&&constraint.minPercent>=0&&terms.push(`${constraint.minPercent}%`),terms.length===0?`${NO_MIN_PX}px`:terms.length===1?terms[0]:`max(${this.safeMin}%, ${terms.join(", ")})`}maxSideExpr(constraint){const terms=[];return constraint?.maxPx!=null&&Number.isFinite(constraint.maxPx)&&constraint.maxPx>=0&&terms.push(`${constraint.maxPx}px`),constraint?.maxPercent!=null&&Number.isFinite(constraint.maxPercent)&&constraint.maxPercent>=0&&terms.push(`${constraint.maxPercent}%`),terms.length===0?`${NO_MAX_PX}px`:terms.length===1?terms[0]:`min(${terms.join(", ")})`}clampPair(sizes,i,delta,containerSize=0){const next=[...sizes],currentA=next[i],currentB=next[i+1];if(currentA===void 0||currentB===void 0)return next;const pairTotal=currentA+currentB,a=this.percentBounds(i,containerSize),b=this.percentBounds(i+1,containerSize),loRaw=Math.max(a.min,pairTotal-b.max),hiRaw=Math.min(a.max,pairTotal-b.min),lo=Math.min(loRaw,pairTotal),hi=Math.max(hiRaw,lo),clampedA=Math.min(Math.max(currentA+delta,lo),hi);return next[i]=clampedA,next[i+1]=pairTotal-clampedA,next}requestResize(next,commit){return next.length===this.sizes.length&&next.every((size,index)=>Math.abs(size-this.sizes[index])<=1e-9)||this.emit("lr-resize-request",{sizes:[...next]},{cancelable:!0}).defaultPrevented?!1:(this.sizes=next,this.emit("lr-resize",{sizes:[...this.sizes]}),commit&&this.persist(),!0)}applyDelta(index,delta,commit){const next=this.clampPair(this.sizes,index,delta,this.getContainerSize());return next.length!==this.sizes.length||next.some((size,currentIndex)=>Math.abs(size-this.sizes[currentIndex])>1e-9)?(this.requestResize(next,commit),!0):!1}get floatingPanelEl(){const index=this.collapsingIndex;return index===-1?null:this.ownedPanels[index]??null}activateFloatingOverlay(){this.overlayHandle=activateOverlay({host:this,panel:()=>this.floatingPanelEl,modalRoot:()=>this.floatingPanelEl,onEscape:()=>this.setOpen(!1),onBackdrop:()=>this.setOpen(!1),lockScroll:!0,suspendWhenUnrendered:!0})}deactivateFloatingOverlay(){this.overlayHandle?.deactivate(),this.overlayHandle=void 0}removeDragListeners(){const ownerWindow=this.dragOwnerWindow;this.dragOwnerWindow=void 0,ownerWindow?.removeEventListener("pointermove",this.onPointerMove),ownerWindow?.removeEventListener("pointerup",this.onPointerUp),ownerWindow?.removeEventListener("pointercancel",this.onPointerUp),ownerWindow?.removeEventListener("lostpointercapture",this.onPointerUp)}endDragGestures(){this.drags.clear(),this.removeDragListeners()}dividerValueRange(index,bounds=this.resolveConstraintBounds(this.getContainerSize()).bounds){const pairTotal=(this.sizes[index]??0)+(this.sizes[index+1]??0),leading=bounds[index],trailing=bounds[index+1],min=Math.max(leading.min,pairTotal-trailing.max);return{min,max:Math.max(min,Math.min(leading.max,pairTotal-trailing.min))}}updated(changed){super.updated(changed),(changed.has("collapse")||changed.has("orientationBreakpoint")||changed.has("orientationBreakpointBasis"))&&this.syncCollapseObserver(),this.orientationBreakpoints.active?this.setAttribute("data-effective-orientation",this._effectiveOrientation):this.removeAttribute("data-effective-orientation");const constraintResolution=this.resolveConstraintBounds(this.getContainerSize()),issue=constraintResolution.issue,issueKey=issue?`${issue.reason}:${issue.panelCount}:${issue.minimumTotal}:${issue.maximumTotal??"unbounded"}`:"";issueKey!==this.constraintIssueKey&&(this.constraintIssueKey=issueKey,issue&&this.emit("lr-multi-split-constraints-invalid",issue));const panels=this.ownedPanels;for(const panel of panels){const snapshot=this.panelOwnership.get(panel);snapshot&&this.adoptPanelOwnership(panel,snapshot)}const collapsingIndex=this.collapseActive?this.collapsingIndex:-1;this.syncGutterObserver(collapsingIndex===-1&&this.panelConstraints.some(constraint=>finiteRange(constraint?.minPx??0,0,0)>0));const pixelMinimumTotal=constraintResolution.usePanelConstraints?this.panelConstraints.slice(0,this.panelCount).reduce((total,constraint)=>total+finiteRange(constraint?.minPx??0,0,0),0):0,redistributedShare=new Array(panels.length).fill(0);if(collapsingIndex===-1){let freedPercent=0;const growableIndexes=[];let growableTotal=0;for(let i=0;i<panels.length;i++){const percent=this.sizes[i]??0,constraint=constraintResolution.usePanelConstraints?this.panelConstraints[i]:void 0;if(this.hasClampConstraint(constraint)){const bounds=constraintResolution.bounds[i],clamped=bounds?Math.min(Math.max(percent,bounds.min),bounds.max):percent;clamped<percent&&(freedPercent+=percent-clamped)}else growableIndexes.push(i),growableTotal+=percent}if(freedPercent>0&&growableTotal>0)for(const i of growableIndexes)redistributedShare[i]=freedPercent*((this.sizes[i]??0)/growableTotal)}panels.forEach((panel,i)=>{const snapshot=this.panelOwnership.get(panel);if(!snapshot)return;const percent=this.sizes[i]??0,constraint=constraintResolution.usePanelConstraints?this.panelConstraints[i]:void 0,pixelMinimum=finiteRange(constraint?.minPx??0,0,0);if(collapsingIndex===-1&&pixelMinimum>0&&pixelMinimumTotal>0?this.applyOwnedPanelStyleValue(panel,snapshot,"--_lr-multi-split-panel-min",`min(${pixelMinimum}px, max(0px, calc((100% - var(--_lr-multi-split-gutters, 0px)) * ${pixelMinimum/pixelMinimumTotal})))`):this.applyOwnedPanelStyle(panel,snapshot,"--_lr-multi-split-panel-min",snapshot.styles.get("--_lr-multi-split-panel-min")),this.applyOwnedPanelStyle(panel,snapshot,"inline-size",snapshot.styles.get("inline-size")),this.applyOwnedPanelHidden(panel,snapshot,snapshot.hidden),collapsingIndex===i&&this.collapseState==="rail")this.applyOwnedPanelStyleValue(panel,snapshot,"flex",`0 0 ${this.railWidth}`);else if(collapsingIndex===i&&this.collapseState==="floating"&&!this.open)this.applyOwnedPanelStyleValue(panel,snapshot,"flex","none"),this.applyOwnedPanelHidden(panel,snapshot,!0);else if(collapsingIndex===i&&this.collapseState==="floating")this.applyOwnedPanelStyleValue(panel,snapshot,"flex","none"),this.applyOwnedPanelStyleValue(panel,snapshot,"inline-size",`${percent}%`);else if(collapsingIndex!==-1&&i!==collapsingIndex)this.applyOwnedPanelStyleValue(panel,snapshot,"flex",this.hasClampConstraint(constraint)?`0 1 clamp(${this.minSideExpr(constraint)}, ${percent}%, ${this.maxSideExpr(constraint)})`:`${percent} 1 0%`);else{const adjustedPercent=percent+(redistributedShare[i]??0);this.applyOwnedPanelStyleValue(panel,snapshot,"flex",this.hasClampConstraint(constraint)?`0 1 clamp(${this.minSideExpr(constraint)}, ${percent}%, ${this.maxSideExpr(constraint)})`:`0 1 ${adjustedPercent}%`)}this.applyOwnedPanelStyleValue(panel,snapshot,"order",String(i*2)),collapsingIndex===i?this.applyOwnedPanelCollapseState(panel,snapshot,this.collapseState):this.applyOwnedPanelCollapseState(panel,snapshot,null)}),collapsingIndex!==-1?this.setAttribute("data-collapse-state",this.collapseState):this.removeAttribute("data-collapse-state"),this.justOpened&&(this.justOpened=!1,this.overlayHandle?.focusInitial())}render(){const dividers=[],bounds=this.resolveConstraintBounds(this.getContainerSize()).bounds;for(let i=0;i<this.panelCount-1;i++){const{min:valueMin,max:valueMax}=this.dividerValueRange(i,bounds),disabled=this.isDividerDisabled(i);dividers.push(html`<div
+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,query}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{activateOverlay}from"../../../internal/overlay-manager.js";import{isRtl}from"../../../internal/rtl.js";import{finiteRange}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{CollapseBreakpointController,OrientationBreakpointController}from"../../../internal/orientation-breakpoint.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{resolveCssLength}from"../../../internal/css-length.js";import{styles}from"./multi-split.styles.js";import{LYRA_DEFAULT_resizeDivider,LYRA_DEFAULT_resizeValuePercent}from"../../../internal/default-strings.generated.js";const KEYBOARD_STEP=2;function isPersistedPanelLayout(value){if(typeof value!="object"||value===null)return!1;const candidate=value;return candidate.version!==1||!Array.isArray(candidate.panels)?!1:candidate.panels.every(panel=>{if(typeof panel!="object"||panel===null)return!1;const record=panel;return typeof record.panelId=="string"&&record.panelId!==""&&record.panelId.trim()===record.panelId&&typeof record.size=="number"&&Number.isFinite(record.size)&&record.size>=0})}const NO_MIN_PX=0,NO_MAX_PX=1e6,OWNED_PANEL_STYLE_PROPERTIES=["flex","order","inline-size","--_lr-multi-split-panel-min"];class LyraMultiSplit extends LyraElement{constructor(){super(...arguments),this.toggleProposalDepth=0,this.toggleProposalMutationVersion=0,this.forcedCloseVersion=0,this.sizes=[],this.defaultSizes=[],this.min=10,this.orientation="horizontal",this.orientationBreakpointBasis="container",this.narrowOrientation="vertical",this.panelConstraints=[],this.collapse="none",this.railWidth="3.5rem",this.railBreakpoint=640,this.floatBreakpoint=400,this.collapseBreakpointBasis="container",this.open=!1,this.panelCount=0,this.sizesReconciledForMembership=!1,this._collapseState="wide",this._forced=!1,this.overlayActive=!1,this.justOpened=!1,this.floatingDialogPanel=null,this.floatingDialogPreviousRole=null,this.floatingDialogPreviousAriaModal=null,this.drags=new Map,this.ownedPanels=[],this.panelOwnership=new Map,this.panelOwnershipObserverGeneration=0,this.constraintIssueKey="",this.initializedSizes=!1,this.measuredInlineSize=Number.POSITIVE_INFINITY,this._effectiveOrientation="horizontal",this.collapseObserverGeneration=0,this.gutterObservedDividers=[],this.gutterObservedContainerSize=0,this.orientationBreakpoints=new OrientationBreakpointController(this,()=>this.updateEffectiveOrientation(this.measuredInlineSize,!0)),this.collapseBreakpoints=new CollapseBreakpointController(this,()=>this.updateCollapseState(this.measuredInlineSize,!0)),this.onSlotChange=()=>{this.updateBrowserDerivedState(()=>this.syncPanelMembership())},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()},this.onModalLayerClick=event=>{event.target===this.baseEl&&this.overlayHandle?.dismissBackdrop()},this.onPointerDown=(e,index)=>{if(e.button!==0||this.isDividerDisabled(index))return;const divider=e.currentTarget,ownerWindow=divider.ownerDocument.defaultView;ownerWindow&&(this.drags.size>0&&this.dragOwnerWindow!==ownerWindow||(this.drags.set(e.pointerId,{index,startPos:this.effectiveOrientation==="vertical"?e.clientY:e.clientX,base:this.baseEl,appliedDelta:0,acceptedResize:!1}),divider.setPointerCapture(e.pointerId),this.drags.size===1&&(this.dragOwnerWindow=ownerWindow,ownerWindow.addEventListener("pointermove",this.onPointerMove),ownerWindow.addEventListener("pointerup",this.onPointerUp),ownerWindow.addEventListener("pointercancel",this.onPointerUp),ownerWindow.addEventListener("lostpointercapture",this.onPointerUp))))},this.onPointerMove=e=>{const drag=this.drags.get(e.pointerId);if(!drag)return;if(this.isDividerDisabled(drag.index)){this.endDragGestures();return}const total=this.effectiveOrientation==="vertical"?drag.base.clientHeight:drag.base.clientWidth;if(!Number.isFinite(total)||total<=0){this.endDragGestures();return}let cumulativeDelta=((this.effectiveOrientation==="vertical"?e.clientY:e.clientX)-drag.startPos)/total*100;this.effectiveOrientation==="horizontal"&&isRtl(this)&&(cumulativeDelta=-cumulativeDelta);const incremental=cumulativeDelta-drag.appliedDelta,priorValue=this.sizes[drag.index];if(priorValue===void 0)return;const paired=this.clampPair(this.sizes,drag.index,incremental,total),pairedA=paired[drag.index],pairedB=paired[drag.index+1];if(pairedA===void 0||pairedB===void 0)return;const next=[...this.sizes];next[drag.index]=pairedA,next[drag.index+1]=pairedB,this.requestResize(next,!1)&&(drag.appliedDelta+=pairedA-priorValue,drag.acceptedResize=!0)},this.onPointerUp=e=>{const drag=this.drags.get(e.pointerId);drag&&(this.drags.delete(e.pointerId),e.type==="pointerup"&&drag.acceptedResize&&this.persist(),this.drags.size===0&&this.removeDragListeners())},this.onDividerKeyDown=(e,index)=>{if(this.isDividerDisabled(index))return;const rtl=this.effectiveOrientation==="horizontal"&&isRtl(this),forwardKey=this.effectiveOrientation==="vertical"?"ArrowDown":rtl?"ArrowLeft":"ArrowRight",backwardKey=this.effectiveOrientation==="vertical"?"ArrowUp":rtl?"ArrowRight":"ArrowLeft";if(e.key==="Home"||e.key==="End"){const{min,max}=this.dividerValueRange(index),current=this.sizes[index];if(current!==void 0){const target=e.key==="Home"?min:max;this.applyDelta(index,target-current,!0)&&e.preventDefault()}}else e.key===forwardKey?this.applyDelta(index,KEYBOARD_STEP,!0)&&e.preventDefault():e.key===backwardKey&&this.applyDelta(index,-KEYBOARD_STEP,!0)&&e.preventDefault()}}static{this.defaultStrings={...super.defaultStrings,resizeDivider:LYRA_DEFAULT_resizeDivider,resizeValuePercent:LYRA_DEFAULT_resizeValuePercent}}static{this.ownedCollectionProperties=Object.freeze(["sizes","defaultSizes","panelConstraints"])}static{this.styles=[LyraElement.styles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-resize-request","lr-resize"])}static{this.properties={collapseState:{reflect:!0,attribute:"collapse-state",noAccessor:!0}}}connectedCallback(){super.connectedCallback();const hostWidth=this.getBoundingClientRect().width;hostWidth>0&&(this.measuredInlineSize=hostWidth),this.seedFirstRenderState(()=>this.syncPanelMembership(!1)),this.hasUpdated&&this.syncPanelMembership(!1),this.initializedSizes&&this.ensureSizes(),this.responsiveObservationEnabled&&this.armCollapseObserver(),this.hasUpdated&&this.overlayActive&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateFloatingOverlay(),queueMicrotask(()=>this.overlayHandle?.focusInitial()))}disconnectedCallback(){super.disconnectedCallback(),this.endDragGestures(),this.resetCollapseObserver(),this.resetGutterObserver(),this.overlayHandle?.suspend(),this.releaseOwnedPanels()}adoptedCallback(){super.adoptedCallback(),this.endDragGestures(),this.resetCollapseObserver(),this.resetGutterObserver(),this.releaseOwnedPanels()}firstUpdated(changed){super.firstUpdated(changed),this.responsiveObservationEnabled&&this.armCollapseObserver()}willUpdate(changed){if(super.willUpdate(changed),!this.ownerDocument&&this.panelCount===0&&(this.panelCount=Math.max(this.sizes.length,this.defaultSizes.length,this.panelConstraints.length)),!this.initializedSizes)this.initializeSizes(),this.initializedSizes=!0;else if(changed.has("sizes")){const previous=changed.get("sizes");this.sizesReconciledForMembership?this.sizesReconciledForMembership=!1:this.validLiveSizes(this.sizes)||(Array.isArray(previous)&&this.validLiveSizes(previous)?this.sizes=[...previous]:(this.sizes=[],this.ensureSizes()))}else this.sizes.length===0&&this.ensureSizes();if((changed.has("orientationBreakpoint")||changed.has("orientationBreakpointBasis"))&&this.orientationBreakpoints.configure(this.orientationBreakpoint,this.orientationBreakpointBasis),(changed.has("orientation")||changed.has("narrowOrientation")||changed.has("orientationBreakpoint")||changed.has("orientationBreakpointBasis"))&&this.updateEffectiveOrientation(this.measuredInlineSize,this.hasUpdated&&this.orientationBreakpointBasis==="viewport"),changed.has("collapse")||changed.has("railBreakpoint")||changed.has("floatBreakpoint")||changed.has("collapseBreakpointBasis")){const previousEffective=changed.has("collapse")?this.effectiveCollapseStateFor(changed.get("collapse")??"none"):this.collapseState;changed.has("collapse")&&previousEffective!=="wide"&&this.endDragGestures(),this.collapseBreakpoints.configure(this.railBreakpoint,this.floatBreakpoint,this.collapseBreakpointBasis),this.collapsingIndex!==-1&&!this._forced&&(this._collapseState=this.collapseBreakpoints.classify(this.measuredInlineSize)),this.applyEffectiveCollapseTransition(previousEffective,this.collapseState,this.hasUpdated)}if(changed.has("open")||changed.has("collapseState")||changed.has("collapse")||changed.has("panelCount")){const next=this.collapseState==="floating"&&this.open;next!==this.overlayActive&&(this.overlayActive=next,next?(this.justOpened=!0,this.activateFloatingOverlay()):this.deactivateFloatingOverlay())}}get collapseState(){return this.effectiveCollapseStateFor(this.collapse)}set collapseState(next){if(next==="auto"){this._forced=!1,this.updateCollapseState(this.currentMeasuredWidth());return}this._forced=!0,this.setRequestedCollapseState(next)}get effectiveOrientation(){return this._effectiveOrientation}get responsiveObservationEnabled(){return this.collapse!=="none"||this.orientationBreakpoints.containerObservationEnabled}updateEffectiveOrientation(width,shouldEmit){const next=this.orientationBreakpoints.isBelow(width)?this.narrowOrientation:this.orientation;next!==this._effectiveOrientation&&(this.endDragGestures(),this._effectiveOrientation=next,this.requestUpdate(),shouldEmit&&this.emit("lr-multi-split-orientation-change",{orientation:next}))}currentMeasuredWidth(){return this.baseEl?.clientWidth??0}effectiveCollapseStateFor(collapse){return collapse!=="none"&&this.panelCount>=2?this._collapseState:"wide"}applyEffectiveCollapseTransition(previous,next,shouldEmit=!0){if(previous===next)return;this.endDragGestures(),this.requestUpdate("collapseState",previous);const forceClose=previous==="floating"&&next!=="floating"&&this.open,forcedCloseVersion=this.forcedCloseVersion;shouldEmit&&this.emit("lr-multi-split-collapse-change",{state:next}),forceClose&&this.forcedCloseVersion===forcedCloseVersion&&this.collapseState!=="floating"&&this.setOpen(!1,{force:!0})}setOpen(next,options){if(options?.force){this.open=next,this.forcedCloseVersion+=1,this.emit("lr-toggle",{open:next});return}if(this.open===next)return;const collapseState=this.collapseState,open=this.open,mutationVersion=this.toggleProposalMutationVersion;this.toggleProposalDepth+=1;try{if(this.emit("lr-toggle",{open:next},{cancelable:!0}).defaultPrevented||this.toggleProposalMutationVersion!==mutationVersion||this.collapseState!==collapseState||this.open!==open)return}finally{this.toggleProposalDepth-=1}this.open=next}requestUpdate(name,oldValue,options){this.toggleProposalDepth>0&&(name==="open"&&oldValue!==this.open||name==="collapse"&&oldValue!==this.collapse||name==="collapseState"&&oldValue!==this.collapseState)&&(this.toggleProposalMutationVersion+=1),super.requestUpdate(name,oldValue,options)}setRequestedCollapseState(next,shouldEmit=!0){const previousEffective=this.collapseState;if(next===this._collapseState)return;this._collapseState=next;const nextEffective=this.collapseState;this.applyEffectiveCollapseTransition(previousEffective,nextEffective,shouldEmit),previousEffective===nextEffective&&next!==nextEffective&&this.requestUpdate("collapseState",next)}get storageFullKey(){return this.storageKey?`lr-multi-split:${this.storageKey}:panels`:void 0}panelIdsFor(panels){const ids=[],seen=new Set;for(const panel of panels){const panelId=panel.getAttribute("panel-id")??"";if(!panelId||panelId.trim()!==panelId||seen.has(panelId))return null;seen.add(panelId),ids.push(panelId)}return ids}reconcileIdentitySizes(previousIds,previousValues,nextIds){if(previousIds.length!==previousValues.length||nextIds.length===0)return null;const previousSizes=new Map;previousIds.forEach((panelId,index)=>{previousSizes.set(panelId,previousValues[index])});const retainedTotal=nextIds.reduce((total,panelId)=>total+(previousSizes.get(panelId)??0),0),missingCount=nextIds.filter(panelId=>!previousSizes.has(panelId)).length;if(!(retainedTotal>0)){const equal=100/nextIds.length;return nextIds.map(()=>equal)}const newShare=100/nextIds.length,retainedScale=(100-newShare*missingCount)/retainedTotal;return nextIds.map(panelId=>{const previous=previousSizes.get(panelId);return previous===void 0?newShare:previous*retainedScale})}reconcileSizesByPanelId(previousPanels,nextPanels){if(previousPanels.length!==this.sizes.length||nextPanels.length===0)return null;const previousIds=this.panelIdsFor(previousPanels),nextIds=this.panelIdsFor(nextPanels);return!previousIds||!nextIds?null:this.reconcileIdentitySizes(previousIds,this.sizes,nextIds)}validInitialSizes(value){return!Array.isArray(value)||value.length!==this.panelCount||!value.every(size=>Number.isFinite(size)&&size>=this.safeMin)?!1:Math.abs(value.reduce((sum,size)=>sum+size,0)-100)<.01}validLiveSizes(value){if(!Array.isArray(value)||value.length!==this.panelCount)return!1;const floor=this.normalizedDefaultMin();return value.every(size=>Number.isFinite(size)&&size>=floor)?Math.abs(value.reduce((sum,size)=>sum+size,0)-100)<.01:!1}resolveDefaultSizes(){if(this.defaultSizes.length===0)return null;if(!this.defaultSizes.some(entry=>typeof entry=="string")){const numbers=this.defaultSizes;return this.validInitialSizes(numbers)?[...numbers]:null}const containerSize=this.currentMeasuredWidth()||this.getBoundingClientRect().width;if(!(containerSize>0))return null;const resolvedPx=[];for(const entry of this.defaultSizes){if(typeof entry=="number"){if(!Number.isFinite(entry))return null;resolvedPx.push(entry/100*containerSize);continue}const px=resolveCssLength(entry,{host:this,percentBase:containerSize,viewportBasis:this.ownerDocument.defaultView??void 0});if(px==null||!(px>=0))return null;resolvedPx.push(px)}const sum=resolvedPx.reduce((total,size)=>total+size,0);if(!(sum>0))return null;const normalized=resolvedPx.map(size=>size/sum*100);return this.validInitialSizes(normalized)?normalized:null}initializeSizes(){if(this.validInitialSizes(this.sizes)||this.loadPersisted())return;const resolved=this.resolveDefaultSizes();if(resolved){this.sizes=resolved;return}this.sizes=[],this.ensureSizes()}loadPersisted(){const panelIds=this.panelIdsFor(this.ownedPanels);if(!panelIds)return!1;const parsed=readPersistedState(this.storageFullKey,isPersistedPanelLayout);if(!parsed||parsed.panels.length===0)return!1;const persistedIds=[],persistedSizes=[],seen=new Set;for(const panel of parsed.panels){if(seen.has(panel.panelId))return!1;seen.add(panel.panelId),persistedIds.push(panel.panelId),persistedSizes.push(panel.size)}if(Math.abs(persistedSizes.reduce((sum,size)=>sum+size,0)-100)>=.01)return!1;const normalized=this.reconcileIdentitySizes(persistedIds,persistedSizes,panelIds);return normalized&&this.validInitialSizes(normalized)?(this.sizes=normalized,!0):!1}persist(){const panelIds=this.panelIdsFor(this.ownedPanels);if(!panelIds||panelIds.length!==this.sizes.length)return;const layout={version:1,panels:panelIds.map((panelId,index)=>({panelId,size:this.sizes[index]}))};writePersistedState(this.storageFullKey,layout)}ensureSizes(){if(this.panelCount===this.sizes.length)return;if(this.panelCount<=0){this.sizes=[];return}if(this.sizes.length===0){const equal=100/this.panelCount;this.sizes=Array.from({length:this.panelCount},()=>equal);return}const diff=this.panelCount-this.sizes.length;if(diff>0){const newShare=100/this.panelCount,scale=(100-newShare*diff)/100;this.sizes=[...this.sizes.map(s=>s*scale),...Array.from({length:diff},()=>newShare)]}else{const kept=this.sizes.slice(0,this.panelCount),removedTotal=this.sizes.slice(this.panelCount).reduce((sum,s)=>sum+s,0),keptTotal=kept.reduce((sum,s)=>sum+s,0)||1;this.sizes=kept.map(s=>s+s/keptTotal*removedTotal)}}readPanelStyle(panel,property2){return{value:panel.style.getPropertyValue(property2),priority:panel.style.getPropertyPriority(property2)}}samePanelStyle(left,right){return left.value===right.value&&left.priority===right.priority}snapshotPanelOwnership(panel){const styles2=new Map;for(const property2 of OWNED_PANEL_STYLE_PROPERTIES)styles2.set(property2,this.readPanelStyle(panel,property2));return{styles:styles2,appliedStyles:new Map,hidden:panel.hidden,collapseState:panel.getAttribute("data-collapse-state")}}adoptPanelOwnership(panel,snapshot){for(const property2 of OWNED_PANEL_STYLE_PROPERTIES){const current=this.readPanelStyle(panel,property2),applied=snapshot.appliedStyles.get(property2);(applied&&!this.samePanelStyle(current,applied)||!applied&&!this.samePanelStyle(current,snapshot.styles.get(property2)))&&snapshot.styles.set(property2,current)}(snapshot.appliedHidden!==void 0&&panel.hidden!==snapshot.appliedHidden||snapshot.appliedHidden===void 0&&panel.hidden!==snapshot.hidden)&&(snapshot.hidden=panel.hidden);const collapseState=panel.getAttribute("data-collapse-state");(snapshot.appliedCollapseState!==void 0&&collapseState!==snapshot.appliedCollapseState||snapshot.appliedCollapseState===void 0&&collapseState!==snapshot.collapseState)&&(snapshot.collapseState=collapseState)}applyOwnedPanelStyle(panel,snapshot,property2,value){value.value===""?panel.style.removeProperty(property2):panel.style.setProperty(property2,value.value,value.priority),snapshot.appliedStyles.set(property2,this.readPanelStyle(panel,property2))}applyOwnedPanelStyleValue(panel,snapshot,property2,value){this.applyOwnedPanelStyle(panel,snapshot,property2,{value,priority:""})}applyOwnedPanelHidden(panel,snapshot,hidden){panel.hidden=hidden,snapshot.appliedHidden=panel.hidden}applyOwnedPanelCollapseState(panel,snapshot,state){state===null?panel.removeAttribute("data-collapse-state"):panel.setAttribute("data-collapse-state",state),snapshot.appliedCollapseState=panel.getAttribute("data-collapse-state")}restorePanelOwnership(panel,snapshot){this.adoptPanelOwnership(panel,snapshot);for(const property2 of OWNED_PANEL_STYLE_PROPERTIES){const value=snapshot.styles.get(property2);value.value===""?panel.style.removeProperty(property2):panel.style.setProperty(property2,value.value,value.priority)}panel.hidden=snapshot.hidden,snapshot.collapseState===null?panel.removeAttribute("data-collapse-state"):panel.setAttribute("data-collapse-state",snapshot.collapseState)}panelProjectionDiverged(panel,snapshot){for(const property2 of OWNED_PANEL_STYLE_PROPERTIES){const current=this.readPanelStyle(panel,property2),expected=snapshot.appliedStyles.get(property2)??snapshot.styles.get(property2);if(!this.samePanelStyle(current,expected))return!0}if(panel.hidden!==(snapshot.appliedHidden??snapshot.hidden))return!0;const expectedCollapseState=snapshot.appliedCollapseState!==void 0?snapshot.appliedCollapseState:snapshot.collapseState;return panel.getAttribute("data-collapse-state")!==expectedCollapseState}resetPanelOwnershipObserver(){this.panelOwnershipObserverGeneration+=1,this.panelOwnershipObserver?.disconnect(),this.panelOwnershipObserver=void 0,this.panelOwnershipObserverDocument=void 0}observeOwnedPanels(){this.resetPanelOwnershipObserver();const ownerDocument=this.ownerDocument,MutationObserverConstructor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverConstructor||!this.isConnected||this.ownedPanels.length===0)return;const generation=this.panelOwnershipObserverGeneration,observer=new MutationObserverConstructor(records=>{if(this.panelOwnershipObserver!==observer||this.panelOwnershipObserverDocument!==this.ownerDocument||this.panelOwnershipObserverGeneration!==generation||!this.isConnected)return;records.some(record=>{const panel=record.target,snapshot=this.panelOwnership.get(panel);return snapshot?this.panelProjectionDiverged(panel,snapshot):!1})&&this.requestUpdate()});this.panelOwnershipObserver=observer,this.panelOwnershipObserverDocument=ownerDocument;for(const panel of this.ownedPanels)observer.observe(panel,{attributes:!0,attributeFilter:["style","hidden","data-collapse-state"]})}samePanelSequence(next){return next.length===this.ownedPanels.length&&next.every((panel,index)=>panel===this.ownedPanels[index])}syncPanelMembership(reconcileSizes=!0){const next=[...this.children];if(this.samePanelSequence(next))return;const previousPanels=this.ownedPanels,identitySizes=reconcileSizes?this.reconcileSizesByPanelId(previousPanels,next):null,previousEffective=this.collapseState,nextSet=new Set(next);for(const panel of this.ownedPanels){if(nextSet.has(panel))continue;const snapshot=this.panelOwnership.get(panel);snapshot&&this.restorePanelOwnership(panel,snapshot),this.panelOwnership.delete(panel)}for(const panel of next)this.panelOwnership.has(panel)||this.panelOwnership.set(panel,this.snapshotPanelOwnership(panel));const countChanged=next.length!==this.panelCount;this.ownedPanels=next,this.panelCount=next.length,this.collapsingIndex!==-1&&!this._forced&&(this._collapseState=this.collapseBreakpoints.classify(this.currentMeasuredWidth())),this.applyEffectiveCollapseTransition(previousEffective,this.collapseState,this.hasUpdated),identitySizes?(this.sizesReconciledForMembership=!0,this.sizes=identitySizes):countChanged&&reconcileSizes&&(this.sizesReconciledForMembership=!0,this.ensureSizes()),this.observeOwnedPanels(),this.hasUpdated&&this.requestUpdate()}releaseOwnedPanels(){this.resetPanelOwnershipObserver();for(const panel of this.ownedPanels){const snapshot=this.panelOwnership.get(panel);snapshot&&this.restorePanelOwnership(panel,snapshot)}this.ownedPanels=[],this.panelOwnership.clear()}getContainerSize(){return this.baseEl?this.effectiveOrientation==="vertical"?this.baseEl.clientHeight:this.baseEl.clientWidth:0}resetGutterObserver(){this.gutterObserverFrame!==void 0&&(this.gutterObserverDocument?.defaultView?.cancelAnimationFrame(this.gutterObserverFrame),this.gutterObserverFrame=void 0),this.gutterResizeObserver?.disconnect(),this.gutterResizeObserver=void 0,this.gutterObserverDocument=void 0,this.gutterObservedDividers=[],this.baseEl?.style.removeProperty("--_lr-multi-split-gutters")}updateGutterBudget(){const view=this.ownerDocument.defaultView,base=this.baseEl;if(!view||!base)return;const vertical=this.effectiveOrientation==="vertical",value=`${this.gutterObservedDividers.reduce((total,divider)=>{const style=view.getComputedStyle(divider),properties=vertical?["height","padding-top","padding-bottom","border-top-width","border-bottom-width"]:["width","padding-left","padding-right","border-left-width","border-right-width"],boxProperties=style.boxSizing==="border-box"?properties.slice(0,1):properties;return total+boxProperties.reduce((size,property2)=>size+finiteRange(parseFloat(style.getPropertyValue(property2)),0,0),0)},0)}px`;base.style.getPropertyValue("--_lr-multi-split-gutters")!==value&&base.style.setProperty("--_lr-multi-split-gutters",value)}syncGutterObserver(enabled){const base=this.baseEl;if(!enabled||!this.isConnected||!base){this.resetGutterObserver();return}const ownerDocument=this.ownerDocument,dividers=[...base.querySelectorAll('[part="divider"]')];if(this.gutterResizeObserver&&this.gutterObserverDocument===ownerDocument&&dividers.length===this.gutterObservedDividers.length&&dividers.every((divider,index)=>divider===this.gutterObservedDividers[index])){this.updateGutterBudget();return}this.resetGutterObserver(),this.gutterObservedDividers=dividers,this.gutterObserverDocument=ownerDocument,this.gutterObservedContainerSize=this.getContainerSize(),this.updateGutterBudget();const ownerWindow=ownerDocument.defaultView,ResizeObserverConstructor=ownerWindow?.ResizeObserver;if(!ownerWindow||!ResizeObserverConstructor)return;const observer=new ResizeObserverConstructor(()=>{if(this.gutterResizeObserver!==observer||!this.isConnected||this.ownerDocument!==ownerDocument)return;this.updateGutterBudget();const size=this.getContainerSize();size!==this.gutterObservedContainerSize&&(this.gutterObservedContainerSize=size,this.requestUpdate())});this.gutterResizeObserver=observer;const frame=ownerWindow.requestAnimationFrame(()=>{if(!(this.gutterObserverFrame!==frame||this.gutterResizeObserver!==observer||!this.isConnected||this.ownerDocument!==ownerDocument||this.baseEl!==base)){this.gutterObserverFrame=void 0,observer.observe(base,{box:"border-box"});for(const divider of dividers)observer.observe(divider,{box:"border-box"})}});this.gutterObserverFrame=frame}get collapsingIndex(){return this.collapse==="none"||this.panelCount<2?-1:this.collapse==="start"?0:this.panelCount-1}get collapseActive(){return this.collapsingIndex!==-1&&this.collapseState!=="wide"}isDividerDisabled(index){if(!this.collapseActive)return!1;const adjacent=this.collapsingIndex===0?0:this.panelCount-2;return index===adjacent}updateCollapseState(width,shouldEmit=!0){this.collapse!=="none"&&(this._forced||this.setRequestedCollapseState(this.collapseBreakpoints.classify(width),shouldEmit))}armCollapseObserver(){const observedElement=this.baseEl;if(!this.isConnected||!observedElement)return;const ownerDocument=this.ownerDocument;if(this.collapseResizeObserver&&this.collapseObservedElement===observedElement&&this.collapseObserverOwnerDocument===ownerDocument)return;this.resetCollapseObserver();const ResizeObserverConstructor=ownerDocument.defaultView?.ResizeObserver;if(!ResizeObserverConstructor)return;const generation=this.collapseObserverGeneration,observer=new ResizeObserverConstructor(entries=>{if(this.collapseResizeObserver!==observer||this.collapseObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||this.baseEl!==observedElement)return;const box=entries[0]?.contentBoxSize?.[0],width=box?box.inlineSize:observedElement.getBoundingClientRect().width;this.measuredInlineSize=width,this.updateCollapseState(width),this.updateEffectiveOrientation(width,!0)});this.collapseResizeObserver=observer,this.collapseObservedElement=observedElement,this.collapseObserverOwnerDocument=ownerDocument,observer.observe(observedElement)}resetCollapseObserver(){this.collapseObserverGeneration+=1,this.collapseResizeObserver?.disconnect(),this.collapseResizeObserver=void 0,this.collapseObservedElement=void 0,this.collapseObserverOwnerDocument=void 0}syncCollapseObserver(){if(!this.responsiveObservationEnabled){this.resetCollapseObserver();return}this.armCollapseObserver()}get safeMin(){return finiteRange(this.min,10,0)}normalizedDefaultMin(){if(this.panelCount<=0)return 0;const requested=this.safeMin,available=Math.max(0,100-KEYBOARD_STEP);return Math.min(requested,available/this.panelCount)}resolveConstraintBounds(containerSize){const fallbackMin=this.normalizedDefaultMin(),fallback=Array.from({length:this.panelCount},()=>({min:fallbackMin,max:1/0}));if(this.panelCount<=0)return{bounds:[],usePanelConstraints:!0};const bounds=[];let minimumTotal=0,maximumTotal=0,hasUnboundedMaximum=!1,issueReason;for(let index=0;index<this.panelCount;index++){const constraint=this.panelConstraints[index];let min=this.safeMin,max=1/0,minSet=!1,maxSet=!1;constraint&&(constraint.minPx!=null&&Number.isFinite(constraint.minPx)&&constraint.minPx>=0&&containerSize>0&&(min=constraint.minPx/containerSize*100,minSet=!0),constraint.minPercent!=null&&Number.isFinite(constraint.minPercent)&&constraint.minPercent>=0&&(min=minSet?Math.max(min,constraint.minPercent):constraint.minPercent,minSet=!0),constraint.maxPx!=null&&Number.isFinite(constraint.maxPx)&&constraint.maxPx>=0&&containerSize>0&&(max=constraint.maxPx/containerSize*100,maxSet=!0),constraint.maxPercent!=null&&Number.isFinite(constraint.maxPercent)&&constraint.maxPercent>=0&&(max=maxSet?Math.min(max,constraint.maxPercent):constraint.maxPercent,maxSet=!0),(constraint.minPx!=null&&(!Number.isFinite(constraint.minPx)||constraint.minPx<0)||constraint.maxPx!=null&&(!Number.isFinite(constraint.maxPx)||constraint.maxPx<0)||constraint.minPercent!=null&&(!Number.isFinite(constraint.minPercent)||constraint.minPercent<0)||constraint.maxPercent!=null&&(!Number.isFinite(constraint.maxPercent)||constraint.maxPercent<0))&&(issueReason??="minimum-exceeds-maximum")),min>max&&(issueReason??="minimum-exceeds-maximum"),bounds.push({min,max}),minimumTotal+=min,Number.isFinite(max)?maximumTotal+=max:hasUnboundedMaximum=!0}return issueReason==null&&minimumTotal>100+1e-9&&(issueReason="minimum-total"),issueReason==null&&!hasUnboundedMaximum&&maximumTotal<100-1e-9&&(issueReason="maximum-total"),issueReason==null?{bounds,usePanelConstraints:!0}:{bounds:fallback,usePanelConstraints:!1,issue:{reason:issueReason,panelCount:this.panelCount,minimumTotal,maximumTotal:hasUnboundedMaximum?null:maximumTotal,containerSize}}}percentBounds(index,containerSize){return this.resolveConstraintBounds(containerSize).bounds[index]??{min:0,max:1/0}}hasClampConstraint(constraint){return!!constraint&&(constraint.minPx!=null||constraint.maxPx!=null||constraint.minPercent!=null||constraint.maxPercent!=null)}minSideExpr(constraint){const terms=[];return constraint?.minPx!=null&&Number.isFinite(constraint.minPx)&&constraint.minPx>=0&&terms.push(`${constraint.minPx}px`),constraint?.minPercent!=null&&Number.isFinite(constraint.minPercent)&&constraint.minPercent>=0&&terms.push(`${constraint.minPercent}%`),terms.length===0?`${NO_MIN_PX}px`:terms.length===1?terms[0]:`max(${this.safeMin}%, ${terms.join(", ")})`}maxSideExpr(constraint){const terms=[];return constraint?.maxPx!=null&&Number.isFinite(constraint.maxPx)&&constraint.maxPx>=0&&terms.push(`${constraint.maxPx}px`),constraint?.maxPercent!=null&&Number.isFinite(constraint.maxPercent)&&constraint.maxPercent>=0&&terms.push(`${constraint.maxPercent}%`),terms.length===0?`${NO_MAX_PX}px`:terms.length===1?terms[0]:`min(${terms.join(", ")})`}clampPair(sizes,i,delta,containerSize=0){const next=[...sizes],currentA=next[i],currentB=next[i+1];if(currentA===void 0||currentB===void 0)return next;const pairTotal=currentA+currentB,a=this.percentBounds(i,containerSize),b=this.percentBounds(i+1,containerSize),loRaw=Math.max(a.min,pairTotal-b.max),hiRaw=Math.min(a.max,pairTotal-b.min),lo=Math.min(loRaw,pairTotal),hi=Math.max(hiRaw,lo),clampedA=Math.min(Math.max(currentA+delta,lo),hi);return next[i]=clampedA,next[i+1]=pairTotal-clampedA,next}requestResize(next,commit){return next.length===this.sizes.length&&next.every((size,index)=>Math.abs(size-this.sizes[index])<=1e-9)||this.emit("lr-resize-request",{sizes:[...next]},{cancelable:!0}).defaultPrevented?!1:(this.sizes=next,this.emit("lr-resize",{sizes:[...this.sizes]}),commit&&this.persist(),!0)}applyDelta(index,delta,commit){const next=this.clampPair(this.sizes,index,delta,this.getContainerSize());return next.length!==this.sizes.length||next.some((size,currentIndex)=>Math.abs(size-this.sizes[currentIndex])>1e-9)?(this.requestResize(next,commit),!0):!1}get floatingPanelEl(){const index=this.collapsingIndex;return index===-1?null:this.ownedPanels[index]??null}activateFloatingOverlay(){const panel=this.floatingPanelEl;panel&&(this.floatingDialogPanel=panel,this.floatingDialogPreviousRole=panel.getAttribute("role"),this.floatingDialogPreviousAriaModal=panel.getAttribute("aria-modal"),panel.setAttribute("role","dialog"),panel.setAttribute("aria-modal","true")),this.overlayHandle=activateOverlay({host:this,panel:()=>this.floatingPanelEl,modalRoot:()=>this.floatingPanelEl,onEscape:()=>this.setOpen(!1),onBackdrop:()=>this.setOpen(!1),lockScroll:!0,suspendWhenUnrendered:!0})}deactivateFloatingOverlay(){this.overlayHandle?.deactivate(),this.overlayHandle=void 0;const panel=this.floatingDialogPanel;this.floatingDialogPanel=null,panel&&(this.floatingDialogPreviousRole===null?panel.removeAttribute("role"):panel.setAttribute("role",this.floatingDialogPreviousRole),this.floatingDialogPreviousAriaModal===null?panel.removeAttribute("aria-modal"):panel.setAttribute("aria-modal",this.floatingDialogPreviousAriaModal))}removeDragListeners(){const ownerWindow=this.dragOwnerWindow;this.dragOwnerWindow=void 0,ownerWindow?.removeEventListener("pointermove",this.onPointerMove),ownerWindow?.removeEventListener("pointerup",this.onPointerUp),ownerWindow?.removeEventListener("pointercancel",this.onPointerUp),ownerWindow?.removeEventListener("lostpointercapture",this.onPointerUp)}endDragGestures(){this.drags.clear(),this.removeDragListeners()}dividerValueRange(index,bounds=this.resolveConstraintBounds(this.getContainerSize()).bounds){const pairTotal=(this.sizes[index]??0)+(this.sizes[index+1]??0),leading=bounds[index],trailing=bounds[index+1],min=Math.max(leading.min,pairTotal-trailing.max);return{min,max:Math.max(min,Math.min(leading.max,pairTotal-trailing.min))}}updated(changed){super.updated(changed),(changed.has("collapse")||changed.has("orientationBreakpoint")||changed.has("orientationBreakpointBasis"))&&this.syncCollapseObserver(),this.orientationBreakpoints.active?this.setAttribute("data-effective-orientation",this._effectiveOrientation):this.removeAttribute("data-effective-orientation");const constraintResolution=this.resolveConstraintBounds(this.getContainerSize()),issue=constraintResolution.issue,issueKey=issue?`${issue.reason}:${issue.panelCount}:${issue.minimumTotal}:${issue.maximumTotal??"unbounded"}`:"";issueKey!==this.constraintIssueKey&&(this.constraintIssueKey=issueKey,issue&&this.emit("lr-multi-split-constraints-invalid",issue));const panels=this.ownedPanels;for(const panel of panels){const snapshot=this.panelOwnership.get(panel);snapshot&&this.adoptPanelOwnership(panel,snapshot)}const collapsingIndex=this.collapseActive?this.collapsingIndex:-1;this.syncGutterObserver(collapsingIndex===-1&&this.panelConstraints.some(constraint=>finiteRange(constraint?.minPx??0,0,0)>0));const pixelMinimumTotal=constraintResolution.usePanelConstraints?this.panelConstraints.slice(0,this.panelCount).reduce((total,constraint)=>total+finiteRange(constraint?.minPx??0,0,0),0):0,redistributedShare=new Array(panels.length).fill(0);if(collapsingIndex===-1){let freedPercent=0;const growableIndexes=[];let growableTotal=0;for(let i=0;i<panels.length;i++){const percent=this.sizes[i]??0,constraint=constraintResolution.usePanelConstraints?this.panelConstraints[i]:void 0;if(this.hasClampConstraint(constraint)){const bounds=constraintResolution.bounds[i],clamped=bounds?Math.min(Math.max(percent,bounds.min),bounds.max):percent;clamped<percent&&(freedPercent+=percent-clamped)}else growableIndexes.push(i),growableTotal+=percent}if(freedPercent>0&&growableTotal>0)for(const i of growableIndexes)redistributedShare[i]=freedPercent*((this.sizes[i]??0)/growableTotal)}panels.forEach((panel,i)=>{const snapshot=this.panelOwnership.get(panel);if(!snapshot)return;const percent=this.sizes[i]??0,constraint=constraintResolution.usePanelConstraints?this.panelConstraints[i]:void 0,pixelMinimum=finiteRange(constraint?.minPx??0,0,0);if(collapsingIndex===-1&&pixelMinimum>0&&pixelMinimumTotal>0?this.applyOwnedPanelStyleValue(panel,snapshot,"--_lr-multi-split-panel-min",`min(${pixelMinimum}px, max(0px, calc((100% - var(--_lr-multi-split-gutters, 0px)) * ${pixelMinimum/pixelMinimumTotal})))`):this.applyOwnedPanelStyle(panel,snapshot,"--_lr-multi-split-panel-min",snapshot.styles.get("--_lr-multi-split-panel-min")),this.applyOwnedPanelStyle(panel,snapshot,"inline-size",snapshot.styles.get("inline-size")),this.applyOwnedPanelHidden(panel,snapshot,snapshot.hidden),collapsingIndex===i&&this.collapseState==="rail")this.applyOwnedPanelStyleValue(panel,snapshot,"flex",`0 0 ${this.railWidth}`);else if(collapsingIndex===i&&this.collapseState==="floating"&&!this.open)this.applyOwnedPanelStyleValue(panel,snapshot,"flex","none"),this.applyOwnedPanelHidden(panel,snapshot,!0);else if(collapsingIndex===i&&this.collapseState==="floating")this.applyOwnedPanelStyleValue(panel,snapshot,"flex","none"),this.applyOwnedPanelStyleValue(panel,snapshot,"inline-size",`${percent}%`);else if(collapsingIndex!==-1&&i!==collapsingIndex)this.applyOwnedPanelStyleValue(panel,snapshot,"flex",this.hasClampConstraint(constraint)?`0 1 clamp(${this.minSideExpr(constraint)}, ${percent}%, ${this.maxSideExpr(constraint)})`:`${percent} 1 0%`);else{const adjustedPercent=percent+(redistributedShare[i]??0);this.applyOwnedPanelStyleValue(panel,snapshot,"flex",this.hasClampConstraint(constraint)?`0 1 clamp(${this.minSideExpr(constraint)}, ${percent}%, ${this.maxSideExpr(constraint)})`:`0 1 ${adjustedPercent}%`)}this.applyOwnedPanelStyleValue(panel,snapshot,"order",String(i*2)),collapsingIndex===i?this.applyOwnedPanelCollapseState(panel,snapshot,this.collapseState):this.applyOwnedPanelCollapseState(panel,snapshot,null)}),collapsingIndex!==-1?this.setAttribute("data-collapse-state",this.collapseState):this.removeAttribute("data-collapse-state"),this.justOpened&&(this.justOpened=!1,this.overlayHandle?.focusInitial())}render(){const dividers=[],bounds=this.resolveConstraintBounds(this.getContainerSize()).bounds;for(let i=0;i<this.panelCount-1;i++){const{min:valueMin,max:valueMax}=this.dividerValueRange(i,bounds),disabled=this.isDividerDisabled(i);dividers.push(html`<div
         part="divider"
         role="separator"
         aria-label=${this.dividerLabel?this.dividerLabel(i,this.panelCount):this.localize("resizeDivider",void 0,{a:getNumberFormat(this.effectiveLocale).format(i+1),b:getNumberFormat(this.effectiveLocale).format(i+2)})}

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

@@ -14,7 +14,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>
-  `}class LyraPage extends LyraElement{constructor(){super(...arguments),this.view="desktop",this.navOpen=!1,this.mobileBreakpoint="768px",this.navigationPlacement="start",this.disableNavigationToggle=!1,this.accessibleLabel=null,this.mainId=nextId("page-main"),this.navigationId=nextId("page-navigation"),this.drawerId=nextId("page-drawer"),this.skipTargetId=nextId("page-skip-target"),this.skipLabelId=nextId("page-skip-label"),this.fragmentTargetId=this.getAttribute("id")||this.skipTargetId,this.fragmentTabIndex=this.getAttribute("tabindex")??"-1",this.customToggles=[],this.customToggleOwnership=new Map,this.onWindowResize=()=>this.measureAllocation(),this.resolveNavigationRestoreTarget=()=>{const owner=this.navigationTriggerOwner;if(owner?.isConnected){const accessible=resolveAccessibleTrigger(owner);if(isComposedFocusAvailable(accessible))return accessible}const builtIn=this.disableNavigationToggle?null:this.renderRoot.querySelector('[part~="navigation-toggle"]');return builtIn&&isComposedFocusAvailable(builtIn)?builtIn:this.mainElement&&isComposedFocusAvailable(this.mainElement)?this.mainElement:null},this.onDefaultToggleClick=event=>{this.rememberTriggerAndToggle(event.currentTarget)},this.onToggleSlotClick=event=>{const trigger=event.composedPath().find(candidate=>candidate?.nodeType===1&&candidate.getAttribute("slot")==="navigation-toggle");trigger&&this.customToggles.includes(trigger)&&!this.isUnavailableCustomToggle(trigger)&&this.rememberTriggerAndToggle(trigger)},this.onPageClick=event=>{const path=event.composedPath();if(path.some(candidate=>candidate?.nodeType===1&&candidate.getAttribute("slot")==="navigation-toggle"))return;const trigger=path.find(candidate=>candidate?.nodeType===1&&candidate.hasAttribute("data-toggle-nav"));trigger&&this.rememberTriggerAndToggle(trigger)},this.onBackdropClick=event=>{event.target===event.currentTarget&&this.overlayHandle?.dismissBackdrop()},this.onSkipClick=event=>{event.preventDefault(),this.mainElement?.focus(),this.mainElement?.scrollIntoView({block:"start"})}}static{this.defaultStrings={...super.defaultStrings,closeNavigation:LYRA_DEFAULT_closeNavigation,navigation:LYRA_DEFAULT_navigation,openNavigation:LYRA_DEFAULT_openNavigation,skipToContent:LYRA_DEFAULT_skipToContent}}static{this.knownUnobservedAttributes=["disable-sticky"]}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.measureAllocation(),this.observeAllocation(),this.hasUpdated&&this.view==="mobile"&&this.navOpen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.syncOverlay(),queueMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&queueMicrotask(()=>this.isConnected&&this.syncCustomToggle())}disconnectedCallback(){this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0,this.overlayHandle?.suspend(),this.releaseCustomToggleA11y(),super.disconnectedCallback()}firstUpdated(changed){super.firstUpdated(changed),this.measureAllocation(),this.observeAllocation()}willUpdate(changed){super.willUpdate(changed),changed.has("fragmentTargetId")&&!this.fragmentTargetId&&(this.fragmentTargetId=this.skipTargetId),changed.has("fragmentTabIndex")&&this.fragmentTabIndex===null&&(this.fragmentTabIndex="-1")}updated(changed){super.updated(changed),changed.has("mobileBreakpoint")&&changed.get("mobileBreakpoint")!==void 0&&this.measureAllocation(),this.overlayHandle!==void 0&&(!this.isConnected||this.view!=="mobile"||!this.navOpen)?(this.syncOverlay(changed),this.syncCustomToggle()):(this.syncCustomToggle(),this.syncOverlay(changed))}observeAllocation(){if(!this.isConnected)return;this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0;const view=this.ownerDocument.defaultView,ResizeObserverConstructor=view?.ResizeObserver;if(ResizeObserverConstructor){this.resizeObserver??=new ResizeObserverConstructor(entries=>{const entry=entries.find(candidate=>candidate.target===this)??entries[0],inlineSize=entry?.contentBoxSize?.[0]?.inlineSize??entry?.contentRect.width;inlineSize!==void 0&&this.applyMeasuredInlineSize(inlineSize)}),this.resizeObserver.observe(this);return}view&&(this.resizeView=view,view.addEventListener("resize",this.onWindowResize))}measureAllocation(){const width=this.getBoundingClientRect().width;width>0&&this.applyMeasuredInlineSize(width)}applyMeasuredInlineSize(width){if(!Number.isFinite(width)||width<0)return;const resolved=resolveCssLength(this.mobileBreakpoint,{host:this}),fallback=resolveCssLength(DEFAULT_MOBILE_BREAKPOINT,{host:this})??768,breakpoint=Math.max(0,resolved!==void 0&&Number.isFinite(resolved)?resolved:fallback),next=width<=breakpoint?"mobile":"desktop";next!==this.view&&(this.view=next)}syncOverlay(changed){if(this.isConnected&&this.view==="mobile"&&this.navOpen){if(this.overlayHandle?.isActive()){this.overlayHandle.resume(),this.navigationTriggerOwner&&this.overlayHandle.updateRestoreFocusTo(this.resolveNavigationRestoreTarget);return}this.overlayHandle=activateOverlay({host:this,panel:()=>this.drawerElement??null,modalRoot:()=>this.drawerElement??null,onEscape:()=>this.hideNavigation(),onBackdrop:()=>this.hideNavigation(),...this.navigationTriggerOwner?{restoreFocusTo:this.resolveNavigationRestoreTarget}:{},lockScroll:!0,suspendWhenUnrendered:!0}),this.overlayHandle.focusInitial();return}if(this.overlayHandle){const restoreFocus=!!(changed?.has("navOpen")&&!this.navOpen);this.overlayHandle.deactivate({restoreFocus}),this.overlayHandle=void 0}this.navOpen||(this.navigationTriggerOwner=void 0)}syncCustomToggle(){const nextToggles=(this.shadowRoot?.querySelector('slot[name="navigation-toggle"]')?.assignedElements({flatten:!0})??[]).filter(candidate=>candidate.nodeType===1&&candidate.getRootNode()!==this.shadowRoot),previous=this.customToggle;this.customToggles=nextToggles,this.customToggle=nextToggles[0];for(const[host,ownership]of this.customToggleOwnership)nextToggles.includes(host)||(ownership.accessibleAria?.release(),ownership.hostAria.release(),this.customToggleOwnership.delete(host));const localizedLabel=this.localize(this.navOpen?"closeNavigation":"openNavigation"),drawer=this.drawerElement;for(const host of nextToggles){const accessible=resolveAccessibleTrigger(host);let ownership=this.customToggleOwnership.get(host);ownership?accessible!==ownership.accessible&&(ownership.accessibleAria?.release(),ownership.accessibleAria=void 0,ownership.accessible=accessible,ownership.accessibleAuthoredLabel=accessible.hasAttribute("aria-label")?accessible.getAttribute("aria-label")??"":null):(ownership={accessible,accessibleAuthoredLabel:accessible.hasAttribute("aria-label")?accessible.getAttribute("aria-label")??"":null,hostAria:acquireAriaOwnership(null,{}),hostAuthoredLabel:host.hasAttribute("aria-label")?host.getAttribute("aria-label")??"":null},this.customToggleOwnership.set(host,ownership)),ownership.hostAria.update(host,{attributes:{"aria-haspopup":"dialog","aria-expanded":this.navOpen?"true":"false","aria-label":ownership.hostAuthoredLabel??localizedLabel},controls:drawer?[drawer]:[]});const distinctAccessible=accessible===host?null:accessible,accessibleContribution={attributes:{"aria-haspopup":"dialog","aria-expanded":this.navOpen?"true":"false","aria-label":ownership.accessibleAuthoredLabel??ownership.hostAuthoredLabel??localizedLabel},controls:drawer?[drawer]:[]};ownership.accessibleAria?ownership.accessibleAria.update(distinctAccessible,accessibleContribution):ownership.accessibleAria=acquireAriaOwnership(distinctAccessible,accessibleContribution)}this.navOpen&&this.navigationTriggerOwner&&!nextToggles.includes(this.navigationTriggerOwner)?(this.navigationTriggerOwner=this.customToggle,this.overlayHandle?.updateRestoreFocusTo(this.resolveNavigationRestoreTarget)):this.navOpen&&previous&&this.navigationTriggerOwner===previous&&this.overlayHandle?.updateRestoreFocusTo(this.resolveNavigationRestoreTarget)}releaseCustomToggleA11y(){for(const ownership of this.customToggleOwnership.values())ownership.accessibleAria?.release(),ownership.hostAria.release();this.customToggleOwnership.clear(),this.customToggle=void 0,this.customToggles=[]}isUnavailableCustomToggle(trigger){const accessible=resolveAccessibleTrigger(trigger);return[trigger,accessible].some(candidate=>candidate.hasAttribute("hidden")||candidate.hasAttribute("inert")||candidate.matches(":disabled")||isAriaTrue(candidate.getAttribute("aria-hidden"))||isAriaTrue(candidate.getAttribute("aria-disabled")))}rememberTriggerAndToggle(trigger){this.syncCustomToggle(),this.navOpen||(this.navigationTriggerOwner=trigger),this.toggleNavigation()}requestNavOpen(next){this.navOpen!==next&&(this.emit("lr-nav-toggle",{open:next},{cancelable:!0}).defaultPrevented||(this.navOpen=next))}showNavigation(){this.requestNavOpen(!0)}hideNavigation(){this.requestNavOpen(!1)}toggleNavigation(){this.requestNavOpen(!this.navOpen)}visiblePixelsInViewport(element){if(!element)return 0;const rect=element.getBoundingClientRect();if(!Number.isFinite(rect.top)||!Number.isFinite(rect.bottom))return 0;const candidateHeight=element.ownerDocument.defaultView?.innerHeight??element.ownerDocument.documentElement.clientHeight;if(!Number.isFinite(candidateHeight)||candidateHeight<=0)return 0;const viewportHeight=finiteRange(candidateHeight,0,0),visible=Math.min(rect.bottom,viewportHeight)-Math.max(rect.top,0);return finiteRange(visible,0,0,viewportHeight)}render(){const mobile=this.view==="mobile",overlayOpen=mobile&&this.navOpen,navigationLabel=this.accessibleLabel??this.localize("navigation");return html`
+  `}class LyraPage extends LyraElement{constructor(){super(...arguments),this.view="desktop",this.navOpen=!1,this.mobileBreakpoint="768px",this.navigationPlacement="start",this.disableNavigationToggle=!1,this.accessibleLabel=null,this.mainId=nextId("page-main"),this.navigationId=nextId("page-navigation"),this.drawerId=nextId("page-drawer"),this.skipTargetId=nextId("page-skip-target"),this.skipLabelId=nextId("page-skip-label"),this.fragmentTargetId=this.getAttribute("id")||this.skipTargetId,this.fragmentTabIndex=this.getAttribute("tabindex")??"-1",this.customToggles=[],this.customToggleOwnership=new Map,this.onWindowResize=()=>this.measureAllocation(),this.resolveNavigationRestoreTarget=()=>{const owner=this.navigationTriggerOwner;if(owner?.isConnected){const accessible=resolveAccessibleTrigger(owner);if(isComposedFocusAvailable(accessible))return accessible}const builtIn=this.disableNavigationToggle?null:this.renderRoot.querySelector('[part~="navigation-toggle"]');return builtIn&&isComposedFocusAvailable(builtIn)?builtIn:this.mainElement&&isComposedFocusAvailable(this.mainElement)?this.mainElement:null},this.onDefaultToggleClick=event=>{this.rememberTriggerAndToggle(event.currentTarget)},this.onToggleSlotClick=event=>{const trigger=event.composedPath().find(candidate=>candidate?.nodeType===1&&candidate.getAttribute("slot")==="navigation-toggle");trigger&&this.customToggles.includes(trigger)&&!this.isUnavailableCustomToggle(trigger)&&this.rememberTriggerAndToggle(trigger)},this.onPageClick=event=>{const path=event.composedPath();if(path.some(candidate=>candidate?.nodeType===1&&candidate.getAttribute("slot")==="navigation-toggle"))return;const trigger=path.find(candidate=>candidate?.nodeType===1&&candidate.hasAttribute("data-toggle-nav"));trigger&&this.rememberTriggerAndToggle(trigger)},this.onBackdropClick=event=>{event.target===event.currentTarget&&this.overlayHandle?.dismissBackdrop()},this.onSkipClick=event=>{event.preventDefault(),this.mainElement?.focus(),this.mainElement?.scrollIntoView({block:"start"})}}static{this.defaultStrings={...super.defaultStrings,closeNavigation:LYRA_DEFAULT_closeNavigation,navigation:LYRA_DEFAULT_navigation,openNavigation:LYRA_DEFAULT_openNavigation,skipToContent:LYRA_DEFAULT_skipToContent}}static{this.knownUnobservedAttributes=["disable-sticky"]}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.measureAllocation(),this.observeAllocation(),this.hasUpdated&&this.view==="mobile"&&this.navOpen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.syncOverlay(),queueMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&queueMicrotask(()=>this.isConnected&&this.syncCustomToggle())}disconnectedCallback(){this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0,this.overlayHandle?.suspend(),this.releaseCustomToggleA11y(),super.disconnectedCallback()}firstUpdated(changed){super.firstUpdated(changed),this.measureAllocation(),this.observeAllocation()}willUpdate(changed){super.willUpdate(changed),changed.has("fragmentTargetId")&&!this.fragmentTargetId&&(this.fragmentTargetId=this.skipTargetId),changed.has("fragmentTabIndex")&&this.fragmentTabIndex===null&&(this.fragmentTabIndex="-1")}updated(changed){super.updated(changed),changed.has("mobileBreakpoint")&&changed.get("mobileBreakpoint")!==void 0&&this.measureAllocation(),this.overlayHandle!==void 0&&(!this.isConnected||this.view!=="mobile"||!this.navOpen)?(this.syncOverlay(changed),this.syncCustomToggle()):(this.syncCustomToggle(),this.syncOverlay(changed))}observeAllocation(){if(!this.isConnected)return;this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0;const view=this.ownerDocument.defaultView,ResizeObserverConstructor=view?.ResizeObserver;if(ResizeObserverConstructor){this.resizeObserver??=new ResizeObserverConstructor(entries=>{const entry=entries.find(candidate=>candidate.target===this)??entries[0],inlineSize=entry?.contentBoxSize?.[0]?.inlineSize??entry?.contentRect.width;inlineSize!==void 0&&this.applyMeasuredInlineSize(inlineSize)}),this.resizeObserver.observe(this);return}view&&(this.resizeView=view,view.addEventListener("resize",this.onWindowResize))}measureAllocation(){const width=this.getBoundingClientRect().width;width>0&&this.applyMeasuredInlineSize(width)}applyMeasuredInlineSize(width){if(!Number.isFinite(width)||width<0)return;const resolved=resolveCssLength(this.mobileBreakpoint,{host:this}),fallback=resolveCssLength(DEFAULT_MOBILE_BREAKPOINT,{host:this})??768,breakpoint=Math.max(0,resolved!==void 0&&Number.isFinite(resolved)?resolved:fallback),next=width<=breakpoint?"mobile":"desktop";next!==this.view&&(this.view=next)}syncOverlay(changed){if(this.isConnected&&this.view==="mobile"&&this.navOpen){if(this.overlayHandle?.isActive()){this.overlayHandle.resume(),this.navigationTriggerOwner&&this.overlayHandle.updateRestoreFocusTo(this.resolveNavigationRestoreTarget);return}this.overlayHandle=activateOverlay({host:this,panel:()=>this.drawerElement??null,modalRoot:()=>this.drawerElement??null,onEscape:()=>this.hideNavigation(),onBackdrop:()=>this.hideNavigation(),...this.navigationTriggerOwner?{restoreFocusTo:this.resolveNavigationRestoreTarget}:{},lockScroll:!0,suspendWhenUnrendered:!0}),this.overlayHandle.focusInitial();return}if(this.overlayHandle){const restoreFocus=!!(changed?.has("navOpen")&&!this.navOpen);this.overlayHandle.deactivate({restoreFocus}),this.overlayHandle=void 0}this.navOpen||(this.navigationTriggerOwner=void 0)}syncCustomToggle(){const nextToggles=(this.shadowRoot?.querySelector('slot[name="navigation-toggle"]')?.assignedElements({flatten:!0})??[]).filter(candidate=>candidate.nodeType===1&&candidate.getRootNode()!==this.shadowRoot),previous=this.customToggle;this.customToggles=nextToggles,this.customToggle=nextToggles[0];for(const[host,ownership]of this.customToggleOwnership)nextToggles.includes(host)||(ownership.accessibleAria?.release(),ownership.hostAria.release(),this.customToggleOwnership.delete(host));const localizedLabel=this.localize(this.navOpen?"closeNavigation":"openNavigation"),drawer=this.drawerElement;for(const host of nextToggles){const accessible=resolveAccessibleTrigger(host);let ownership=this.customToggleOwnership.get(host);ownership?accessible!==ownership.accessible&&(ownership.accessibleAria?.release(),ownership.accessibleAria=void 0,ownership.accessible=accessible,ownership.accessibleAuthoredLabel=accessible.hasAttribute("aria-label")?accessible.getAttribute("aria-label")??"":null):(ownership={accessible,accessibleAuthoredLabel:accessible.hasAttribute("aria-label")?accessible.getAttribute("aria-label")??"":null,hostAria:acquireAriaOwnership(null,{}),hostAuthoredLabel:host.hasAttribute("aria-label")?host.getAttribute("aria-label")??"":null},this.customToggleOwnership.set(host,ownership)),ownership.hostAria.update(host,{attributes:{"aria-haspopup":"dialog","aria-expanded":this.navOpen?"true":"false","aria-label":ownership.hostAuthoredLabel??localizedLabel},controls:drawer?[drawer]:[]});const distinctAccessible=accessible===host?null:accessible,accessibleContribution={attributes:{"aria-haspopup":"dialog","aria-expanded":this.navOpen?"true":"false","aria-label":ownership.accessibleAuthoredLabel??ownership.hostAuthoredLabel??localizedLabel},controls:drawer?[drawer]:[]};ownership.accessibleAria?ownership.accessibleAria.update(distinctAccessible,accessibleContribution):ownership.accessibleAria=acquireAriaOwnership(distinctAccessible,accessibleContribution)}this.navOpen&&this.navigationTriggerOwner&&!nextToggles.includes(this.navigationTriggerOwner)?(this.navigationTriggerOwner=this.customToggle,this.overlayHandle?.updateRestoreFocusTo(this.resolveNavigationRestoreTarget)):this.navOpen&&previous&&this.navigationTriggerOwner===previous&&this.overlayHandle?.updateRestoreFocusTo(this.resolveNavigationRestoreTarget)}releaseCustomToggleA11y(){for(const ownership of this.customToggleOwnership.values())ownership.accessibleAria?.release(),ownership.hostAria.release();this.customToggleOwnership.clear(),this.customToggle=void 0,this.customToggles=[]}isUnavailableCustomToggle(trigger){const accessible=resolveAccessibleTrigger(trigger);return[trigger,accessible].some(candidate=>candidate.hasAttribute("hidden")||candidate.hasAttribute("inert")||candidate.matches(":disabled")||isAriaTrue(candidate.getAttribute("aria-hidden"))||isAriaTrue(candidate.getAttribute("aria-disabled")))}rememberTriggerAndToggle(trigger){this.syncCustomToggle(),this.navOpen||(this.navigationTriggerOwner=trigger),this.toggleNavigation()}requestNavOpen(next){this.navOpen!==next&&(this.emit("lr-nav-toggle",{open:next},{cancelable:!0}).defaultPrevented||(this.navOpen=next))}showNavigation(){this.requestNavOpen(!0)}hideNavigation(){this.requestNavOpen(!1)}toggleNavigation(){this.requestNavOpen(!this.navOpen)}visiblePixelsInViewport(element){if(!element)return 0;const rect=element.getBoundingClientRect();if(!Number.isFinite(rect.top)||!Number.isFinite(rect.bottom))return 0;const candidateHeight=element.ownerDocument.defaultView?.innerHeight??element.ownerDocument.documentElement.clientHeight;if(!Number.isFinite(candidateHeight)||candidateHeight<=0)return 0;const viewportHeight=finiteRange(candidateHeight,0,0),visible=Math.min(rect.bottom,viewportHeight)-Math.max(rect.top,0);return finiteRange(visible,0,0,viewportHeight)}render(){const mobile=this.view==="mobile",overlayOpen=mobile&&this.navOpen,navigationLabel=this.accessibleLabel??this.localize("navigation"),hostDescribedBy=this.getAttribute("aria-describedby");return html`
       <div part="base page" @click=${this.onPageClick}>
         <a
           part="skip-to-content"
@@ -65,6 +65,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
               role=${overlayOpen?"dialog":nothing}
               aria-modal=${overlayOpen?"true":nothing}
               aria-label=${overlayOpen?navigationLabel:nothing}
+              aria-describedby=${overlayOpen&&hostDescribedBy?hostDescribedBy:nothing}
               aria-hidden=${mobile&&!this.navOpen?"true":nothing}
               tabindex=${overlayOpen?"-1":nothing}
               ?inert=${mobile&&!this.navOpen}

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

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{--_lr-page-aside-width:var(--aside-width,auto);--_lr-page-banner-height:var(--banner-height,calc(0 * var(--lr-size-1px)));--_lr-page-header-height:var(--header-height,calc(0 * var(--lr-size-1px)));--_lr-page-main-width:var(--main-width,1fr);--_lr-page-menu-width:var(--menu-width,auto);--_lr-page-subheader-height:var(--subheader-height,calc(0 * var(--lr-size-1px)));min-inline-size:0;color:var(--lr-color-text);contain-intrinsic-inline-size:var(--lr-size-20rem);display:block;container-type:inline-size}[part~=page]{background:var(--lr-color-surface);flex-direction:column;min-block-size:100dvh;min-inline-size:0;display:flex;overflow-x:clip}[part~=skip-to-content]{z-index:var(--lr-layer-toast);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);box-sizing:border-box;padding-inline:var(--lr-space-m);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);opacity:0;pointer-events:none;background:var(--lr-color-surface-overlay);color:var(--lr-color-text);box-shadow:var(--lr-shadow-m);transform:translateY(calc(-100% - var(--lr-space-l)));transition:opacity var(--lr-transition-fast), transform var(--lr-transition-fast), background-color var(--lr-transition-fast);cursor:pointer;justify-content:center;align-items:center;text-decoration:none;display:inline-flex;position:fixed;inset-block-start:max(var(--lr-space-s), var(--lr-safe-area-top));inset-inline-start:max(var(--lr-space-s), var(--lr-safe-area-inline-start))}[part~=skip-to-content]:where(:hover){background:var(--lr-page-skip-to-content-hover-bg,var(--lr-color-brand-quiet));color:var(--lr-page-skip-to-content-hover-color,var(--lr-color-brand))}[part~=skip-to-content]:where(:active){background:var(--lr-page-skip-to-content-active-bg,color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-page-skip-to-content-active-color,var(--lr-color-brand))}[part~=skip-to-content]:where(:focus-visible){opacity:1;pointer-events:auto;outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset);transform:none}[part~=banner],[part~=header],[part~=subheader],[part~=menu],[part~=navigation-header],[part~=navigation-footer],[part~=main-header],[part~=main-content],[part~=main-footer],[part~=aside],[part~=footer]{overflow-wrap:anywhere;min-inline-size:0}[part~=banner]{min-block-size:var(--lr-page-banner-height,var(--_lr-page-banner-height))}[part~=header]{justify-content:space-between;align-items:center;gap:var(--lr-space-s);min-block-size:var(--lr-page-header-height,var(--_lr-page-header-height));display:flex}[part~=subheader]{min-block-size:var(--lr-page-subheader-height,var(--_lr-page-subheader-height))}:host(:not([disable-sticky~=banner])) [part~=banner]{z-index:var(--lr-layer-content);position:sticky;inset-block-start:0}:host(:not([disable-sticky~=header])) [part~=header]{z-index:var(--lr-layer-content);position:sticky;inset-block-start:var(--lr-page-banner-height,var(--_lr-page-banner-height))}:host(:not([disable-sticky~=subheader])) [part~=subheader]{z-index:var(--lr-layer-content);position:sticky;inset-block-start:calc(var(--lr-page-banner-height,var(--_lr-page-banner-height)) + var(--lr-page-header-height,var(--_lr-page-header-height)))}.navigation-toggle-container{flex:none;display:none}:host([view=mobile]) .navigation-toggle-container{display:block}[part~=navigation-toggle]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);box-sizing:border-box;padding:var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;cursor:pointer;justify-content:center;align-items:center;display:inline-flex}:host([disable-navigation-toggle]) [part~=navigation-toggle]{display:none}[part~=navigation-toggle]:where(:hover),::slotted([slot=navigation-toggle]:hover){background:var(--lr-page-navigation-toggle-hover-bg,var(--lr-color-brand-quiet));color:var(--lr-page-navigation-toggle-hover-color,var(--lr-color-brand))}[part~=navigation-toggle]:where(:active),::slotted([slot=navigation-toggle]:active){background:var(--lr-page-navigation-toggle-active-bg,color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-page-navigation-toggle-active-color,var(--lr-color-brand))}[part~=navigation-toggle]:where(:focus-visible),::slotted([slot=navigation-toggle]:focus-visible){outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}::slotted([slot=navigation-toggle]){min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:pointer}[part~=navigation-toggle-icon]{pointer-events:none;justify-content:center;align-items:center;display:inline-flex}[part~=navigation-toggle-icon] svg{display:block}[part~=body]{grid-template-areas:"menu navigation main aside";grid-template-columns:var(--lr-page-menu-width,var(--_lr-page-menu-width)) auto minmax(0, var(--lr-page-main-width,var(--_lr-page-main-width))) var(--lr-page-aside-width,var(--_lr-page-aside-width));flex:auto;align-items:stretch;min-inline-size:0;display:grid}:host([navigation-placement=end]) [part~=body]{grid-template-areas:"menu main aside navigation";grid-template-columns:var(--lr-page-menu-width,var(--_lr-page-menu-width)) minmax(0, var(--lr-page-main-width,var(--_lr-page-main-width))) var(--lr-page-aside-width,var(--_lr-page-aside-width)) auto}[part~=menu]{inline-size:var(--lr-page-menu-width,var(--_lr-page-menu-width));grid-area:menu}[part~=dialog-wrapper],[part~=drawer]{display:contents}[part~=navigation]{flex-direction:column;grid-area:navigation;min-inline-size:0;display:flex}[part~=navigation]>slot[name=navigation]{flex:auto}[part~=main]{min-inline-size:0;inline-size:var(--lr-page-main-width,var(--_lr-page-main-width));outline:none;grid-area:main;max-inline-size:100%}[part~=aside]{inline-size:var(--lr-page-aside-width,var(--_lr-page-aside-width));grid-area:aside;max-inline-size:100%}:host(:not([disable-sticky~=menu])) [part~=menu],:host(:not([disable-sticky~=aside])) [part~=aside]{max-block-size:calc(100dvh - var(--lr-page-banner-height,var(--_lr-page-banner-height)) - var(--lr-page-header-height,var(--_lr-page-header-height)) - var(--lr-page-subheader-height,var(--_lr-page-subheader-height)));align-self:start;position:sticky;inset-block-start:calc(var(--lr-page-banner-height,var(--_lr-page-banner-height)) + var(--lr-page-header-height,var(--_lr-page-header-height)) + var(--lr-page-subheader-height,var(--_lr-page-subheader-height)));overflow:clip auto}:host([view=mobile]) [part~=body]{display:block}:host([view=mobile]) [part~=menu],:host([view=mobile]) [part~=main],:host([view=mobile]) [part~=aside]{inline-size:100%}:host([view=mobile]) [part~=dialog-wrapper]{z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));visibility:hidden;pointer-events:none;transition:background-color var(--lr-transition-base), visibility var(--lr-transition-base);background:0 0;display:block;position:fixed;inset:0}:host([view=mobile][nav-open]) [part~=dialog-wrapper]{visibility:visible;pointer-events:auto;background:var(--lr-page-navigation-backdrop-bg,var(--lr-color-overlay))}:host([view=mobile]) [part~=drawer]{inline-size:min(var(--lr-size-18rem), calc(100% - var(--lr-space-l)));box-sizing:border-box;min-inline-size:0;max-inline-size:100%;background:var(--lr-page-navigation-drawer-bg,var(--lr-color-surface-overlay));box-shadow:var(--lr-page-navigation-drawer-shadow,var(--lr-shadow-l));transition:transform var(--lr-transition-base);flex-direction:column;padding-block-start:var(--lr-safe-area-top);padding-block-end:var(--lr-safe-area-bottom);padding-inline-start:var(--lr-safe-area-inline-start);padding-inline-end:var(--lr-safe-area-inline-end);display:flex;position:absolute;inset-block:0;overflow:clip auto}:host([view=mobile][navigation-placement=start]) [part~=drawer]{inset-inline-start:0}:host([view=mobile][navigation-placement=end]) [part~=drawer]{inset-inline-end:0}:host([view=mobile]:not([nav-open])[navigation-placement=start]:not(:dir(rtl))) [part~=drawer],:host([view=mobile]:not([nav-open])[navigation-placement=end]:dir(rtl)) [part~=drawer]{transform:translate(-100%)}:host([view=mobile]:not([nav-open])[navigation-placement=end]:not(:dir(rtl))) [part~=drawer],:host([view=mobile]:not([nav-open])[navigation-placement=start]:dir(rtl)) [part~=drawer]{transform:translate(100%)}:host([view=mobile][nav-open]) [part~=drawer]{transform:none}:host([view=mobile]) [part~=navigation]{flex:auto;min-block-size:0}::slotted(*){min-inline-size:0;max-inline-size:100%}@media (prefers-reduced-motion:reduce){[part~=skip-to-content],[part~=navigation-toggle],[part~=dialog-wrapper],[part~=drawer]{transition:none!important}}`;export{styles};
+import{css}from"lit";const styles=css`:host{--_lr-page-aside-width:var(--aside-width,auto);--_lr-page-banner-height:var(--banner-height,calc(0 * var(--lr-size-1px)));--_lr-page-header-height:var(--header-height,calc(0 * var(--lr-size-1px)));--_lr-page-main-width:var(--main-width,1fr);--_lr-page-menu-width:var(--menu-width,auto);--_lr-page-subheader-height:var(--subheader-height,calc(0 * var(--lr-size-1px)));min-inline-size:0;color:var(--lr-color-text);contain-intrinsic-inline-size:var(--lr-size-20rem);display:block;container-type:inline-size}[part~=page]{background:var(--lr-color-surface);flex-direction:column;min-block-size:100dvh;min-inline-size:0;display:flex;overflow:clip}[part~=skip-to-content]{z-index:var(--lr-layer-toast);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);box-sizing:border-box;padding-inline:var(--lr-space-m);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);opacity:0;pointer-events:none;background:var(--lr-color-surface-overlay);color:var(--lr-color-text);box-shadow:var(--lr-shadow-m);transform:translateY(calc(-100% - var(--lr-space-l)));transition:opacity var(--lr-transition-fast), transform var(--lr-transition-fast), background-color var(--lr-transition-fast);cursor:pointer;justify-content:center;align-items:center;text-decoration:none;display:inline-flex;position:fixed;inset-block-start:max(var(--lr-space-s), var(--lr-safe-area-top));inset-inline-start:max(var(--lr-space-s), var(--lr-safe-area-inline-start))}[part~=skip-to-content]:where(:hover){background:var(--lr-page-skip-to-content-hover-bg,var(--lr-color-brand-quiet));color:var(--lr-page-skip-to-content-hover-color,var(--lr-color-brand))}[part~=skip-to-content]:where(:active){background:var(--lr-page-skip-to-content-active-bg,color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-page-skip-to-content-active-color,var(--lr-color-brand))}[part~=skip-to-content]:where(:focus-visible){opacity:1;pointer-events:auto;outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset);transform:none}[part~=banner],[part~=header],[part~=subheader],[part~=menu],[part~=navigation-header],[part~=navigation-footer],[part~=main-header],[part~=main-content],[part~=main-footer],[part~=aside],[part~=footer]{overflow-wrap:anywhere;min-inline-size:0}[part~=banner]{min-block-size:var(--lr-page-banner-height,var(--_lr-page-banner-height))}[part~=header]{justify-content:space-between;align-items:center;gap:var(--lr-space-s);min-block-size:var(--lr-page-header-height,var(--_lr-page-header-height));display:flex}[part~=subheader]{min-block-size:var(--lr-page-subheader-height,var(--_lr-page-subheader-height))}:host(:not([disable-sticky~=banner])) [part~=banner]{z-index:var(--lr-layer-content);position:sticky;inset-block-start:0}:host(:not([disable-sticky~=header])) [part~=header]{z-index:var(--lr-layer-content);position:sticky;inset-block-start:var(--lr-page-banner-height,var(--_lr-page-banner-height))}:host(:not([disable-sticky~=subheader])) [part~=subheader]{z-index:var(--lr-layer-content);position:sticky;inset-block-start:calc(var(--lr-page-banner-height,var(--_lr-page-banner-height)) + var(--lr-page-header-height,var(--_lr-page-header-height)))}.navigation-toggle-container{flex:none;display:none}:host([view=mobile]) .navigation-toggle-container{display:block}[part~=navigation-toggle]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);box-sizing:border-box;padding:var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);color:var(--lr-color-text);font:inherit;cursor:pointer;justify-content:center;align-items:center;display:inline-flex}:host([disable-navigation-toggle]) [part~=navigation-toggle]{display:none}[part~=navigation-toggle]:where(:hover),::slotted([slot=navigation-toggle]:hover){background:var(--lr-page-navigation-toggle-hover-bg,var(--lr-color-brand-quiet));color:var(--lr-page-navigation-toggle-hover-color,var(--lr-color-brand))}[part~=navigation-toggle]:where(:active),::slotted([slot=navigation-toggle]:active){background:var(--lr-page-navigation-toggle-active-bg,color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-page-navigation-toggle-active-color,var(--lr-color-brand))}[part~=navigation-toggle]:where(:focus-visible),::slotted([slot=navigation-toggle]:focus-visible){outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}::slotted([slot=navigation-toggle]){min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);cursor:pointer}[part~=navigation-toggle-icon]{pointer-events:none;justify-content:center;align-items:center;display:inline-flex}[part~=navigation-toggle-icon] svg{display:block}[part~=body]{grid-template-areas:"menu navigation main aside";grid-template-columns:var(--lr-page-menu-width,var(--_lr-page-menu-width)) auto minmax(0, var(--lr-page-main-width,var(--_lr-page-main-width))) var(--lr-page-aside-width,var(--_lr-page-aside-width));flex:auto;align-items:stretch;min-inline-size:0;display:grid}:host([navigation-placement=end]) [part~=body]{grid-template-areas:"menu main aside navigation";grid-template-columns:var(--lr-page-menu-width,var(--_lr-page-menu-width)) minmax(0, var(--lr-page-main-width,var(--_lr-page-main-width))) var(--lr-page-aside-width,var(--_lr-page-aside-width)) auto}[part~=menu]{inline-size:var(--lr-page-menu-width,var(--_lr-page-menu-width));grid-area:menu}[part~=dialog-wrapper],[part~=drawer]{display:contents}[part~=navigation]{flex-direction:column;grid-area:navigation;min-inline-size:0;display:flex}[part~=navigation]>slot[name=navigation]{flex:auto}[part~=main]{min-inline-size:0;inline-size:var(--lr-page-main-width,var(--_lr-page-main-width));outline:none;grid-area:main;max-inline-size:100%}[part~=aside]{inline-size:var(--lr-page-aside-width,var(--_lr-page-aside-width));grid-area:aside;max-inline-size:100%}:host(:not([disable-sticky~=menu])) [part~=menu],:host(:not([disable-sticky~=aside])) [part~=aside]{max-block-size:calc(100dvh - var(--lr-page-banner-height,var(--_lr-page-banner-height)) - var(--lr-page-header-height,var(--_lr-page-header-height)) - var(--lr-page-subheader-height,var(--_lr-page-subheader-height)));align-self:start;position:sticky;inset-block-start:calc(var(--lr-page-banner-height,var(--_lr-page-banner-height)) + var(--lr-page-header-height,var(--_lr-page-header-height)) + var(--lr-page-subheader-height,var(--_lr-page-subheader-height)));overflow:clip auto}:host([view=mobile]) [part~=body]{display:block}:host([view=mobile]) [part~=menu],:host([view=mobile]) [part~=main],:host([view=mobile]) [part~=aside]{inline-size:100%}:host([view=mobile]) [part~=dialog-wrapper]{z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));visibility:hidden;pointer-events:none;transition:background-color var(--lr-transition-base), visibility var(--lr-transition-base);background:0 0;display:block;position:fixed;inset:0}:host([view=mobile][nav-open]) [part~=dialog-wrapper]{visibility:visible;pointer-events:auto;background:var(--lr-page-navigation-backdrop-bg,var(--lr-color-overlay))}:host([view=mobile]) [part~=drawer]{inline-size:min(var(--lr-size-18rem), calc(100% - var(--lr-space-l)));box-sizing:border-box;min-inline-size:0;max-inline-size:100%;background:var(--lr-page-navigation-drawer-bg,var(--lr-color-surface-overlay));box-shadow:var(--lr-page-navigation-drawer-shadow,var(--lr-shadow-l));transition:transform var(--lr-transition-base);flex-direction:column;padding-block-start:var(--lr-safe-area-top);padding-block-end:var(--lr-safe-area-bottom);padding-inline-start:var(--lr-safe-area-inline-start);padding-inline-end:var(--lr-safe-area-inline-end);display:flex;position:absolute;inset-block:0;overflow:clip auto}:host([view=mobile][navigation-placement=start]) [part~=drawer]{inset-inline-start:0}:host([view=mobile][navigation-placement=end]) [part~=drawer]{inset-inline-end:0}:host([view=mobile]:not([nav-open])[navigation-placement=start]:not(:dir(rtl))) [part~=drawer],:host([view=mobile]:not([nav-open])[navigation-placement=end]:dir(rtl)) [part~=drawer]{transform:translate(-100%)}:host([view=mobile]:not([nav-open])[navigation-placement=end]:not(:dir(rtl))) [part~=drawer],:host([view=mobile]:not([nav-open])[navigation-placement=start]:dir(rtl)) [part~=drawer]{transform:translate(100%)}:host([view=mobile][nav-open]) [part~=drawer]{transform:none}:host([view=mobile]) [part~=navigation]{flex:auto;min-block-size:0}::slotted(*){min-inline-size:0;max-inline-size:100%}@media (prefers-reduced-motion:reduce){[part~=skip-to-content],[part~=navigation-toggle],[part~=dialog-wrapper],[part~=drawer]{transition:none!important}}`;export{styles};

package/dist/components/layout/responsive-panel/responsive-panel.class.d.ts

@@ -4,7 +4,7 @@ import{type TemplateResult,type PropertyValues}from'lit';import{LyraElement}from
 export type LyraResponsivePanelMode='inline'|'overlay'|'auto';
 /** What `mode` actually resolves to once the breakpoint is taken into
 *  account -- `'auto'` never appears here. */
-export type LyraResponsivePanelEffectiveMode='inline'|'overlay';export type LyraResponsivePanelVariant='fullscreen'|'bottom-sheet';
+export type LyraResponsivePanelEffectiveMode='inline'|'overlay';export type LyraResponsivePanelShape='fullscreen'|'bottom-sheet';
 /** Reason the panel was closed, forwarded as the `lr-close` event detail --
 *  mirrors lr-dialog's own `DialogCloseReason` shape. `'escape'` and
 *  `'backdrop'` are emitted by the overlay presentation's own built-in
@@ -97,7 +97,7 @@ export declare function resolveResponsivePanelEffectiveMode(mode:LyraResponsiveP
 * @cssprop [--lr-responsive-panel-overlay-panel-shadow=var(--lr-shadow-l)] - Shadow of
 *   `[part="panel"]` in the overlay presentation.
 * @cssprop [--lr-responsive-panel-sheet-max-block-size=85dvh] - Maximum height of the
-*   `variant="bottom-sheet"` overlay panel (falls back to `85vh` where `dvh` is unsupported).
+*   `shape="bottom-sheet"` overlay panel (falls back to `85vh` where `dvh` is unsupported).
 * @status stable
 * @since 4.0.0
 */
@@ -110,8 +110,10 @@ open:boolean;
 private _mode;get mode():LyraResponsivePanelMode;set mode(next:LyraResponsivePanelMode);
 /** Only affects the overlay presentation's visual treatment -- `'fullscreen'` (default) covers
 *  the whole viewport; `'bottom-sheet'` anchors to the block-end edge and doesn't cover the full
-*  height. No entrance motion is implied by the variant. */
-variant:LyraResponsivePanelVariant;
+*  height. No entrance motion is implied by the shape. This is a presentation-shape axis, not
+*  the library's shared semantic-tone `variant` vocabulary (`lr-button`/`lr-badge`/etc.) -- it
+*  deliberately uses a different property name to avoid colliding with that meaning. */
+shape:LyraResponsivePanelShape;
 /** Accessible name for the overlay presentation's `role="dialog"`. Unused in the inline
 *  presentation, which has no dialog semantics to name. When empty, falls back to the `header`
 *  slot's content -- see the class doc for the full fallback order. */

package/dist/components/layout/responsive-panel/responsive-panel.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{resolveCssLength}from"../../../internal/css-length.js";import{LyraElement}from"../../../internal/lyra-element.js";import{literalSetConverter}from"../../../internal/converters.js";import{activateOverlay,deepActiveElement}from"../../../internal/overlay-manager.js";import{styles}from"./responsive-panel.styles.js";import{LYRA_DEFAULT_responsivePanel}from"../../../internal/default-strings.generated.js";const HEADING_SELECTOR='h1, h2, h3, h4, h5, h6, [role="heading"]',DEFAULT_OVERLAY_BREAKPOINT="768px",RESPONSIVE_PANEL_MODE=literalSetConverter(["inline","overlay","auto"],"auto");function resolveResponsivePanelEffectiveMode(mode,belowBreakpoint){return mode==="inline"||mode==="overlay"?mode:belowBreakpoint?"overlay":"inline"}class LyraResponsivePanel extends LyraElement{constructor(){super(...arguments),this.open=!1,this._mode="auto",this.variant="fullscreen",this.label="",this.overlayBreakpoint=DEFAULT_OVERLAY_BREAKPOINT,this.accessibleLabel=null,this.belowBreakpoint=!1,this.resolvedMode="inline",this.hasHeaderSlot=!1,this.hasFooterSlot=!1,this.headerObserverGeneration=0,this.ownerRealmGeneration=0,this.overlayChromeActive=!1,this.focusOverlayAfterUpdate=!1,this.isFirstUpdate=!0,this.onWindowResize=()=>this.measureAllocation(),this.onHeaderSlotChange=e=>{this.syncHeaderSlot(e.target.assignedElements({flatten:!0}))},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()}}static{this.defaultStrings={...super.defaultStrings,responsivePanel:LYRA_DEFAULT_responsivePanel}}static{this.styles=[LyraElement.styles,styles]}get mode(){return this._mode}set mode(next){const normalized=RESPONSIVE_PANEL_MODE.normalizeReflected(this,"mode",next),old=this._mode;old!==normalized&&(this._mode=normalized,this.requestUpdate("mode",old))}get effectiveMode(){return this.resolvedMode}willUpdate(changed){if(super.willUpdate(changed),this.isFirstUpdate=!this.hasUpdated,this.isFirstUpdate&&(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.headingText=this.detectHeadingText()),!this.isFirstUpdate&&changed.has("overlayBreakpoint")&&this.isConnected&&this.measureAllocation(),(this.isFirstUpdate||changed.has("mode")||changed.has("belowBreakpoint"))&&(this.resolvedMode=resolveResponsivePanelEffectiveMode(this.mode,this.belowBreakpoint)),changed.has("open")&&this.open){const active=deepActiveElement(this.ownerDocument);this.lastTrigger=active&&typeof active.focus=="function"?active:void 0}const overlayOpen=this.resolvedMode==="overlay"&&this.open;overlayOpen!==this.overlayChromeActive&&(this.overlayChromeActive=overlayOpen,overlayOpen?(this.activateOverlayChrome(),this.focusOverlayAfterUpdate=!0):this.deactivateOverlayChrome(changed.has("open")&&!this.open)),changed.has("open")&&!this.open&&(this.lastTrigger=void 0)}updated(changed){super.updated(changed),!this.isFirstUpdate&&changed.has("resolvedMode")&&this.emit("lr-mode-change",{mode:this.resolvedMode}),this.focusOverlayAfterUpdate&&(this.focusOverlayAfterUpdate=!1,this.overlayHandle?.focusInitial())}connectedCallback(){super.connectedCallback(),this.measureAllocation(),this.observeAllocation();const overlayOpen=resolveResponsivePanelEffectiveMode(this.mode,this.belowBreakpoint)==="overlay"&&this.open;this.hasUpdated&&overlayOpen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateOverlayChrome(),this.queueOwnerMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&this.queueOwnerMicrotask(()=>{const slot=this.shadowRoot?.querySelector('slot[name="header"]');slot&&this.syncHeaderSlot(slot.assignedElements({flatten:!0}))})}disconnectedCallback(){this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0,this.overlayHandle?.suspend(),this.resetOwnerRealmWork(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0,this.resetOwnerRealmWork(),this.isConnected&&(this.measureAllocation(),this.observeAllocation())}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.resetHeaderObserver()}queueOwnerMicrotask(callback){const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration;ownerWindow.queueMicrotask(()=>{this.ownerRealmGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||callback()})}activateOverlayChrome(){this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="panel"]')??null,onEscape:()=>this.close("escape"),onBackdrop:()=>this.close("backdrop"),restoreFocusTo:this.lastTrigger??null,lockScroll:!0,suspendWhenUnrendered:!0})}deactivateOverlayChrome(restoreFocus=!0){this.overlayHandle?.deactivate({restoreFocus}),this.overlayHandle=void 0}observeAllocation(){if(!this.isConnected)return;this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0;const view=this.ownerDocument.defaultView,ResizeObserverConstructor=view?.ResizeObserver;if(ResizeObserverConstructor){this.resizeObserver??=new ResizeObserverConstructor(entries=>{const entry=entries.find(candidate=>candidate.target===this)??entries[0],inlineSize=entry?.contentBoxSize?.[0]?.inlineSize??entry?.contentRect.width;inlineSize!==void 0&&this.queueOwnerMicrotask(()=>this.applyMeasuredInlineSize(inlineSize))}),this.resizeObserver.observe(this);return}view&&(this.resizeView=view,view.addEventListener("resize",this.onWindowResize))}measureAllocation(){const inlineSize=this.getBoundingClientRect().width;inlineSize>0&&this.applyMeasuredInlineSize(inlineSize)}applyMeasuredInlineSize(inlineSize){if(!Number.isFinite(inlineSize)||inlineSize<0)return;const resolved=resolveCssLength(this.overlayBreakpoint,{host:this}),fallback=resolveCssLength(DEFAULT_OVERLAY_BREAKPOINT,{host:this})??768,breakpoint=Math.max(0,resolved!==void 0&&Number.isFinite(resolved)?resolved:fallback);this.belowBreakpoint=inlineSize<=breakpoint}syncHeaderSlot(assigned){if(this.hasHeaderSlot=assigned.length>0,this.headingText=this.detectHeadingText(),this.resetHeaderObserver(),assigned.length===0||!this.isConnected)return;const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.headerObserverGeneration,observer=new MutationObserverCtor(()=>{this.headerObserver!==observer||this.headerObserverDocument!==ownerDocument||this.headerObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.headingText=this.detectHeadingText())});this.headerObserver=observer,this.headerObserverDocument=ownerDocument;for(const element of assigned)observer.observe(element,{childList:!0,characterData:!0,subtree:!0})}resetHeaderObserver(){this.headerObserverGeneration+=1,this.headerObserver?.disconnect(),this.headerObserver=void 0,this.headerObserverDocument=void 0}detectHeadingText(){const headerChildren=Array.from(this.children).filter(el=>el.getAttribute("slot")==="header");if(headerChildren.length===0)return;const heading=headerChildren.find(el=>el.matches(HEADING_SELECTOR));return heading?heading.textContent?.trim()||void 0:headerChildren.map(el=>el.textContent?.trim()).filter(Boolean).join(" ")||void 0}close(reason="api"){this.open&&(this.emit("lr-close",reason,{cancelable:!0}).defaultPrevented||(this.open=!1))}render(){const overlay=this.effectiveMode==="overlay",accessibleName=this.accessibleLabel??(this.label||this.headingText||this.localize("responsivePanel"));return 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{resolveCssLength}from"../../../internal/css-length.js";import{LyraElement}from"../../../internal/lyra-element.js";import{literalSetConverter}from"../../../internal/converters.js";import{activateOverlay,deepActiveElement}from"../../../internal/overlay-manager.js";import{styles}from"./responsive-panel.styles.js";import{LYRA_DEFAULT_responsivePanel}from"../../../internal/default-strings.generated.js";const HEADING_SELECTOR='h1, h2, h3, h4, h5, h6, [role="heading"]',DEFAULT_OVERLAY_BREAKPOINT="768px",RESPONSIVE_PANEL_MODE=literalSetConverter(["inline","overlay","auto"],"auto");function resolveResponsivePanelEffectiveMode(mode,belowBreakpoint){return mode==="inline"||mode==="overlay"?mode:belowBreakpoint?"overlay":"inline"}class LyraResponsivePanel extends LyraElement{constructor(){super(...arguments),this.open=!1,this._mode="auto",this.shape="fullscreen",this.label="",this.overlayBreakpoint=DEFAULT_OVERLAY_BREAKPOINT,this.accessibleLabel=null,this.belowBreakpoint=!1,this.resolvedMode="inline",this.hasHeaderSlot=!1,this.hasFooterSlot=!1,this.headerObserverGeneration=0,this.ownerRealmGeneration=0,this.overlayChromeActive=!1,this.focusOverlayAfterUpdate=!1,this.isFirstUpdate=!0,this.onWindowResize=()=>this.measureAllocation(),this.onHeaderSlotChange=e=>{this.syncHeaderSlot(e.target.assignedElements({flatten:!0}))},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()}}static{this.defaultStrings={...super.defaultStrings,responsivePanel:LYRA_DEFAULT_responsivePanel}}static{this.styles=[LyraElement.styles,styles]}get mode(){return this._mode}set mode(next){const normalized=RESPONSIVE_PANEL_MODE.normalizeReflected(this,"mode",next),old=this._mode;old!==normalized&&(this._mode=normalized,this.requestUpdate("mode",old))}get effectiveMode(){return this.resolvedMode}willUpdate(changed){if(super.willUpdate(changed),this.isFirstUpdate=!this.hasUpdated,this.isFirstUpdate&&(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.headingText=this.detectHeadingText()),!this.isFirstUpdate&&changed.has("overlayBreakpoint")&&this.isConnected&&this.measureAllocation(),(this.isFirstUpdate||changed.has("mode")||changed.has("belowBreakpoint"))&&(this.resolvedMode=resolveResponsivePanelEffectiveMode(this.mode,this.belowBreakpoint)),changed.has("open")&&this.open){const active=deepActiveElement(this.ownerDocument);this.lastTrigger=active&&typeof active.focus=="function"?active:void 0}const overlayOpen=this.resolvedMode==="overlay"&&this.open;overlayOpen!==this.overlayChromeActive&&(this.overlayChromeActive=overlayOpen,overlayOpen?(this.activateOverlayChrome(),this.focusOverlayAfterUpdate=!0):this.deactivateOverlayChrome(changed.has("open")&&!this.open)),changed.has("open")&&!this.open&&(this.lastTrigger=void 0)}updated(changed){super.updated(changed),!this.isFirstUpdate&&changed.has("resolvedMode")&&this.emit("lr-mode-change",{mode:this.resolvedMode}),this.focusOverlayAfterUpdate&&(this.focusOverlayAfterUpdate=!1,this.overlayHandle?.focusInitial())}connectedCallback(){super.connectedCallback(),this.measureAllocation(),this.observeAllocation();const overlayOpen=resolveResponsivePanelEffectiveMode(this.mode,this.belowBreakpoint)==="overlay"&&this.open;this.hasUpdated&&overlayOpen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateOverlayChrome(),this.queueOwnerMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&this.queueOwnerMicrotask(()=>{const slot=this.shadowRoot?.querySelector('slot[name="header"]');slot&&this.syncHeaderSlot(slot.assignedElements({flatten:!0}))})}disconnectedCallback(){this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0,this.overlayHandle?.suspend(),this.resetOwnerRealmWork(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0,this.resetOwnerRealmWork(),this.isConnected&&(this.measureAllocation(),this.observeAllocation())}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.resetHeaderObserver()}queueOwnerMicrotask(callback){const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration;ownerWindow.queueMicrotask(()=>{this.ownerRealmGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||callback()})}activateOverlayChrome(){this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="panel"]')??null,onEscape:()=>this.close("escape"),onBackdrop:()=>this.close("backdrop"),restoreFocusTo:this.lastTrigger??null,lockScroll:!0,suspendWhenUnrendered:!0})}deactivateOverlayChrome(restoreFocus=!0){this.overlayHandle?.deactivate({restoreFocus}),this.overlayHandle=void 0}observeAllocation(){if(!this.isConnected)return;this.resizeView?.removeEventListener("resize",this.onWindowResize),this.resizeView=void 0;const view=this.ownerDocument.defaultView,ResizeObserverConstructor=view?.ResizeObserver;if(ResizeObserverConstructor){this.resizeObserver??=new ResizeObserverConstructor(entries=>{const entry=entries.find(candidate=>candidate.target===this)??entries[0],inlineSize=entry?.contentBoxSize?.[0]?.inlineSize??entry?.contentRect.width;inlineSize!==void 0&&this.queueOwnerMicrotask(()=>this.applyMeasuredInlineSize(inlineSize))}),this.resizeObserver.observe(this);return}view&&(this.resizeView=view,view.addEventListener("resize",this.onWindowResize))}measureAllocation(){const inlineSize=this.getBoundingClientRect().width;inlineSize>0&&this.applyMeasuredInlineSize(inlineSize)}applyMeasuredInlineSize(inlineSize){if(!Number.isFinite(inlineSize)||inlineSize<0)return;const resolved=resolveCssLength(this.overlayBreakpoint,{host:this}),fallback=resolveCssLength(DEFAULT_OVERLAY_BREAKPOINT,{host:this})??768,breakpoint=Math.max(0,resolved!==void 0&&Number.isFinite(resolved)?resolved:fallback);this.belowBreakpoint=inlineSize<=breakpoint}syncHeaderSlot(assigned){if(this.hasHeaderSlot=assigned.length>0,this.headingText=this.detectHeadingText(),this.resetHeaderObserver(),assigned.length===0||!this.isConnected)return;const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.headerObserverGeneration,observer=new MutationObserverCtor(()=>{this.headerObserver!==observer||this.headerObserverDocument!==ownerDocument||this.headerObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.headingText=this.detectHeadingText())});this.headerObserver=observer,this.headerObserverDocument=ownerDocument;for(const element of assigned)observer.observe(element,{childList:!0,characterData:!0,subtree:!0})}resetHeaderObserver(){this.headerObserverGeneration+=1,this.headerObserver?.disconnect(),this.headerObserver=void 0,this.headerObserverDocument=void 0}detectHeadingText(){const headerChildren=Array.from(this.children).filter(el=>el.getAttribute("slot")==="header");if(headerChildren.length===0)return;const heading=headerChildren.find(el=>el.matches(HEADING_SELECTOR));return heading?heading.textContent?.trim()||void 0:headerChildren.map(el=>el.textContent?.trim()).filter(Boolean).join(" ")||void 0}close(reason="api"){this.open&&(this.emit("lr-close",reason,{cancelable:!0}).defaultPrevented||(this.open=!1))}render(){const overlay=this.effectiveMode==="overlay",accessibleName=this.accessibleLabel??(this.label||this.headingText||this.localize("responsivePanel"));return html`
       <div part="base" class=${overlay?"overlay":"inline"}>
         ${overlay?html`<div part="backdrop" @click=${this.onBackdropClick}></div>`:nothing}
         <div
@@ -19,4 +19,4 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
           </div>
         </div>
       </div>
-    `}}__decorate([property({type:Boolean,reflect:!0})],LyraResponsivePanel.prototype,"open",void 0),__decorate([property({reflect:!0,converter:RESPONSIVE_PANEL_MODE})],LyraResponsivePanel.prototype,"mode",null),__decorate([property({reflect:!0})],LyraResponsivePanel.prototype,"variant",void 0),__decorate([property()],LyraResponsivePanel.prototype,"label",void 0),__decorate([property({attribute:"overlay-breakpoint"})],LyraResponsivePanel.prototype,"overlayBreakpoint",void 0),__decorate([property({attribute:"aria-label"})],LyraResponsivePanel.prototype,"accessibleLabel",void 0),__decorate([state()],LyraResponsivePanel.prototype,"belowBreakpoint",void 0),__decorate([state()],LyraResponsivePanel.prototype,"resolvedMode",void 0),__decorate([state()],LyraResponsivePanel.prototype,"hasHeaderSlot",void 0),__decorate([state()],LyraResponsivePanel.prototype,"hasFooterSlot",void 0),__decorate([state()],LyraResponsivePanel.prototype,"headingText",void 0);export{LyraResponsivePanel,resolveResponsivePanelEffectiveMode};
+    `}}__decorate([property({type:Boolean,reflect:!0})],LyraResponsivePanel.prototype,"open",void 0),__decorate([property({reflect:!0,converter:RESPONSIVE_PANEL_MODE})],LyraResponsivePanel.prototype,"mode",null),__decorate([property({reflect:!0})],LyraResponsivePanel.prototype,"shape",void 0),__decorate([property()],LyraResponsivePanel.prototype,"label",void 0),__decorate([property({attribute:"overlay-breakpoint"})],LyraResponsivePanel.prototype,"overlayBreakpoint",void 0),__decorate([property({attribute:"aria-label"})],LyraResponsivePanel.prototype,"accessibleLabel",void 0),__decorate([state()],LyraResponsivePanel.prototype,"belowBreakpoint",void 0),__decorate([state()],LyraResponsivePanel.prototype,"resolvedMode",void 0),__decorate([state()],LyraResponsivePanel.prototype,"hasHeaderSlot",void 0),__decorate([state()],LyraResponsivePanel.prototype,"hasFooterSlot",void 0),__decorate([state()],LyraResponsivePanel.prototype,"headingText",void 0);export{LyraResponsivePanel,resolveResponsivePanelEffectiveMode};

package/dist/components/layout/responsive-panel/responsive-panel.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{min-inline-size:0;max-inline-size:100%;display:block}[part=base]{min-inline-size:0;max-inline-size:100%;display:none}:host([open]) [part=base]{display:block}:host([open]) [part=base].overlay{z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));display:flex;position:fixed;inset:0}:host([variant=bottom-sheet][open]) [part=base].overlay{align-items:flex-end}[part=backdrop]{background:var(--lr-responsive-panel-overlay-color,var(--lr-color-overlay));position:absolute;inset:0}[part=panel]{background:var(--lr-color-surface);flex-direction:column;min-block-size:0;min-inline-size:0;max-inline-size:100%;display:flex;position:relative}[part=base]:not(.overlay) [part=panel]{border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);overflow:auto}[part=base].overlay [part=panel]{box-sizing:border-box;block-size:100%;inline-size:100%;background:var(--lr-responsive-panel-overlay-panel-bg,var(--lr-color-surface-overlay));box-shadow:var(--lr-responsive-panel-overlay-panel-shadow,var(--lr-shadow-l));padding-block-start:var(--lr-safe-area-top);padding-block-end:var(--lr-safe-area-bottom);padding-inline-start:var(--lr-safe-area-inline-start);padding-inline-end:var(--lr-safe-area-inline-end);overflow:auto}:host([variant=bottom-sheet]) [part=base].overlay [part=panel]{block-size:auto;max-block-size:var(--lr-responsive-panel-sheet-max-block-size,85vh);border-start-start-radius:var(--lr-radius);border-start-end-radius:var(--lr-radius)}@supports (max-block-size:1dvh){:host([variant=bottom-sheet]) [part=base].overlay [part=panel]{max-block-size:var(--lr-responsive-panel-sheet-max-block-size,85dvh)}}[part=header]{min-inline-size:0;max-inline-size:100%;padding:var(--lr-space-m) var(--lr-space-l);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);overflow-wrap:anywhere}[part=header][hidden]{display:none}[part=body]{min-inline-size:0;max-inline-size:100%;padding:var(--lr-space-l);overflow-wrap:anywhere;flex:1;overflow:auto}[part=footer]{justify-content:flex-end;align-items:center;gap:var(--lr-space-s);min-inline-size:0;max-inline-size:100%;padding:var(--lr-space-m) var(--lr-space-l);border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);overflow-wrap:anywhere;flex-wrap:wrap;display:flex}[part=footer][hidden]{display:none}`;export{styles};
+import{css}from"lit";const styles=css`:host{min-inline-size:0;max-inline-size:100%;display:block}[part=base]{min-inline-size:0;max-inline-size:100%;display:none}:host([open]) [part=base]{display:block}:host([open]) [part=base].overlay{z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));display:flex;position:fixed;inset:0}:host([shape=bottom-sheet][open]) [part=base].overlay{align-items:flex-end}[part=backdrop]{background:var(--lr-responsive-panel-overlay-color,var(--lr-color-overlay));position:absolute;inset:0}[part=panel]{background:var(--lr-color-surface);flex-direction:column;min-block-size:0;min-inline-size:0;max-inline-size:100%;display:flex;position:relative}[part=base]:not(.overlay) [part=panel]{border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);overflow:auto}[part=base].overlay [part=panel]{box-sizing:border-box;block-size:100%;inline-size:100%;background:var(--lr-responsive-panel-overlay-panel-bg,var(--lr-color-surface-overlay));box-shadow:var(--lr-responsive-panel-overlay-panel-shadow,var(--lr-shadow-l));padding-block-start:var(--lr-safe-area-top);padding-block-end:var(--lr-safe-area-bottom);padding-inline-start:var(--lr-safe-area-inline-start);padding-inline-end:var(--lr-safe-area-inline-end);overflow:auto}:host([shape=bottom-sheet]) [part=base].overlay [part=panel]{block-size:auto;max-block-size:var(--lr-responsive-panel-sheet-max-block-size,85vh);border-start-start-radius:var(--lr-radius);border-start-end-radius:var(--lr-radius)}@supports (max-block-size:1dvh){:host([shape=bottom-sheet]) [part=base].overlay [part=panel]{max-block-size:var(--lr-responsive-panel-sheet-max-block-size,85dvh)}}[part=header]{min-inline-size:0;max-inline-size:100%;padding:var(--lr-space-m) var(--lr-space-l);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);overflow-wrap:anywhere}[part=header][hidden]{display:none}[part=body]{min-inline-size:0;max-inline-size:100%;padding:var(--lr-space-l);overflow-wrap:anywhere;flex:1;overflow:auto}[part=footer]{justify-content:flex-end;align-items:center;gap:var(--lr-space-s);min-inline-size:0;max-inline-size:100%;padding:var(--lr-space-m) var(--lr-space-l);border-block-start:var(--lr-border-width-thin) solid var(--lr-color-border);overflow-wrap:anywhere;flex-wrap:wrap;display:flex}[part=footer][hidden]{display:none}`;export{styles};