@sbb-esta/lyne-elements-dev 5.3.0-dev.1784307592 → 5.3.0-dev.1784406755

package/autocomplete.pure.js

@@ -1,5 +1,5 @@
 import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeController as n}from"@lit-labs/observers/resize-controller.js";import{html as ee,isServer as r,nothing as i,unsafeCSS as a}from"lit";import{property as o}from"lit/decorators.js";import{ref as te}from"lit/directives/ref.js";import{SbbEscapableOverlayController as s,SbbNegativeMixin as c,SbbOpenCloseBaseElement as l,SbbPropertyWatcherController as u,forceType as d,getNextElementIndex as f,idReference as p,isEventOnElement as m,isSafari as h,isZeroAnimationDuration as g,popoverResetStyles as _,removeAriaComboBoxAttributes as v,scrollbarStyles as y,setAriaComboBoxAttributes as b,setOverlayPosition as x}from"./core.js";import{optionPanelStyles as S}from"./option.pure.js";var C=`:host{display:none}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){display:block}
-`;const w=h;var T=class extends Event{get option(){return this._option}constructor(e){super(`inputAutocomplete`,{bubbles:!0,composed:!0}),this._option=e}};let E=(()=>{let f=c(l),h,b=[],E=[],D,O=[],k=[],A,j=[],M=[],N,P=[],F=[],I,L=[],R=[],z,B=[],V=[],H,U=[],W=[],G,K=[],q=[],J,Y=[],X=[],Z,Q=[],$=[];return class extends f{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(f[Symbol.metadata]??null):void 0;h=[p(),o()],D=[p(),o()],A=[d(),o({attribute:`preserve-icon-space`,reflect:!0,type:Boolean})],N=[d(),o({attribute:`auto-active-first-option`,type:Boolean})],I=[o({attribute:!1})],z=[o({reflect:!0})],H=[d(),o({attribute:`auto-select-active-option`,type:Boolean})],G=[d(),o({attribute:`auto-select-active-option-on-blur`,type:Boolean})],J=[d(),o({attribute:`require-selection`,type:Boolean})],Z=[o()],e(this,null,h,{kind:`accessor`,name:`origin`,static:!1,private:!1,access:{has:e=>`origin`in e,get:e=>e.origin,set:(e,t)=>{e.origin=t}},metadata:t},b,E),e(this,null,D,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},O,k),e(this,null,A,{kind:`accessor`,name:`preserveIconSpace`,static:!1,private:!1,access:{has:e=>`preserveIconSpace`in e,get:e=>e.preserveIconSpace,set:(e,t)=>{e.preserveIconSpace=t}},metadata:t},j,M),e(this,null,N,{kind:`accessor`,name:`autoActiveFirstOption`,static:!1,private:!1,access:{has:e=>`autoActiveFirstOption`in e,get:e=>e.autoActiveFirstOption,set:(e,t)=>{e.autoActiveFirstOption=t}},metadata:t},P,F),e(this,null,I,{kind:`accessor`,name:`displayWith`,static:!1,private:!1,access:{has:e=>`displayWith`in e,get:e=>e.displayWith,set:(e,t)=>{e.displayWith=t}},metadata:t},L,R),e(this,null,z,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:t},B,V),e(this,null,H,{kind:`accessor`,name:`autoSelectActiveOption`,static:!1,private:!1,access:{has:e=>`autoSelectActiveOption`in e,get:e=>e.autoSelectActiveOption,set:(e,t)=>{e.autoSelectActiveOption=t}},metadata:t},U,W),e(this,null,G,{kind:`accessor`,name:`autoSelectActiveOptionOnBlur`,static:!1,private:!1,access:{has:e=>`autoSelectActiveOptionOnBlur`in e,get:e=>e.autoSelectActiveOptionOnBlur,set:(e,t)=>{e.autoSelectActiveOptionOnBlur=t}},metadata:t},K,q),e(this,null,J,{kind:`accessor`,name:`requireSelection`,static:!1,private:!1,access:{has:e=>`requireSelection`in e,get:e=>e.requireSelection,set:(e,t)=>{e.requireSelection=t}},metadata:t},Y,X),e(this,null,Z,{kind:`accessor`,name:`position`,static:!1,private:!1,access:{has:e=>`position`in e,get:e=>e.position,set:(e,t)=>{e.position=t}},metadata:t},Q,$),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[_,y,S,a(C)]}#e;get origin(){return this.#e}set origin(e){this.#e=e}#t;get trigger(){return this.#t}set trigger(e){this.#t=e}#n;get preserveIconSpace(){return this.#n}set preserveIconSpace(e){this.#n=e}#r;get autoActiveFirstOption(){return this.#r}set autoActiveFirstOption(e){this.#r=e}#i;get displayWith(){return this.#i}set displayWith(e){this.#i=e}#a;get size(){return this.#a}set size(e){this.#a=e}#o;get autoSelectActiveOption(){return this.#o}set autoSelectActiveOption(e){this.#o=e}#s;get autoSelectActiveOptionOnBlur(){return this.#s}set autoSelectActiveOptionOnBlur(e){this.#s=e}#c;get requireSelection(){return this.#c}set requireSelection(e){this.#c=e}#l;get position(){return this.#l}set position(e){this.#l=e}get originElement(){return this.origin??this.closest?.(`sbb-form-field`)?.shadowRoot?.querySelector?.(`#overlay-anchor`)??this.trigger??null}get triggerElement(){return this._triggerElement??null}constructor(){super(),this.#e=t(this,b,null),this.#t=(t(this,E),t(this,O,null)),this.#n=(t(this,k),t(this,j,!1)),this.#r=(t(this,M),t(this,P,!1)),this.#i=(t(this,F),t(this,L,null)),this.#a=(t(this,R),t(this,B,null)),this.#o=(t(this,V),t(this,U,!1)),this.#s=(t(this,W),t(this,K,!1)),this.#c=(t(this,q),t(this,Y,!1)),this.#l=(t(this,X),t(this,Q,`auto`)),this._triggerElement=t(this,$),this.activeOption=null,this.pendingAutoSelectedOption=null,this._resizeObserver=new n(this,{target:null,skipInitial:!0,callback:(()=>{let e;return()=>{clearTimeout(e),e=setTimeout(()=>{this.state!==`closed`&&this._setOverlayPosition()},10)}})()}),this._triggerAttributeObserver=r?null:new MutationObserver(e=>{let t=e[0].target;(t.hasAttribute(`disabled`)||t.hasAttribute(`readonly`))&&this.close()}),this._isPointerDownEventOnMenu=!1,this._escapableOverlayController=new s(this),this._optionsCount=0,this._lastUserInput=null,this._isCustomChangeEvent=!1,this._pointerDownListener=e=>{this._isPointerDownEventOnMenu=m(this._overlay,e)},this._closeOnBackdropClick=e=>{!this._isPointerDownEventOnMenu&&!m(this._overlay,e)&&!m(this.originElement,e)&&this.close()},this.addEventListener?.(`optionselected`,e=>this.onOptionSelected(e)),this.addEventListener?.(`ɵoptgroupslotchange`,()=>this._handleSlotchange(),{capture:!0}),this.addController(new u(this,()=>this.closest(`sbb-form-field`),{negative:e=>{this.negative=e.negative,this.syncNegative()},borderless:e=>this.toggleState(`option-panel-origin-borderless`,e.borderless)}))}open(){if(this.state===`opening`||this.state===`opened`||!this._overlay||this.options.length===0||this._readonly()||!this.dispatchBeforeOpenEvent())return;this.showPopover?.(),this.state=`opening`,this.triggerElement?.toggleAttribute(`data-expanded`,!0);let e=this.originElement;if(!e)throw Error(`Cannot find the origin element. Please specify a valid element or check the usage of the "origin" property from the documentation`);this._setOverlayPosition(e),this._setNextActiveOptionIfAutoActiveFirstOption(),this._attachOpenPanelEvents(),this._escapableOverlayController.connect(),this._isZeroAnimationDuration()&&this._handleOpening()}close(){this.state===`closing`||this.state===`closed`||!this.dispatchBeforeCloseEvent()||(this.pendingAutoSelectedOption&&(this.pendingAutoSelectedOption.selected=!0,this._setValueAndDispatchEvents(this.pendingAutoSelectedOption,!0)),this.state=`closing`,this.triggerElement?.removeAttribute(`data-expanded`),this._openPanelEventsController.abort(),this.originElement&&this._resizeObserver.unobserve(this.originElement),this._isZeroAnimationDuration()&&this._handleClosing())}_isZeroAnimationDuration(){return g(this,`--sbb-options-panel-animation-duration`)}connectedCallback(){this.popover=`manual`,super.connectedCallback(),w&&(this.id||=this.overlayId),this.hasUpdated&&this._componentSetup(),this.syncNegative()}willUpdate(e){super.willUpdate(e),e.has(`negative`)&&this.syncNegative(),e.has(`autoActiveFirstOption`)&&this.isOpen&&this._setNextActiveOptionIfAutoActiveFirstOption()}firstUpdated(e){super.firstUpdated(e),this._componentSetup()}disconnectedCallback(){super.disconnectedCallback(),this._triggerElement=null,this._triggerAbortController?.abort(),this._openPanelEventsController?.abort()}requestUpdate(e,t,n){super.requestUpdate(e,t,n),!(r||!this.hasUpdated)&&(!e||e===`trigger`?this._configureTrigger():(!e||e===`origin`)&&this.isOpen&&this._setOverlayPosition())}onOptionSelected(e){let t=e.target;this._setValueAndDispatchEvents(t),this.close()}setPendingSelection(e){this.pendingAutoSelectedOption=e,this._setInputValue(e)}_setValueAndDispatchEvents(e,t=!1){this.options.filter(t=>t!==e&&t.selected).forEach(e=>e.selected=!1),this.pendingAutoSelectedOption=null,this.triggerElement&&(this._setInputValue(e),this._isCustomChangeEvent=!0,this.triggerElement.dispatchEvent(new Event(`change`,{bubbles:!0})),this.triggerElement.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0})),this._lastUserInput=null,this.triggerElement.dispatchEvent(new T(e)),t||this.triggerElement.focus())}_setInputValue(e){if(!this.triggerElement)return;let t=this.displayWith?.(e.value)??e.value;Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,`value`).set.call(this.triggerElement,t)}_handleSlotchange(){this._highlightOptions(this.triggerElement?.value);let e=Array.from(this.querySelectorAll(`*`));this._previousElements?.forEach(e=>this._resizeObserver.unobserve(e)),this._previousElements=e,this._previousElements.forEach(e=>this._resizeObserver.observe(e)),this.isOpen?(this._setOverlayPosition(),this._setNextActiveOptionIfAutoActiveFirstOption(),this._optionsCount>0&&this.options.length===0&&this.close()):document?.activeElement===this.triggerElement&&this._optionsCount===0&&this.options.length>0&&this.open(),this._optionsCount=this.options.length}_setNextActiveOptionIfAutoActiveFirstOption(){this.autoActiveFirstOption&&(this.resetActiveElement(),this.setNextActiveOption())}_readonly(){return this.triggerElement?.hasAttribute(`readonly`)??!1}_componentSetup(){r||this._configureTrigger()}_configureTrigger(){let e=this.trigger??this.closest?.(`sbb-form-field`)?.querySelector(`input`);if(e===this.triggerElement||(this._triggerAbortController?.abort(),v(this.triggerElement),this.triggerElement?.removeAttribute(`data-expanded`),this._triggerElement=e,!this.triggerElement))return;let t=this.originElement;this.triggerElement===t&&this.isOpen&&this._setOverlayPosition(t),this._triggerAttributeObserver?.observe(this.triggerElement,{attributes:!0,attributeFilter:[`disabled`,`readonly`]}),this.setTriggerAttributes(this.triggerElement),this._triggerAbortController=new AbortController,this.triggerElement.addEventListener(`focus`,()=>this.open(),{signal:this._triggerAbortController.signal}),this.triggerElement.addEventListener(`click`,()=>this.open(),{signal:this._triggerAbortController.signal}),this.triggerElement.addEventListener(`input`,e=>{let t=e.target.value;t&&e.isTrusted&&this.open(),this._highlightOptions(t),this._lastUserInput=t,this.pendingAutoSelectedOption=null},{signal:this._triggerAbortController.signal}),this.triggerElement.addEventListener(`change`,e=>{this.requireSelection&&!this._isCustomChangeEvent&&e.stopImmediatePropagation(),this._isCustomChangeEvent=!1},{signal:this._triggerAbortController.signal,capture:!0}),this.triggerElement.addEventListener(`keydown`,e=>this._closedPanelKeyboardInteraction(e),{signal:this._triggerAbortController.signal,capture:!0}),this.triggerElement.addEventListener(`blur`,e=>{this.contains(e.relatedTarget)||(this.autoSelectActiveOptionOnBlur&&this.activeOption&&this._lastUserInput&&this.triggerElement?.value&&(this.activeOption.selected=!0,this._setValueAndDispatchEvents(this.activeOption,!0)),this.requireSelection&&this.triggerElement&&this._lastUserInput!=null&&!this.pendingAutoSelectedOption&&(Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,`value`).set.call(this.triggerElement,``),this._highlightOptions(``),this._isCustomChangeEvent=!0,this.triggerElement.dispatchEvent(new Event(`change`,{bubbles:!0})),this.triggerElement.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0}))),this.close())},{signal:this._triggerAbortController.signal,capture:!0})}_setOverlayPosition(e=this.originElement){e&&x(this._overlay,e,this._overlay,this.shadowRoot.querySelector(`.sbb-option-panel__overlay-container`),this,this.position)}_onAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this._handleOpening():e.animationName===`close`&&this.state===`closing`&&this._handleClosing()}_handleOpening(){this.state=`opened`,this.originElement&&this._resizeObserver.observe(this.originElement),this.triggerElement?.setAttribute(`aria-expanded`,`true`),this.dispatchOpenEvent()}_handleClosing(){this.state=`closed`,this.hidePopover?.(),this.triggerElement?.setAttribute(`aria-expanded`,`false`),this.resetActiveElement(),this._overlay.scrollTop=0,this._escapableOverlayController.disconnect(),this.dispatchCloseEvent()}_attachOpenPanelEvents(){this._openPanelEventsController=new AbortController,document.addEventListener(`scroll`,()=>this._setOverlayPosition(),{passive:!0,signal:this._openPanelEventsController.signal,capture:!0}),window.addEventListener(`resize`,()=>this._setOverlayPosition(),{passive:!0,signal:this._openPanelEventsController.signal}),window.addEventListener(`pointerdown`,e=>this._pointerDownListener(e),{signal:this._openPanelEventsController.signal}),window.addEventListener(`pointerup`,e=>this._closeOnBackdropClick(e),{signal:this._openPanelEventsController.signal}),this.addEventListener(`ɵdisabledchange`,()=>{this.activeOption?.disabled&&this.resetActiveElement(),this._setNextActiveOptionIfAutoActiveFirstOption()},{signal:this._openPanelEventsController.signal}),this.triggerElement?.addEventListener(`keydown`,e=>this.openedPanelKeyboardInteraction(e),{signal:this._openPanelEventsController.signal,capture:!0})}_closedPanelKeyboardInteraction(e){if(!(this.state===`opening`||this.state===`opened`))switch(e.key){case`ArrowDown`:case`ArrowUp`:this.open();break}}_highlightOptions(e){e!=null&&this.options.forEach(t=>t.highlight(e))}render(){return ee`
+`;const w=h;var T=class extends Event{get option(){return this._option}constructor(e){super(`inputAutocomplete`,{bubbles:!0,composed:!0}),this._option=e}};let E=(()=>{let f=c(l),h,b=[],E=[],D,O=[],k=[],A,j=[],M=[],N,P=[],F=[],I,L=[],R=[],z,B=[],V=[],H,U=[],W=[],G,K=[],q=[],J,Y=[],X=[],Z,Q=[],$=[];return class extends f{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(f[Symbol.metadata]??null):void 0;h=[p(),o()],D=[p(),o()],A=[d(),o({attribute:`preserve-icon-space`,reflect:!0,type:Boolean})],N=[d(),o({attribute:`auto-active-first-option`,type:Boolean})],I=[o({attribute:!1})],z=[o({reflect:!0})],H=[d(),o({attribute:`auto-select-active-option`,type:Boolean})],G=[d(),o({attribute:`auto-select-active-option-on-blur`,type:Boolean})],J=[d(),o({attribute:`require-selection`,type:Boolean})],Z=[o()],e(this,null,h,{kind:`accessor`,name:`origin`,static:!1,private:!1,access:{has:e=>`origin`in e,get:e=>e.origin,set:(e,t)=>{e.origin=t}},metadata:t},b,E),e(this,null,D,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},O,k),e(this,null,A,{kind:`accessor`,name:`preserveIconSpace`,static:!1,private:!1,access:{has:e=>`preserveIconSpace`in e,get:e=>e.preserveIconSpace,set:(e,t)=>{e.preserveIconSpace=t}},metadata:t},j,M),e(this,null,N,{kind:`accessor`,name:`autoActiveFirstOption`,static:!1,private:!1,access:{has:e=>`autoActiveFirstOption`in e,get:e=>e.autoActiveFirstOption,set:(e,t)=>{e.autoActiveFirstOption=t}},metadata:t},P,F),e(this,null,I,{kind:`accessor`,name:`displayWith`,static:!1,private:!1,access:{has:e=>`displayWith`in e,get:e=>e.displayWith,set:(e,t)=>{e.displayWith=t}},metadata:t},L,R),e(this,null,z,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:t},B,V),e(this,null,H,{kind:`accessor`,name:`autoSelectActiveOption`,static:!1,private:!1,access:{has:e=>`autoSelectActiveOption`in e,get:e=>e.autoSelectActiveOption,set:(e,t)=>{e.autoSelectActiveOption=t}},metadata:t},U,W),e(this,null,G,{kind:`accessor`,name:`autoSelectActiveOptionOnBlur`,static:!1,private:!1,access:{has:e=>`autoSelectActiveOptionOnBlur`in e,get:e=>e.autoSelectActiveOptionOnBlur,set:(e,t)=>{e.autoSelectActiveOptionOnBlur=t}},metadata:t},K,q),e(this,null,J,{kind:`accessor`,name:`requireSelection`,static:!1,private:!1,access:{has:e=>`requireSelection`in e,get:e=>e.requireSelection,set:(e,t)=>{e.requireSelection=t}},metadata:t},Y,X),e(this,null,Z,{kind:`accessor`,name:`position`,static:!1,private:!1,access:{has:e=>`position`in e,get:e=>e.position,set:(e,t)=>{e.position=t}},metadata:t},Q,$),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[_,y,S,a(C)]}#e;get origin(){return this.#e}set origin(e){this.#e=e}#t;get trigger(){return this.#t}set trigger(e){this.#t=e}#n;get preserveIconSpace(){return this.#n}set preserveIconSpace(e){this.#n=e}#r;get autoActiveFirstOption(){return this.#r}set autoActiveFirstOption(e){this.#r=e}#i;get displayWith(){return this.#i}set displayWith(e){this.#i=e}#a;get size(){return this.#a}set size(e){this.#a=e}#o;get autoSelectActiveOption(){return this.#o}set autoSelectActiveOption(e){this.#o=e}#s;get autoSelectActiveOptionOnBlur(){return this.#s}set autoSelectActiveOptionOnBlur(e){this.#s=e}#c;get requireSelection(){return this.#c}set requireSelection(e){this.#c=e}#l;get position(){return this.#l}set position(e){this.#l=e}get originElement(){return this.origin??this.closest?.(`sbb-form-field`)?.shadowRoot?.querySelector?.(`#overlay-anchor`)??this.trigger??null}get triggerElement(){return this._triggerElement??null}constructor(){super(),this.#e=t(this,b,null),this.#t=(t(this,E),t(this,O,null)),this.#n=(t(this,k),t(this,j,!1)),this.#r=(t(this,M),t(this,P,!1)),this.#i=(t(this,F),t(this,L,null)),this.#a=(t(this,R),t(this,B,null)),this.#o=(t(this,V),t(this,U,!1)),this.#s=(t(this,W),t(this,K,!1)),this.#c=(t(this,q),t(this,Y,!1)),this.#l=(t(this,X),t(this,Q,`auto`)),this._triggerElement=t(this,$),this.activeOption=null,this.pendingAutoSelectedOption=null,this._resizeObserver=new n(this,{target:null,skipInitial:!0,callback:(()=>{let e;return()=>{clearTimeout(e),e=setTimeout(()=>{this.state!==`closed`&&this._setOverlayPosition()},10)}})()}),this._triggerAttributeObserver=r?null:new MutationObserver(e=>{let t=e[0].target;(t.hasAttribute(`disabled`)||t.hasAttribute(`readonly`))&&this.close()}),this._isPointerDownEventOnMenu=!1,this._escapableOverlayController=new s(this),this._optionsCount=0,this._lastUserInput=null,this._isCustomChangeEvent=!1,this._pointerDownListener=e=>{this._isPointerDownEventOnMenu=m(this._overlay,e)},this._closeOnBackdropClick=e=>{!this._isPointerDownEventOnMenu&&!m(this._overlay,e)&&!m(this.originElement,e)&&this.close()},this.addEventListener?.(`optionselected`,e=>this.onOptionSelected(e)),this.addEventListener?.(`ɵoptgroupslotchange`,()=>this._handleSlotchange(),{capture:!0}),this.addController(new u(this,()=>this.closest(`sbb-form-field`),{negative:e=>{this.negative=e.negative,this.syncNegative()},borderless:e=>this.toggleState(`option-panel-origin-borderless`,e.borderless)}))}open(){if(this.state===`opening`||this.state===`opened`||!this._overlay||this.options.length===0||this._readonly()||!this.dispatchBeforeOpenEvent())return;this.showPopover?.(),this.state=`opening`,this.triggerElement?.toggleAttribute(`data-expanded`,!0);let e=this.originElement;if(!e)throw Error(`Cannot find the origin element. Please specify a valid element or check the usage of the "origin" property from the documentation`);this._setOverlayPosition(e),this._setNextActiveOptionIfAutoActiveFirstOption(),this._attachOpenPanelEvents(),this._escapableOverlayController.connect(),this._isZeroAnimationDuration()&&this._handleOpening()}close(){this.state===`closing`||this.state===`closed`||!this.dispatchBeforeCloseEvent()||(this.pendingAutoSelectedOption&&(this.pendingAutoSelectedOption.selected=!0,this._setValueAndDispatchEvents(this.pendingAutoSelectedOption,!0)),this.state=`closing`,this.triggerElement?.removeAttribute(`data-expanded`),this._openPanelEventsController.abort(),this.originElement&&this._resizeObserver.unobserve(this.originElement),this._isZeroAnimationDuration()&&this._handleClosing())}_isZeroAnimationDuration(){return g(this,`--sbb-options-panel-animation-duration`)}connectedCallback(){this.popover=`manual`,super.connectedCallback(),w&&(this.id||=this.overlayId),this.hasUpdated&&this._componentSetup(),this.syncNegative()}willUpdate(e){super.willUpdate(e),e.has(`negative`)&&this.syncNegative(),e.has(`autoActiveFirstOption`)&&this.isOpen&&this._setNextActiveOptionIfAutoActiveFirstOption()}firstUpdated(e){super.firstUpdated(e),this._componentSetup()}disconnectedCallback(){super.disconnectedCallback(),this._triggerElement=null,this._triggerAbortController?.abort(),this._openPanelEventsController?.abort()}requestUpdate(e,t,n){super.requestUpdate(e,t,n),!(r||!this.hasUpdated)&&(!e||e===`trigger`?this._configureTrigger():(!e||e===`origin`)&&this.isOpen&&this._setOverlayPosition())}onOptionSelected(e){let t=e.target;this._setValueAndDispatchEvents(t),this.close()}setPendingSelection(e){this.pendingAutoSelectedOption=e,this._setInputValue(e)}_setValueAndDispatchEvents(e,t=!1){this.options.filter(t=>t!==e&&t.selected).forEach(e=>e.selected=!1),this.pendingAutoSelectedOption=null,this.triggerElement&&(this._setInputValue(e),this._isCustomChangeEvent=!0,this.triggerElement.dispatchEvent(new Event(`change`,{bubbles:!0})),this.triggerElement.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0})),this._lastUserInput=null,this.triggerElement.dispatchEvent(new T(e)),t||this.triggerElement.focus())}_setInputValue(e){if(!this.triggerElement)return;let t=this.displayWith?.(e.value)??e.value;Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,`value`).set.call(this.triggerElement,t)}_handleSlotchange(){this._highlightOptions(this.triggerElement?.value);let e=Array.from(this.querySelectorAll(`*`));this._previousElements?.forEach(e=>this._resizeObserver.unobserve(e)),this._previousElements=e,this._previousElements.forEach(e=>this._resizeObserver.observe(e)),this.isOpen?(this._setOverlayPosition(),this._setNextActiveOptionIfAutoActiveFirstOption(),this._optionsCount>0&&this.options.length===0&&this.close()):document?.activeElement===this.triggerElement&&this._optionsCount===0&&this.options.length>0&&this.open(),this._optionsCount=this.options.length}_setNextActiveOptionIfAutoActiveFirstOption(){this.autoActiveFirstOption&&(this.resetActiveElement(),this.setNextActiveOption())}_readonly(){return this.triggerElement?.hasAttribute(`readonly`)??!1}_componentSetup(){r||this._configureTrigger()}_configureTrigger(){let e=this.trigger??this.closest?.(`sbb-form-field`)?.querySelector(`input`);if(e===this.triggerElement||(this._triggerAbortController?.abort(),v(this.triggerElement),this.triggerElement?.removeAttribute(`data-expanded`),this._triggerElement=e,!this.triggerElement))return;let t=this.originElement;this.triggerElement===t&&this.isOpen&&this._setOverlayPosition(t),this._triggerAttributeObserver?.observe(this.triggerElement,{attributes:!0,attributeFilter:[`disabled`,`readonly`]}),this.setTriggerAttributes(this.triggerElement),this._triggerAbortController=new AbortController,this.triggerElement.addEventListener(`focus`,()=>this.open(),{signal:this._triggerAbortController.signal}),this.triggerElement.addEventListener(`click`,()=>this.open(),{signal:this._triggerAbortController.signal}),this.triggerElement.addEventListener(`input`,e=>{let t=e.target.value;t&&e.isTrusted&&this.open(),this._highlightOptions(t),this._lastUserInput=t,this.pendingAutoSelectedOption=null},{signal:this._triggerAbortController.signal}),this.triggerElement.addEventListener(`change`,e=>{this.requireSelection&&!this._isCustomChangeEvent&&e.stopImmediatePropagation(),this._isCustomChangeEvent=!1},{signal:this._triggerAbortController.signal,capture:!0}),this.triggerElement.addEventListener(`keydown`,e=>this._closedPanelKeyboardInteraction(e),{signal:this._triggerAbortController.signal,capture:!0}),this.triggerElement.addEventListener(`blur`,e=>{this.contains(e.relatedTarget)||(this.autoSelectActiveOptionOnBlur&&this.activeOption&&this._lastUserInput&&this.triggerElement?.value&&(this.activeOption.selected=!0,this._setValueAndDispatchEvents(this.activeOption,!0)),this.requireSelection&&this.triggerElement&&this._lastUserInput!=null&&!this.pendingAutoSelectedOption&&(Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,`value`).set.call(this.triggerElement,``),this._highlightOptions(``),this._isCustomChangeEvent=!0,this.triggerElement.dispatchEvent(new Event(`change`,{bubbles:!0})),this.triggerElement.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0}))),this.close())},{signal:this._triggerAbortController.signal,capture:!0})}_setOverlayPosition(e=this.originElement){e&&x(this._overlay,e,this._overlay,this.shadowRoot.querySelector(`.sbb-option-panel__overlay-container`),this,this.position)}_onAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this._handleOpening():e.animationName===`close`&&this.state===`closing`&&this._handleClosing()}_handleOpening(){this.state=`opened`,this.originElement&&this._resizeObserver.observe(this.originElement),this.triggerElement?.setAttribute(`aria-expanded`,`true`),this.dispatchOpenEvent()}_handleClosing(){this.state=`closed`,this.hidePopover?.(),this.triggerElement?.setAttribute(`aria-expanded`,`false`),this.resetActiveElement(),this._overlay.scrollTop=0,this._escapableOverlayController.disconnect(),this.dispatchCloseEvent()}_attachOpenPanelEvents(){this._openPanelEventsController=new AbortController,document.addEventListener(`scroll`,()=>this._setOverlayPosition(),{passive:!0,signal:this._openPanelEventsController.signal,capture:!0}),window.addEventListener(`resize`,()=>this._setOverlayPosition(),{passive:!0,signal:this._openPanelEventsController.signal}),window.addEventListener(`pointerdown`,e=>this._pointerDownListener(e),{signal:this._openPanelEventsController.signal}),window.addEventListener(`pointerup`,e=>this._closeOnBackdropClick(e),{signal:this._openPanelEventsController.signal}),this.addEventListener(`ɵdisabledchange`,()=>{this.activeOption?.disabled&&this.resetActiveElement(),this._setNextActiveOptionIfAutoActiveFirstOption()},{signal:this._openPanelEventsController.signal}),this.triggerElement?.addEventListener(`keydown`,e=>this.openedPanelKeyboardInteraction(e),{signal:this._openPanelEventsController.signal,capture:!0})}_closedPanelKeyboardInteraction(e){if(this.state!==`opening`&&this.state!==`opened`)switch(e.key){case`ArrowDown`:case`ArrowUp`:this.open();break}}_highlightOptions(e){e!=null&&this.options.forEach(t=>t.highlight(e))}render(){return ee`
       <div class="sbb-option-panel__overlay-container">
         <div
           class="sbb-option-panel__overlay ${this.negative?`sbb-scrollbar-negative`:`sbb-scrollbar`}"

package/carousel.pure.js

@@ -1,7 +1,7 @@
 import{html as e,unsafeCSS as t}from"lit";import{SbbElement as n,SbbLanguageController as r,forceType as i,i18nCarouselArrowsNavigationHint as a,i18nCarouselItemAriaLabel as o,i18nNextSlide as s,i18nPreviousSlide as c,i18nSlide as l,isArrowKeyPressed as u,screenReaderOnlyStyles as d}from"./core.js";import{IntersectionController as f}from"@lit-labs/observers/intersection-controller.js";import{ResizeController as p}from"@lit-labs/observers/resize-controller.js";import{__esDecorate as m,__runInitializers as h}from"tslib";import{property as g}from"lit/decorators.js";var _=`:host{scroll-snap-align:start;flex-shrink:0;display:flex}
 `,v=class extends Event{get index(){return this._index}constructor(e,{index:t}){super(e,{bubbles:!0,composed:!0}),this._index=t}},y=class extends n{static{this.elementName=`sbb-carousel-item`}static{this.styles=[t(_)]}static{this.events={beforeshow:`beforeshow`,show:`show`}}connectedCallback(){super.connectedCallback(),this.internals.role=`group`,this.internals.ariaRoleDescription=`slide`}render(){return e`<slot></slot>`}},b=`:host{height:var(--sbb-carousel-list-height);width:var(--sbb-carousel-list-width,0);scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;border-radius:var(--sbb-carousel-inherit-border-radius);outline:none;display:flex;overflow-x:auto}:host(:focus-visible):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);content:"";height:inherit;width:inherit;border-start-start-radius:var(--sbb-carousel-list-border-radius);border-start-end-radius:var(--sbb-carousel-list-border-radius);border-end-end-radius:var(--sbb-carousel-inherit-border-radius);border-end-start-radius:var(--sbb-carousel-inherit-border-radius);position:absolute}
 `,x=class extends n{static{this.elementName=`sbb-carousel-list`}static{this.styles=[t(b)]}constructor(){super(),this._currentIndex=0,this._language=new r(this),this._observedCarouselItems=[],this._beforeShowObserver=new f(this,{target:null,callback:e=>{e.filter(e=>e.isIntersecting&&e.target!==this).forEach(e=>{let t=e.target;t.dispatchEvent(new v(`beforeshow`,{index:this._carouselItems().findIndex(e=>e===t)}))})},config:{threshold:.01,root:this,rootMargin:`100% 0% 100% 0%`}}),this._showObserver=new f(this,{target:null,callback:e=>{for(let t of e){if(t.target===this)continue;let e=t.target;t.isIntersecting?(e.ariaHidden=null,this._currentIndex=this._carouselItems().findIndex(t=>t===e),e.dispatchEvent(new v(`show`,{index:this._currentIndex}))):e.ariaHidden=`true`}},config:{threshold:.99,root:this,rootMargin:`100% 0% 100% 0%`}}),this._resizeObserverController=new p(this,{skipInitial:!0,callback:()=>this._readDimensions()}),this.addEventListener?.(`keydown`,e=>this._onKeyDown(e))}_carouselItems(){return Array.from(this.querySelectorAll?.(`sbb-carousel-item`)??[])}_handleSlotchange(){this._observedCarouselItems.forEach(e=>{this._beforeShowObserver.unobserve(e),this._showObserver.unobserve(e)});let e=this._carouselItems();e.forEach((t,n)=>{t.ariaLabel||=o(n+1,e.length)[this._language.current],t.ariaHidden=n===this._currentIndex?null:`true`}),this._readDimensions()}_readDimensions(){let e=this._carouselItems();if(e.length===0)return;let t=e[0];t.clientHeight>0&&this.style.setProperty(`--sbb-carousel-list-height`,`${t.clientHeight}px`),t.clientWidth>0&&(this.style.setProperty(`--sbb-carousel-list-width`,`${t.clientWidth}px`),e.forEach(e=>{this._beforeShowObserver.observe(e),this._showObserver.observe(e)}),this._observedCarouselItems=e,this._resizeObserverController.unobserve(this))}_onKeyDown(e){if(!u(e))return;e.preventDefault();let t=this._currentIndex,n=e.key===`ArrowUp`||e.key===`ArrowLeft`,r=e.key===`ArrowDown`||e.key===`ArrowRight`;n?t=Math.max(0,this._currentIndex-1):r&&(t=Math.min(this._carouselItems().length-1,this._currentIndex+1)),t!==this._currentIndex&&(this._currentIndex=t,this.scrollTo({left:this._carouselItems()[this._currentIndex].offsetLeft-this.offsetLeft}))}connectedCallback(){super.connectedCallback(),this.internals.ariaLive=`polite`,this.internals.ariaAtomic=`true`}render(){return e`<slot @slotchange=${this._handleSlotchange}></slot>`}},S=`:host{border-radius:var(--sbb-carousel-border-radius) var(--sbb-carousel-border-radius) 0 0;display:inline-block;overflow:hidden}:host([shadow]){box-shadow:var(--sbb-carousel-box-shadow);border-radius:var(--sbb-carousel-border-radius)}:host(:not([shadow])) ::slotted(sbb-carousel-list){--sbb-carousel-inherit-border-radius:var(--sbb-carousel-border-radius)}.sbb-carousel{background-color:var(--sbb-carousel-background-color);flex-direction:column;justify-content:center;align-items:center;display:flex}::slotted(sbb-compact-paginator){padding:var(--sbb-carousel-paginator-padding)}
-`;let C=(()=>{let o=n,u,f=[],p=[];return class extends o{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;u=[i(),g({reflect:!0,type:Boolean})],m(this,null,u,{kind:`accessor`,name:`shadow`,static:!1,private:!1,access:{has:e=>`shadow`in e,get:e=>e.shadow,set:(e,t)=>{e.shadow=t}},metadata:e},f,p),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-carousel`}static{this.styles=[d,t(S)]}#e;get shadow(){return this.#e}set shadow(e){this.#e=e}constructor(){super(),this.#e=h(this,f,!1),this._paginator=(h(this,p),null),this._abortController=null,this._language=new r(this),this._requestedPageIndexByPaginator=-1,this.addEventListener?.(`show`,e=>{this._requestedPageIndexByPaginator!==-1&&this._requestedPageIndexByPaginator!==e.index||(this._paginator&&e.index!==this._paginator.pageIndex&&(this._paginator.pageIndex=e.index),this._requestedPageIndexByPaginator=-1)})}connectedCallback(){super.connectedCallback(),this.internals.role=`region`,this.internals.ariaLabel=`carousel`,this._setupPaginator()}firstUpdated(e){super.firstUpdated(e),this.internals.ariaDescribedByElements=[this.shadowRoot.querySelector(`#sbb-carousel-arrows-navigation-hint`)]}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort()}_handleSlotchange(){let e=Array.from(this.children).find(e=>e.localName===`sbb-compact-paginator`),t=Array.from(this.children).find(e=>e.localName===`sbb-carousel-list`);if(!e||!t)return;let n=t.querySelectorAll(`sbb-carousel-item`);n&&n.length>0&&(e.length=n.length,e.pageSize=1),e.accessibilityNextPageLabel||=s[this._language.current],e.accessibilityPreviousPageLabel||=c[this._language.current],e.accessibilityPageLabel||=l[this._language.current],e!==this._paginator&&(this._paginator=e,this._setupPaginator())}_setupPaginator(){this._abortController?.abort(),this._paginator&&(this._abortController=new AbortController,this._paginator.addEventListener(`click`,()=>this._scrollAtPaginatorChange(),{signal:this._abortController.signal}))}_scrollAtPaginatorChange(){if(!this._paginator)return;this._requestedPageIndexByPaginator=this._paginator.pageIndex;let e=this.querySelector(`sbb-carousel-list`);if(e){let t=e.querySelectorAll(`sbb-carousel-item`)[this._paginator.pageIndex].offsetLeft-this.offsetLeft;(e.clientWidth<=100||Math.abs(e.scrollLeft-t)>50)&&e.scrollTo({left:t})}}render(){return e`
+`;let C=(()=>{let o=n,u,f=[],p=[];return class extends o{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;u=[i(),g({reflect:!0,type:Boolean})],m(this,null,u,{kind:`accessor`,name:`shadow`,static:!1,private:!1,access:{has:e=>`shadow`in e,get:e=>e.shadow,set:(e,t)=>{e.shadow=t}},metadata:e},f,p),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-carousel`}static{this.styles=[d,t(S)]}#e;get shadow(){return this.#e}set shadow(e){this.#e=e}constructor(){super(),this.#e=h(this,f,!1),this._paginator=(h(this,p),null),this._abortController=null,this._language=new r(this),this._requestedPageIndexByPaginator=-1,this.addEventListener?.(`show`,e=>{(this._requestedPageIndexByPaginator===-1||this._requestedPageIndexByPaginator===e.index)&&(this._paginator&&e.index!==this._paginator.pageIndex&&(this._paginator.pageIndex=e.index),this._requestedPageIndexByPaginator=-1)})}connectedCallback(){super.connectedCallback(),this.internals.role=`region`,this.internals.ariaLabel=`carousel`,this._setupPaginator()}firstUpdated(e){super.firstUpdated(e),this.internals.ariaDescribedByElements=[this.shadowRoot.querySelector(`#sbb-carousel-arrows-navigation-hint`)]}disconnectedCallback(){super.disconnectedCallback(),this._abortController?.abort()}_handleSlotchange(){let e=Array.from(this.children).find(e=>e.localName===`sbb-compact-paginator`),t=Array.from(this.children).find(e=>e.localName===`sbb-carousel-list`);if(!e||!t)return;let n=t.querySelectorAll(`sbb-carousel-item`);n&&n.length>0&&(e.length=n.length,e.pageSize=1),e.accessibilityNextPageLabel||=s[this._language.current],e.accessibilityPreviousPageLabel||=c[this._language.current],e.accessibilityPageLabel||=l[this._language.current],e!==this._paginator&&(this._paginator=e,this._setupPaginator())}_setupPaginator(){this._abortController?.abort(),this._paginator&&(this._abortController=new AbortController,this._paginator.addEventListener(`click`,()=>this._scrollAtPaginatorChange(),{signal:this._abortController.signal}))}_scrollAtPaginatorChange(){if(!this._paginator)return;this._requestedPageIndexByPaginator=this._paginator.pageIndex;let e=this.querySelector(`sbb-carousel-list`);if(e){let t=e.querySelectorAll(`sbb-carousel-item`)[this._paginator.pageIndex].offsetLeft-this.offsetLeft;(e.clientWidth<=100||Math.abs(e.scrollLeft-t)>50)&&e.scrollTo({left:t})}}render(){return e`
       <div class="sbb-carousel">
         <span class="sbb-screen-reader-only" id="sbb-carousel-arrows-navigation-hint"
           >${a[this._language.current]}</span

package/expansion-panel.pure.js

@@ -13,7 +13,7 @@ import{html as e,nothing as t,unsafeCSS as n}from"lit";import{SbbButtonBaseEleme
               </sbb-icon>
             </span>`}
     `}},b=`:host{--sbb-expansion-panel-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));--sbb-expansion-panel-border-color:var(--sbb-border-color-4-inverted);--sbb-expansion-panel-border-width:var(--sbb-border-width-1x);--sbb-expansion-panel-border-block-start-color:var(--sbb-expansion-panel-border-color);--sbb-expansion-panel-border-block-start-width:var(--sbb-expansion-panel-border-width);--sbb-expansion-panel-start-end-radius:var(--sbb-expansion-panel-border-radius);--sbb-expansion-panel-start-start-radius:var(--sbb-expansion-panel-border-radius);--sbb-expansion-panel-end-end-radius:var(--sbb-expansion-panel-border-radius);--sbb-expansion-panel-end-start-radius:var(--sbb-expansion-panel-border-radius);background-color:var(--sbb-expansion-panel-background-color);border:var(--sbb-expansion-panel-border-width) solid var(--sbb-expansion-panel-border-color);border-block-start-color:var(--sbb-expansion-panel-border-block-start-color);border-block-start-width:var(--sbb-expansion-panel-border-block-start-width);border-radius:var(--sbb-expansion-panel-start-start-radius) var(--sbb-expansion-panel-start-end-radius) var(--sbb-expansion-panel-end-end-radius) var(--sbb-expansion-panel-end-start-radius);background-clip:padding-box;display:block}:host([size=s]){--sbb-expansion-panel-title-gap:var(--sbb-expansion-panel-title-gap-s)}:host([size=l]){--sbb-expansion-panel-title-gap:var(--sbb-expansion-panel-title-gap-l)}:host(:not([size])){--sbb-expansion-panel-title-gap:var(--sbb-expansion-panel-title-gap-default)}@media (forced-colors:active){:host([disabled]){--sbb-expansion-panel-border-color:GrayText;--sbb-expansion-panel-border-block-start-color:GrayText}}:host([expanded]){--_sbb-expansion-panel-display-expanded:grid}:host(:is(:state(accordion),[state--accordion]):is(:state(accordion-first),[state--accordion-first])){--sbb-expansion-panel-start-end-radius:var(--sbb-expansion-panel-border-radius);--sbb-expansion-panel-start-start-radius:var(--sbb-expansion-panel-border-radius)}:host(:is(:state(accordion),[state--accordion]):not(:is(:state(accordion-first),[state--accordion-first]))){--sbb-expansion-panel-border-block-start-width:0;--sbb-expansion-panel-border-block-start-color:transparent;--sbb-expansion-panel-start-end-radius:0;--sbb-expansion-panel-start-start-radius:0}:host(:is(:state(accordion),[state--accordion]):is(:state(accordion-last),[state--accordion-last])){--sbb-expansion-panel-end-end-radius:var(--sbb-expansion-panel-border-radius);--sbb-expansion-panel-end-start-radius:var(--sbb-expansion-panel-border-radius)}:host(:is(:state(accordion),[state--accordion]):not(:is(:state(accordion-last),[state--accordion-last]))){--sbb-expansion-panel-end-end-radius:0;--sbb-expansion-panel-end-start-radius:0}:host([color=white]){--sbb-expansion-panel-background-color:var(--sbb-background-color-1);--sbb-expansion-panel-background-color-hover:var(--sbb-background-color-3)}:host([color=milk]){--sbb-expansion-panel-background-color:var(--sbb-background-color-3);--sbb-expansion-panel-background-color-hover:var(--sbb-background-color-1)}:host([borderless]){--sbb-expansion-panel-border-width:0;--sbb-expansion-panel-border-color:transparent;--sbb-expansion-panel-border-block-start-width:0;--sbb-expansion-panel-border-block-start-color:transparent}@media (forced-colors:active){:host([borderless]){--sbb-expansion-panel-border-width:var(--sbb-border-width-1x);--sbb-expansion-panel-border-block-start-width:var(--sbb-expansion-panel-border-width)}}:host([borderless]:is(:state(accordion),[state--accordion]):not(:is(:state(accordion-first),[state--accordion-first]))){--sbb-expansion-panel-border-block-start-width:var(--sbb-spacing-fixed-1x)}@media (forced-colors:active){:host([borderless]:is(:state(accordion),[state--accordion]):not(:is(:state(accordion-first),[state--accordion-first]))){--sbb-expansion-panel-border-block-start-width:0}}:host(:not([disabled]):is(:state(toggle-hover),[state--toggle-hover])){background-color:var(--sbb-expansion-panel-background-color-hover)}@media (forced-colors:active){:host(:not([disabled]):is(:state(toggle-hover),[state--toggle-hover])){--sbb-expansion-panel-border-color:Highlight;--sbb-expansion-panel-border-block-start-color:Highlight}}.sbb-expansion-panel__header{margin:0}.sbb-expansion-panel__content-wrapper{display:var(--_sbb-expansion-panel-display-expanded,none);opacity:0;grid-template-rows:0fr}:host(:is(:state(state-opened),[state--state-opened])) .sbb-expansion-panel__content-wrapper{opacity:1;grid-template-rows:1fr}:host(:is(:state(state-opening),[state--state-opening])) .sbb-expansion-panel__content-wrapper{animation-name:open,open-opacity;animation-fill-mode:forwards;animation-duration:var(--sbb-expansion-panel-animation-duration);animation-timing-function:var(--sbb-animation-easing);animation-delay:0s, var(--sbb-expansion-panel-animation-duration)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-expansion-panel__content-wrapper{visibility:hidden;animation-name:close;animation-duration:var(--sbb-expansion-panel-animation-duration);animation-timing-function:var(--sbb-animation-easing);display:grid}.sbb-expansion-panel__content{min-width:0;min-height:0}@keyframes open{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes open-opacity{0%{opacity:0}to{opacity:1}}@keyframes close{0%{opacity:1;grid-template-rows:1fr}to{opacity:0;grid-template-rows:0fr}}
-`;let x=0,S=(()=>{let r=a,i=[],o,s=[],c=[],f,g=[],_=[],v,y,S,C=[],w=[],T,E=[],D=[];return class extends r{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;o=[h({attribute:`title-level`})],f=[h({reflect:!0})],v=[h({reflect:!0,type:Boolean})],y=[h({reflect:!0,type:Boolean})],S=[l(),h({reflect:!0,type:Boolean})],T=[h({reflect:!0})],p(this,null,o,{kind:`accessor`,name:`titleLevel`,static:!1,private:!1,access:{has:e=>`titleLevel`in e,get:e=>e.titleLevel,set:(e,t)=>{e.titleLevel=t}},metadata:e},s,c),p(this,null,f,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:e},g,_),p(this,null,v,{kind:`setter`,name:`expanded`,static:!1,private:!1,access:{has:e=>`expanded`in e,set:(e,t)=>{e.expanded=t}},metadata:e},null,i),p(this,null,y,{kind:`setter`,name:`disabled`,static:!1,private:!1,access:{has:e=>`disabled`in e,set:(e,t)=>{e.disabled=t}},metadata:e},null,i),p(this,null,S,{kind:`accessor`,name:`borderless`,static:!1,private:!1,access:{has:e=>`borderless`in e,get:e=>e.borderless,set:(e,t)=>{e.borderless=t}},metadata:e},C,w),p(this,null,T,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:e},E,D),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-expansion-panel`}static{this.styles=[n(b)]}static{this.events={beforeopen:`beforeopen`,open:`open`,beforeclose:`beforeclose`,close:`close`}}#e;get titleLevel(){return this.#e}set titleLevel(e){this.#e=e}#t;get color(){return this.#t}set color(e){this.#t=e}set expanded(e){this._expanded=e,this._onExpandedChange()}get expanded(){return this._expanded}set disabled(e){this._disabled=e,this._updateDisabledOnHeader(this._disabled)}get disabled(){return this._disabled}#n;get borderless(){return this.#n}set borderless(e){this.#n=e}#r;get size(){return this.#r}set size(e){this.#r=e}set _state(e){this._stateInternal&&this.internals.states.delete(`state-${this._stateInternal}`),this._stateInternal=e,this._stateInternal&&this.internals.states.add(`state-${this._stateInternal}`)}get _state(){return this._stateInternal}constructor(){super(),this.#e=(m(this,i),m(this,s,null)),this.#t=(m(this,c),m(this,g,`white`)),this._expanded=(m(this,_),!1),this._disabled=!1,this.#n=m(this,C,!1),this.#r=(m(this,w),m(this,E,null)),this._stateInternal=m(this,D),this._progressiveId=`-${++x}`,this._state=`closed`,this.addEventListener?.(`toggleexpanded`,e=>{e.target===this._headerRef&&this._toggleExpanded()})}connectedCallback(){super.connectedCallback(),this.toggleState(`accordion`,!!this.closest?.(`sbb-accordion`))}disconnectedCallback(){super.disconnectedCallback(),this.internals.states.delete(`accordion`)}_toggleExpanded(){this.expanded=!this.expanded}_onExpandedChange(){this._headerRef?.setAttribute(`aria-expanded`,String(this.expanded)),this._contentRef?.setAttribute(`aria-hidden`,String(!this.expanded)),this.expanded?this._open():this._state===`opened`&&this._close()}_open(){this._state=`opening`,this.dispatchEvent(new Event(`beforeopen`)),(!this.hasUpdated||this._isZeroAnimationDuration())&&this._handleOpening()}_close(){this._state=`closing`,this.dispatchEvent(new Event(`beforeclose`)),this._isZeroAnimationDuration()&&this._handleClosing()}_isZeroAnimationDuration(){return u(this,`--sbb-expansion-panel-animation-duration`)}_handleOpening(){this._state=`opened`,this.dispatchEvent(new Event(`open`))}_handleClosing(){this._state=`closed`,this.dispatchEvent(new Event(`close`))}_updateDisabledOnHeader(e){this._headerRef&&(this._headerRef.disabled=e)}_handleSlotchange(){let e=Array.from(this.children??[]),t=e.find(e=>e.localName===`sbb-expansion-panel-header`),n=e.find(e=>e.localName===`sbb-expansion-panel-content`);this._headerRef===t&&this._contentRef===n||(t&&this._headerRef!==t&&(t.id||=`sbb-expansion-panel-header${this._progressiveId}`,t.setAttribute(`aria-expanded`,String(this.expanded)),t.toggleAttribute(`disabled`,this.disabled)),n&&this._contentRef!==n&&(n.id||=`sbb-expansion-panel-content${this._progressiveId}`,n.setAttribute(`aria-hidden`,String(!this.expanded))),this._headerRef=t,this._contentRef=n,this._headerRef&&this._contentRef&&(this._headerRef.setAttribute(`aria-controls`,this._contentRef.id),this._contentRef.setAttribute(`aria-labelledby`,this._headerRef.id),d(this._contentRef).toggle(`icon-space`,d(this._headerRef).has(`icon`))))}_onAnimationEnd(e){e.animationName===`open-opacity`&&this._state===`opening`?this._handleOpening():e.animationName===`close`&&this._state===`closing`&&this._handleClosing()}render(){return e`
+`;let x=0,S=(()=>{let r=a,i=[],o,s=[],c=[],f,g=[],_=[],v,y,S,C=[],w=[],T,E=[],D=[];return class extends r{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;o=[h({attribute:`title-level`})],f=[h({reflect:!0})],v=[h({reflect:!0,type:Boolean})],y=[h({reflect:!0,type:Boolean})],S=[l(),h({reflect:!0,type:Boolean})],T=[h({reflect:!0})],p(this,null,o,{kind:`accessor`,name:`titleLevel`,static:!1,private:!1,access:{has:e=>`titleLevel`in e,get:e=>e.titleLevel,set:(e,t)=>{e.titleLevel=t}},metadata:e},s,c),p(this,null,f,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:e},g,_),p(this,null,v,{kind:`setter`,name:`expanded`,static:!1,private:!1,access:{has:e=>`expanded`in e,set:(e,t)=>{e.expanded=t}},metadata:e},null,i),p(this,null,y,{kind:`setter`,name:`disabled`,static:!1,private:!1,access:{has:e=>`disabled`in e,set:(e,t)=>{e.disabled=t}},metadata:e},null,i),p(this,null,S,{kind:`accessor`,name:`borderless`,static:!1,private:!1,access:{has:e=>`borderless`in e,get:e=>e.borderless,set:(e,t)=>{e.borderless=t}},metadata:e},C,w),p(this,null,T,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:e},E,D),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-expansion-panel`}static{this.styles=[n(b)]}static{this.events={beforeopen:`beforeopen`,open:`open`,beforeclose:`beforeclose`,close:`close`}}#e;get titleLevel(){return this.#e}set titleLevel(e){this.#e=e}#t;get color(){return this.#t}set color(e){this.#t=e}set expanded(e){this._expanded=e,this._onExpandedChange()}get expanded(){return this._expanded}set disabled(e){this._disabled=e,this._updateDisabledOnHeader(this._disabled)}get disabled(){return this._disabled}#n;get borderless(){return this.#n}set borderless(e){this.#n=e}#r;get size(){return this.#r}set size(e){this.#r=e}set _state(e){this._stateInternal&&this.internals.states.delete(`state-${this._stateInternal}`),this._stateInternal=e,this._stateInternal&&this.internals.states.add(`state-${this._stateInternal}`)}get _state(){return this._stateInternal}constructor(){super(),this.#e=(m(this,i),m(this,s,null)),this.#t=(m(this,c),m(this,g,`white`)),this._expanded=(m(this,_),!1),this._disabled=!1,this.#n=m(this,C,!1),this.#r=(m(this,w),m(this,E,null)),this._stateInternal=m(this,D),this._progressiveId=`-${++x}`,this._state=`closed`,this.addEventListener?.(`toggleexpanded`,e=>{e.target===this._headerRef&&this._toggleExpanded()})}connectedCallback(){super.connectedCallback(),this.toggleState(`accordion`,!!this.closest?.(`sbb-accordion`))}disconnectedCallback(){super.disconnectedCallback(),this.internals.states.delete(`accordion`)}_toggleExpanded(){this.expanded=!this.expanded}_onExpandedChange(){this._headerRef?.setAttribute(`aria-expanded`,String(this.expanded)),this._contentRef?.setAttribute(`aria-hidden`,String(!this.expanded)),this.expanded?this._open():this._state===`opened`&&this._close()}_open(){this._state=`opening`,this.dispatchEvent(new Event(`beforeopen`)),(!this.hasUpdated||this._isZeroAnimationDuration())&&this._handleOpening()}_close(){this._state=`closing`,this.dispatchEvent(new Event(`beforeclose`)),this._isZeroAnimationDuration()&&this._handleClosing()}_isZeroAnimationDuration(){return u(this,`--sbb-expansion-panel-animation-duration`)}_handleOpening(){this._state=`opened`,this.dispatchEvent(new Event(`open`))}_handleClosing(){this._state=`closed`,this.dispatchEvent(new Event(`close`))}_updateDisabledOnHeader(e){this._headerRef&&(this._headerRef.disabled=e)}_handleSlotchange(){let e=Array.from(this.children??[]),t=e.find(e=>e.localName===`sbb-expansion-panel-header`),n=e.find(e=>e.localName===`sbb-expansion-panel-content`);(this._headerRef!==t||this._contentRef!==n)&&(t&&this._headerRef!==t&&(t.id||=`sbb-expansion-panel-header${this._progressiveId}`,t.setAttribute(`aria-expanded`,String(this.expanded)),t.toggleAttribute(`disabled`,this.disabled)),n&&this._contentRef!==n&&(n.id||=`sbb-expansion-panel-content${this._progressiveId}`,n.setAttribute(`aria-hidden`,String(!this.expanded))),this._headerRef=t,this._contentRef=n,this._headerRef&&this._contentRef&&(this._headerRef.setAttribute(`aria-controls`,this._contentRef.id),this._contentRef.setAttribute(`aria-labelledby`,this._headerRef.id),d(this._contentRef).toggle(`icon-space`,d(this._headerRef).has(`icon`))))}_onAnimationEnd(e){e.animationName===`open-opacity`&&this._state===`opening`?this._handleOpening():e.animationName===`close`&&this._state===`closing`&&this._handleClosing()}render(){return e`
       <div
         role=${this.titleLevel?`heading`:t}
         aria-level=${this.titleLevel||t}

package/overlay.pure.js

@@ -1,4 +1,4 @@
-import{__esDecorate as e,__runInitializers as t}from"tslib";import{isServer as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{SbbEscapableOverlayController as a,SbbFocusTrapController as o,SbbInertController as s,SbbLanguageController as c,SbbNegativeMixin as l,SbbOpenCloseBaseElement as u,SbbScrollHandler as d,forceType as f,forwardEvent as p,i18nCloseDialog as m,i18nDialog as h,idReference as g,isZeroAnimationDuration as _,popoverResetStyles as v,removeAriaOverlayTriggerProperties as y,screenReaderOnlyStyles as b,scrollbarStyles as x,setAriaOverlayTriggerProperties as S}from"./core.js";import{ref as C}from"lit/directives/ref.js";import{html as w}from"lit/static-html.js";import{SbbSecondaryButtonElement as T}from"./button.pure.js";import{SbbContainerElement as E}from"./container.pure.js";const D=new WeakMap;var O=class extends Event{constructor(e,{cancelable:t,closeAttribute:n,closeTarget:r,result:i}){super(e,{cancelable:t}),this.result=i??(r?D.get(r)??(r.getAttribute(n)?.trim()||null):null),this.closeTarget=r??null}};function k(e,t){D.set(e,t)}const A=[];let j=(()=>{let r=l(u),p,m=[],_=[],x,C=[],w=[],T,E=[],D=[];return class extends r{constructor(){super(...arguments),this.#e=t(this,m,null),this.#t=(t(this,_),t(this,C,``)),this.#n=(t(this,w),t(this,E,!1)),this.lastFocusedElement=t(this,D),this.focusTrapController=new o(this),this.scrollHandler=new d,this.language=new c(this),this.inertController=new s(this),this.escapableOverlayController=new a(this),this._ariaLiveRefToggle=!1,this._triggerElement=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;p=[g(),i()],x=[f(),i({attribute:`accessibility-label`})],T=[f(),i({type:Boolean})],e(this,null,p,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},m,_),e(this,null,x,{kind:`accessor`,name:`accessibilityLabel`,static:!1,private:!1,access:{has:e=>`accessibilityLabel`in e,get:e=>e.accessibilityLabel,set:(e,t)=>{e.accessibilityLabel=t}},metadata:t},C,w),e(this,null,T,{kind:`accessor`,name:`skipFocusRestoration`,static:!1,private:!1,access:{has:e=>`skipFocusRestoration`in e,get:e=>e.skipFocusRestoration,set:(e,t)=>{e.skipFocusRestoration=t}},metadata:t},E,D),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[v,b]}#e;get trigger(){return this.#e}set trigger(e){this.#e=e}#t;get accessibilityLabel(){return this.#t}set accessibilityLabel(e){this.#t=e}#n;get skipFocusRestoration(){return this.#n}set skipFocusRestoration(e){this.#n=e}open(){this.state===`opening`||this.state===`opened`||this._hasClosedParent()||!this.dispatchBeforeOpenEvent()||(this.lastFocusedElement=document.activeElement,this.showPopover?.(),this.state=`opening`,this._triggerElement&&(this._triggerElement.ariaExpanded=`true`),A.push(this),this.scrollHandler.disableScroll(),this.escapableOverlayController.connect(),this.attachOpenOverlayEvents(),this.isZeroAnimationDuration()&&this.handleOpening())}close(e){this._close(e,void 0)}_close(e,t){this.state===`closing`||this.state===`closed`||(this.lastResult=e??null,this.lastClosedTarget=t,this.dispatchBeforeCloseEvent()&&(this.state=`closing`,this._triggerElement&&(this._triggerElement.ariaExpanded=`false`),this.removeAriaLiveRefContent(),this.isZeroAnimationDuration()&&this.handleClosing()))}_hasClosedParent(){let e=this.parentElement?.closest(`sbb-dialog, sbb-overlay`);return e?.state===`closed`||e?.state===`closing`}connectedCallback(){this.popover=`manual`,super.connectedCallback(),this.hasUpdated&&this._configureTrigger()}_configureTrigger(){this.trigger!==this._triggerElement&&(this._triggerAbortController?.abort(),y(this._triggerElement),this._triggerElement=this.trigger,this._triggerElement&&(S(this,this._triggerElement,`dialog`,this.state),this._triggerAbortController=new AbortController,this._triggerElement.addEventListener(`click`,()=>this.open(),{signal:this._triggerAbortController.signal})))}firstUpdated(e){super.firstUpdated(e),this._ariaLiveRef=this.shadowRoot.querySelector(`.sbb-screen-reader-only`),this._configureTrigger(),this.isOpen&&setTimeout(()=>{this.focusTrapController.focusInitialElement()},0)}disconnectedCallback(){super.disconnectedCallback(),this.openOverlayController?.abort(),this.removeInstanceFromGlobalCollection(),this.scrollHandler.enableScroll(),this._triggerElement=null,this._triggerAbortController?.abort()}requestUpdate(e,t,r){super.requestUpdate(e,t,r),!n&&(!e||e===`trigger`)&&this.hasUpdated&&this._configureTrigger()}attachOpenOverlayEvents(){this.openOverlayController=new AbortController,window.addEventListener(`keydown`,()=>{this.removeAriaLiveRefContent()},{signal:this.openOverlayController.signal}),window.addEventListener(`click`,()=>this.removeAriaLiveRefContent(),{signal:this.openOverlayController.signal})}removeInstanceFromGlobalCollection(){let e=A.indexOf(this);e>-1&&A.splice(e,1)}closeOnSbbOverlayCloseClick(e){let t=e.composedPath().find((e,t,n)=>e instanceof HTMLElement&&t<n.indexOf(this)&&(e.hasAttribute(this.closeAttribute)||e.localName===this.closeTag)&&!e.hasAttribute(`disabled`)&&(e.closest(this.localName)===this||(this.shadowRoot?.contains(e)??!1)));t&&A.length&&A[A.length-1]._close(null,t)}removeAriaLiveRefContent(){this._ariaLiveRef&&(this._ariaLiveRef.textContent=``)}setAriaLiveRefContent(e){this._ariaLiveRef&&(this._ariaLiveRefToggle=!this._ariaLiveRefToggle,this._ariaLiveRef.textContent=`${h[this.language.current]}${e?`, ${e}`:``}${this._ariaLiveRefToggle?`\xA0`:``}`)}onOverlayAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this.handleOpening():e.animationName===`close`&&this.state===`closing`&&this.handleClosing()}}})();var M=`:host{--sbb-overlay-display:none;--sbb-overlay-inset:0 auto auto 0;--sbb-overlay-pointer-events:none;--sbb-overlay-container-display:none;--_sbb-overlay-padding-block:calc(var(--sbb-spacing-fixed-14x) + var(--sbb-spacing-responsive-l));--sbb-overlay-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x));display:var(--sbb-overlay-display);inset:var(--sbb-overlay-inset);z-index:var(--sbb-overlay-z-index,var(--sbb-overlay-default-z-index));position:fixed}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){--sbb-overlay-display:block;--sbb-overlay-container-display:flex}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]))){--sbb-overlay-pointer-events:all}:host(:not([negative])){--sbb-overlay-color:var(--sbb-color-1);--sbb-overlay-background-color:var(--sbb-background-color-3)}:host([negative]){--sbb-overlay-color:var(--sbb-color-1-negative);--sbb-overlay-background-color:var(--sbb-background-color-3-negative);--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}:host(:not(:is(:state(state-closed),[state--state-closed]))){--sbb-overlay-inset:0}.sbb-overlay__container{background-color:var(--sbb-overlay-background-color);pointer-events:var(--sbb-overlay-pointer-events);display:var(--sbb-overlay-container-display);inset:var(--sbb-overlay-inset);align-items:center;position:fixed}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-overlay__container{animation-name:open;animation-duration:var(--sbb-overlay-animation-duration);animation-timing-function:var(--sbb-overlay-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-overlay__container{pointer-events:none;animation-name:close}.sbb-overlay{height:var(--sbb-overlay-height);color:var(--sbb-overlay-color);border:none;margin:auto;padding:0;position:absolute;inset-inline:0}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-overlay{animation-name:open-move-in;animation-duration:var(--sbb-overlay-animation-duration);animation-timing-function:var(--sbb-overlay-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-overlay{animation-name:close-move-out}.sbb-overlay__wrapper{width:100%;height:var(--sbb-overlay-height);outline:none;flex-direction:column;display:flex;position:fixed}@media (width>=64rem){.sbb-overlay__wrapper{height:auto;position:sticky;inset-block-start:0}}.sbb-overlay__header{pointer-events:none;width:100%;padding:var(--sbb-spacing-responsive-xs);z-index:1;justify-content:space-between;align-items:start;padding-block-end:0;display:flex;position:absolute;inset-inline-start:0}.sbb-overlay__header *{pointer-events:all}.sbb-overlay__close{margin-inline-start:auto}.sbb-overlay__content{-webkit-overflow-scrolling:touch;height:100vh;overflow:auto}.sbb-overlay__content-container{padding-block:var(--_sbb-overlay-padding-block)}@keyframes open{0%{opacity:0}to{opacity:1}}@keyframes open-move-in{0%{transform:translateY(var(--sbb-spacing-fixed-4x))}to{transform:translateY(0%)}}@keyframes close{0%{opacity:1}to{opacity:0}}@keyframes close-move-out{0%{transform:translateY(0%)}to{transform:translateY(var(--sbb-spacing-fixed-4x))}}
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{isServer as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{SbbEscapableOverlayController as a,SbbFocusTrapController as o,SbbInertController as s,SbbLanguageController as c,SbbNegativeMixin as l,SbbOpenCloseBaseElement as u,SbbScrollHandler as d,forceType as f,forwardEvent as p,i18nCloseDialog as m,i18nDialog as h,idReference as g,isZeroAnimationDuration as _,popoverResetStyles as v,removeAriaOverlayTriggerProperties as y,screenReaderOnlyStyles as b,scrollbarStyles as x,setAriaOverlayTriggerProperties as S}from"./core.js";import{ref as C}from"lit/directives/ref.js";import{html as w}from"lit/static-html.js";import{SbbSecondaryButtonElement as T}from"./button.pure.js";import{SbbContainerElement as E}from"./container.pure.js";const D=new WeakMap;var O=class extends Event{constructor(e,{cancelable:t,closeAttribute:n,closeTarget:r,result:i}){super(e,{cancelable:t}),this.result=i??(r?D.get(r)??(r.getAttribute(n)?.trim()||null):null),this.closeTarget=r??null}};function k(e,t){D.set(e,t)}const A=[];let j=(()=>{let r=l(u),p,m=[],_=[],x,C=[],w=[],T,E=[],D=[];return class extends r{constructor(){super(...arguments),this.#e=t(this,m,null),this.#t=(t(this,_),t(this,C,``)),this.#n=(t(this,w),t(this,E,!1)),this.lastFocusedElement=t(this,D),this.focusTrapController=new o(this),this.scrollHandler=new d,this.language=new c(this),this.inertController=new s(this),this.escapableOverlayController=new a(this),this._ariaLiveRefToggle=!1,this._triggerElement=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;p=[g(),i()],x=[f(),i({attribute:`accessibility-label`})],T=[f(),i({type:Boolean})],e(this,null,p,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},m,_),e(this,null,x,{kind:`accessor`,name:`accessibilityLabel`,static:!1,private:!1,access:{has:e=>`accessibilityLabel`in e,get:e=>e.accessibilityLabel,set:(e,t)=>{e.accessibilityLabel=t}},metadata:t},C,w),e(this,null,T,{kind:`accessor`,name:`skipFocusRestoration`,static:!1,private:!1,access:{has:e=>`skipFocusRestoration`in e,get:e=>e.skipFocusRestoration,set:(e,t)=>{e.skipFocusRestoration=t}},metadata:t},E,D),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[v,b]}#e;get trigger(){return this.#e}set trigger(e){this.#e=e}#t;get accessibilityLabel(){return this.#t}set accessibilityLabel(e){this.#t=e}#n;get skipFocusRestoration(){return this.#n}set skipFocusRestoration(e){this.#n=e}open(){this.state===`opening`||this.state===`opened`||this._hasClosedParent()||!this.dispatchBeforeOpenEvent()||(this.lastFocusedElement=document.activeElement,this.showPopover?.(),this.state=`opening`,this._triggerElement&&(this._triggerElement.ariaExpanded=`true`),A.push(this),this.scrollHandler.disableScroll(),this.escapableOverlayController.connect(),this.attachOpenOverlayEvents(),this.isZeroAnimationDuration()&&this.handleOpening())}close(e){this._close(e,void 0)}_close(e,t){this.state!==`closing`&&this.state!==`closed`&&(this.lastResult=e??null,this.lastClosedTarget=t,this.dispatchBeforeCloseEvent()&&(this.state=`closing`,this._triggerElement&&(this._triggerElement.ariaExpanded=`false`),this.removeAriaLiveRefContent(),this.isZeroAnimationDuration()&&this.handleClosing()))}_hasClosedParent(){let e=this.parentElement?.closest(`sbb-dialog, sbb-overlay`);return e?.state===`closed`||e?.state===`closing`}connectedCallback(){this.popover=`manual`,super.connectedCallback(),this.hasUpdated&&this._configureTrigger()}_configureTrigger(){this.trigger!==this._triggerElement&&(this._triggerAbortController?.abort(),y(this._triggerElement),this._triggerElement=this.trigger,this._triggerElement&&(S(this,this._triggerElement,`dialog`,this.state),this._triggerAbortController=new AbortController,this._triggerElement.addEventListener(`click`,()=>this.open(),{signal:this._triggerAbortController.signal})))}firstUpdated(e){super.firstUpdated(e),this._ariaLiveRef=this.shadowRoot.querySelector(`.sbb-screen-reader-only`),this._configureTrigger(),this.isOpen&&setTimeout(()=>{this.focusTrapController.focusInitialElement()},0)}disconnectedCallback(){super.disconnectedCallback(),this.openOverlayController?.abort(),this.removeInstanceFromGlobalCollection(),this.scrollHandler.enableScroll(),this._triggerElement=null,this._triggerAbortController?.abort()}requestUpdate(e,t,r){super.requestUpdate(e,t,r),!n&&(!e||e===`trigger`)&&this.hasUpdated&&this._configureTrigger()}attachOpenOverlayEvents(){this.openOverlayController=new AbortController,window.addEventListener(`keydown`,()=>{this.removeAriaLiveRefContent()},{signal:this.openOverlayController.signal}),window.addEventListener(`click`,()=>this.removeAriaLiveRefContent(),{signal:this.openOverlayController.signal})}removeInstanceFromGlobalCollection(){let e=A.indexOf(this);e>-1&&A.splice(e,1)}closeOnSbbOverlayCloseClick(e){let t=e.composedPath().find((e,t,n)=>e instanceof HTMLElement&&t<n.indexOf(this)&&(e.hasAttribute(this.closeAttribute)||e.localName===this.closeTag)&&!e.hasAttribute(`disabled`)&&(e.closest(this.localName)===this||(this.shadowRoot?.contains(e)??!1)));t&&A.length&&A[A.length-1]._close(null,t)}removeAriaLiveRefContent(){this._ariaLiveRef&&(this._ariaLiveRef.textContent=``)}setAriaLiveRefContent(e){this._ariaLiveRef&&(this._ariaLiveRefToggle=!this._ariaLiveRefToggle,this._ariaLiveRef.textContent=`${h[this.language.current]}${e?`, ${e}`:``}${this._ariaLiveRefToggle?`\xA0`:``}`)}onOverlayAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this.handleOpening():e.animationName===`close`&&this.state===`closing`&&this.handleClosing()}}})();var M=`:host{--sbb-overlay-display:none;--sbb-overlay-inset:0 auto auto 0;--sbb-overlay-pointer-events:none;--sbb-overlay-container-display:none;--_sbb-overlay-padding-block:calc(var(--sbb-spacing-fixed-14x) + var(--sbb-spacing-responsive-l));--sbb-overlay-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x));display:var(--sbb-overlay-display);inset:var(--sbb-overlay-inset);z-index:var(--sbb-overlay-z-index,var(--sbb-overlay-default-z-index));position:fixed}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){--sbb-overlay-display:block;--sbb-overlay-container-display:flex}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]))){--sbb-overlay-pointer-events:all}:host(:not([negative])){--sbb-overlay-color:var(--sbb-color-1);--sbb-overlay-background-color:var(--sbb-background-color-3)}:host([negative]){--sbb-overlay-color:var(--sbb-color-1-negative);--sbb-overlay-background-color:var(--sbb-background-color-3-negative);--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}:host(:not(:is(:state(state-closed),[state--state-closed]))){--sbb-overlay-inset:0}.sbb-overlay__container{background-color:var(--sbb-overlay-background-color);pointer-events:var(--sbb-overlay-pointer-events);display:var(--sbb-overlay-container-display);inset:var(--sbb-overlay-inset);align-items:center;position:fixed}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-overlay__container{animation-name:open;animation-duration:var(--sbb-overlay-animation-duration);animation-timing-function:var(--sbb-overlay-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-overlay__container{pointer-events:none;animation-name:close}.sbb-overlay{height:var(--sbb-overlay-height);color:var(--sbb-overlay-color);border:none;margin:auto;padding:0;position:absolute;inset-inline:0}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-overlay{animation-name:open-move-in;animation-duration:var(--sbb-overlay-animation-duration);animation-timing-function:var(--sbb-overlay-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-overlay{animation-name:close-move-out}.sbb-overlay__wrapper{width:100%;height:var(--sbb-overlay-height);outline:none;flex-direction:column;display:flex;position:fixed}@media (width>=64rem){.sbb-overlay__wrapper{height:auto;position:sticky;inset-block-start:0}}.sbb-overlay__header{pointer-events:none;width:100%;padding:var(--sbb-spacing-responsive-xs);z-index:1;justify-content:space-between;align-items:start;padding-block-end:0;display:flex;position:absolute;inset-inline-start:0}.sbb-overlay__header *{pointer-events:all}.sbb-overlay__close{margin-inline-start:auto}.sbb-overlay__content{-webkit-overflow-scrolling:touch;height:100vh;overflow:auto}.sbb-overlay__content-container{padding-block:var(--_sbb-overlay-padding-block)}@keyframes open{0%{opacity:0}to{opacity:1}}@keyframes open-move-in{0%{transform:translateY(var(--sbb-spacing-fixed-4x))}to{transform:translateY(0%)}}@keyframes close{0%{opacity:1}to{opacity:0}}@keyframes close-move-out{0%{transform:translateY(0%)}to{transform:translateY(var(--sbb-spacing-fixed-4x))}}
 `;let N=(()=>{let n=j,a,o=[],s=[],c,l=[],u=[];return class extends n{constructor(){super(...arguments),this.#e=t(this,o,!1),this.#t=(t(this,s),t(this,l,``)),this.closeAttribute=(t(this,u),`sbb-overlay-close`),this._overlayContentElement=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(n[Symbol.metadata]??null):void 0;a=[f(),i({reflect:!0,type:Boolean})],c=[f(),i({attribute:`accessibility-close-label`})],e(this,null,a,{kind:`accessor`,name:`expanded`,static:!1,private:!1,access:{has:e=>`expanded`in e,get:e=>e.expanded,set:(e,t)=>{e.expanded=t}},metadata:t},o,s),e(this,null,c,{kind:`accessor`,name:`accessibilityCloseLabel`,static:!1,private:!1,access:{has:e=>`accessibilityCloseLabel`in e,get:e=>e.accessibilityCloseLabel,set:(e,t)=>{e.accessibilityCloseLabel=t}},metadata:t},l,u),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-overlay`}static{this.elementDependencies=[T,E]}static{this.styles=[x,r(M)]}static{this.events={beforeopen:`beforeopen`,open:`open`,beforeclose:`beforeclose`,close:`close`}}#e;get expanded(){return this.#e}set expanded(e){this.#e=e}#t;get accessibilityCloseLabel(){return this.#t}set accessibilityCloseLabel(e){this.#t=e}firstUpdated(e){super.firstUpdated(e),this.isOpen&&this.setAriaLiveRefContent()}isZeroAnimationDuration(){return _(this,`--sbb-overlay-animation-duration`)}handleOpening(){this.state=`opened`,this.inertController.activate(),this.focusTrapController.focusInitialElement(),setTimeout(()=>this.setAriaLiveRefContent(this.accessibilityLabel)),this.focusTrapController.enabled=!0,this.dispatchOpenEvent()}handleClosing(){this._overlayContentElement?.scrollTo(0,0),this.state=`closed`,this.hidePopover?.(),this.inertController.deactivate(),this.skipFocusRestoration||this.lastFocusedElement?.focus(),this.openOverlayController?.abort(),this.focusTrapController.enabled=!1,this.removeInstanceFromGlobalCollection(),A.length||this.scrollHandler.enableScroll(),this.escapableOverlayController.disconnect(),this.dispatchCloseEvent()}dispatchBeforeCloseEvent(){return this.dispatchEvent(new O(`beforeclose`,{cancelable:!0,closeAttribute:this.closeAttribute,closeTarget:this.lastClosedTarget,result:this.lastResult}))}dispatchCloseEvent(){return this.dispatchEvent(new O(`close`,{closeAttribute:this.closeAttribute,closeTarget:this.lastClosedTarget,result:this.lastResult}))}render(){return w`
       <div class="sbb-overlay__container" @animationend=${this.onOverlayAnimationEnd}>
         <div class="sbb-overlay">

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@sbb-esta/lyne-elements-dev",
-  "version": "5.3.0-dev.1784307592",
+  "version": "5.3.0-dev.1784406755",
   "description": "Lyne Design System",
   "keywords": [
     "design system",
     "web components",
     "lit",
-    "https://github.com/sbb-design-systems/lyne-components/commit/b5b6bc96760a5d81a41ecfacc58fb24a06b4fdf8"
+    "https://github.com/sbb-design-systems/lyne-components/commit/642084181cb2b96fb6083b84e35f68d92a08e8e9"
   ],
   "type": "module",
   "exports": {

package/popover.pure.js

@@ -1,5 +1,5 @@
 import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeController as n}from"@lit-labs/observers/resize-controller.js";import{html as r,isServer as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import{ref as c}from"lit/directives/ref.js";import{IS_FOCUSABLE_QUERY as l,SbbEscapableOverlayController as u,SbbFocusTrapController as d,SbbLanguageController as f,SbbMediaQueryPointerCoarse as p,SbbOpenCloseBaseElement as m,forceType as h,getElementPosition as g,i18nClosePopover as _,idReference as v,isEventOnElement as y,isFakeMousedownFromScreenReader as b,isZeroAnimationDuration as x,popoverResetStyles as S,readConfig as C,removeAriaOverlayTriggerProperties as w,sbbInputModalityDetector as T,scrollbarStyles as E,setAriaOverlayTriggerProperties as D,ɵstateController as O}from"./core.js";import{SbbSecondaryButtonElement as k}from"./button.pure.js";var A=`:host{--sbb-focus-outline-color:light-dark(var(--sbb-focus-outline-color-default),var(--sbb-focus-outline-color-dark));--sbb-popover-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));--_sbb-popover-inset:0 auto auto 0;--_sbb-popover-translate:0 var(--sbb-spacing-fixed-2x);--_sbb-popover-box-shadow:var(--sbb-box-shadow-level-9-hard);display:none;outline:none!important}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){--_sbb-popover-inset:0;display:block}:host(:is(:state(position-above),[state--position-above])){--_sbb-popover-translate:0 calc(var(--sbb-spacing-fixed-2x) * -1)}.sbb-popover:after,.sbb-popover__content:before{content:"";width:var(--sbb-popover-arrow-size);height:var(--sbb-popover-arrow-size);left:var(--_sbb-popover-arrow-position-x,0);bottom:calc(100% - var(--sbb-popover-arrow-size) / 2);background-color:var(--sbb-popover-background);border-radius:var(--sbb-border-radius-2x) 0;display:block;position:absolute;rotate:45deg}.sbb-popover__container{inset:var(--_sbb-popover-inset);pointer-events:none;z-index:var(--sbb-popover-z-index,var(--sbb-overlay-default-z-index));position:fixed}.sbb-popover{position:var(--sbb-popover-position,absolute);top:var(--_sbb-popover-position-y,0);bottom:unset;left:var(--_sbb-popover-position-x,0);right:unset;background-color:var(--sbb-popover-background);max-width:var(--sbb-popover-max-width);width:max-content;box-shadow:var(--_sbb-popover-box-shadow);border-radius:var(--sbb-popover-border-radius);pointer-events:all;border:none;outline:none;padding:0;display:none}:host(:focus-visible) .sbb-popover{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-popover{animation-name:open;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing);display:block}:host(:is(:state(state-closing),[state--state-closing])) .sbb-popover{pointer-events:none;animation-name:close;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}.sbb-popover:after{z-index:-1;box-shadow:var(--_sbb-popover-box-shadow)}@media (forced-colors:active){.sbb-popover:after{outline:var(--sbb-border-width-1x) solid CanvasText}}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:after{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@media (forced-colors:active){.sbb-popover{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-popover:before{content:"";z-index:-1;background-color:#0000;display:block;position:absolute;inset:0}:host(:is(:state(position-below),[state--position-below])) .sbb-popover:before{inset-block-start:calc(-1 * var(--sbb-spacing-fixed-6x))}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:before{inset-block-end:calc(-1 * var(--sbb-spacing-fixed-6x))}.sbb-popover__content{border-radius:var(--sbb-popover-border-radius);padding:var(--sbb-popover-padding);background-color:var(--sbb-popover-background);outline:none}.sbb-popover__content:before{clip-path:polygon(100% 0,0% 0%,0% 100%)}:host(:is(:state(position-above),[state--position-above])) .sbb-popover__content:before{top:calc(100% - var(--sbb-popover-arrow-size) / 2);clip-path:polygon(100% 0,100% 100%,0% 100%)}@keyframes open{0%{opacity:0;translate:var(--_sbb-popover-translate)}to{opacity:1;translate:0}}@keyframes close{0%{opacity:1;translate:0}to{opacity:0;translate:var(--_sbb-popover-translate)}}
-`;const j=new Set;var M=class extends Event{get closeTarget(){return this._closeTarget}constructor(e,{closeTarget:t,cancelable:n}){super(e,{cancelable:n}),this._closeTarget=t}};let N=(()=>{let s=m,f,p=[],h=[];return class extends s{constructor(){super(...arguments),this.#e=t(this,p,null),this._nextFocusedElement=t(this,h),this._skipCloseFocus=!1,this._resizeController=new n(this,{target:null,callback:()=>this._setPopoverPosition()}),this._escapableOverlayController=new u(this),this._focusTrapController=new d(this),this._blurTimeout=null,this._pointerDownListener=e=>{this._isPointerDownEventOnPopover=y(this.overlay,e)},this._closeOnBackdropClick=e=>{let t=e.composedPath();!this._isPointerDownEventOnPopover&&!y(this.overlay,e)&&(!this.trigger||!t.includes(this.trigger))&&(this._nextFocusedElement=t.filter(e=>e instanceof window.HTMLElement).find(e=>e.matches(l)),clearTimeout(this.closeTimeout),this.close())}}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(s[Symbol.metadata]??null):void 0;f=[v(),o()],e(this,null,f,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},p,h),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[S,a(A)]}#e;get trigger(){return this.#e}set trigger(e){this.#e=e}open(){if(!(this.state!==`closed`&&this.state!==`closing`||!this.overlay||!this.dispatchBeforeOpenEvent())){for(let e of j)(e.state===`opened`||e.state===`opening`)&&e.close();this.showPopover?.(),this.state=`opening`,this.inert=!0,this._setPopoverPosition(),this._attachWindowEvents(),this._escapableOverlayController.connect(),this._nextFocusedElement=void 0,this._skipCloseFocus=!1,this._triggerElement&&(this._triggerElement.ariaExpanded=`true`),this._isZeroAnimationDuration()&&this._handleOpening()}}close(e){this.state!==`opened`&&this.state!==`opening`||(this._popoverCloseElement=e,this.dispatchBeforeCloseEvent({closeTarget:e??null})&&(this.state=`closing`,this.inert=!0,this._triggerElement&&(this._triggerElement.ariaExpanded=`false`),this._isZeroAnimationDuration()&&this._handleClosing()))}_isZeroAnimationDuration(){return x(this,`--sbb-popover-animation-duration`)}_handleClosing(){this.state=`closed`,this.hidePopover?.(),this.overlay&&(this._resizeController.unobserve(this.overlay),this.overlay.firstElementChild?.scrollTo(0,0)),this.removeAttribute(`tabindex`),this._skipCloseFocus||(this._nextFocusedElement||this._triggerElement)?.focus(),this._escapableOverlayController.disconnect(),this._openStateController?.abort(),this._focusTrapController.enabled=!1,this.dispatchCloseEvent({closeTarget:this._popoverCloseElement??null})}_handleOpening(){this.state=`opened`,this.inert=!1,this._setPopoverFocus(),this._focusTrapController.enabled=!0,this.overlay&&this._resizeController.observe(this.overlay),this.dispatchOpenEvent()}connectedCallback(){this.popover=`manual`,super.connectedCallback(),this.state=`closed`,j.add(this),this.hasUpdated&&this._configureTrigger()}requestUpdate(e,t,n){super.requestUpdate(e,t,n),!i&&(!e||e===`trigger`||e===`hoverTrigger`)&&this.hasUpdated&&this._configureTrigger()}firstUpdated(e){super.firstUpdated(e),this._configureTrigger()}disconnectedCallback(){super.disconnectedCallback(),this._triggerElement=null,this._triggerAbortController?.abort(),this._openStateController?.abort(),j.delete(this),this._blurTimeout&&clearTimeout(this._blurTimeout)}_configureTrigger(){if(!i){if(this.hydrationRequired){this.hydrationComplete.then(()=>this._configureTrigger());return}this.configureTrigger(this._triggerElement??null)}}configureTrigger(e){this._triggerAbortController?.abort(),w(this._triggerElement),this._triggerElement=this.trigger,this._triggerElement&&(D(this,this._triggerElement,`dialog`,this.state),this._triggerAbortController=new AbortController,this.registerTriggerListeners(this._triggerAbortController.signal))}registerTriggerListeners(e){this._triggerElement.addEventListener(`click`,()=>this.open(),{signal:e})}_attachWindowEvents(){this._openStateController=new AbortController,document.addEventListener(`scroll`,()=>this._setPopoverPosition(),{passive:!0,signal:this._openStateController.signal,capture:!0}),window.addEventListener(`resize`,()=>this._setPopoverPosition(),{passive:!0,signal:this._openStateController.signal}),window.addEventListener(`pointerdown`,this._pointerDownListener,{signal:this._openStateController.signal}),window.addEventListener(`pointerup`,this._closeOnBackdropClick,{signal:this._openStateController.signal})}_closeOnSbbPopoverCloseClick(e){let t=e.composedPath().find((e,t,n)=>e instanceof HTMLElement&&t<n.indexOf(this)&&(e.hasAttribute(`sbb-popover-close`)||e.localName===`sbb-popover-close-button`)&&!e.hasAttribute(`disabled`));t&&(clearTimeout(this.closeTimeout),this.close(t))}_onPopoverAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this._handleOpening():e.animationName===`close`&&this.state===`closing`&&this._handleClosing()}_setPopoverFocus(){!this._focusTrapController.focusInitialElement()&&this._openStateController&&(this.setAttribute(`tabindex`,`0`),this.focus({preventScroll:!0}),this.addEventListener(`blur`,e=>{this._blurTimeout=setTimeout(()=>{if(document.visibilityState!==`hidden`){if(this.removeAttribute(`tabindex`),this.contains(e.relatedTarget)||e.relatedTarget===this.trigger)return;(this.state===`opened`||this.state===`opening`)&&(this._skipCloseFocus=!0),this.close()}})},{signal:this._openStateController.signal}))}_setPopoverPosition(){if(!this.overlay||!this._triggerElement)return;let e=g(this.overlay,this._triggerElement,this.shadowRoot.querySelector(`.sbb-popover__container`),{verticalOffset:16,horizontalOffset:32,centered:!0,responsiveHeight:!0}),t=e.alignment.vertical;for(let e of[`above`,`below`])this.toggleState(`position-${e}`,e===t);let n=this._triggerElement.getBoundingClientRect().left-e.left+this._triggerElement.clientWidth/2-8;this.style.setProperty(`--_sbb-popover-position-x`,`${e.left}px`),this.style.setProperty(`--_sbb-popover-position-y`,`${e.top}px`),this.style.setProperty(`--_sbb-popover-arrow-position-x`,`${n}px`),this.style.setProperty(`--_sbb-popover-max-height`,e.maxHeight)}dispatchBeforeCloseEvent(e){let t=e?.closeTarget??null;return this.dispatchEvent(new M(`beforeclose`,{closeTarget:t,cancelable:!0}))}dispatchCloseEvent(e){let t=e?.closeTarget??null;return this.dispatchEvent(new M(`close`,{closeTarget:t,cancelable:!1}))}render(){return r`
+`;const j=new Set;var M=class extends Event{get closeTarget(){return this._closeTarget}constructor(e,{closeTarget:t,cancelable:n}){super(e,{cancelable:n}),this._closeTarget=t}};let N=(()=>{let s=m,f,p=[],h=[];return class extends s{constructor(){super(...arguments),this.#e=t(this,p,null),this._nextFocusedElement=t(this,h),this._skipCloseFocus=!1,this._resizeController=new n(this,{target:null,callback:()=>this._setPopoverPosition()}),this._escapableOverlayController=new u(this),this._focusTrapController=new d(this),this._blurTimeout=null,this._pointerDownListener=e=>{this._isPointerDownEventOnPopover=y(this.overlay,e)},this._closeOnBackdropClick=e=>{let t=e.composedPath();!this._isPointerDownEventOnPopover&&!y(this.overlay,e)&&(!this.trigger||!t.includes(this.trigger))&&(this._nextFocusedElement=t.filter(e=>e instanceof window.HTMLElement).find(e=>e.matches(l)),clearTimeout(this.closeTimeout),this.close())}}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(s[Symbol.metadata]??null):void 0;f=[v(),o()],e(this,null,f,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},p,h),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[S,a(A)]}#e;get trigger(){return this.#e}set trigger(e){this.#e=e}open(){if(!(this.state!==`closed`&&this.state!==`closing`||!this.overlay||!this.dispatchBeforeOpenEvent())){for(let e of j)(e.state===`opened`||e.state===`opening`)&&e.close();this.showPopover?.(),this.state=`opening`,this.inert=!0,this._setPopoverPosition(),this._attachWindowEvents(),this._escapableOverlayController.connect(),this._nextFocusedElement=void 0,this._skipCloseFocus=!1,this._triggerElement&&(this._triggerElement.ariaExpanded=`true`),this._isZeroAnimationDuration()&&this._handleOpening()}}close(e){(this.state===`opened`||this.state===`opening`)&&(this._popoverCloseElement=e,this.dispatchBeforeCloseEvent({closeTarget:e??null})&&(this.state=`closing`,this.inert=!0,this._triggerElement&&(this._triggerElement.ariaExpanded=`false`),this._isZeroAnimationDuration()&&this._handleClosing()))}_isZeroAnimationDuration(){return x(this,`--sbb-popover-animation-duration`)}_handleClosing(){this.state=`closed`,this.hidePopover?.(),this.overlay&&(this._resizeController.unobserve(this.overlay),this.overlay.firstElementChild?.scrollTo(0,0)),this.removeAttribute(`tabindex`),this._skipCloseFocus||(this._nextFocusedElement||this._triggerElement)?.focus(),this._escapableOverlayController.disconnect(),this._openStateController?.abort(),this._focusTrapController.enabled=!1,this.dispatchCloseEvent({closeTarget:this._popoverCloseElement??null})}_handleOpening(){this.state=`opened`,this.inert=!1,this._setPopoverFocus(),this._focusTrapController.enabled=!0,this.overlay&&this._resizeController.observe(this.overlay),this.dispatchOpenEvent()}connectedCallback(){this.popover=`manual`,super.connectedCallback(),this.state=`closed`,j.add(this),this.hasUpdated&&this._configureTrigger()}requestUpdate(e,t,n){super.requestUpdate(e,t,n),!i&&(!e||e===`trigger`||e===`hoverTrigger`)&&this.hasUpdated&&this._configureTrigger()}firstUpdated(e){super.firstUpdated(e),this._configureTrigger()}disconnectedCallback(){super.disconnectedCallback(),this._triggerElement=null,this._triggerAbortController?.abort(),this._openStateController?.abort(),j.delete(this),this._blurTimeout&&clearTimeout(this._blurTimeout)}_configureTrigger(){if(!i){if(this.hydrationRequired){this.hydrationComplete.then(()=>this._configureTrigger());return}this.configureTrigger(this._triggerElement??null)}}configureTrigger(e){this._triggerAbortController?.abort(),w(this._triggerElement),this._triggerElement=this.trigger,this._triggerElement&&(D(this,this._triggerElement,`dialog`,this.state),this._triggerAbortController=new AbortController,this.registerTriggerListeners(this._triggerAbortController.signal))}registerTriggerListeners(e){this._triggerElement.addEventListener(`click`,()=>this.open(),{signal:e})}_attachWindowEvents(){this._openStateController=new AbortController,document.addEventListener(`scroll`,()=>this._setPopoverPosition(),{passive:!0,signal:this._openStateController.signal,capture:!0}),window.addEventListener(`resize`,()=>this._setPopoverPosition(),{passive:!0,signal:this._openStateController.signal}),window.addEventListener(`pointerdown`,this._pointerDownListener,{signal:this._openStateController.signal}),window.addEventListener(`pointerup`,this._closeOnBackdropClick,{signal:this._openStateController.signal})}_closeOnSbbPopoverCloseClick(e){let t=e.composedPath().find((e,t,n)=>e instanceof HTMLElement&&t<n.indexOf(this)&&(e.hasAttribute(`sbb-popover-close`)||e.localName===`sbb-popover-close-button`)&&!e.hasAttribute(`disabled`));t&&(clearTimeout(this.closeTimeout),this.close(t))}_onPopoverAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this._handleOpening():e.animationName===`close`&&this.state===`closing`&&this._handleClosing()}_setPopoverFocus(){!this._focusTrapController.focusInitialElement()&&this._openStateController&&(this.setAttribute(`tabindex`,`0`),this.focus({preventScroll:!0}),this.addEventListener(`blur`,e=>{this._blurTimeout=setTimeout(()=>{if(document.visibilityState!==`hidden`){if(this.removeAttribute(`tabindex`),this.contains(e.relatedTarget)||e.relatedTarget===this.trigger)return;(this.state===`opened`||this.state===`opening`)&&(this._skipCloseFocus=!0),this.close()}})},{signal:this._openStateController.signal}))}_setPopoverPosition(){if(!this.overlay||!this._triggerElement)return;let e=g(this.overlay,this._triggerElement,this.shadowRoot.querySelector(`.sbb-popover__container`),{verticalOffset:16,horizontalOffset:32,centered:!0,responsiveHeight:!0}),t=e.alignment.vertical;for(let e of[`above`,`below`])this.toggleState(`position-${e}`,e===t);let n=this._triggerElement.getBoundingClientRect().left-e.left+this._triggerElement.clientWidth/2-8;this.style.setProperty(`--_sbb-popover-position-x`,`${e.left}px`),this.style.setProperty(`--_sbb-popover-position-y`,`${e.top}px`),this.style.setProperty(`--_sbb-popover-arrow-position-x`,`${n}px`),this.style.setProperty(`--_sbb-popover-max-height`,e.maxHeight)}dispatchBeforeCloseEvent(e){let t=e?.closeTarget??null;return this.dispatchEvent(new M(`beforeclose`,{closeTarget:t,cancelable:!0}))}dispatchCloseEvent(e){let t=e?.closeTarget??null;return this.dispatchEvent(new M(`close`,{closeTarget:t,cancelable:!1}))}render(){return r`
       <div class="sbb-popover__container">
         <div
           @animationend=${this._onPopoverAnimationEnd}
@@ -16,7 +16,7 @@ import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeControl
         </div>
       </div>
     `}}})();var P=`:host{--_sbb-popover-half-padding:calc(.5 * var(--sbb-popover-padding));position:relative}:host(:is(:state(has-close-button),[state--has-close-button])){--_sbb-popover-close-button-min-height:calc(var(--sbb-button-min-height-size-s) + 2 * var(--sbb-popover-padding));--_sbb-popover-close-button-min-width:calc(var(--_sbb-popover-close-button-min-height) - var(--_sbb-popover-half-padding))}.sbb-popover__content{padding-block:var(--_sbb-popover-half-padding);padding-inline:var(--_sbb-popover-half-padding) var(--_sbb-popover-close-button-min-width,var(--_sbb-popover-half-padding));min-height:var(--_sbb-popover-close-button-min-height)}.sbb-popover__scrollable-content{padding-inline:var(--_sbb-popover-half-padding);padding-block:var(--_sbb-popover-half-padding);max-height:calc(var(--_sbb-popover-max-height) - var(--sbb-spacing-fixed-1x));display:block;overflow:auto}::slotted(sbb-popover-close-button){inset:var(--sbb-popover-padding) var(--sbb-popover-padding) auto auto;position:absolute}
-`;const F=!i&&matchMedia(p).matches;let I=(()=>{let n=N,i=[],c,l=[],u=[],d,f,p,m=[],g=[];return class extends n{constructor(){super(...arguments),this.#e=(t(this,i),t(this,l,!1)),this._openDelay=t(this,u),this.#t=t(this,m,!1),this._openTimeout=t(this,g),this._overlayAbortController=null,this._onTriggerMouseEnter=()=>{this.state===`closed`||this.state===`closing`?this._openTimeout=setTimeout(()=>{T.reset(),this.open()},this.openDelay):clearTimeout(this.closeTimeout)},this._onTriggerMouseLeave=()=>{this.state===`opened`||this.state===`opening`?this.closeTimeout=setTimeout(()=>this.close(),this.closeDelay):clearTimeout(this._openTimeout)},this._onOverlayMouseEnter=()=>{this.state!==`opening`&&clearTimeout(this.closeTimeout)},this._onOverlayMouseLeave=()=>{this.state!==`opening`&&(this.closeTimeout=setTimeout(()=>this.close(),this.closeDelay))}}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(n[Symbol.metadata]??null):void 0;c=[h(),o({attribute:`hover-trigger`,type:Boolean})],d=[o({attribute:`open-delay`,type:Number})],f=[o({attribute:`close-delay`,type:Number})],p=[s()],e(this,null,c,{kind:`accessor`,name:`hoverTrigger`,static:!1,private:!1,access:{has:e=>`hoverTrigger`in e,get:e=>e.hoverTrigger,set:(e,t)=>{e.hoverTrigger=t}},metadata:t},l,u),e(this,null,d,{kind:`setter`,name:`openDelay`,static:!1,private:!1,access:{has:e=>`openDelay`in e,set:(e,t)=>{e.openDelay=t}},metadata:t},null,i),e(this,null,f,{kind:`setter`,name:`closeDelay`,static:!1,private:!1,access:{has:e=>`closeDelay`in e,set:(e,t)=>{e.closeDelay=t}},metadata:t},null,i),e(this,null,p,{kind:`accessor`,name:`_hoverTrigger`,static:!1,private:!1,access:{has:e=>`_hoverTrigger`in e,get:e=>e._hoverTrigger,set:(e,t)=>{e._hoverTrigger=t}},metadata:t},m,g),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-popover`}static{this.styles=[E,a(P)]}#e;get hoverTrigger(){return this.#e}set hoverTrigger(e){this.#e=e}set openDelay(e){this._openDelay=+e}get openDelay(){return this._openDelay??C().popover?.openDelay??0}set closeDelay(e){this._closeDelay=+e}get closeDelay(){return this._closeDelay??C().popover?.closeDelay??0}#t;get _hoverTrigger(){return this.#t}set _hoverTrigger(e){this.#t=e}configureTrigger(e){let t=this.hoverTrigger&&!F;this.trigger===e&&t===this._hoverTrigger||(this._hoverTrigger!==t&&(this._hoverTrigger=t,this.toggleState(`hover-trigger`,this._hoverTrigger),this._registerOverlayListeners()),super.configureTrigger(e))}_registerOverlayListeners(){this._overlayAbortController?.abort(),this._hoverTrigger&&(this._overlayAbortController=new AbortController,this.overlay?.addEventListener(`mouseenter`,()=>this._onOverlayMouseEnter(),{signal:this._overlayAbortController.signal}),this.overlay?.addEventListener(`mouseleave`,()=>this._onOverlayMouseLeave(),{signal:this._overlayAbortController.signal}))}registerTriggerListeners(e){this._hoverTrigger&&this.trigger?(this.trigger.addEventListener(`mouseenter`,this._onTriggerMouseEnter,{signal:e}),this.trigger.addEventListener(`mouseleave`,this._onTriggerMouseLeave,{signal:e}),this.trigger.addEventListener(`keydown`,e=>{(e.code===`Space`||e.code===`Enter`)&&this.open()},{signal:e}),this.trigger.addEventListener(`mousedown`,e=>{b(e)&&this.open()},{signal:e})):super.registerTriggerListeners(e)}firstUpdated(e){super.firstUpdated(e),this._registerOverlayListeners()}open(){super.open(),this.hoverTrigger&&this.trigger&&O(this.trigger).add(`force-hover`)}close(){super.close(),O(this.trigger)?.delete(`force-hover`)}renderContent(){return r`
+`;const F=!i&&matchMedia(p).matches;let I=(()=>{let n=N,i=[],c,l=[],u=[],d,f,p,m=[],g=[];return class extends n{constructor(){super(...arguments),this.#e=(t(this,i),t(this,l,!1)),this._openDelay=t(this,u),this.#t=t(this,m,!1),this._openTimeout=t(this,g),this._overlayAbortController=null,this._onTriggerMouseEnter=()=>{this.state===`closed`||this.state===`closing`?this._openTimeout=setTimeout(()=>{T.reset(),this.open()},this.openDelay):clearTimeout(this.closeTimeout)},this._onTriggerMouseLeave=()=>{this.state===`opened`||this.state===`opening`?this.closeTimeout=setTimeout(()=>this.close(),this.closeDelay):clearTimeout(this._openTimeout)},this._onOverlayMouseEnter=()=>{this.state!==`opening`&&clearTimeout(this.closeTimeout)},this._onOverlayMouseLeave=()=>{this.state!==`opening`&&(this.closeTimeout=setTimeout(()=>this.close(),this.closeDelay))}}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(n[Symbol.metadata]??null):void 0;c=[h(),o({attribute:`hover-trigger`,type:Boolean})],d=[o({attribute:`open-delay`,type:Number})],f=[o({attribute:`close-delay`,type:Number})],p=[s()],e(this,null,c,{kind:`accessor`,name:`hoverTrigger`,static:!1,private:!1,access:{has:e=>`hoverTrigger`in e,get:e=>e.hoverTrigger,set:(e,t)=>{e.hoverTrigger=t}},metadata:t},l,u),e(this,null,d,{kind:`setter`,name:`openDelay`,static:!1,private:!1,access:{has:e=>`openDelay`in e,set:(e,t)=>{e.openDelay=t}},metadata:t},null,i),e(this,null,f,{kind:`setter`,name:`closeDelay`,static:!1,private:!1,access:{has:e=>`closeDelay`in e,set:(e,t)=>{e.closeDelay=t}},metadata:t},null,i),e(this,null,p,{kind:`accessor`,name:`_hoverTrigger`,static:!1,private:!1,access:{has:e=>`_hoverTrigger`in e,get:e=>e._hoverTrigger,set:(e,t)=>{e._hoverTrigger=t}},metadata:t},m,g),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-popover`}static{this.styles=[E,a(P)]}#e;get hoverTrigger(){return this.#e}set hoverTrigger(e){this.#e=e}set openDelay(e){this._openDelay=+e}get openDelay(){return this._openDelay??C().popover?.openDelay??0}set closeDelay(e){this._closeDelay=+e}get closeDelay(){return this._closeDelay??C().popover?.closeDelay??0}#t;get _hoverTrigger(){return this.#t}set _hoverTrigger(e){this.#t=e}configureTrigger(e){let t=this.hoverTrigger&&!F;(this.trigger!==e||t!==this._hoverTrigger)&&(this._hoverTrigger!==t&&(this._hoverTrigger=t,this.toggleState(`hover-trigger`,this._hoverTrigger),this._registerOverlayListeners()),super.configureTrigger(e))}_registerOverlayListeners(){this._overlayAbortController?.abort(),this._hoverTrigger&&(this._overlayAbortController=new AbortController,this.overlay?.addEventListener(`mouseenter`,()=>this._onOverlayMouseEnter(),{signal:this._overlayAbortController.signal}),this.overlay?.addEventListener(`mouseleave`,()=>this._onOverlayMouseLeave(),{signal:this._overlayAbortController.signal}))}registerTriggerListeners(e){this._hoverTrigger&&this.trigger?(this.trigger.addEventListener(`mouseenter`,this._onTriggerMouseEnter,{signal:e}),this.trigger.addEventListener(`mouseleave`,this._onTriggerMouseLeave,{signal:e}),this.trigger.addEventListener(`keydown`,e=>{(e.code===`Space`||e.code===`Enter`)&&this.open()},{signal:e}),this.trigger.addEventListener(`mousedown`,e=>{b(e)&&this.open()},{signal:e})):super.registerTriggerListeners(e)}firstUpdated(e){super.firstUpdated(e),this._registerOverlayListeners()}open(){super.open(),this.hoverTrigger&&this.trigger&&O(this.trigger).add(`force-hover`)}close(){super.close(),O(this.trigger)?.delete(`force-hover`)}renderContent(){return r`
       <span class="sbb-popover__scrollable-content sbb-scrollbar">
         <slot
           @slotchange=${()=>this.toggleState(`has-close-button`,!!this.querySelector(`sbb-popover-close-button`))}

package/selection-expansion-panel.pure.js

@@ -1,5 +1,5 @@
 import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i,state as a}from"lit/decorators.js";import{SbbElement as o,SbbLanguageController as s,SbbSelectionPanelMixin as c,forceType as l,i18nCollapsed as u,i18nExpanded as d,isZeroAnimationDuration as f}from"./core.js";import{SbbDividerElement as p}from"./divider.pure.js";var m=`:host{--sbb-selection-panel-inner-background:transparent;--sbb-selection-panel-inner-border-width:0px;--sbb-selection-expansion-panel-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));--sbb-focus-outline-color:light-dark(var(--sbb-focus-outline-color-default),var(--sbb-focus-outline-color-dark));width:var(--sbb-selection-group-elements-width,100%);background-color:var(--sbb-selection-expansion-panel-background);border-radius:var(--sbb-selection-panel-border-radius);box-shadow:inset 0 0 0 var(--sbb-selection-expansion-panel-border-width) var(--sbb-selection-expansion-panel-border-color);transition-duration:var(--sbb-selection-expansion-panel-animation-duration);transition-timing-function:var(--sbb-animation-easing);flex:auto;transition-property:box-shadow;display:block;position:relative}@media (forced-colors:active){:host:after{content:"";pointer-events:none;border:var(--sbb-selection-expansion-panel-border-width) solid var(--sbb-selection-expansion-panel-border-color);border-radius:var(--sbb-selection-panel-border-radius);display:block;position:absolute;inset:0}}:host(:is(:state(size-xs),[state--size-xs])){--sbb-selection-expansion-panel-content-padding-inline:var(--sbb-selection-panel-input-padding-inline-xs)}:host(:is(:state(size-s),[state--size-s])){--sbb-selection-expansion-panel-content-padding-inline:var(--sbb-selection-panel-input-padding-inline-s)}:host(:is(:state(size-m),[state--size-m])){--sbb-selection-expansion-panel-content-padding-inline:var(--sbb-selection-panel-input-padding-inline-m)}:host(:is(:state(color-milk),[state--color-milk])){--sbb-selection-expansion-panel-background:var(--sbb-selection-panel-background-milk)}:host(:where(:is(:state(checked),[state--checked])):not(:where(:is(:state(disabled),[state--disabled])))){--sbb-selection-expansion-panel-border-color:var(--sbb-selection-panel-border-color-checked);--sbb-selection-expansion-panel-border-width:var(--sbb-selection-panel-border-width-checked)}:host(:is(:state(slotted-content),[state--slotted-content]):where(:is(:state(disabled),[state--disabled]))){--sbb-selection-expansion-panel-border-color:var(--sbb-selection-panel-border-color-default)}:host(:is(:state(borderless),[state--borderless]):not(:where(:is(:state(checked),[state--checked])))){--sbb-selection-expansion-panel-border-color:transparent}:host(:not(:is(:state(slotted-content),[state--slotted-content]):where(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened])))){--sbb-selection-expansion-panel-content-padding-block-end:0px;--sbb-selection-expansion-panel-content-visibility:hidden}.sbb-selection-expansion-panel__content--wrapper{visibility:var(--sbb-selection-expansion-panel-content-visibility);opacity:0;grid-template-rows:0fr;display:grid}:host(:is(:state(state-opened),[state--state-opened])) .sbb-selection-expansion-panel__content--wrapper{opacity:1;grid-template-rows:1fr}:host(:is(:state(state-opening),[state--state-opening])) .sbb-selection-expansion-panel__content--wrapper{animation-name:open,open-opacity;animation-fill-mode:forwards;animation-duration:var(--sbb-selection-expansion-panel-animation-duration);animation-timing-function:var(--sbb-animation-easing);animation-delay:0s, var(--sbb-selection-expansion-panel-animation-duration)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-selection-expansion-panel__content--wrapper{animation-name:close;animation-duration:var(--sbb-selection-expansion-panel-animation-duration);animation-timing-function:var(--sbb-animation-easing)}:host(:not(:is(:state(slotted-content),[state--slotted-content]))) .sbb-selection-expansion-panel__content--wrapper{display:none}.sbb-selection-expansion-panel__content{padding-inline:var(--sbb-selection-expansion-panel-content-padding-inline);transition:padding var(--sbb-selection-expansion-panel-animation-duration) var(--sbb-animation-easing);padding-block-end:var(--sbb-selection-expansion-panel-content-padding-block-end);overflow:hidden}sbb-divider{margin-block-end:var(--sbb-selection-expansion-panel-content-padding-block-start)}@keyframes open{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes open-opacity{0%{opacity:0}to{opacity:1}}@keyframes close{0%{opacity:1;grid-template-rows:1fr}to{opacity:0;grid-template-rows:0fr}}
-`;let h=(()=>{let h=c(o),g=[],_,v=[],y=[],b;return class extends h{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(h[Symbol.metadata]??null):void 0;_=[l(),i({attribute:`force-open`,type:Boolean})],b=[a()],e(this,null,_,{kind:`accessor`,name:`forceOpen`,static:!1,private:!1,access:{has:e=>`forceOpen`in e,get:e=>e.forceOpen,set:(e,t)=>{e.forceOpen=t}},metadata:t},v,y),e(this,null,b,{kind:`setter`,name:`_state`,static:!1,private:!1,access:{has:e=>`_state`in e,set:(e,t)=>{e._state=t}},metadata:t},null,g),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-selection-expansion-panel`}static{this.elementDependencies=[p]}static{this.styles=[r(m)]}static{this.events={beforeopen:`beforeopen`,open:`open`,beforeclose:`beforeclose`,close:`close`}}#e;get forceOpen(){return this.#e}set forceOpen(e){this.#e=e}set _state(e){this._stateInternal&&this.internals.states.delete(`state-${this._stateInternal}`),this._stateInternal=e,this._stateInternal&&this.internals.states.add(`state-${this._stateInternal}`)}get _state(){return this._stateInternal}get _hasContent(){return this.querySelectorAll?.(`[slot="content"]`).length>0}constructor(){super(),this.#e=(t(this,g),t(this,v,!1)),this._stateInternal=t(this,y),this._language=new s(this),this._state=`closed`}willUpdate(e){super.willUpdate(e),e.has(`forceOpen`)&&this._updateState()}onInputStateChange(){this._updateState()}_updateState(){this._hasContent&&(this.forceOpen||this.matches(`:is(:state(checked),[state--checked])`)?this._open():this._close(),this._updateExpandedLabel(this.forceOpen||this.matches(`:is(:state(checked),[state--checked])`)))}_open(){this._state!==`closed`&&this._state!==`closing`||(this._state=`opening`,this.dispatchEvent(new Event(`beforeopen`,{cancelable:!0})),(!this.hasUpdated||this._isZeroAnimationDuration())&&this._handleOpening())}_close(){this._state!==`opened`&&this._state!==`opening`||(this._state=`closing`,this.dispatchEvent(new Event(`beforeclose`,{cancelable:!0})),this._isZeroAnimationDuration()&&this._handleClosing())}_isZeroAnimationDuration(){return f(this,`--sbb-selection-expansion-panel-animation-duration`)}_handleClosing(){this._state=`closed`,this.dispatchEvent(new Event(`close`))}_handleOpening(){this._state=`opened`,this.dispatchEvent(new Event(`open`))}_onAnimationEnd(e){e.animationName===`open-opacity`&&this._state===`opening`?this._handleOpening():e.animationName===`close`&&this._state===`closing`&&this._handleClosing()}async _updateExpandedLabel(e){await this.hydrationComplete;let t=this.panel;if(t){if(!this._hasContent){t.expansionState=``;return}t.expansionState=e?`, `+d[this._language.current]:`, `+u[this._language.current]}}render(){return n`
+`;let h=(()=>{let h=c(o),g=[],_,v=[],y=[],b;return class extends h{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(h[Symbol.metadata]??null):void 0;_=[l(),i({attribute:`force-open`,type:Boolean})],b=[a()],e(this,null,_,{kind:`accessor`,name:`forceOpen`,static:!1,private:!1,access:{has:e=>`forceOpen`in e,get:e=>e.forceOpen,set:(e,t)=>{e.forceOpen=t}},metadata:t},v,y),e(this,null,b,{kind:`setter`,name:`_state`,static:!1,private:!1,access:{has:e=>`_state`in e,set:(e,t)=>{e._state=t}},metadata:t},null,g),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-selection-expansion-panel`}static{this.elementDependencies=[p]}static{this.styles=[r(m)]}static{this.events={beforeopen:`beforeopen`,open:`open`,beforeclose:`beforeclose`,close:`close`}}#e;get forceOpen(){return this.#e}set forceOpen(e){this.#e=e}set _state(e){this._stateInternal&&this.internals.states.delete(`state-${this._stateInternal}`),this._stateInternal=e,this._stateInternal&&this.internals.states.add(`state-${this._stateInternal}`)}get _state(){return this._stateInternal}get _hasContent(){return this.querySelectorAll?.(`[slot="content"]`).length>0}constructor(){super(),this.#e=(t(this,g),t(this,v,!1)),this._stateInternal=t(this,y),this._language=new s(this),this._state=`closed`}willUpdate(e){super.willUpdate(e),e.has(`forceOpen`)&&this._updateState()}onInputStateChange(){this._updateState()}_updateState(){this._hasContent&&(this.forceOpen||this.matches(`:is(:state(checked),[state--checked])`)?this._open():this._close(),this._updateExpandedLabel(this.forceOpen||this.matches(`:is(:state(checked),[state--checked])`)))}_open(){(this._state===`closed`||this._state===`closing`)&&(this._state=`opening`,this.dispatchEvent(new Event(`beforeopen`,{cancelable:!0})),(!this.hasUpdated||this._isZeroAnimationDuration())&&this._handleOpening())}_close(){(this._state===`opened`||this._state===`opening`)&&(this._state=`closing`,this.dispatchEvent(new Event(`beforeclose`,{cancelable:!0})),this._isZeroAnimationDuration()&&this._handleClosing())}_isZeroAnimationDuration(){return f(this,`--sbb-selection-expansion-panel-animation-duration`)}_handleClosing(){this._state=`closed`,this.dispatchEvent(new Event(`close`))}_handleOpening(){this._state=`opened`,this.dispatchEvent(new Event(`open`))}_onAnimationEnd(e){e.animationName===`open-opacity`&&this._state===`opening`?this._handleOpening():e.animationName===`close`&&this._state===`closing`&&this._handleClosing()}async _updateExpandedLabel(e){await this.hydrationComplete;let t=this.panel;if(t){if(!this._hasContent){t.expansionState=``;return}t.expansionState=e?`, `+d[this._language.current]:`, `+u[this._language.current]}}render(){return n`
       <div class="sbb-selection-expansion-panel__input">
         <slot></slot>
       </div>

package/sidebar.pure.js

@@ -10,7 +10,7 @@ import{html as e,isServer as t,unsafeCSS as n}from"lit";import{SbbSecondaryButto
       <slot @slotchange=${()=>this._handleWidthChange()}></slot>`}},P=`:host{--_sbb-sidebar-content-margin-inline-start:initial;--_sbb-sidebar-content-margin-inline-end:initial;margin-inline:var(--_sbb-sidebar-content-margin-inline-start,var(--_sbb-sidebar-container-start-width,0)) var(--_sbb-sidebar-content-margin-inline-end,var(--_sbb-sidebar-container-end-width,0));transition:margin var(--sbb-sidebar-container-animation-duration) var(--sbb-sidebar-container-animation-easing)}
 `,F=class extends a{static{this.elementName=`sbb-sidebar-content`}static{this.styles=[f,k,n(P)]}connectedCallback(){super.connectedCallback(),this.classList.add(`sbb-scrollbar`)}render(){return e`<slot></slot>`}},I=`:host{hyphens:auto;min-height:var(--_sbb-sidebar-close-button-size);padding-block-start:calc(.5 * (var(--_sbb-sidebar-close-button-size) - 1em * var(--sbb-typo-line-height-heading)))}
 `;let L=(()=>{let e=x,t,r=[],i=[];return class extends e{static{let n=typeof Symbol==`function`&&Symbol.metadata?Object.create(e[Symbol.metadata]??null):void 0;t=[b({reflect:!0})],_(this,null,t,{kind:`accessor`,name:`level`,static:!1,private:!1,access:{has:e=>`level`in e,get:e=>e.level,set:(e,t)=>{e.level=t}},metadata:n},r,i),n&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:n})}static{this.elementName=`sbb-sidebar-title`}static{this.styles=[n(I)]}#e=v(this,r,`2`);get level(){return this.#e}set level(e){this.#e=e}constructor(){super(),v(this,i),this.visualLevel??=`5`}connectedCallback(){super.connectedCallback(),this.slot||=`title-section`}}})();var R=`:host{--sbb-link-text-decoration-line:none;--sbb-sidebar-background-color:var(--sbb-background-color-1);--sbb-sidebar-scrollbar-placeholder-width:var(--sbb-spacing-fixed-3x);--_sbb-sidebar-margin:0;--_sbb-sidebar-margin-block-start:var(--sbb-sidebar-margin);--_sbb-sidebar-translate-x:-100%;--_sbb-sidebar-z-index:2;--_sbb-sidebar-padding-inline-end:var(--sbb-sidebar-padding);--_sbb-sidebar-padding-block-start:var(--sbb-sidebar-padding);--_sbb-sidebar-border-radius-start:var(--sbb-sidebar-border-radius);--_sbb-sidebar-border-radius-end:0;--_sbb-sidebar-close-button-size:var(--sbb-size-element-xs);--_sbb-sidebar-max-width:calc(100% - 2 * var(--_sbb-sidebar-margin));width:20rem;display:block}@supports (scrollbar-gutter:stable) and (not (-webkit-touch-callout:none)){:host{--_sbb-sidebar-padding-inline-end:calc(var(--sbb-sidebar-padding) - var(--sbb-sidebar-scrollbar-placeholder-width))}}:host([color=white]){--sbb-sidebar-background-color:var(--sbb-background-color-1)}:host([color=milk]){--sbb-sidebar-background-color:var(--sbb-background-color-3)}:host(:is([mode=over],:is(:state(mode-over-forced),[state--mode-over-forced]):not(:is(:state(mode-over-forced-closing),[state--mode-over-forced-closing])))){--_sbb-sidebar-margin:var(--sbb-sidebar-margin);--_sbb-sidebar-border-radius-end:var(--sbb-sidebar-border-radius);--_sbb-sidebar-z-index:3}:host(:is(:dir(rtl),[position=end])){--_sbb-sidebar-translate-x:100%}:host(:dir(rtl)[position=end]){--_sbb-sidebar-translate-x:-100%}.sbb-sidebar{width:inherit;max-width:var(--_sbb-sidebar-max-width);background-color:var(--sbb-sidebar-background-color);z-index:var(--_sbb-sidebar-z-index);margin:var(--_sbb-sidebar-margin);transition-duration:var(--sbb-sidebar-container-animation-duration);transition-timing-function:var(--sbb-sidebar-container-animation-easing);border-start-start-radius:var(--_sbb-sidebar-border-radius-start);border-start-end-radius:var(--_sbb-sidebar-border-radius-start);border-end-end-radius:var(--_sbb-sidebar-border-radius-end);border-end-start-radius:var(--_sbb-sidebar-border-radius-end);flex-direction:column;margin-block-start:var(--_sbb-sidebar-margin-block-start);transition-property:width,translate;display:flex;position:absolute;inset-block:0;overflow:hidden;translate:none}:host([position=end]) .sbb-sidebar{inset-inline-end:0}:host(:is(:state(state-closed),[state--state-closed])) .sbb-sidebar{visibility:hidden}:host(:is(:is(:state(state-closing),[state--state-closing]),:is(:state(state-closed),[state--state-closed]))) .sbb-sidebar{translate:var(--_sbb-sidebar-translate-x) 0}.sbb-sidebar-title-section{gap:var(--sbb-sidebar-title-gap);background-color:var(--sbb-sidebar-background-color);width:100%;padding-inline:var(--sbb-sidebar-padding);transition:box-shadow var(--sbb-animation-easing) var(--sbb-sidebar-container-animation-duration);box-shadow:none;display:flex}:host(:is(:state(scrolled),[state--scrolled])) .sbb-sidebar-title-section{box-shadow:var(--sbb-box-shadow-level-5-soft)}.sbb-sidebar-content-section{padding-block-start:var(--_sbb-sidebar-padding-block-start);padding-inline:var(--sbb-sidebar-padding) var(--_sbb-sidebar-padding-inline-end);outline-color:var(--sbb-focus-outline-color);flex-grow:1;overflow-y:auto}@supports (scrollbar-gutter:stable){.sbb-sidebar-content-section{scrollbar-gutter:stable}}::slotted(sbb-sidebar-title){margin-block:var(--sbb-sidebar-title-padding-block);flex-grow:1}::slotted(sbb-sidebar-close-button){margin-inline-end:calc(-1 * (var(--sbb-sidebar-padding) - var(--sbb-sidebar-title-padding-block)));margin-block:var(--sbb-sidebar-title-padding-block);order:1;inset-inline-end:var(--sbb-sidebar-padding)}
-`;let z=(()=>{let r=i(l),a=[],c,f=[],p=[],g,x=[],C=[],w,T=[],E=[],D,O=[],k=[],A,j=[],M=[],N;return class extends r{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;c=[b({reflect:!0})],g=[u(e=>e===`over`?`over`:`side`),b({reflect:!0})],w=[u(e=>e===`end`?`end`:`start`),d((e,t,n)=>e._updateSidebarWidth(n)),b({reflect:!0})],D=[u(),b({type:Boolean,reflect:!0})],A=[u(),b({type:Boolean,attribute:`focus-on-open`})],N=[y({passive:!0})],_(this,null,c,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:e},f,p),_(this,null,g,{kind:`accessor`,name:`mode`,static:!1,private:!1,access:{has:e=>`mode`in e,get:e=>e.mode,set:(e,t)=>{e.mode=t}},metadata:e},x,C),_(this,null,w,{kind:`accessor`,name:`position`,static:!1,private:!1,access:{has:e=>`position`in e,get:e=>e.position,set:(e,t)=>{e.position=t}},metadata:e},T,E),_(this,null,D,{kind:`accessor`,name:`opened`,static:!1,private:!1,access:{has:e=>`opened`in e,get:e=>e.opened,set:(e,t)=>{e.opened=t}},metadata:e},O,k),_(this,null,A,{kind:`accessor`,name:`focusOnOpen`,static:!1,private:!1,access:{has:e=>`focusOnOpen`in e,get:e=>e.focusOnOpen,set:(e,t)=>{e.focusOnOpen=t}},metadata:e},j,M),_(this,null,N,{kind:`method`,name:`_detectScrolledState`,static:!1,private:!1,access:{has:e=>`_detectScrolledState`in e,get:e=>e._detectScrolledState},metadata:e},null,a),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-sidebar`}static{this.styles=[h,n(R)]}#e;get color(){return this.#e}set color(e){this.#e=e}#t;get mode(){return this.#t}set mode(e){this.#t=e}#n;get position(){return this.#n}set position(e){this.#n=e}#r;get opened(){return this.#r}set opened(e){this.#r=e}#i;get focusOnOpen(){return this.#i}set focusOnOpen(e){this.#i=e}get container(){return this._container}constructor(){super(),this.#e=(v(this,a),v(this,f,`white`)),this.#t=(v(this,p),v(this,x,`side`)),this.#n=(v(this,C),v(this,T,`start`)),this.#r=(v(this,E),v(this,O,!1)),this.#i=(v(this,k),v(this,j,!1)),this._container=(v(this,M),null),this._lastFocusedElement=null,this._focusTrapController=new s(this),this._escapableOverlayController=new o(this),this._closeOnNavigation=()=>{this._isModeOver()&&this.isOpen&&this.close()},this.addController(new S(this,{skipInitial:!0,callback:()=>this._updateSidebarWidth()})),this.addEventListener?.(`click`,e=>{e.target?.localName===`sbb-sidebar-close-button`&&this.close()})}connectedCallback(){super.connectedCallback(),this._container=this.closest?.(`sbb-sidebar-container`),this._updateSidebarWidth(),this.isOpen&&this._isModeOver()&&this._takeFocus(),t||(window.navigation?window.navigation.addEventListener(`navigate`,this._closeOnNavigation):window.addEventListener(`popstate`,this._closeOnNavigation))}disconnectedCallback(){super.disconnectedCallback(),this.container?.style.removeProperty(this._buildCssWidthVar()),this._container=null,t||(window.navigation?window.navigation.removeEventListener(`navigate`,this._closeOnNavigation):window.removeEventListener(`popstate`,this._closeOnNavigation))}willUpdate(e){super.willUpdate(e),e.has(`opened`)&&(this.opened?this.open():this.opened||this.close()),e.has(`mode`)&&(this.mode===`over`&&this.isOpen?this._takeFocus():this.cedeFocus())}firstUpdated(e){super.firstUpdated(e),this._updateSidebarWidth()}toggle(){this.state===`opening`||this.state===`opened`?this.close():this.open()}open(){if(this.state===`opening`||this.state===`opened`||!this.dispatchBeforeOpenEvent())return;this.startAnimation(),!t&&document.activeElement?.localName!==`body`&&(this._lastFocusedElement=document.activeElement),this.opened=!0,this.state=`opening`;let e=this._isZeroAnimationDuration()||!this.isConnected,n=!this.hasUpdated;(n||e)&&(this.internals.states.add(`skip-animation`),n?this.updateComplete.then(()=>this._handleOpening()):this._handleOpening())}_isZeroAnimationDuration(){return m(this,`--sbb-sidebar-container-animation-duration`)}_handleOpening(){this.state=`opened`,setTimeout(()=>this.internals.states.delete(`skip-animation`)),this._takeFocus(),this.stopAnimation(),this.dispatchOpenEvent()}close(){if(this.state===`closing`||this.state===`closed`||!this.dispatchBeforeCloseEvent())return;this.startAnimation();let e=this._isZeroAnimationDuration();!this.hasUpdated||e?this.internals.states.add(`skip-animation`):this.state=`closing`,this.opened=!1,(!this.hasUpdated||e)&&this._handleClosing()}_handleClosing(){this.state=`closed`,setTimeout(()=>this.internals.states.delete(`skip-animation`)),this.cedeFocus(),!t&&(this.contains(document.activeElement)||this._isModeOver())&&(this._lastFocusedElement?this._lastFocusedElement?.focus():document.activeElement.blur()),this._lastFocusedElement=null,this.stopAnimation(),this.dispatchCloseEvent()}_takeFocus(){if(!this.isConnected)return;let e=this._isModeOver();(e||this.focusOnOpen)&&this._focusTrapController.focusInitialElement(),e&&(this._escapableOverlayController.connect(),this._focusTrapController.enabled=!0)}cedeFocus(){this._focusTrapController.enabled=!1,this._escapableOverlayController.disconnect()}_updateSidebarWidth(e){let t=this.container;if(!t)return;e&&t.style.removeProperty(this._buildCssWidthVar(e));let n=this.offsetWidth;if(!n)return;let r=`${n}px`;t.style.getPropertyValue(this._buildCssWidthVar())!==r&&t.style.setProperty(this._buildCssWidthVar(),r)}_buildCssWidthVar(e=this.position){return`--_sbb-sidebar-container-${e}-width`}_isModeOver(){return this.mode===`over`||this.matches(`:is(:state(mode-over-forced),[state--mode-over-forced])`)}_onTransitionEnd(e){e.propertyName!==`translate`||e.target!==e.currentTarget||(this.state===`opening`?this._handleOpening():this.state===`closing`&&this._handleClosing())}_detectScrolledState(){this.toggleState(`scrolled`,(this.shadowRoot?.querySelector(`.sbb-sidebar-content-section`)?.scrollTop??0)>0)}render(){return e`<div class="sbb-sidebar" @transitionend=${this._onTransitionEnd}>
+`;let z=(()=>{let r=i(l),a=[],c,f=[],p=[],g,x=[],C=[],w,T=[],E=[],D,O=[],k=[],A,j=[],M=[],N;return class extends r{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;c=[b({reflect:!0})],g=[u(e=>e===`over`?`over`:`side`),b({reflect:!0})],w=[u(e=>e===`end`?`end`:`start`),d((e,t,n)=>e._updateSidebarWidth(n)),b({reflect:!0})],D=[u(),b({type:Boolean,reflect:!0})],A=[u(),b({type:Boolean,attribute:`focus-on-open`})],N=[y({passive:!0})],_(this,null,c,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:e},f,p),_(this,null,g,{kind:`accessor`,name:`mode`,static:!1,private:!1,access:{has:e=>`mode`in e,get:e=>e.mode,set:(e,t)=>{e.mode=t}},metadata:e},x,C),_(this,null,w,{kind:`accessor`,name:`position`,static:!1,private:!1,access:{has:e=>`position`in e,get:e=>e.position,set:(e,t)=>{e.position=t}},metadata:e},T,E),_(this,null,D,{kind:`accessor`,name:`opened`,static:!1,private:!1,access:{has:e=>`opened`in e,get:e=>e.opened,set:(e,t)=>{e.opened=t}},metadata:e},O,k),_(this,null,A,{kind:`accessor`,name:`focusOnOpen`,static:!1,private:!1,access:{has:e=>`focusOnOpen`in e,get:e=>e.focusOnOpen,set:(e,t)=>{e.focusOnOpen=t}},metadata:e},j,M),_(this,null,N,{kind:`method`,name:`_detectScrolledState`,static:!1,private:!1,access:{has:e=>`_detectScrolledState`in e,get:e=>e._detectScrolledState},metadata:e},null,a),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-sidebar`}static{this.styles=[h,n(R)]}#e;get color(){return this.#e}set color(e){this.#e=e}#t;get mode(){return this.#t}set mode(e){this.#t=e}#n;get position(){return this.#n}set position(e){this.#n=e}#r;get opened(){return this.#r}set opened(e){this.#r=e}#i;get focusOnOpen(){return this.#i}set focusOnOpen(e){this.#i=e}get container(){return this._container}constructor(){super(),this.#e=(v(this,a),v(this,f,`white`)),this.#t=(v(this,p),v(this,x,`side`)),this.#n=(v(this,C),v(this,T,`start`)),this.#r=(v(this,E),v(this,O,!1)),this.#i=(v(this,k),v(this,j,!1)),this._container=(v(this,M),null),this._lastFocusedElement=null,this._focusTrapController=new s(this),this._escapableOverlayController=new o(this),this._closeOnNavigation=()=>{this._isModeOver()&&this.isOpen&&this.close()},this.addController(new S(this,{skipInitial:!0,callback:()=>this._updateSidebarWidth()})),this.addEventListener?.(`click`,e=>{e.target?.localName===`sbb-sidebar-close-button`&&this.close()})}connectedCallback(){super.connectedCallback(),this._container=this.closest?.(`sbb-sidebar-container`),this._updateSidebarWidth(),this.isOpen&&this._isModeOver()&&this._takeFocus(),t||(window.navigation?window.navigation.addEventListener(`navigate`,this._closeOnNavigation):window.addEventListener(`popstate`,this._closeOnNavigation))}disconnectedCallback(){super.disconnectedCallback(),this.container?.style.removeProperty(this._buildCssWidthVar()),this._container=null,t||(window.navigation?window.navigation.removeEventListener(`navigate`,this._closeOnNavigation):window.removeEventListener(`popstate`,this._closeOnNavigation))}willUpdate(e){super.willUpdate(e),e.has(`opened`)&&(this.opened?this.open():this.opened||this.close()),e.has(`mode`)&&(this.mode===`over`&&this.isOpen?this._takeFocus():this.cedeFocus())}firstUpdated(e){super.firstUpdated(e),this._updateSidebarWidth()}toggle(){this.state===`opening`||this.state===`opened`?this.close():this.open()}open(){if(this.state===`opening`||this.state===`opened`||!this.dispatchBeforeOpenEvent())return;this.startAnimation(),!t&&document.activeElement?.localName!==`body`&&(this._lastFocusedElement=document.activeElement),this.opened=!0,this.state=`opening`;let e=this._isZeroAnimationDuration()||!this.isConnected,n=!this.hasUpdated;(n||e)&&(this.internals.states.add(`skip-animation`),n?this.updateComplete.then(()=>this._handleOpening()):this._handleOpening())}_isZeroAnimationDuration(){return m(this,`--sbb-sidebar-container-animation-duration`)}_handleOpening(){this.state=`opened`,setTimeout(()=>this.internals.states.delete(`skip-animation`)),this._takeFocus(),this.stopAnimation(),this.dispatchOpenEvent()}close(){if(this.state===`closing`||this.state===`closed`||!this.dispatchBeforeCloseEvent())return;this.startAnimation();let e=this._isZeroAnimationDuration();!this.hasUpdated||e?this.internals.states.add(`skip-animation`):this.state=`closing`,this.opened=!1,(!this.hasUpdated||e)&&this._handleClosing()}_handleClosing(){this.state=`closed`,setTimeout(()=>this.internals.states.delete(`skip-animation`)),this.cedeFocus(),!t&&(this.contains(document.activeElement)||this._isModeOver())&&(this._lastFocusedElement?this._lastFocusedElement?.focus():document.activeElement.blur()),this._lastFocusedElement=null,this.stopAnimation(),this.dispatchCloseEvent()}_takeFocus(){if(!this.isConnected)return;let e=this._isModeOver();(e||this.focusOnOpen)&&this._focusTrapController.focusInitialElement(),e&&(this._escapableOverlayController.connect(),this._focusTrapController.enabled=!0)}cedeFocus(){this._focusTrapController.enabled=!1,this._escapableOverlayController.disconnect()}_updateSidebarWidth(e){let t=this.container;if(!t)return;e&&t.style.removeProperty(this._buildCssWidthVar(e));let n=this.offsetWidth;if(!n)return;let r=`${n}px`;t.style.getPropertyValue(this._buildCssWidthVar())!==r&&t.style.setProperty(this._buildCssWidthVar(),r)}_buildCssWidthVar(e=this.position){return`--_sbb-sidebar-container-${e}-width`}_isModeOver(){return this.mode===`over`||this.matches(`:is(:state(mode-over-forced),[state--mode-over-forced])`)}_onTransitionEnd(e){e.propertyName===`translate`&&e.target===e.currentTarget&&(this.state===`opening`?this._handleOpening():this.state===`closing`&&this._handleClosing())}_detectScrolledState(){this.toggleState(`scrolled`,(this.shadowRoot?.querySelector(`.sbb-sidebar-content-section`)?.scrollTop??0)>0)}render(){return e`<div class="sbb-sidebar" @transitionend=${this._onTransitionEnd}>
       <div class="sbb-sidebar-title-section"><slot name="title-section"></slot></div>
       <div
         class="sbb-sidebar-content-section sbb-scrollbar"

package/toggle.pure.js

@@ -5,4 +5,4 @@ import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeControl
         <slot></slot>
       </span>
     `}}})();var h=`:host{--_sbb-toggle-min-width:calc(var(--sbb-toggle-padding-inline) * 4 + var(--sbb-size-icon-ui-small));--sbb-toggle-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x));grid-template-columns:var(--sbb-toggle-grid-template-columns);height:var(--sbb-toggle-height);width:var(--sbb-toggle-width,fit-content);min-width:var(--_sbb-toggle-min-width);border-radius:var(--sbb-toggle-border-radius);max-width:100%;font-size:var(--sbb-toggle-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);user-select:none;-webkit-tap-highlight-color:transparent;line-height:var(--sbb-typo-line-height-text);grid-template-areas:"start end";align-items:center;display:grid}:host:before{content:"";margin-inline:var(--sbb-toggle-option-left,0) var(--sbb-toggle-option-right,0);background-color:var(--sbb-toggle-selected-option-background-color);border-radius:var(--sbb-toggle-border-radius);border:var(--sbb-toggle-selected-option-border-width) var(--sbb-toggle-selected-option-border-style) var(--sbb-toggle-selected-option-border-color);max-width:100%;height:100%;transition-duration:var(--sbb-toggle-animation-duration);grid-area:start/start/end/end;transition-property:margin-inline-start,margin-inline-end;transition-timing-function:ease;display:block}:host:after{content:"";background:var(--sbb-toggle-background-color);margin-inline:var(--sbb-toggle-background-inset);height:calc(100% - 2 * var(--sbb-toggle-background-inset));border-radius:var(--sbb-toggle-border-radius);order:-1;grid-area:start/start/end/end}@media (forced-colors:active){:host:after{border:var(--sbb-border-width-1x) solid CanvasText}}:host([even]){--sbb-toggle-width:100%;--sbb-toggle-grid-template-columns:50% 50%}:host(:disabled){--sbb-toggle-selected-option-border-color:light-dark(var(--sbb-color-graphite),var(--sbb-color-smoke));--sbb-toggle-selected-option-border-style:dashed}@media (forced-colors:active){:host(:disabled){--sbb-toggle-selected-option-border-style:solid;--sbb-toggle-selected-option-border-color:GrayText}}:host([size=s]){--sbb-toggle-padding-inline:var(--sbb-toggle-padding-inline-s);--sbb-toggle-height:var(--sbb-toggle-height-s)}:host([size=m]){--sbb-toggle-padding-inline:var(--sbb-toggle-padding-inline-m);--sbb-toggle-height:var(--sbb-toggle-height-m)}:host(:is(:not(:is(:state(initialized),[state--initialized])),:is(:state(disable-animation-on-resizing),[state--disable-animation-on-resizing]))){--sbb-disable-animation-duration:0s}::slotted(sbb-toggle-option:first-of-type){grid-area:start}::slotted(sbb-toggle-option:last-of-type){grid-area:end}
-`;let g=(()=>{let n=s(l(c)),f=[],p,m=[],g=[],_,v=[],y=[],b;return class extends n{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(n[Symbol.metadata]??null):void 0;p=[u(),o({reflect:!0,type:Boolean})],_=[o({reflect:!0})],b=[o()],e(this,null,p,{kind:`accessor`,name:`even`,static:!1,private:!1,access:{has:e=>`even`in e,get:e=>e.even,set:(e,t)=>{e.even=t}},metadata:t},m,g),e(this,null,_,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:t},v,y),e(this,null,b,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,f),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-toggle`}static{this.role=`radiogroup`}static{this.styles=[a(h)]}static{this.events={change:`change`}}#e;get even(){return this.#e}set even(e){this.#e=e}#t;get size(){return this.#t}set size(e){this.#t=e}set value(e){i||!this.hasUpdated?this._fallbackValue=e:this._valueChanged(e)}get value(){return i?this._fallbackValue??null:this.options.find(e=>e.checked)?.value??this.options[0]?.value??null}get options(){return Array.from(this.querySelectorAll?.(`sbb-toggle-option`)??[])}constructor(){super(),this.#e=(t(this,f),t(this,m,!1)),this.#t=(t(this,g),t(this,v,null)),this._fallbackValue=(t(this,y),null),this.addEventListener?.(`input`,()=>this._handleInput(),{passive:!0}),this.addEventListener?.(`keydown`,e=>this._handleKeyDown(e))}willUpdate(e){super.willUpdate(e),(e.has(`disabled`)||e.has(`formDisabled`))&&this._updateDisabled(),this.hasUpdated||this._valueChanged(this._fallbackValue)}statusChanged(){this.updateFormValue(),this.updatePillPosition()}formResetCallback(){this.value=this.hasAttribute(`value`)?this.getAttribute(`value`):null}formStateRestoreCallback(e,t){typeof e==`string`||e==null?this.value=e??null:e instanceof FormData&&this._readFormData(e).then(e=>{this.value=e})}async _readFormData(e){let t=e.get(this.name);return t instanceof Blob?JSON.parse(await t.text()):t}updatePillPosition(e=!1){let t=this.options;if(t.length<2||t.every(e=>!e.checked)||t.every(e=>!e.clientWidth))return;this.toggleState(`disable-animation-on-resizing`,e);let n=t[0],r=n.checked,i=r?`0px`:`${n.clientWidth}px`,a=r?`${this.clientWidth-n.clientWidth}px`:`0px`;a===`0px`&&i===`0px`||(this.style?.setProperty(`--sbb-toggle-option-left`,i),this.style?.setProperty(`--sbb-toggle-option-right`,a),this.offsetWidth,this.internals.states.add(`initialized`))}_updateToggle(){this._valueChanged(this.value),this._updateDisabled()}_valueChanged(e){let t=this.options,n=t.find(t=>e===t.value)??t.find(e=>e.checked)??t[0];n&&(n.checked=!0,this.statusChanged())}_updateDisabled(){for(let e of this.options)e.disabled=this.disabled||this.formDisabled}_handleInput(){this.statusChanged(),this.dispatchEvent(new Event(`change`,{bubbles:!0}))}_handleKeyDown(e){if(!this.options.filter(e=>!e.disabled&&d.isVisible(e))||e.target!==this&&e.target.parentElement!==this)return;let t=this.options,n=this.matches(`:dir(rtl)`),r=t.findIndex(e=>e.checked)??t[0],i=t.slice(r+1).concat(t.slice(0,r)).filter(e=>!e.disabled&&d.isVisible(e));(n?e.key===`ArrowLeft`:e.key===` `||e.key===`ArrowRight`)?(this._selectAndFocusOption(i[0]),e.preventDefault()):(n?e.key===` `||e.key===`ArrowRight`:e.key===`ArrowLeft`)&&(this._selectAndFocusOption(i.at(-1)),e.preventDefault())}_selectAndFocusOption(e){!e||e.disabled||e.checked||(e.checked=!0,e.focus(),e.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0})))}render(){return r` <slot @slotchange=${this._updateToggle}></slot> `}}})();export{g as SbbToggleElement,m as SbbToggleOptionElement};
+`;let g=(()=>{let n=s(l(c)),f=[],p,m=[],g=[],_,v=[],y=[],b;return class extends n{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(n[Symbol.metadata]??null):void 0;p=[u(),o({reflect:!0,type:Boolean})],_=[o({reflect:!0})],b=[o()],e(this,null,p,{kind:`accessor`,name:`even`,static:!1,private:!1,access:{has:e=>`even`in e,get:e=>e.even,set:(e,t)=>{e.even=t}},metadata:t},m,g),e(this,null,_,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:t},v,y),e(this,null,b,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,f),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-toggle`}static{this.role=`radiogroup`}static{this.styles=[a(h)]}static{this.events={change:`change`}}#e;get even(){return this.#e}set even(e){this.#e=e}#t;get size(){return this.#t}set size(e){this.#t=e}set value(e){i||!this.hasUpdated?this._fallbackValue=e:this._valueChanged(e)}get value(){return i?this._fallbackValue??null:this.options.find(e=>e.checked)?.value??this.options[0]?.value??null}get options(){return Array.from(this.querySelectorAll?.(`sbb-toggle-option`)??[])}constructor(){super(),this.#e=(t(this,f),t(this,m,!1)),this.#t=(t(this,g),t(this,v,null)),this._fallbackValue=(t(this,y),null),this.addEventListener?.(`input`,()=>this._handleInput(),{passive:!0}),this.addEventListener?.(`keydown`,e=>this._handleKeyDown(e))}willUpdate(e){super.willUpdate(e),(e.has(`disabled`)||e.has(`formDisabled`))&&this._updateDisabled(),this.hasUpdated||this._valueChanged(this._fallbackValue)}statusChanged(){this.updateFormValue(),this.updatePillPosition()}formResetCallback(){this.value=this.hasAttribute(`value`)?this.getAttribute(`value`):null}formStateRestoreCallback(e,t){typeof e==`string`||e==null?this.value=e??null:e instanceof FormData&&this._readFormData(e).then(e=>{this.value=e})}async _readFormData(e){let t=e.get(this.name);return t instanceof Blob?JSON.parse(await t.text()):t}updatePillPosition(e=!1){let t=this.options;if(t.length<2||t.every(e=>!e.checked)||t.every(e=>!e.clientWidth))return;this.toggleState(`disable-animation-on-resizing`,e);let n=t[0],r=n.checked,i=r?`0px`:`${n.clientWidth}px`,a=r?`${this.clientWidth-n.clientWidth}px`:`0px`;(a!==`0px`||i!==`0px`)&&(this.style?.setProperty(`--sbb-toggle-option-left`,i),this.style?.setProperty(`--sbb-toggle-option-right`,a),this.offsetWidth,this.internals.states.add(`initialized`))}_updateToggle(){this._valueChanged(this.value),this._updateDisabled()}_valueChanged(e){let t=this.options,n=t.find(t=>e===t.value)??t.find(e=>e.checked)??t[0];n&&(n.checked=!0,this.statusChanged())}_updateDisabled(){for(let e of this.options)e.disabled=this.disabled||this.formDisabled}_handleInput(){this.statusChanged(),this.dispatchEvent(new Event(`change`,{bubbles:!0}))}_handleKeyDown(e){if(!this.options.filter(e=>!e.disabled&&d.isVisible(e))||e.target!==this&&e.target.parentElement!==this)return;let t=this.options,n=this.matches(`:dir(rtl)`),r=t.findIndex(e=>e.checked)??t[0],i=t.slice(r+1).concat(t.slice(0,r)).filter(e=>!e.disabled&&d.isVisible(e));(n?e.key===`ArrowLeft`:e.key===` `||e.key===`ArrowRight`)?(this._selectAndFocusOption(i[0]),e.preventDefault()):(n?e.key===` `||e.key===`ArrowRight`:e.key===`ArrowLeft`)&&(this._selectAndFocusOption(i.at(-1)),e.preventDefault())}_selectAndFocusOption(e){!e||e.disabled||e.checked||(e.checked=!0,e.focus(),e.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0})))}render(){return r` <slot @slotchange=${this._updateToggle}></slot> `}}})();export{g as SbbToggleElement,m as SbbToggleOptionElement};

package/tooltip.pure.js

@@ -1,5 +1,5 @@
 import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{SbbDisabledMixin as o,SbbEscapableOverlayController as s,SbbOpenCloseBaseElement as c,SbbOverlayPositionController as l,appendAriaElements as u,idReference as d,isAndroid as f,isIOS as p,isZeroAnimationDuration as m,popoverResetStyles as h,queueDomContentLoaded as g,readConfig as _,removeAriaElements as v,sbbInputModalityDetector as y,sbbOverlayOutsidePointerEventListener as b}from"./core.js";var x=`:host{--sbb-tooltip-max-width:min(25rem, calc(100vw - var(--sbb-spacing-fixed-2x)));--sbb-tooltip-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));position-area:var(--sbb-overlay-position-area);position-try-fallbacks:var(--sbb-overlay-position-try-fallbacks);pointer-events:var(--sbb-tooltip-pointer-events,all);z-index:var(--sbb-tooltip-z-index,var(--sbb-overlay-default-z-index));animation-name:var(--sbb-tooltip-animation-name);animation-duration:var(--sbb-tooltip-animation-duration);animation-timing-function:var(--sbb-tooltip-animation-easing);font-size:var(--sbb-tooltip-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:none;position:fixed}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){--sbb-tooltip-animation-name:open;display:block}:host(:is(:state(state-closing),[state--state-closing])){--sbb-tooltip-animation-name:close;--sbb-tooltip-pointer-events:none}:host(:is([data-position~=block-end],[data-position~=bottom],[data-position^=end])){padding-block-start:var(--sbb-tooltip-gap)}:host(:is([data-position~=block-start],[data-position~=top],[data-position^=start])){padding-block-end:var(--sbb-tooltip-gap)}:host(:is([data-position~=inline-start],[data-position~=inline-end],[data-position~=left],[data-position~=right],[data-position$=\\ start],[data-position$=\\ end])){padding-inline:var(--sbb-tooltip-gap)}.sbb-tooltip{box-shadow:var(--sbb-box-shadow-level-5-soft);border:var(--sbb-border-width-1x) solid var(--sbb-tooltip-border-color);border-radius:var(--sbb-tooltip-border-radius);padding:var(--sbb-tooltip-padding);color:var(--sbb-tooltip-color);background-color:var(--sbb-tooltip-background-color);min-width:var(--sbb-tooltip-min-width);max-width:var(--sbb-tooltip-max-width)}@keyframes open{0%{opacity:0;translate:var(--sbb-tooltip-animation-translate)}to{opacity:1;translate:0}}@keyframes close{0%{opacity:1;translate:0}to{opacity:0;translate:var(--sbb-tooltip-animation-translate)}}
-`;const S=f||p,C=new WeakMap;let w=(()=>{let f=o(c),p=[],w,T=[],E=[],D,O,k;return class extends f{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(f[Symbol.metadata]??null):void 0;w=[d(),a()],D=[a({attribute:`open-delay`,type:Number})],O=[a({attribute:`close-delay`,type:Number})],k=[a({attribute:`long-press-close-delay`,type:Number})],e(this,null,w,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},T,E),e(this,null,D,{kind:`setter`,name:`openDelay`,static:!1,private:!1,access:{has:e=>`openDelay`in e,set:(e,t)=>{e.openDelay=t}},metadata:t},null,p),e(this,null,O,{kind:`setter`,name:`closeDelay`,static:!1,private:!1,access:{has:e=>`closeDelay`in e,set:(e,t)=>{e.closeDelay=t}},metadata:t},null,p),e(this,null,k,{kind:`setter`,name:`longPressCloseDelay`,static:!1,private:!1,access:{has:e=>`longPressCloseDelay`in e,set:(e,t)=>{e.longPressCloseDelay=t}},metadata:t},null,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-tooltip`}static{this.role=`tooltip`}static{this.styles=[h,i(x)]}static{r||g(()=>this._initializeTooltipOutlet())}#e;get trigger(){return this.#e}set trigger(e){this.#e=e}set openDelay(e){this._openDelay=e}get openDelay(){return this._openDelay??_().tooltip?.openDelay??0}set closeDelay(e){this._closeDelay=e}get closeDelay(){return this._closeDelay??_().tooltip?.closeDelay??0}set longPressCloseDelay(e){this._longPressCloseDelay=+e}get longPressCloseDelay(){return this._longPressCloseDelay??_().tooltip?.longPressCloseDelay??1500}constructor(){super(),this.#e=(t(this,p),t(this,T,null)),this._openDelay=(t(this,E),null),this._closeDelay=null,this._triggerElement=null,this._escapableOverlayController=new s(this),this._overlayController=new l(this),this.addEventListener(`mouseleave`,e=>{(this.state===`opened`||this.state===`opening`)&&(!e.relatedTarget||!this._triggerElement?.contains(e.relatedTarget))&&this._delayedClose()},{passive:!0}),this.addEventListener(`overlayOutsidePointer`,()=>this.close(),{passive:!0}),this.addEventListener(`animationend`,e=>this._onTooltipAnimationEnd(e),{passive:!0})}static _initializeTooltipOutlet(){this._tooltipOutlet=document.createElement(`div`),this._tooltipOutlet.classList.add(`sbb-overlay-outlet`),document.body.appendChild(this._tooltipOutlet),new MutationObserver(e=>{for(let t of e)if(t.type===`attributes`)this._handleTooltipTrigger(t.target);else if(t.type===`childList`)for(let e of[...t.addedNodes,...t.removedNodes].filter(e=>e.nodeType===e.ELEMENT_NODE))this._handleTooltipTrigger(e),this._findAndHandleTooltipTriggers(e)}).observe(document.documentElement,{attributeFilter:[`sbb-tooltip`,`sbb-tooltip-open-delay`,`sbb-tooltip-close-delay`,`sbb-tooltip-position`],childList:!0,subtree:!0}),this._findAndHandleTooltipTriggers(document.body)}static _findAndHandleTooltipTriggers(e){e.querySelectorAll(`[sbb-tooltip]`).forEach(e=>this._handleTooltipTrigger(e))}static _handleTooltipTrigger(e){let t=e.getAttribute(`sbb-tooltip`),n=C.get(e);if(t&&e.isConnected){n||(n=document.createElement(`sbb-tooltip`),C.set(e,n),this._tooltipOutlet.appendChild(n),n.trigger=e),n.textContent=t,n.openDelay=e.hasAttribute(`sbb-tooltip-open-delay`)?+e.getAttribute(`sbb-tooltip-open-delay`):null,n.closeDelay=e.hasAttribute(`sbb-tooltip-close-delay`)?+e.getAttribute(`sbb-tooltip-close-delay`):null;let r=e.hasAttribute(`sbb-tooltip-position`)?e.getAttribute(`sbb-tooltip-position`).split(`,`).map(e=>e.trim()):e.tooltipPositions;r&&r.length>0?(n.style.setProperty(`--sbb-overlay-position-area`,r[0]),n.style.setProperty(`--sbb-overlay-position-try-fallbacks`,r.slice(1).join(`, `))):(n.style.removeProperty(`--sbb-overlay-position-area`),n.style.removeProperty(`--sbb-overlay-position-try-fallbacks`))}else n&&(C.delete(e),n._destroy?.())}connectedCallback(){super.connectedCallback(),this.popover=`manual`,this.state=`closed`,b.connect(this),this.hasUpdated&&this.trigger&&this._attach(this.trigger)}disconnectedCallback(){super.disconnectedCallback(),b.disconnect(this),this._detach()}requestUpdate(e,t,n){super.requestUpdate(e,t,n),!r&&(!e||e===`trigger`)&&this.hasUpdated&&this._attach(this.trigger)}firstUpdated(e){super.firstUpdated(e),this._attach(this.trigger)}open(){this._resetOpenCloseTimeout(),!(this.state!==`closed`&&this.state!==`closing`||this.disabled||!this.trigger||!this.dispatchBeforeOpenEvent())&&(this.showPopover?.(),this.state=`opening`,this._overlayController.connect(this.trigger),this._isZeroAnimationDuration()&&this._handleOpening())}close(){this._resetOpenCloseTimeout(),!(this.state!==`opened`&&this.state!==`opening`)&&(this.dispatchBeforeCloseEvent(),this.state=`closing`,this._isZeroAnimationDuration()&&this._handleClosing())}_delayedOpen(){this._resetOpenCloseTimeout(),this._openTimeout=setTimeout(()=>this.open(),this.openDelay)}_handleOpening(){this.state=`opened`,this._escapableOverlayController.connect(),this.dispatchOpenEvent()}_delayedClose(){this._resetOpenCloseTimeout(),this._closeTimeout=setTimeout(()=>this.close(),this.closeDelay)}_handleClosing(){this.state=`closed`,this.hidePopover?.(),this._overlayController.disconnect(),this._escapableOverlayController.disconnect(),this.dispatchCloseEvent(),this._openStateController?.abort()}_onTooltipAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this._handleOpening():e.animationName===`close`&&this.state===`closing`&&this._handleClosing()}_attach(e){this._triggerElement&&this._detach(),this._triggerElement=e,this._triggerElement&&(this._triggerElement.ariaDescribedByElements=u(this._triggerElement.ariaDescribedByElements,this),this._addTriggerEventHandlers())}_detach(){this._triggerAbortController?.abort(),this._openStateController?.abort(),this._resetOpenCloseTimeout(),clearTimeout(this._longPressOpenTimeout),clearTimeout(this._longPressCloseTimeout),this._triggerElement&&=(this._triggerElement.ariaDescribedByElements=v(this._triggerElement.ariaDescribedByElements,this),null)}_destroy(){this._detach(),this.remove()}_addTriggerEventHandlers(){let e=this._triggerElement;if(!e)return;this._triggerAbortController?.abort(),this._triggerAbortController=new AbortController;let t={signal:this._triggerAbortController.signal,passive:!0};S||(e.addEventListener(`mouseenter`,()=>this._delayedOpen(),t),e.addEventListener(`mouseleave`,e=>{let t=e.relatedTarget;(!t||t!==this)&&this._delayedClose()},t),e.addEventListener(`blur`,()=>this.close(),t),e.addEventListener(`focus`,()=>{y.mostRecentModality===`keyboard`&&this._delayedOpen()},t)),e.addEventListener(`touchstart`,()=>{clearTimeout(this._longPressOpenTimeout),clearTimeout(this._longPressCloseTimeout),this._longPressOpenTimeout=setTimeout(()=>this.open(),500)},t),e.addEventListener(`touchend`,()=>{clearTimeout(this._longPressOpenTimeout),this._longPressCloseTimeout=setTimeout(()=>this.close(),this.longPressCloseDelay)},t),e.addEventListener(`touchcancel`,()=>{clearTimeout(this._longPressOpenTimeout)},t)}_isZeroAnimationDuration(){return m(this,`--sbb-tooltip-animation-duration`)}_resetOpenCloseTimeout(){clearTimeout(this._openTimeout),clearTimeout(this._closeTimeout)}render(){return n`
+`;const S=f||p,C=new WeakMap;let w=(()=>{let f=o(c),p=[],w,T=[],E=[],D,O,k;return class extends f{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(f[Symbol.metadata]??null):void 0;w=[d(),a()],D=[a({attribute:`open-delay`,type:Number})],O=[a({attribute:`close-delay`,type:Number})],k=[a({attribute:`long-press-close-delay`,type:Number})],e(this,null,w,{kind:`accessor`,name:`trigger`,static:!1,private:!1,access:{has:e=>`trigger`in e,get:e=>e.trigger,set:(e,t)=>{e.trigger=t}},metadata:t},T,E),e(this,null,D,{kind:`setter`,name:`openDelay`,static:!1,private:!1,access:{has:e=>`openDelay`in e,set:(e,t)=>{e.openDelay=t}},metadata:t},null,p),e(this,null,O,{kind:`setter`,name:`closeDelay`,static:!1,private:!1,access:{has:e=>`closeDelay`in e,set:(e,t)=>{e.closeDelay=t}},metadata:t},null,p),e(this,null,k,{kind:`setter`,name:`longPressCloseDelay`,static:!1,private:!1,access:{has:e=>`longPressCloseDelay`in e,set:(e,t)=>{e.longPressCloseDelay=t}},metadata:t},null,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-tooltip`}static{this.role=`tooltip`}static{this.styles=[h,i(x)]}static{r||g(()=>this._initializeTooltipOutlet())}#e;get trigger(){return this.#e}set trigger(e){this.#e=e}set openDelay(e){this._openDelay=e}get openDelay(){return this._openDelay??_().tooltip?.openDelay??0}set closeDelay(e){this._closeDelay=e}get closeDelay(){return this._closeDelay??_().tooltip?.closeDelay??0}set longPressCloseDelay(e){this._longPressCloseDelay=+e}get longPressCloseDelay(){return this._longPressCloseDelay??_().tooltip?.longPressCloseDelay??1500}constructor(){super(),this.#e=(t(this,p),t(this,T,null)),this._openDelay=(t(this,E),null),this._closeDelay=null,this._triggerElement=null,this._escapableOverlayController=new s(this),this._overlayController=new l(this),this.addEventListener(`mouseleave`,e=>{(this.state===`opened`||this.state===`opening`)&&(!e.relatedTarget||!this._triggerElement?.contains(e.relatedTarget))&&this._delayedClose()},{passive:!0}),this.addEventListener(`overlayOutsidePointer`,()=>this.close(),{passive:!0}),this.addEventListener(`animationend`,e=>this._onTooltipAnimationEnd(e),{passive:!0})}static _initializeTooltipOutlet(){this._tooltipOutlet=document.createElement(`div`),this._tooltipOutlet.classList.add(`sbb-overlay-outlet`),document.body.appendChild(this._tooltipOutlet),new MutationObserver(e=>{for(let t of e)if(t.type===`attributes`)this._handleTooltipTrigger(t.target);else if(t.type===`childList`)for(let e of[...t.addedNodes,...t.removedNodes].filter(e=>e.nodeType===e.ELEMENT_NODE))this._handleTooltipTrigger(e),this._findAndHandleTooltipTriggers(e)}).observe(document.documentElement,{attributeFilter:[`sbb-tooltip`,`sbb-tooltip-open-delay`,`sbb-tooltip-close-delay`,`sbb-tooltip-position`],childList:!0,subtree:!0}),this._findAndHandleTooltipTriggers(document.body)}static _findAndHandleTooltipTriggers(e){e.querySelectorAll(`[sbb-tooltip]`).forEach(e=>this._handleTooltipTrigger(e))}static _handleTooltipTrigger(e){let t=e.getAttribute(`sbb-tooltip`),n=C.get(e);if(t&&e.isConnected){n||(n=document.createElement(`sbb-tooltip`),C.set(e,n),this._tooltipOutlet.appendChild(n),n.trigger=e),n.textContent=t,n.openDelay=e.hasAttribute(`sbb-tooltip-open-delay`)?+e.getAttribute(`sbb-tooltip-open-delay`):null,n.closeDelay=e.hasAttribute(`sbb-tooltip-close-delay`)?+e.getAttribute(`sbb-tooltip-close-delay`):null;let r=e.hasAttribute(`sbb-tooltip-position`)?e.getAttribute(`sbb-tooltip-position`).split(`,`).map(e=>e.trim()):e.tooltipPositions;r&&r.length>0?(n.style.setProperty(`--sbb-overlay-position-area`,r[0]),n.style.setProperty(`--sbb-overlay-position-try-fallbacks`,r.slice(1).join(`, `))):(n.style.removeProperty(`--sbb-overlay-position-area`),n.style.removeProperty(`--sbb-overlay-position-try-fallbacks`))}else n&&(C.delete(e),n._destroy?.())}connectedCallback(){super.connectedCallback(),this.popover=`manual`,this.state=`closed`,b.connect(this),this.hasUpdated&&this.trigger&&this._attach(this.trigger)}disconnectedCallback(){super.disconnectedCallback(),b.disconnect(this),this._detach()}requestUpdate(e,t,n){super.requestUpdate(e,t,n),!r&&(!e||e===`trigger`)&&this.hasUpdated&&this._attach(this.trigger)}firstUpdated(e){super.firstUpdated(e),this._attach(this.trigger)}open(){this._resetOpenCloseTimeout(),!(this.state!==`closed`&&this.state!==`closing`||this.disabled||!this.trigger||!this.dispatchBeforeOpenEvent())&&(this.showPopover?.(),this.state=`opening`,this._overlayController.connect(this.trigger),this._isZeroAnimationDuration()&&this._handleOpening())}close(){this._resetOpenCloseTimeout(),(this.state===`opened`||this.state===`opening`)&&(this.dispatchBeforeCloseEvent(),this.state=`closing`,this._isZeroAnimationDuration()&&this._handleClosing())}_delayedOpen(){this._resetOpenCloseTimeout(),this._openTimeout=setTimeout(()=>this.open(),this.openDelay)}_handleOpening(){this.state=`opened`,this._escapableOverlayController.connect(),this.dispatchOpenEvent()}_delayedClose(){this._resetOpenCloseTimeout(),this._closeTimeout=setTimeout(()=>this.close(),this.closeDelay)}_handleClosing(){this.state=`closed`,this.hidePopover?.(),this._overlayController.disconnect(),this._escapableOverlayController.disconnect(),this.dispatchCloseEvent(),this._openStateController?.abort()}_onTooltipAnimationEnd(e){e.animationName===`open`&&this.state===`opening`?this._handleOpening():e.animationName===`close`&&this.state===`closing`&&this._handleClosing()}_attach(e){this._triggerElement&&this._detach(),this._triggerElement=e,this._triggerElement&&(this._triggerElement.ariaDescribedByElements=u(this._triggerElement.ariaDescribedByElements,this),this._addTriggerEventHandlers())}_detach(){this._triggerAbortController?.abort(),this._openStateController?.abort(),this._resetOpenCloseTimeout(),clearTimeout(this._longPressOpenTimeout),clearTimeout(this._longPressCloseTimeout),this._triggerElement&&=(this._triggerElement.ariaDescribedByElements=v(this._triggerElement.ariaDescribedByElements,this),null)}_destroy(){this._detach(),this.remove()}_addTriggerEventHandlers(){let e=this._triggerElement;if(!e)return;this._triggerAbortController?.abort(),this._triggerAbortController=new AbortController;let t={signal:this._triggerAbortController.signal,passive:!0};S||(e.addEventListener(`mouseenter`,()=>this._delayedOpen(),t),e.addEventListener(`mouseleave`,e=>{let t=e.relatedTarget;(!t||t!==this)&&this._delayedClose()},t),e.addEventListener(`blur`,()=>this.close(),t),e.addEventListener(`focus`,()=>{y.mostRecentModality===`keyboard`&&this._delayedOpen()},t)),e.addEventListener(`touchstart`,()=>{clearTimeout(this._longPressOpenTimeout),clearTimeout(this._longPressCloseTimeout),this._longPressOpenTimeout=setTimeout(()=>this.open(),500)},t),e.addEventListener(`touchend`,()=>{clearTimeout(this._longPressOpenTimeout),this._longPressCloseTimeout=setTimeout(()=>this.close(),this.longPressCloseDelay)},t),e.addEventListener(`touchcancel`,()=>{clearTimeout(this._longPressOpenTimeout)},t)}_isZeroAnimationDuration(){return m(this,`--sbb-tooltip-animation-duration`)}_resetOpenCloseTimeout(){clearTimeout(this._openTimeout),clearTimeout(this._closeTimeout)}render(){return n`
       <div class="sbb-tooltip">
         <slot></slot>
       </div>