@sbb-esta/lyne-elements 5.0.2 → 5.2.0

package/sidebar.pure.js

@@ -1,6 +1,21 @@
-import { t as e } from "./sidebar-close-button.component-BoOFzuBn.js";
-import { t } from "./sidebar-container.component-BFm6HnIu.js";
-import { t as n } from "./sidebar-content.component-DFLqVK-O.js";
-import { t as r } from "./sidebar-title.component-4B18yGLO.js";
-import { t as i } from "./sidebar.component-VL6TFd9H.js";
-export { e as SbbSidebarCloseButtonElement, t as SbbSidebarContainerElement, n as SbbSidebarContentElement, i as SbbSidebarElement, r as SbbSidebarTitleElement };
+import{html as e,isServer as t,unsafeCSS as n}from"lit";import{SbbSecondaryButtonElement as r}from"./button.pure.js";import{SbbAnimationCompleteMixin as i,SbbElement as a,SbbEscapableOverlayController as o,SbbFocusTrapController as s,SbbLanguageController as c,SbbOpenCloseBaseElement as l,forceType as u,handleDistinctChange as d,hostScrollbarStyles as f,i18nCloseSidebar as p,isZeroAnimationDuration as m,scrollbarStyles as h,ɵstateController as g}from"./core.js";import{__esDecorate as _,__runInitializers as v}from"tslib";import{eventOptions as y,property as b}from"lit/decorators.js";import{SbbTitleBase as x}from"./title.pure.js";import{ResizeController as S}from"@lit-labs/observers/resize-controller.js";var C=`:host{height:fit-content;display:block}
+`,w=class extends r{static{this.elementName=`sbb-sidebar-close-button`}static{this.styles=[n(C)]}constructor(){super(),this._languageController=new c(this),this.size=`s`}connectedCallback(){super.connectedCallback(),this.slot||=`title-section`}willUpdate(e){super.willUpdate(e),this.internals.ariaLabel=p[this._languageController.current]}renderTemplate(){return super.renderIconSlot()}renderIconName(){return super.renderIconName()||`cross-small`}},T=`:host{--sbb-icon-sidebar-button-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));--sbb-icon-sidebar-button-transition-easing-function:var(--sbb-animation-easing);--sbb-icon-sidebar-button-dimension:var(--sbb-size-element-m);--sbb-icon-sidebar-button-border-radius:var(--sbb-border-radius-4x);--sbb-icon-sidebar-button-color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite));--sbb-icon-sidebar-button-current-color:var(--sbb-color-3);--sbb-icon-sidebar-button-current-border-width:var(--sbb-border-width-3x);--sbb-icon-sidebar-button-current-border-inset-block:var(--sbb-spacing-fixed-2x);--sbb-icon-sidebar-button__current-border-inset-inline-start:0;--sbb-icon-sidebar-button__color:var(--sbb-icon-sidebar-button-color);display:block;outline:none!important}@media (forced-colors:active){:host{--sbb-icon-sidebar-button-current-color:Highlight!important}:host(:is(:state(button),[state--button])){--sbb-icon-sidebar-button-color:ButtonText!important}:host(:is(:state(link),[state--link])){--sbb-icon-sidebar-button-color:LinkText!important}}@media (any-hover:hover){:host(:not(:active,:is(:state(active),[state--active])):hover){--sbb-icon-sidebar-button__hover-shift:.0625rem;--sbb-icon-sidebar-button__cursor:var(--sbb-cursor-pointer)}}.sbb-action-base{width:100%;height:var(--sbb-icon-sidebar-button-dimension);padding-block:0 calc(2 * var(--sbb-icon-sidebar-button__hover-shift,0rem));color:var(--sbb-icon-sidebar-button__color);border-radius:var(--sbb-icon-sidebar-button-border-radius);cursor:var(--sbb-icon-sidebar-button__cursor);user-select:none;transition-duration:var(--sbb-icon-sidebar-button-transition-duration);transition-timing-function:var(--sbb-icon-sidebar-button-transition-easing-function);justify-content:center;align-items:center;transition-property:color,padding;display:flex;position:relative}:host(.sbb-active) .sbb-action-base{color:var(--sbb-icon-sidebar-button-current-color)}:host(.sbb-active) .sbb-action-base:before{content:"";inset-block:var(--sbb-icon-sidebar-button-current-border-inset-block);inset-inline:var(--sbb-icon-sidebar-button__current-border-inset-inline-start) 0;border-inline-start:var(--sbb-icon-sidebar-button-current-border-width) solid currentcolor;display:block;position:absolute}:host(:focus-visible) .sbb-action-base,.sbb-action-base:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);outline-offset:calc(-1 * var(--sbb-focus-outline-width) - .3125rem)}
+`,E=`:host{position:absolute;inset:0}
+`,D=`:host{outline-color:var(--sbb-focus-outline-color);height:100%;display:block;position:relative;overflow:auto}
+`;const O=n(E),k=n(D);n(T);var A=`:host{--sbb-sidebar-container-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));--sbb-sidebar-container-animation-easing:var(--sbb-animation-easing);--sbb-sidebar-container-backdrop-opacity:0;--sbb-sidebar-container__backdrop-visibility:hidden;--sbb-sidebar-container-backdrop-animation-duration:var(--sbb-sidebar-container-animation-duration);display:block;overflow:hidden}@media (forced-colors:active){:host{--sbb-sidebar-container-backdrop-opacity:.5}}.sbb-sidebar-container-backdrop{visibility:var(--sbb-sidebar-container__backdrop-visibility);opacity:var(--sbb-sidebar-container-backdrop-opacity);background-color:var(--sbb-color-black);z-index:3;transition-duration:var(--sbb-sidebar-container-backdrop-animation-duration);transition-timing-function:var(--sbb-sidebar-container-animation-easing);transition-property:opacity,visibility;position:absolute;inset:0}
+`;const j=new Set;let M;var N=class extends a{constructor(){super(...arguments),this._forcedClosedSidebars=new WeakSet}static{this.elementName=`sbb-sidebar-container`}static{this.styles=[O,n(A)]}get sidebars(){return Array.from(this.querySelectorAll?.(`:scope > sbb-sidebar`)??[])}get start(){return this.querySelector?.(`:scope > sbb-sidebar:not([position='end'])`)}get end(){return this.querySelector?.(`:scope > sbb-sidebar[position='end']`)}connectedCallback(){super.connectedCallback(),M??=!t&&new ResizeObserver(()=>this._handleWidthChange()),!t&&j.size===0&&M.observe(document?.documentElement),j.add(this),this._handleWidthChange()}disconnectedCallback(){super.disconnectedCallback(),j.delete(this),j.size===0&&M?.disconnect()}firstUpdated(e){super.firstUpdated(e),this._handleWidthChange()}_handleWidthChange(){Array.from(j).sort((e,t)=>e.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_FOLLOWING).forEach(e=>e._calculateSpaceState())}async _calculateSpaceState(){if(t)return;let e=this.parentElement?.closest?.(`sbb-sidebar-container`)?.sidebars??[];for(let t of e)await t.updateComplete.then(()=>t.animationComplete);let n=this.offsetWidth??0;if(n===0)return;let r=this.sidebars,i=e.some(e=>e.matches(`:is(:state(mode-over-forced),[state--mode-over-forced])`))??!1,a=n-r.filter(e=>e.mode===`side`).reduce((e,t)=>e+(t.offsetWidth??0),0)<320;for(let e of r){let t=e.matches(`:is(:state(mode-over-forced),[state--mode-over-forced])`),n=g(e);n.toggle(`mode-over-forced`,a),e.mode===`side`&&((a||i)&&e.opened&&!t?(e.isOpen&&!e.matches(`:is(:state(skip-animation),[state--skip-animation])`)&&n.add(`mode-over-forced-closing`),e.opened=!1,this._forcedClosedSidebars.add(e),e.matches(`:is(:state(mode-over-forced-closing),[state--mode-over-forced-closing])`)&&e.updateComplete.then(()=>e.animationComplete).then(()=>n.delete(`mode-over-forced-closing`))):!a&&!i&&this._forcedClosedSidebars.has(e)&&(e.cedeFocus(),e.opened=!0,this._forcedClosedSidebars.delete(e)))}}render(){return e`<div
+        class="sbb-sidebar-container-backdrop"
+        @click=${()=>this.sidebars.forEach(e=>e.close())}
+      ></div>
+      <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}>
+      <div class="sbb-sidebar-title-section"><slot name="title-section"></slot></div>
+      <div
+        class="sbb-sidebar-content-section sbb-scrollbar"
+        @scroll=${()=>this._detectScrolledState()}
+      >
+        <slot></slot>
+      </div>
+    </div>`}}})();export{w as SbbSidebarCloseButtonElement,N as SbbSidebarContainerElement,F as SbbSidebarContentElement,z as SbbSidebarElement,L as SbbSidebarTitleElement};

package/signet.js

@@ -1,6 +1 @@
-import { t as e } from "./signet.component-DoXHpxDU.js";
-import "./signet.pure.js";
-//#region src/elements/signet.ts
-e.define();
-//#endregion
-export { e as SbbSignetElement };
+import{SbbSignetElement as e}from"./signet.pure.js";export*from"./signet.pure.js";e.define();

package/signet.pure.js

@@ -1,2 +1,23 @@
-import { t as e } from "./signet.component-DoXHpxDU.js";
-export { e as SbbSignetElement };
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{SbbElement as a,forceType as o}from"./core.js";var s=`:host{background-color:var(--sbb-signet-background-color);aspect-ratio:var(--sbb-signet-aspect-ratio);height:var(--sbb-signet-height,auto);justify-content:center;align-items:center;display:flex}:host([protective-room=minimal]){--sbb-signet-aspect-ratio:108 / 64;--sbb-signet-svg-container-height:calc(44 / 64 * 100%)}:host([protective-room=ideal]){--sbb-signet-aspect-ratio:128 / 84;--sbb-signet-svg-container-height:calc(44 / 84 * 100%)}:host([protective-room=panel]){--sbb-signet-aspect-ratio:143 / 48;--sbb-signet-background-color:unset}.sbb-signet__svg-container{height:var(--sbb-signet-svg-container-height,100%);width:100%;display:flex}svg{width:100%;height:100%}#sbb-signet__panel{fill:var(--sbb-signet-panel-color);stroke:var(--sbb-signet-panel-color)}#sbb-signet__icon{fill:var(--sbb-signet-icon-color)}
+`;let c=(()=>{let c=a,l,u=[],d=[],f,p=[],m=[];return class extends c{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(c[Symbol.metadata]??null):void 0;l=[i({attribute:`protective-room`,reflect:!0})],f=[o(),i({attribute:`accessibility-label`})],e(this,null,l,{kind:`accessor`,name:`protectiveRoom`,static:!1,private:!1,access:{has:e=>`protectiveRoom`in e,get:e=>e.protectiveRoom,set:(e,t)=>{e.protectiveRoom=t}},metadata:t},u,d),e(this,null,f,{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},p,m),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-signet`}static{this.styles=[r(s)]}#e=t(this,u,`ideal`);get protectiveRoom(){return this.#e}set protectiveRoom(e){this.#e=e}#t=(t(this,d),t(this,p,`Logo`));get accessibilityLabel(){return this.#t}set accessibilityLabel(e){this.#t=e}render(){return n`
+      <span class="sbb-signet__svg-container">
+        ${this.protectiveRoom===`panel`?n`
+                <svg focusable="false" viewBox="0 0 143 48" xmlns="http://www.w3.org/2000/svg">
+                  <title .textContent=${this.accessibilityLabel}></title>
+                  <path id="sbb-signet__panel" stroke-width="1" d="M1 47h141V1H1v46z"></path>
+                  <path
+                    id="sbb-signet__icon"
+                    d="M87 40h9.3L83.8 27.7h15.5V40h7.4V27.7h15.6L109.7 40h9.3l16-16-15.9-16h-9.3l12.5 12.3h-15.6V8h-7.4v12.3H83.8L96.3 8H87L71 24l16 16z"
+                  ></path>
+                </svg>
+              `:n`
+                <svg focusable="false" viewBox="0 0 80 40" xmlns="http://www.w3.org/2000/svg">
+                  <title .textContent=${this.accessibilityLabel}></title>
+                  <path
+                    id="sbb-signet__icon"
+                    d="M20.0265 40H31.6821L16 24.6154H35.3907V40H44.6093V24.6154H64.106L48.4238 40H60.0795L80 20.0531L60.0795 0H48.4238L64.106 15.3846H44.6093V0H35.3907V15.3846H16L31.6821 0H20.0265L0 20.0531L20.0265 40Z"
+                  ></path>
+                </svg>
+              `}
+      </span>
+    `}constructor(){super(...arguments),t(this,m)}}})();export{c as SbbSignetElement};

package/skiplink-list.js

@@ -1,6 +1 @@
-import { t as e } from "./skiplink-list.component-Cc6QNvVU.js";
-import "./skiplink-list.pure.js";
-//#region src/elements/skiplink-list.ts
-e.define();
-//#endregion
-export { e as SbbSkiplinkListElement };
+import{SbbSkiplinkListElement as e}from"./skiplink-list.pure.js";export*from"./skiplink-list.pure.js";e.define();

package/skiplink-list.pure.js

@@ -1,2 +1,10 @@
-import { t as e } from "./skiplink-list.component-Cc6QNvVU.js";
-export { e as SbbSkiplinkListElement };
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{unsafeCSS as n}from"lit";import{property as r}from"lit/decorators.js";import{html as i,unsafeStatic as a}from"lit/static-html.js";import{SbbDarkModeController as o,SbbElement as s,SbbNamedSlotListMixin as c,forceType as l,omitEmptyConverter as u}from"./core.js";var d=`:host{--sbb-skiplink-list-background:var(--sbb-background-color-1-inverted);z-index:calc(var(--sbb-skiplink-list-z-index,var(--sbb-overlay-default-z-index)) + 1);position:fixed;inset-block-start:var(--sbb-spacing-fixed-4x);inset-inline-start:var(--sbb-spacing-fixed-4x)}.sbb-skiplink-list>:is(li,span){box-shadow:var(--sbb-box-shadow-level-5-hard);height:var(--sbb-skiplink-list-height,0);overflow:var(--sbb-skiplink-list-overflow,hidden);border-radius:var(--sbb-border-radius-4x);background-color:var(--sbb-skiplink-list-background);border:var(--sbb-skiplink-list-border,unset);width:fit-content;list-style:none;display:list-item}.sbb-skiplink-list>:is(li,span):focus-within{--sbb-skiplink-list-height:auto;--sbb-skiplink-list-overflow:visible;--sbb-skiplink-list-border:var(--sbb-border-width-2x) solid var(--sbb-border-color-1-inverted)}::slotted(:is(:state(sbb-link),[state--sbb-link])){--sbb-focus-outline-color:transparent;--sbb-link-padding:var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xxs)}::slotted(*){color-scheme:light only}:host(:is(:state(dark),[state--dark])) ::slotted(*){--sbb-link-color-normal:var(--sbb-color-midnight)}
+`;let f=(()=>{let f=c(s),p,m=[],h=[],g,_=[],v=[];return class extends f{constructor(){super(...arguments),this.listChildLocalNames=[`sbb-block-link`,`sbb-block-link-button`],this.#e=t(this,m,``),this.#t=(t(this,h),t(this,_,`2`)),this._darkModeController=(t(this,v),new o(this,()=>{for(let e of this.listChildren)e.negative=this._isLightMode()}))}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(f[Symbol.metadata]??null):void 0;p=[l(),r({attribute:`title-content`,reflect:!0,converter:u})],g=[r({attribute:`title-level`})],e(this,null,p,{kind:`accessor`,name:`titleContent`,static:!1,private:!1,access:{has:e=>`titleContent`in e,get:e=>e.titleContent,set:(e,t)=>{e.titleContent=t}},metadata:t},m,h),e(this,null,g,{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:t},_,v),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-skiplink-list`}static{this.styles=[n(d)]}#e;get titleContent(){return this.#e}set titleContent(e){this.#e=e}#t;get titleLevel(){return this.#t}set titleLevel(e){this.#t=e}willUpdate(e){if(super.willUpdate(e),e.has(`listChildren`))for(let e of this.listChildren)e.size=`m`,e.negative=this._isLightMode()}_isLightMode(){return!this._darkModeController.matches()}render(){let e=`h${this.titleLevel||`2`}`;return i`
+      <${a(e)}
+        class="sbb-screen-reader-only"
+        id="sbb-skiplink-list-title-id"
+      >
+        <slot name="title">${this.titleContent}</slot>
+      </${a(e)}>
+      ${this.renderList({ariaLabelledby:`sbb-skiplink-list-title-id`})}
+    `}}})();export{f as SbbSkiplinkListElement};

package/slider.js

@@ -1,6 +1 @@
-import { t as e } from "./slider.component-pDx_g7eE.js";
-import "./slider.pure.js";
-//#region src/elements/slider.ts
-e.define();
-//#endregion
-export { e as SbbSliderElement };
+import{SbbSliderElement as e}from"./slider.pure.js";export*from"./slider.pure.js";e.define();

package/slider.pure.js

@@ -1,2 +1,31 @@
-import { t as e } from "./slider.component-pDx_g7eE.js";
-export { e as SbbSliderElement };
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,nothing as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{ref as o}from"lit/directives/ref.js";import{SbbDisabledMixin as s,SbbElement as c,SbbFormAssociatedMixin as l,SbbReadonlyMixin as u,forceType as d}from"./core.js";import{SbbIconElement as f}from"./icon.pure.js";var p=`:host{--_sbb-slider-value-fraction:0;min-width:var(--sbb-slider-min-width);width:min(var(--sbb-slider-width), 100%);display:inline-block;outline:none!important}:host(:disabled){--sbb-slider-icon-color:light-dark(var(--sbb-color-graphite),var(--sbb-color-smoke));--sbb-slider-knob-border-color:var(--sbb-border-color-5);--sbb-slider-knob-border-size:var(--sbb-border-width-2x);--sbb-slider-knob-border-style:dashed}:host([readonly]){--sbb-slider-icon-color:var(--sbb-color-5);--sbb-slider-knob-border-color:var(--sbb-slider-selected-line-disabled-color)}:host(:disabled),:host([readonly]){--sbb-slider-line-color:var(--sbb-slider-line-disabled-color);--sbb-slider-selected-line-color:var(--sbb-slider-selected-line-disabled-color)}@media (forced-colors:active){:host(:disabled),:host([readonly]){--sbb-slider-icon-color:GrayText;--sbb-slider-selected-line-disabled-color:GrayText;--sbb-slider-line-disabled-color:GrayText}}.sbb-slider__height-container{flex-direction:column;display:flex}.sbb-slider__height-container:before{content:"​";user-select:none;width:0;height:0}.sbb-slider__wrapper{gap:var(--sbb-slider-gap);padding-block:var(--sbb-slider-padding-block);color:var(--sbb-slider-icon-color);display:flex}.sbb-slider__container{min-height:var(--sbb-size-icon-ui-small);flex-grow:1;position:relative}.sbb-slider__range-input{opacity:0;width:100%;margin:0;position:absolute;inset:0}.sbb-slider__line{height:var(--sbb-slider-line-height);background-color:var(--sbb-slider-line-color);border-radius:var(--sbb-slider-line-height);pointer-events:none;width:100%;position:absolute;top:50%;overflow:hidden;translate:0 -50%}.sbb-slider__selected-line{background-color:var(--sbb-slider-selected-line-color);height:100%;width:calc(var(--_sbb-slider-value-fraction) * 100%);position:relative}.sbb-slider__knob{box-shadow:var(--sbb-box-shadow-level-5-hard);width:var(--sbb-slider-knob-size);height:var(--sbb-slider-knob-size);top:50%;transition-property:width,height;transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-1x));background-color:var(--sbb-slider-knob-color);border:var(--sbb-slider-knob-border-size) var(--sbb-slider-knob-border-style) var(--sbb-slider-knob-border-color);pointer-events:none;border-radius:50%;transition-timing-function:ease-in;position:absolute;inset-inline-start:calc(var(--_sbb-slider-value-fraction) * 100% - var(--sbb-slider-knob-size) * var(--_sbb-slider-value-fraction));translate:0 -50%}:host(:focus-visible) .sbb-slider__knob{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);--sbb-slider-knob-size:var(--sbb-slider-knob-size-active)}:host(:not(:is(:disabled,[readonly]))) .sbb-slider__range-input:active~.sbb-slider__knob{--sbb-slider-knob-size:var(--sbb-slider-knob-size-active)}
+`;let m=(()=>{let m=s(u(l(c))),h=[],g,_,v,y,b,x=[],S=[],C,w=[],T=[];return class extends m{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(m[Symbol.metadata]??null):void 0;g=[a()],_=[a({attribute:`value-as-number`,type:Number})],v=[a()],y=[a()],b=[d(),a({attribute:`start-icon`})],C=[d(),a({attribute:`end-icon`})],e(this,null,g,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,h),e(this,null,_,{kind:`setter`,name:`valueAsNumber`,static:!1,private:!1,access:{has:e=>`valueAsNumber`in e,set:(e,t)=>{e.valueAsNumber=t}},metadata:t},null,h),e(this,null,v,{kind:`setter`,name:`min`,static:!1,private:!1,access:{has:e=>`min`in e,set:(e,t)=>{e.min=t}},metadata:t},null,h),e(this,null,y,{kind:`setter`,name:`max`,static:!1,private:!1,access:{has:e=>`max`in e,set:(e,t)=>{e.max=t}},metadata:t},null,h),e(this,null,b,{kind:`accessor`,name:`startIcon`,static:!1,private:!1,access:{has:e=>`startIcon`in e,get:e=>e.startIcon,set:(e,t)=>{e.startIcon=t}},metadata:t},x,S),e(this,null,C,{kind:`accessor`,name:`endIcon`,static:!1,private:!1,access:{has:e=>`endIcon`in e,get:e=>e.endIcon,set:(e,t)=>{e.endIcon=t}},metadata:t},w,T),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-slider`}static{this.elementDependencies=[f]}static{this.role=`slider`}static{this.styles=[i(p)]}static{this.events={didChange:`didChange`}}set value(e){this._isValidNumber(e)?this._value=this._boundBetweenMinMax(e):this._value=null,this.internals.ariaValueNow=this.value}get value(){return this._value??this._defaultValue()}set valueAsNumber(e){this.value=e?.toString()??null}get valueAsNumber(){return Number(this.value)}set min(e){if(!this._isValidNumber(e))return;this._min=e,this.internals.ariaValueMin=this.min;let t=this._boundBetweenMinMax(this.value);this.value!==t&&(this.value=t)}get min(){return this._min}set max(e){if(!this._isValidNumber(e))return;this._max=e,this.internals.ariaValueMax=this.max;let t=this._boundBetweenMinMax(this.value);this.value!==t&&(this.value=t)}get max(){return this._max}#e;get startIcon(){return this.#e}set startIcon(e){this.#e=e}#t;get endIcon(){return this.#t}set endIcon(e){this.#t=e}get type(){return`range`}constructor(){super(),this._value=(t(this,h),null),this._min=`0`,this._max=`100`,this.#e=t(this,x,``),this.#t=(t(this,S),t(this,w,``)),this._rangeInput=t(this,T),this.addEventListener?.(`keydown`,e=>this._handleKeydown(e))}connectedCallback(){super.connectedCallback(),this.tabIndex=0}willUpdate(e){super.willUpdate(e),e.has(`readOnly`)&&(this.internals.ariaReadOnly=(!!this.readOnly).toString()),this.style?.setProperty(`--_sbb-slider-value-fraction`,this._valueFraction().toString())}formResetCallback(){this.value=this.getAttribute(`value`)??this._defaultValue()}formStateRestoreCallback(e,t){this.value=e}_defaultValue(){return(+this.min+(this.max-+this.min)/2).toString()}_isValidNumber(e){return e!=null&&!isNaN(Number(e))}_boundBetweenMinMax(e){return Math.max(+this.min,Math.min(+this.max,+e)).toString()}_valueFraction(){let e=this.valueAsNumber,t=+this.min,n=+this.max,r=(e-t)/(n-t);return isNaN(r)?0:Math.max(0,Math.min(1,r))}async _handleKeydown(e){if(e.key!==`Tab`&&e.preventDefault(),!this.readOnly){if(e.key===`Home`)this._rangeInput.value=this.min;else if(e.key===`End`)this._rangeInput.value=this.max;else if(e.key===`ArrowLeft`||e.key===`ArrowDown`)this._rangeInput.stepDown();else if(e.key===`ArrowRight`||e.key===`ArrowUp`)this._rangeInput.stepUp();else if(e.key===`PageDown`)this._rangeInput.stepDown((this.max-+this.min)/10);else if(e.key===`PageUp`)this._rangeInput.stepUp((this.max-+this.min)/10);else return;this._rangeInput.dispatchEvent(new InputEvent(`input`,{bubbles:!0,cancelable:!0,composed:!0})),this._rangeInput.dispatchEvent(new Event(`change`,{bubbles:!0}))}}_dispatchChangeEvent(){this.dispatchEvent(new Event(`change`,{bubbles:!0})),this.dispatchEvent(new Event(`didChange`,{bubbles:!0}))}render(){return n`
+      <div class="sbb-slider__height-container">
+        <div class="sbb-slider__wrapper">
+          <slot name="prefix">
+            ${this.startIcon?n`<sbb-icon name="${this.startIcon}"></sbb-icon>`:r}
+          </slot>
+          <div class="sbb-slider__container">
+            <input
+              tabindex="-1"
+              min=${this.min}
+              max=${this.max}
+              ?disabled=${this.disabled||this.formDisabled||this.readOnly}
+              value=${this.value||r}
+              class="sbb-slider__range-input"
+              type="range"
+              @change=${()=>this._dispatchChangeEvent()}
+              @input=${()=>this.value=this._rangeInput.value}
+              ${o(e=>this._rangeInput=e)}
+            />
+            <div class="sbb-slider__line">
+              <div class="sbb-slider__selected-line"></div>
+            </div>
+            <div class="sbb-slider__knob"></div>
+          </div>
+          <slot name="suffix">
+            ${this.endIcon?n`<sbb-icon name="${this.endIcon}"></sbb-icon>`:r}
+          </slot>
+        </div>
+      </div>
+    `}}})();export{m as SbbSliderElement};

package/standard-theme.css

@@ -1720,7 +1720,15 @@ summary {
   --sbb-stepper-marker-color: var(--sbb-color-3);
   --sbb-table-border-color: var(--sbb-color-cloud);
   --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
+  --sbb-table-border-color-hover: var(--sbb-color-aluminium);
+  --sbb-table-border-color-hover: light-dark(
+    var(--sbb-color-aluminium),
+    var(--sbb-table-border-color)
+  );
+  --sbb-table-border-color-selected: var(--sbb-background-color-4-inverted);
+  --sbb-table-border-width: var(--sbb-border-width-1x);
   --sbb-table-background-color: var(--sbb-background-color-1);
+  --sbb-table-background-color-hover: var(--sbb-background-color-4);
   --sbb-table-row-striped-color: var(--sbb-background-color-3);
   --sbb-table-color: var(--sbb-color-1);
   --sbb-table-caption-color: var(--sbb-color-granite);
@@ -2248,6 +2256,10 @@ sbb-card .sbb-action {
   pointer-events: all;
 }
 
+sbb-carousel-item sbb-image {
+  border-radius: unset;
+}
+
 sbb-container > [slot=image]:is(sbb-image, img),
 sbb-container > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap-image) {
   --sbb-image-object-fit: cover;
@@ -2546,7 +2558,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 }
 
 :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) {
-  --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
+  --sbb-table-border: var(--sbb-table-border-width) solid var(--sbb-table-border-color);
   --sbb-table-sticky-shadow-transition-duration: var(
     --sbb-disable-animation-duration,
     var(--sbb-animation-duration-6x)
@@ -2630,7 +2642,10 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 sbb-table-wrapper[negative] .sbb-table,
 .sbb-table--negative {
   --sbb-table-border-color: var(--sbb-color-anthracite);
+  --sbb-table-border-color-hover: var(--sbb-table-border-color);
+  --sbb-table-border-color-selected: var(--sbb-color-cloud);
   --sbb-table-background-color: var(--sbb-background-color-1-negative);
+  --sbb-table-background-color-hover: var(--sbb-background-color-4-negative);
   --sbb-table-color: var(--sbb-color-1-negative);
   --sbb-table-row-striped-color: var(--sbb-background-color-3-negative);
   --sbb-table-caption-color: var(--sbb-color-cement);
@@ -2644,6 +2659,26 @@ sbb-table-wrapper[negative] .sbb-table,
   background-color: var(--sbb-table-background-color);
 }
 
+.sbb-table--hover tbody tr:hover :is(th, td) {
+  background-color: var(--sbb-table-background-color-hover);
+  border-color: var(--sbb-table-border-color-hover);
+}
+.sbb-table--hover :is(thead:has(+ tbody tr:first-of-type:hover) tr:last-of-type :is(th, td),
+tbody tr:has(+ tr:hover) :is(th, td)) {
+  border-block-end-color: var(--sbb-table-border-color-hover);
+}
+
+tr.sbb-table--selected :is(th, td) {
+  position: relative;
+}
+tr.sbb-table--selected :is(th, td)::after {
+  content: "";
+  position: absolute;
+  inset: 0 0 calc(-1 * var(--sbb-table-border-width));
+  pointer-events: none;
+  border-block-end: var(--sbb-table-border-width) solid var(--sbb-table-border-color-selected);
+}
+
 .sbb-table--theme-iron {
   --sbb-table-cell-color: var(--sbb-color-4);
 }
@@ -2766,6 +2801,9 @@ sbb-tab-nav-bar .sbb-tab-amount {
   filter: brightness(var(--sbb-teaser-image-brightness, 1));
   transition: filter, scale var(--sbb-teaser-image-animation-duration) var(--sbb-teaser-image-animation-easing);
 }
+:is(sbb-teaser, sbb-teaser-hero, sbb-teaser-product) .sbb-figure {
+  max-width: 100%;
+}
 
 sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
   --sbb-image-object-fit: cover;

package/status.js

@@ -1,6 +1 @@
-import { t as e } from "./status.component-Cg671ic2.js";
-import "./status.pure.js";
-//#region src/elements/status.ts
-e.define();
-//#endregion
-export { e as SbbStatusElement };
+import{SbbStatusElement as e}from"./status.pure.js";export*from"./status.pure.js";e.define();

package/status.pure.js

@@ -1,2 +1,10 @@
-import { t as e } from "./status.component-Cg671ic2.js";
-export { e as SbbStatusElement };
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{SbbElement as a}from"./core.js";import{SbbIconNameMixin as o}from"./icon.pure.js";var s=`:host{--sbb-status-text-color:var(--sbb-status-color);gap:var(--sbb-status-gap);color:var(--sbb-status-text-color);font-size:var(--sbb-status-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:flex}:host([type=error]){--sbb-status-color:var(--sbb-color-error)}:host([type=success]){--sbb-status-color:var(--sbb-color-success)}:host([type=warning]){--sbb-status-color:var(--sbb-color-2)}:host([type=pending]){--sbb-status-color:var(--sbb-color-sky)}:host([type=incomplete]){--sbb-status-color:var(--sbb-color-error)}:host([type=not-started]){--sbb-status-color:var(--sbb-color-5);--sbb-status-text-color:var(--sbb-color-2)}:host([type=in-progress]){--sbb-status-color:var(--sbb-color-pink)}:host(:is(:state(slotted-title),[state--slotted-title])){--sbb-status-gap:var(--sbb-spacing-responsive-xxxs);--_sbb-status-title-font-size:var(--sbb-heading-font-size-5);--_sbb-status-title-line-height:var(--sbb-typo-line-height-heading);color:var(--sbb-status-title-color)}.sbb-status__icon{color:var(--sbb-status-color);flex-shrink:0;margin-block-start:calc((var(--_sbb-status-title-font-size,var(--sbb-status-font-size)) * var(--_sbb-status-title-line-height,var(--sbb-typo-line-height-text)) - var(--sbb-size-icon-ui-small)) / 2);display:flex}.sbb-status__content-slot{margin:0;padding:0;display:inline}::slotted(sbb-title){margin-block:0}
+`;let c=(()=>{let c=o(a),l,u=[],d=[];return class extends c{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(c[Symbol.metadata]??null):void 0;l=[i({reflect:!0})],e(this,null,l,{kind:`accessor`,name:`type`,static:!1,private:!1,access:{has:e=>`type`in e,get:e=>e.type,set:(e,t)=>{e.type=t}},metadata:t},u,d),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-status`}static{this.styles=[r(s)]}#e;get type(){return this.#e}set type(e){this.#e=e}_handleSlotchange(){let e=Array.from(this.children).find(e=>e.localName===`sbb-title`);e&&(e.slot=`title`)}_configureTitle(e){let t=e.target.assignedElements().find(e=>e.localName===`sbb-title`);t&&(customElements.upgrade(t),t.visualLevel=`5`)}renderIconName(){return super.renderIconName()||this._statusTypes.get(this.type)}render(){return n`
+      <span class="sbb-status__icon"> ${this.renderIconSlot()} </span>
+      <span class="sbb-status__content">
+        <slot name="title" @slotchange=${this._configureTitle}></slot>
+        <p class="sbb-status__content-slot" @slotchange=${this._handleSlotchange}>
+          <slot></slot>
+        </p>
+      </span>
+    `}constructor(){super(...arguments),this._statusTypes=new Map([[`info`,`circle-information-small`],[`success`,`circle-tick-small`],[`warning`,`circle-exclamation-point-small`],[`error`,`circle-cross-small`],[`pending`,`circle-three-dots-small`],[`incomplete`,`circle-dotted-part-x-small`],[`not-started`,`circle-dotted-small`],[`in-progress`,`circle-dotted-part-small`]]),this.#e=t(this,u,`info`),t(this,d)}}})();export{c as SbbStatusElement};

package/stepper.js

@@ -1,7 +1 @@
-import { t as e } from "./step-label.component-olqRA-s7.js";
-import { n as t, t as n } from "./step.component-CcjV_283.js";
-import { n as r, t as i } from "./stepper.component-CqClDxL6.js";
-import "./stepper.pure.js";
-n.define(), e.define(), r.define();
-//#endregion
-export { i as SbbStepChangeEvent, n as SbbStepElement, e as SbbStepLabelElement, t as SbbStepValidateEvent, r as SbbStepperElement };
+import{SbbStepElement as e,SbbStepLabelElement as t,SbbStepperElement as n}from"./stepper.pure.js";export*from"./stepper.pure.js";e.define(),t.define(),n.define();

package/stepper.pure.js

@@ -1,4 +1,18 @@
-import { t as e } from "./step-label.component-olqRA-s7.js";
-import { n as t, t as n } from "./step.component-CcjV_283.js";
-import { n as r, t as i } from "./stepper.component-CqClDxL6.js";
-export { i as SbbStepChangeEvent, n as SbbStepElement, e as SbbStepLabelElement, t as SbbStepValidateEvent, r as SbbStepperElement };
+import{html as e,unsafeCSS as t}from"lit";import{SbbButtonBaseElement as n,SbbDisabledMixin as r,SbbElement as i,SbbMediaMatcherController as a,SbbMediaQueryBreakpointLargeAndAbove as o,SbbMediaQueryBreakpointSmallAndAbove as s,SbbMediaQueryBreakpointUltraAndAbove as c,SbbMediaQueryBreakpointZeroAndAbove as l,SbbPropertyWatcherController as u,appendAriaElements as d,forceType as f,getNextElementIndex as p,isArrowKeyPressed as m,removeAriaElements as h}from"./core.js";import{SbbIconNameMixin as g}from"./icon.pure.js";import{ResizeController as _}from"@lit-labs/observers/resize-controller.js";import{__esDecorate as v,__runInitializers as y}from"tslib";import{IntersectionController as b}from"@lit-labs/observers/intersection-controller.js";import{property as x}from"lit/decorators.js";var S=`:host{--sbb-step-label-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));gap:var(--sbb-step-label-gap);min-width:0;max-width:fit-content;cursor:var(--sbb-step-label-cursor);color:var(--sbb-step-label-color);font-size:var(--sbb-step-label-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:flex;position:relative}:host:before{font-size:var(--sbb-step-label-number-font-size);font-weight:var(--sbb-step-label-font-weight-selected,normal);top:50%;left:50%;z-index:1;translate:-50% -50%;translate:-50% calc(-50% + var(--sbb-step-label-translate-y-content-hover,0px));transition:translate var(--sbb-step-label-animation-duration) var(--sbb-animation-easing);line-height:1;position:absolute;inset-block-start:calc(var(--sbb-step-label-font-size) * var(--sbb-typo-line-height-text) / 2 + var(--sbb-border-width-1x) / 2);inset-inline-start:calc(var(--sbb-step-label-prefix-size) / 2)}:host(:is(:state(selected),[state--selected])){--sbb-step-label-color:var(--sbb-color-3);--sbb-step-label-font-weight-selected:bold}@media (forced-colors:active){:host(:is(:state(selected),[state--selected])){--sbb-step-label-color:Highlight!important}}:host(:is(:state(size-s),[state--size-s])){--sbb-step-label-gap:var(--sbb-step-label-gap-s);--sbb-step-label-prefix-size:var(--sbb-step-label-prefix-size-s);--sbb-step-label-font-size:var(--sbb-step-label-font-size-s)}:host(:is(:state(size-m),[state--size-m])){--sbb-step-label-gap:var(--sbb-step-label-gap-m);--sbb-step-label-prefix-size:var(--sbb-step-label-prefix-size-m);--sbb-step-label-font-size:var(--sbb-step-label-font-size-m)}:host(:disabled){--sbb-step-label-color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite));--sbb-step-label-prefix-border-style:dashed}@media (forced-colors:active){:host(:disabled){--sbb-step-label-color:GrayText!important}}@media (any-hover:hover){:host(:hover:not(:disabled)){--sbb-step-label-cursor:var(--sbb-cursor-pointer);--sbb-step-label-prefix-background-color:var(--sbb-background-color-3);--sbb-step-label-translate-y-content-hover:-.0625rem;--sbb-step-label-prefix-size-grow-hover:calc(var(--sbb-border-width-2x) * -1)}}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);border-radius:var(--sbb-border-radius-1x)}:host(:is(:state(orientation-vertical),[state--orientation-vertical])){transition:margin var(--sbb-stepper-animation-duration) var(--sbb-animation-easing)}:host(:is(:state(orientation-vertical),[state--orientation-vertical]):not(:first-of-type)){margin-block-start:var(--sbb-spacing-fixed-6x)}:host(:is(:state(selected),[state--selected]):is(:state(orientation-vertical),[state--orientation-vertical])){margin-block-end:var(--sbb-spacing-fixed-8x)}.sbb-step-label__prefix{width:var(--sbb-step-label-prefix-size);height:var(--sbb-step-label-prefix-size);flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative;inset-block-start:calc(1em * var(--sbb-typo-line-height-text) / 2 + var(--sbb-border-width-1x) / 2 - var(--sbb-step-label-prefix-size) / 2)}.sbb-step-label__prefix:before{content:"";inset:calc(var(--sbb-step-label-prefix-size-grow-hover,0px));border-radius:var(--sbb-border-radius-infinity);border:var(--sbb-border-width-1x) var(--sbb-step-label-prefix-border-style) var(--sbb-step-label-prefix-border-color);background-color:var(--sbb-step-label-prefix-background-color);transition-duration:var(--sbb-step-label-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:background-color,inset;position:absolute}.sbb-step-label__text{font-weight:700}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])) .sbb-step-label__text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::slotted(sbb-icon),sbb-icon{z-index:1;background-color:var(--sbb-step-label-prefix-background-color);border-radius:var(--sbb-border-radius-infinity);translate:0 var(--sbb-step-label-translate-y-content-hover,0);transition-duration:var(--sbb-step-label-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:background-color,translate}
+`,C=class extends g(r(n)){static{this.elementName=`sbb-step-label`}static{this.role=`tab`}static{this.styles=[t(S)]}get step(){return this._step}get stepper(){return this.closest(`sbb-stepper`)}set disabled(e){super.disabled=e,this.toggleState(`user-disabled`,e)}get disabled(){return super.disabled}constructor(){super(),this._step=null,this._previousSize=null,this.addEventListener?.(`click`,()=>{let e=this.stepper;e&&this.step&&this._isNotDeactivatedByLinearMode(this.step)&&!this.disabled&&(e.selected=this.step)}),this.addController(new u(this,()=>this.stepper,{orientation:e=>{this._previousOrientation&&this.internals.states.delete(`orientation-${this._previousOrientation}`),this._previousOrientation=e.orientation,this._previousOrientation&&this.internals.states.add(`orientation-${this._previousOrientation}`)},size:e=>{this._previousSize&&this.internals.states.delete(`size-${this._previousSize}`),this._previousSize=e.size,this._previousSize&&this.internals.states.add(`size-${this._previousSize}`)}}))}_isNotDeactivatedByLinearMode(e){let t=this.stepper;if(t?.linear&&t.selectedIndex!==null){let n=t.steps.indexOf(e);return n<t.selectedIndex||n===t.selectedIndex+1}return!0}connectedCallback(){super.connectedCallback(),this.slot||=`step-label`,this.internals.ariaSelected=`false`,this.tabIndex=-1,this._assignStep()}select(){this.tabIndex=0,this.internals.ariaSelected=`true`,this.internals.states.add(`selected`)}deselect(){this.tabIndex=-1,this.internals.ariaSelected=`false`,this.internals.states.delete(`selected`)}configure(e,t,n){n&&this._assignStep(),this.internals.ariaPosInSet=`${e}`,this.internals.ariaSetSize=`${t}`}_assignStep(){let e=this.nextElementSibling;for(;e&&e.localName!==`sbb-step`;)e=e.nextElementSibling;let t=e;this.internals.ariaControlsElements=h(this.internals.ariaControlsElements,this._step),this._step=t instanceof Element?t:null,this.internals.ariaControlsElements=d(this.internals.ariaControlsElements,this._step)}disable(e){super.disabled=e}render(){return e`
+      <span class="sbb-step-label__prefix">${this.renderIconSlot()}</span>
+      <span class="sbb-step-label__text"><slot></slot></span>
+    `}},w=`:host{--sbb-step-opacity:0;--sbb-step-margin-inline-start:var(--sbb-spacing-fixed-4x);--sbb-step-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));display:block}:host(:is(:state(orientation-vertical),[state--orientation-vertical])){opacity:0;height:0;transition:display var(--sbb-step-animation-duration) var(--sbb-animation-easing), height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing), opacity var(--sbb-step-animation-duration) var(--sbb-animation-easing);transition-behavior:allow-discrete;margin-inline-start:var(--sbb-step-margin-inline-start)}:host(:is(:state(selected),[state--selected]):is(:state(orientation-vertical),[state--orientation-vertical])){opacity:1;height:var(--sbb-stepper-content-height);transition:display var(--sbb-step-animation-duration) var(--sbb-animation-easing), height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing), opacity var(--sbb-step-animation-duration) var(--sbb-stepper-animation-duration) var(--sbb-animation-easing);transition-behavior:allow-discrete}:host(:is(:state(selected),[state--selected])){--sbb-step-opacity:1;--sbb-step-display:block;--sbb-step-height:fit-content;--sbb-step-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x));--sbb-step-animation-delay:var(--sbb-step-animation-duration)}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])){--sbb-step-position:absolute;--sbb-step-inset-block-start:0}.sbb-step{position:var(--sbb-step-position,initial);width:100%;opacity:var(--sbb-step-opacity);display:var(--sbb-step-display,none);height:var(--sbb-step-height,0);transition-property:display,opacity;transition-duration:var(--sbb-step-animation-duration);transition-delay:var(--sbb-step-animation-delay,0);transition-timing-function:var(--sbb-animation-easing);transition-behavior:allow-discrete;inset-block-start:var(--sbb-step-inset-block-start,unset)}@starting-style{.sbb-step{--sbb-step-opacity:0}}
+`,T=class extends Event{get currentIndex(){return this._currentIndex}get currentStep(){return this._currentStep}get nextIndex(){return this._nextIndex}get nextStep(){return this._nextStep}constructor({currentIndex:e,currentStep:t,nextIndex:n,nextStep:r}){super(`validate`,{bubbles:!0,composed:!0,cancelable:!0}),this._currentIndex=e,this._currentStep=t,this._nextIndex=n,this._nextStep=r}},E=class extends i{static{this.elementName=`sbb-step`}static{this.role=`tabpanel`}static{this.styles=[t(w)]}static{this.events={validate:`validate`,resizechange:`resizechange`,active:`active`}}get label(){return this._label}get stepper(){return this.closest(`sbb-stepper`)}constructor(){super(),this._stepResizeObserver=new _(this,{target:null,skipInitial:!0,callback:()=>setTimeout(()=>this._onStepElementResize())}),this._label=null,this.addEventListener?.(`click`,e=>this._handleClick(e)),this.addController(new u(this,()=>this.stepper,{orientation:e=>{this._previousOrientation&&this.internals.states.delete(`orientation-${this._previousOrientation}`),this._previousOrientation=e.orientation,this._previousOrientation&&this.internals.states.add(`orientation-${this._previousOrientation}`)}}))}select(){!this.hasUpdated||!this.label||(this.internals.states.add(`selected`),this.label.select(),this.dispatchEvent(new Event(`active`,{bubbles:!0,composed:!0})))}deselect(){this.label&&(this.internals.states.delete(`selected`),this.label.deselect())}validate(e){return this.dispatchEvent(new T(e))}configure(e){e&&this._assignLabel()}_handleClick(e){let t=e.composedPath().filter(e=>e instanceof window.HTMLElement);t.some(e=>e.hasAttribute(`sbb-stepper-next`))?this.stepper?.next():t.some(e=>e.hasAttribute(`sbb-stepper-previous`))&&this.stepper?.previous()}_onStepElementResize(){this.matches(`:is(:state(selected),[state--selected])`)&&this.dispatchEvent(new Event(`resizechange`,{bubbles:!0}))}connectedCallback(){super.connectedCallback(),this.slot||=`step`,this._assignLabel()}firstUpdated(e){super.firstUpdated(e),this.updateComplete.then(()=>{this._stepResizeObserver.observe(this.shadowRoot.querySelector(`.sbb-step`))})}_assignLabel(){let e=this.previousElementSibling;for(;e&&e.localName!==`sbb-step-label`;)e=e.previousElementSibling;let t=e;this.internals.ariaLabelledByElements=h(this.internals.ariaLabelledByElements,this._label),this._label=t instanceof Element?t:null,this.internals.ariaLabelledByElements=d(this.internals.ariaLabelledByElements,this._label)}render(){return e`
+      <div class="sbb-step">
+        <slot></slot>
+      </div>
+    `}},D=`:host{--sbb-stepper-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x));counter-reset:step-label;display:block;position:relative}@media (forced-colors:active){:host{--sbb-stepper-marker-color:ButtonText}}:host(:is(:state(disable-animation),[state--disable-animation])){--sbb-disable-animation-duration:0s}:host([orientation=vertical]){--sbb-stepper-orientation:column}.sbb-stepper__labels{flex-direction:var(--sbb-stepper-orientation);justify-content:start;margin-block-end:var(--sbb-spacing-responsive-m);display:flex;position:relative}.sbb-stepper__labels:before{content:"";background-color:var(--sbb-stepper-marker-color);position:absolute;inset-inline-start:calc(var(--sbb-stepper-border-width) * -1)}:host([orientation=horizontal]) .sbb-stepper__labels{gap:var(--sbb-spacing-responsive-m);border-block-end:var(--sbb-stepper-border-width) solid var(--sbb-border-color-4-inverted);padding-block-end:var(--sbb-spacing-fixed-4x)}:host([orientation=horizontal]) .sbb-stepper__labels:before{height:var(--sbb-stepper-marker-width);width:var(--sbb-stepper-marker-size,0);transition:width var(--sbb-stepper-animation-duration) var(--sbb-animation-easing);inset-block-end:calc(var(--sbb-stepper-border-width) * -1)}:host([orientation=vertical]) .sbb-stepper__labels{border-inline-start:var(--sbb-stepper-border-width) solid var(--sbb-border-color-4-inverted);padding-inline-start:var(--sbb-spacing-fixed-4x)}:host([orientation=vertical]) .sbb-stepper__labels:before{width:var(--sbb-stepper-marker-width);height:var(--sbb-stepper-marker-size,0);transition:height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing);inset-block-start:0}.sbb-stepper__steps{position:relative}:host([orientation=horizontal]) .sbb-stepper__steps{height:var(--sbb-stepper-content-height);transition:height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing)}::slotted(sbb-step-label):before{content:counter(step-label);counter-increment:step-label}
+`;const O={zero:l,small:s,large:o,ultra:c};var k=class extends Event{get selectedIndex(){return this._selectedIndex}get previousIndex(){return this._previousIndex}get selectedStep(){return this._selectedStep}get previousStep(){return this._previousStep}constructor({selectedIndex:e,previousIndex:t,selectedStep:n,previousStep:r}){super(`stepchange`,{bubbles:!0,composed:!0}),this._selectedIndex=e,this._previousIndex=t,this._selectedStep=n,this._previousStep=r}};let A=(()=>{let n=i,r=[],o,s=[],c=[],l,u,d=[],h=[],g,_=[],S=[],C,w;return class extends n{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(n[Symbol.metadata]??null):void 0;o=[f(),x({type:Boolean})],l=[x({attribute:`horizontal-from`,reflect:!0})],u=[x({reflect:!0})],g=[x({reflect:!0})],C=[x({attribute:!1})],w=[x({attribute:`selected-index`,type:Number})],v(this,null,o,{kind:`accessor`,name:`linear`,static:!1,private:!1,access:{has:e=>`linear`in e,get:e=>e.linear,set:(e,t)=>{e.linear=t}},metadata:e},s,c),v(this,null,l,{kind:`setter`,name:`horizontalFrom`,static:!1,private:!1,access:{has:e=>`horizontalFrom`in e,set:(e,t)=>{e.horizontalFrom=t}},metadata:e},null,r),v(this,null,u,{kind:`accessor`,name:`orientation`,static:!1,private:!1,access:{has:e=>`orientation`in e,get:e=>e.orientation,set:(e,t)=>{e.orientation=t}},metadata:e},d,h),v(this,null,g,{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},_,S),v(this,null,C,{kind:`setter`,name:`selected`,static:!1,private:!1,access:{has:e=>`selected`in e,set:(e,t)=>{e.selected=t}},metadata:e},null,r),v(this,null,w,{kind:`setter`,name:`selectedIndex`,static:!1,private:!1,access:{has:e=>`selectedIndex`in e,set:(e,t)=>{e.selectedIndex=t}},metadata:e},null,r),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.elementName=`sbb-stepper`}static{this.styles=[t(D)]}static{this.events={stepchange:`stepchange`}}#e;get linear(){return this.#e}set linear(e){this.#e=e}set horizontalFrom(e){this._horizontalFrom=e&&O[e]?e:null,this._horizontalFrom&&this._loaded&&this._checkOrientation()}get horizontalFrom(){return this._horizontalFrom}#t;get orientation(){return this.#t}set orientation(e){this.#t=e}#n;get size(){return this.#n}set size(e){this.#n=e}set selected(e){this._loaded&&this._select(e),this._requestedSelected=e}get selected(){return this.querySelector?.(`sbb-step:is(:state(selected),[state--selected])`)??null}set selectedIndex(e){this._loaded&&e!==null&&this._select(this.steps[e]),this._requestedSelectedIndex=e}get selectedIndex(){return this.selected?this.steps.indexOf(this.selected):null}get steps(){let e=[];return this.querySelectorAll?.(`sbb-step`).forEach(t=>{customElements.upgrade(t),e.push(t)}),e}get _enabledSteps(){return this.steps.filter(e=>e.label?(customElements.upgrade(e.label),!e.label.disabled):!1)}constructor(){super(),this._observer=(y(this,r),new b(this,{target:null,callback:e=>{e.forEach(e=>{e.intersectionRatio>0&&(this._setStepperHeight(this.selected),this._setMarkerSize())})}})),this.#e=y(this,s,!1),this._horizontalFrom=(y(this,c),null),this.#t=y(this,d,`horizontal`),this.#n=(y(this,h),y(this,_,null)),this._requestedSelected=(y(this,S),null),this._requestedSelectedIndex=null,this._loaded=!1,this._resizeObserverTimeout=null,this._mediaMatcher=new a(this,{}),this._onStepperResize=()=>{this._checkOrientation(),this._setStepperHeight(this.selected),clearTimeout(this._resizeObserverTimeout),this.internals.states.add(`disable-animation`),this._resizeObserverTimeout=setTimeout(()=>this.internals.states.delete(`disable-animation`),150)},this.addEventListener?.(`keydown`,e=>this._handleKeyDown(e)),this.addEventListener?.(`resizechange`,e=>this._onSelectedStepResize(e))}next(){if(this.selectedIndex!==null)for(let e=this.selectedIndex+1;e<this.steps.length;e++){let t=this.steps[e];if(this._isSelectable(t)){this._select(t);return}}}previous(){if(this.selectedIndex!==null)for(let e=this.selectedIndex-1;e>=0;e--){let t=this.steps[e];if(this._isSelectable(t)){this._select(t);return}}}reset(){let e=this.closest(`form`);e?e.reset():this.querySelectorAll(`form`).forEach(e=>e.reset()),this.selectedIndex=0,document.activeElement?.closest(`sbb-stepper`)===this&&this.selected?.label?.focus()}_isSelectable(e){return e?(customElements.upgrade(e),!(e.label&&(customElements.upgrade(e.label),!this.linear&&e.label.disabled))):!1}_select(e){if(!e||e===this.selected)return;let t=this.selectedIndex,n=this.selected,r=this.steps.indexOf(e),i={currentIndex:t,currentStep:n,nextIndex:r>=0?r:null,nextStep:e};this.selected&&!this.selected.validate(i)||(n?.deselect(),e.select(),this.dispatchEvent(new k({selectedIndex:this.selectedIndex,previousIndex:t,selectedStep:this.selected,previousStep:n})),this._setMarkerSize(),this._setStepperHeight(e),this._configureLinearMode(),document.activeElement?.closest(`sbb-stepper`)===this&&this.selected?.label?.focus())}_setMarkerSize(){if(!this._loaded||!this.selected||this.selectedIndex===void 0||!this.selected.label)return;let e=this.orientation===`horizontal`?this.selected.label.offsetLeft+this.selected.label.offsetWidth:this._calculateLabelOffsetTop();this.style.setProperty(`--sbb-stepper-marker-size`,`${e}px`)}_setStepperHeight(e){if(e&&e.shadowRoot){let t=e.shadowRoot.querySelector(`.sbb-step`);t&&this.style?.setProperty(`--sbb-stepper-content-height`,`${t.offsetHeight}px`)}}_calculateLabelOffsetTop(){if(this.selectedIndex===null)return;let e=0;for(let t of this.steps){if(t===this.selected)break;e=t.label.offsetHeight+e}return e+this.selected.label.offsetHeight+parseFloat(getComputedStyle(this).getPropertyValue(`--sbb-spacing-fixed-6x`))*16*this.selectedIndex}_onSelectedStepResize(e){this._setStepperHeight(e.target)}_configure(){this.steps.forEach((e,t,n)=>{e.configure(this._loaded),e.label?.configure(t+1,n.length,this._loaded)}),this._select(this.selected||this._enabledSteps[0])}_updateLabels(){this.steps.forEach(e=>{e.slot=this.orientation===`horizontal`?`step`:`step-label`})}_checkOrientation(){this.horizontalFrom&&(this.orientation=this._mediaMatcher.matches(O[this.horizontalFrom])?`horizontal`:`vertical`,this._updateLabels()),setTimeout(()=>this._setMarkerSize(),0)}_configureLinearMode(){this.steps.forEach((e,t)=>{e.label&&(customElements.upgrade(e.label),e.label.disable(this.linear&&t>this.selectedIndex||!this.linear&&e.label.matches(`:is(:state(user-disabled),[state--user-disabled])`)))})}connectedCallback(){super.connectedCallback(),window.addEventListener(`resize`,this._onStepperResize,{passive:!0}),this.toggleState(`disable-animation`,!this._loaded)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener(`resize`,this._onStepperResize)}firstUpdated(e){super.firstUpdated(e),this.updateComplete.then(()=>{this._loaded=!0,this._configure(),this._requestedSelected&&this.steps.indexOf(this._requestedSelected)!==-1?this.selectedIndex=this.steps.indexOf(this._requestedSelected):this._requestedSelectedIndex?this.selectedIndex=this._requestedSelectedIndex:this.selectedIndex=0,this._observer.observe(this),this._checkOrientation(),setTimeout(()=>this.internals.states.delete(`disable-animation`),150)})}willUpdate(e){super.willUpdate(e),e.has(`orientation`)&&!this.horizontalFrom&&(this._updateLabels(),this._setMarkerSize()),e.has(`linear`)&&this._loaded&&this._configureLinearMode(),e.has(`size`)&&this._setMarkerSize()}_handleKeyDown(e){let t=this._enabledSteps;if(!(!t||e.target!==this&&e.target.parentElement!==this)&&m(e)){let n=p(e,t.indexOf(this.selected),t.length);this._select(t[n]),e.preventDefault()}}render(){return e`
+      <div class="sbb-stepper__labels" role="tablist">
+        <slot name="step-label" @slotchange=${this._configure}></slot>
+      </div>
+      <div class="sbb-stepper__steps">
+        <slot name="step" @slotchange=${this._configure}></slot>
+      </div>
+    `}}})();export{k as SbbStepChangeEvent,E as SbbStepElement,C as SbbStepLabelElement,T as SbbStepValidateEvent,A as SbbStepperElement};

package/table/_table.global.scss

@@ -4,7 +4,16 @@ $theme: 'standard' !default;
 
 @mixin base {
   --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
+
+  // In light mode and non negative we need to adjust the border color
+  --sbb-table-border-color-hover: light-dark(
+    var(--sbb-color-aluminium),
+    var(--sbb-table-border-color)
+  );
+  --sbb-table-border-color-selected: var(--sbb-background-color-4-inverted);
+  --sbb-table-border-width: var(--sbb-border-width-1x);
   --sbb-table-background-color: var(--sbb-background-color-1);
+  --sbb-table-background-color-hover: var(--sbb-background-color-4);
   --sbb-table-row-striped-color: var(--sbb-background-color-3);
   --sbb-table-color: var(--sbb-color-1);
   --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
@@ -54,7 +63,7 @@ $theme: 'standard' !default;
   // We cannot use `border-collapse` because in sticky variants it gets visually broken.
   // Therefore, we have to build the grid avoiding double borders.
   :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) {
-    --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
+    --sbb-table-border: var(--sbb-table-border-width) solid var(--sbb-table-border-color);
     --sbb-table-sticky-shadow-transition-duration: var(
       --sbb-disable-animation-duration,
       var(--sbb-animation-duration-6x)
@@ -156,7 +165,10 @@ $theme: 'standard' !default;
   sbb-table-wrapper[negative] .sbb-table,
   .sbb-table--negative {
     --sbb-table-border-color: var(--sbb-color-anthracite);
+    --sbb-table-border-color-hover: var(--sbb-table-border-color);
+    --sbb-table-border-color-selected: var(--sbb-color-cloud);
     --sbb-table-background-color: var(--sbb-background-color-1-negative);
+    --sbb-table-background-color-hover: var(--sbb-background-color-4-negative);
     --sbb-table-color: var(--sbb-color-1-negative);
     --sbb-table-row-striped-color: var(--sbb-background-color-3-negative);
     --sbb-table-caption-color: var(--sbb-color-cement);
@@ -174,6 +186,39 @@ $theme: 'standard' !default;
     }
   }
 
+  .sbb-table--hover {
+    tbody tr:hover :is(th, td) {
+      background-color: var(--sbb-table-background-color-hover);
+      border-color: var(--sbb-table-border-color-hover);
+    }
+
+    :is(
+      // Address last row of thead if hover is on first row of tbody
+      thead:has(+ tbody tr:first-of-type:hover) tr:last-of-type :is(th, td),
+
+      // Address row before hovered row
+      tbody tr:has(+ tr:hover) :is(th, td)
+    ) {
+      border-block-end-color: var(--sbb-table-border-color-hover);
+    }
+  }
+
+  tr.sbb-table--selected {
+    :is(th, td) {
+      position: relative;
+
+      &::after {
+        content: '';
+        position: absolute;
+
+        // Lay the border over the cell border
+        inset: 0 0 calc(-1 * var(--sbb-table-border-width));
+        pointer-events: none;
+        border-block-end: var(--sbb-table-border-width) solid var(--sbb-table-border-color-selected);
+      }
+    }
+  }
+
   .sbb-table--theme-iron {
     --sbb-table-cell-color: var(--sbb-color-4);
 

package/table.js

@@ -1,6 +1 @@
-import { t as e } from "./table-wrapper.component-BzmzJJim.js";
-import "./table.pure.js";
-//#region src/elements/table.ts
-e.define();
-//#endregion
-export { e as SbbTableWrapperElement };
+import{SbbTableWrapperElement as e}from"./table.pure.js";export*from"./table.pure.js";e.define();

package/table.pure.js

@@ -1,2 +1,2 @@
-import { t as e } from "./table-wrapper.component-BzmzJJim.js";
-export { e as SbbTableWrapperElement };
+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}from"lit/decorators.js";import{SbbElement as s,SbbNegativeMixin as c,forceType as l,hostScrollbarStyles as u}from"./core.js";var d=`:host{--sbb-scrollbar-thumb-width:.5rem;--sbb-scrollbar-thumb-width-hover:var(--sbb-scrollbar-thumb-width);--sbb-scrollbar-width-firefox:auto;--sbb-scrollbar-track-color:var(--sbb-background-color-4);display:block;overflow:auto}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}::slotted(.sbb-table){width:100%}:host([negative]){--sbb-scrollbar-track-color:var(--sbb-background-color-4-negative)}
+`;let f=(()=>{let f=c(s),p,m=[],h=[];return class extends f{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(f[Symbol.metadata]??null):void 0;p=[l(),o({reflect:!0,type:Boolean})],e(this,null,p,{kind:`accessor`,name:`focusable`,static:!1,private:!1,access:{has:e=>`focusable`in e,get:e=>e.focusable,set:(e,t)=>{e.focusable=t}},metadata:t},m,h),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-table-wrapper`}static{this.role=`section`}static{this.styles=[u,a(d)]}#e=t(this,m,!1);get focusable(){return this.#e}set focusable(e){this.#e=e}constructor(){super(),t(this,h),this.addController(new n(this,{skipInitial:!0,callback:()=>this._checkHorizontalScrollbarOffset()})),this.addEventListener?.(`scroll`,()=>this._checkHorizontalScrollbarOffset(),{passive:!0})}connectedCallback(){super.connectedCallback(),this._updateScrollbarClass()}willUpdate(e){super.willUpdate(e),e.has(`focusable`)&&(this.focusable?this.hasAttribute(`tabindex`)||this.setAttribute(`tabindex`,`0`):this.removeAttribute(`tabindex`)),e.has(`negative`)&&this._updateScrollbarClass()}_updateScrollbarClass(){i||(this.negative?(this.classList.remove(`sbb-scrollbar-thick-track-visible`),this.classList.add(`sbb-scrollbar-thick-negative-track-visible`)):(this.classList.remove(`sbb-scrollbar-thick-negative-track-visible`),this.classList.add(`sbb-scrollbar-thick-track-visible`)))}_checkHorizontalScrollbarOffset(){let e=this._calculateScrollOffset();this.classList.remove(`sbb-table-wrapper-offset-none`,`sbb-table-wrapper-offset-left`,`sbb-table-wrapper-offset-right`,`sbb-table-wrapper-offset-both`),this.classList.add(`sbb-table-wrapper-offset-${e}`)}_calculateScrollOffset(){if(this.scrollWidth===this.offsetWidth)return`none`;let e=this.scrollLeft===0,t=this.scrollWidth-this.scrollLeft-this.offsetWidth<=1;return e?t?`none`:`right`:t?`left`:`both`}render(){return r`<slot></slot>`}}})();export{f as SbbTableWrapperElement};

package/tabs.js

@@ -1,9 +1 @@
-import { n as e, t } from "./tab-group.component-Dx0xldWI.js";
-import { t as n } from "./tab-label.component-C5HCrNFB.js";
-import { t as r } from "./tab-nav-bar.component-7j-RCq7p.js";
-import { t as i } from "./tab.component-C5xxMwwX.js";
-import { n as a, t as o } from "./styles-DGAxTLMz.js";
-import "./tabs.pure.js";
-i.define(), e.define(), n.define(), r.define();
-//#endregion
-export { t as SbbTabChangeEvent, i as SbbTabElement, e as SbbTabGroupElement, n as SbbTabLabelElement, r as SbbTabNavBarElement, o as tabGroupCommonStyles, a as tabLabelCommonStyles };
+import{SbbTabElement as e,SbbTabGroupElement as t,SbbTabLabelElement as n,SbbTabNavBarElement as r}from"./tabs.pure.js";export*from"./tabs.pure.js";e.define(),t.define(),n.define(),r.define();

package/tabs.pure.js

@@ -1,6 +1,32 @@
-import { n as e, t } from "./tab-group.component-Dx0xldWI.js";
-import { t as n } from "./tab-label.component-C5HCrNFB.js";
-import { t as r } from "./tab-nav-bar.component-7j-RCq7p.js";
-import { t as i } from "./tab.component-C5xxMwwX.js";
-import { n as a, t as o } from "./styles-DGAxTLMz.js";
-export { t as SbbTabChangeEvent, i as SbbTabElement, e as SbbTabGroupElement, n as SbbTabLabelElement, r as SbbTabNavBarElement, o as tabGroupCommonStyles, a as tabLabelCommonStyles };
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeController as n}from"@lit-labs/observers/resize-controller.js";import{html as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{ref as o}from"lit/directives/ref.js";import{SbbDisabledMixin as s,SbbElement as c,SbbNamedSlotListMixin as l,SbbPropertyWatcherController as u,forceType as d,getNextElementIndex as f,hostScrollbarStyles as p,isArrowKeyPressed as m,omitEmptyConverter as h,ɵstateController as g}from"./core.js";import{html as _,unsafeStatic as v}from"lit/static-html.js";import{SbbIconNameMixin as y}from"./icon.pure.js";var b=`:host{flex-direction:column;display:flex}:host(:not([size])){--sbb-tab-group-content-gap:var(--sbb-tab-group-content-gap-default)}:host([size=s]){--sbb-tab-group-content-gap:var(--sbb-tab-group-content-gap-size-s)}:host([size=l]){--sbb-tab-group-content-gap:var(--sbb-tab-group-content-gap-size-l)}:host([size=xl]){--sbb-tab-group-content-gap:var(--sbb-tab-group-content-gap-size-xl)}.sbb-tab-group,.sbb-tab-nav-bar{flex-wrap:wrap;display:flex}
+`,x=`:host{--sbb-tab-label-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));--sbb-tab-label-outline-border-radius-internal:calc(var(--sbb-tab-label-outline-border-radius) - var(--sbb-focus-outline-offset))}:host(:is(:is(:state(size-s),[state--size-s]),[size=s])){--sbb-tab-label-height:var(--sbb-size-element-xs);--sbb-tab-label-inline-padding:var(--sbb-spacing-responsive-xxxs);--sbb-tab-label-font-size:var(--sbb-text-font-size-s)}:host(:is(:is(:state(size-l),[state--size-l]),[size=l])){--sbb-tab-label-height:var(--sbb-size-element-m);--sbb-tab-label-inline-padding:var(--sbb-spacing-responsive-xs);--sbb-tab-label-font-size:var(--sbb-text-font-size-m)}:host(:is(:is(:state(size-xl),[state--size-xl]),[size=xl])){--sbb-tab-label-height:var(--sbb-size-element-m);--sbb-tab-label-inline-padding:var(--sbb-spacing-responsive-xs);--sbb-tab-label-font-size:var(--sbb-text-font-size-xl)}:host(sbb-tab-label),:host(sbb-tab-nav-bar) ::slotted(a){pointer-events:var(--sbb-tab-label-pointer-events,unset)}@media (forced-colors:active){:host(sbb-tab-label),:host(sbb-tab-nav-bar) ::slotted(a){--sbb-tab-label-color:ButtonText;--sbb-tab-label-amount-color:ButtonText}}:host(sbb-tab-nav-bar) ::slotted(a),:host(sbb-tab-label) .sbb-tab-label{align-items:center;gap:var(--sbb-tab-label-gap);color:var(--sbb-tab-label-color);padding-inline:var(--sbb-tab-label-inline-padding);min-height:var(--sbb-tab-label-height);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);font-size:var(--sbb-tab-label-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);font-weight:var(--sbb-tab-label-font-weight);text-decoration:var(--sbb-tab-label-text-decoration);margin:0;display:flex;position:relative}:host(sbb-tab-nav-bar) ::slotted(a):after,:host(sbb-tab-label) .sbb-tab-label:after{content:"";height:var(--sbb-tab-label-marker-thickness);background-color:var(--sbb-tab-label-color);scale:var(--sbb-tab-label-marker-scale,0);transition-duration:var(--sbb-tab-label-animation-duration);transition-timing-function:var(--sbb-tab-label-animation-easing);transition-property:scale,background-color;position:absolute;inset-block-end:0;inset-inline:0}:host(sbb-tab-nav-bar) .sbb-tab-nav-bar>[data-has-divider],:host(sbb-tab-label:is(:state(has-divider),[state--has-divider])){position:relative}:host(sbb-tab-nav-bar) .sbb-tab-nav-bar>[data-has-divider]:before,:host(sbb-tab-label:is(:state(has-divider),[state--has-divider])):before{content:"";width:var(--sbb-tab-group-width);height:var(--sbb-border-width-1x);background-color:var(--sbb-tab-label-line-color);position:absolute;inset-block-end:0;inset-inline-start:0}:host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),:host(sbb-tab-label[disabled]){--sbb-tab-label-cursor:unset;--sbb-tab-label-pointer-events:none;--sbb-tab-label-text-decoration:line-through}@media (forced-colors:active){:host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),:host(sbb-tab-label[disabled]){--sbb-tab-label-color:GrayText;--sbb-tab-label-amount-color:GrayText}}:host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),:host(sbb-tab-label[active]:not([disabled])){--sbb-tab-label-color:var(--sbb-color-3);--sbb-tab-label-cursor:unset;--sbb-tab-label-pointer-events:none;--sbb-tab-label-marker-scale:1}@media (forced-colors:active){:host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),:host(sbb-tab-label[active]:not([disabled])){--sbb-tab-label-color:ButtonText;--sbb-tab-label-amount-color:ButtonText}}@media (any-hover:hover){:host(sbb-tab-nav-bar) ::slotted(a:hover:not(.sbb-disabled)),:host(sbb-tab-label:hover:not([disabled])){--sbb-tab-label-marker-scale:1}}:host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),:host(sbb-tab-label:active){--sbb-tab-label-color:var(--sbb-color-3)}@media (forced-colors:active){:host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),:host(sbb-tab-label:active){--sbb-tab-label-color:ButtonText;--sbb-tab-label-amount-color:ButtonText}}:host(sbb-tab-nav-bar) ::slotted(a:focus-visible),:host(sbb-tab-label:focus-visible) .sbb-tab-label{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);border-radius:var(--sbb-tab-label-outline-border-radius-internal)}
+`;const S=i(b),C=i(x);var w=`:host{--sbb-tab-group-animation-duration:0s;gap:var(--sbb-tab-group-content-gap)}:host(:is(:state(initialized),[state--initialized])){--sbb-tab-group-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-4x))}.sbb-tab-group-content{height:var(--sbb-tab-content-height);transition:height var(--sbb-tab-group-animation-duration) var(--sbb-animation-easing)}:host([fixed-height]) ::slotted(sbb-tab){height:100%;overflow:auto}
+`,T=class extends Event{get activeIndex(){return this._activeIndex}get activeTabLabel(){return this._activeTabLabel}get activeTab(){return this._activeTab}get previousIndex(){return this._previousIndex}get previousTabLabel(){return this._previousTabLabel}get previousTab(){return this._previousTab}constructor({activeIndex:e,activeTabLabel:t,activeTab:n,previousIndex:r,previousTabLabel:i,previousTab:a}){super(`tabchange`,{bubbles:!0,composed:!0}),this._activeIndex=e,this._activeTabLabel=t,this._activeTab=n,this._previousIndex=r,this._previousTabLabel=i,this._previousTab=a}};let E=(()=>{let s=c,l,u=[],p=[],h,_=[],v=[],y,b=[],x=[];return class extends s{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(s[Symbol.metadata]??null):void 0;l=[a({reflect:!0})],h=[d(),a({attribute:`initial-selected-index`,type:Number})],y=[d(),a({attribute:`fixed-height`,type:Boolean,reflect:!0})],e(this,null,l,{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},u,p),e(this,null,h,{kind:`accessor`,name:`initialSelectedIndex`,static:!1,private:!1,access:{has:e=>`initialSelectedIndex`in e,get:e=>e.initialSelectedIndex,set:(e,t)=>{e.initialSelectedIndex=t}},metadata:t},_,v),e(this,null,y,{kind:`accessor`,name:`fixedHeight`,static:!1,private:!1,access:{has:e=>`fixedHeight`in e,get:e=>e.fixedHeight,set:(e,t)=>{e.fixedHeight=t}},metadata:t},b,x),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-tab-group`}static{this.styles=[S,i(w)]}static{this.events={tabchange:`tabchange`}}#e;get size(){return this.#e}set size(e){this.#e=e}#t;get initialSelectedIndex(){return this.#t}set initialSelectedIndex(e){this.#t=e}#n;get fixedHeight(){return this.#n}set fixedHeight(e){this.#n=e}get labels(){return Array.from(this.children??[]).filter(e=>/^sbb-tab-label$/u.test(e.localName))}get tabs(){return Array.from(this.children??[]).filter(e=>/^sbb-tab$/u.test(e.localName))}constructor(){super(),this._tabGroupResizeObserver=new n(this,{target:null,skipInitial:!0,callback:()=>this._onTabGroupElementResize()}),this.#e=t(this,u,null),this.#t=(t(this,p),t(this,_,0)),this.#n=(t(this,v),t(this,b,!1)),t(this,x),this.addEventListener?.(`keydown`,e=>this._handleKeyDown(e))}firstUpdated(e){super.firstUpdated(e),this.labels.forEach(e=>e.linkToTab()),this._initSelection(),Promise.resolve().then(()=>this.internals.states.add(`initialized`)),this._tabGroupResizeObserver.observe(this._tabGroupElement)}disableTab(e){this.labels[e]&&(this.labels[e].disabled=!0)}enableTab(e){this.labels[e]&&(this.labels[e].disabled=!1)}activateTab(e){this.labels[e]?.activate()}_enabledTabs(){return this.labels.filter(e=>(customElements.upgrade(e),!e.disabled))}_onContentSlotChange(){this._contentSlotChangeDebounceId&&clearTimeout(this._contentSlotChangeDebounceId),this._contentSlotChangeDebounceId=setTimeout(()=>{this.labels.forEach(e=>e.linkToTab()),this.labels.find(e=>e.active)?.activate()},150)}_onLabelSlotChange(){this.labels.forEach(e=>e.linkToTab()),this._ensureActiveTab()}_ensureActiveTab(){this.matches?.(`:is(:state(initialized),[state--initialized])`)&&!this.labels.some(e=>e.active)&&this._initSelection()}_initSelection(){let e=this.labels[this.initialSelectedIndex];if(e&&(customElements.upgrade(e),this.initialSelectedIndex>=0&&this.initialSelectedIndex<this.labels.length&&!e.disabled)){e.activate();return}this._enabledTabs()[0]?.activate()}_onTabGroupElementResize(){let e=this.labels;e.forEach(t=>{g(t)?.toggle(`has-divider`,t===e[0]||t.offsetLeft===e[0].offsetLeft)}),this.style.setProperty(`--sbb-tab-group-width`,`${this._tabGroupElement.clientWidth}px`)}_handleKeyDown(e){let t=this._enabledTabs();if(!(!t||e.target!==this&&e.target.parentElement!==this)&&m(e)){let n=f(e,t.findIndex(e=>e.active),t.length);t[n]?.activate(),t[n]?.focus(),e.preventDefault()}}setTabContentHeight(e){this.style.setProperty(`--sbb-tab-content-height`,`${e}px`)}render(){return r`
+      <div
+        class="sbb-tab-group"
+        role="tablist"
+        ${o(e=>this._tabGroupElement=e)}
+      >
+        <slot name="tab-bar" @slotchange=${this._onLabelSlotChange}></slot>
+      </div>
+      ${this.fixedHeight?r`<slot @slotchange=${this._onContentSlotChange}></slot>`:r`
+              <div class="sbb-tab-group-content">
+                <slot @slotchange=${this._onContentSlotChange}></slot>
+              </div>
+            `}
+    `}}})();var D=`:host{max-width:100%;display:inline-block;outline:none!important}.sbb-tab-label{cursor:var(--sbb-tab-label-cursor);user-select:none;-webkit-tap-highlight-color:transparent}.sbb-tab-label__icon{flex-shrink:0;display:flex}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-tab-label__icon{display:none}.sbb-tab-label__text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-tab-label__text{display:none}.sbb-tab-label__amount{color:var(--sbb-tab-label-amount-color);text-decoration:var(--sbb-tab-label-text-decoration);margin:0;font-weight:400}:host(:not(:is(:state(slotted-amount),[state--slotted-amount]),[amount])) .sbb-tab-label__amount{display:none}
+`;let O=(()=>{let n=s(y(c)),r,o=[],l=[],f,p=[],m=[],g,b=[],x=[];return class extends n{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(n[Symbol.metadata]??null):void 0;r=[a()],f=[d(),a({reflect:!0,type:Boolean})],g=[d(),a({reflect:!0,converter:h})],e(this,null,r,{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:t},o,l),e(this,null,f,{kind:`accessor`,name:`active`,static:!1,private:!1,access:{has:e=>`active`in e,get:e=>e.active,set:(e,t)=>{e.active=t}},metadata:t},p,m),e(this,null,g,{kind:`accessor`,name:`amount`,static:!1,private:!1,access:{has:e=>`amount`in e,get:e=>e.amount,set:(e,t)=>{e.amount=t}},metadata:t},b,x),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-tab-label`}static{this.role=`tab`}static{this.styles=[C,i(D)]}#e;get level(){return this.#e}set level(e){this.#e=e}#t;get active(){return this.#t}set active(e){this.#t=e}#n;get amount(){return this.#n}set amount(e){this.#n=e}get tab(){return this.nextElementSibling?.localName===`sbb-tab`?this.nextElementSibling:null}get group(){return this.closest(`sbb-tab-group`)}constructor(){super(),this._selected=!1,this._previousSize=null,this.#e=t(this,o,`1`),this.#t=(t(this,l),t(this,p,!1)),this.#n=(t(this,m),t(this,b,``)),t(this,x),this.addEventListener(`click`,()=>this.activate()),this.addController(new u(this,()=>this.group,{size:e=>{this._previousSize&&this.internals.states.delete(`size-${this._previousSize}`),this._previousSize=e.size??null,this._previousSize&&this.internals.states.add(`size-${this._previousSize}`)}}))}connectedCallback(){super.connectedCallback(),this.slot=`tab-bar`,this.tabIndex=this.active?0:-1}willUpdate(e){super.willUpdate(e),e.has(`active`)&&(this.internals.ariaSelected=`${this.active}`,this.active&&!this.disabled?this.activate():this.deactivate()),e.has(`disabled`)&&this.disabled&&(this.tabIndex=-1,this.active&&(this.deactivate(),this.group?.activateTab(0)))}deactivate(){this.active=!1,this.tab?.deactivate(),this._selected=!1,this.tabIndex=-1}activate(){if(this.disabled)return;let e=this.group?.labels||[],t=e.find(e=>e._selected);if(t!==this){t?.deactivate(),this.active=!0,this.tab?.activate(),this._selected=!0,this.tabIndex=0,this.tab?.dispatchEvent(new Event(`active`,{bubbles:!0,composed:!0}));let n={activeIndex:e.findIndex(e=>e===this),activeTabLabel:this,activeTab:this.tab,previousIndex:e.findIndex(e=>e===t),previousTabLabel:t,previousTab:t?.tab};this.group?.dispatchEvent(new T(n))}}linkToTab(){this.tab&&(this.internals.ariaControlsElements=[this.tab])}render(){let e=`h${Number(this.level)<7?this.level:`1`}`;return _`
+        <${v(e)} class="sbb-tab-label">
+          <span class="sbb-tab-label__icon">
+            ${this.renderIconSlot()}
+          </span>
+          <span class="sbb-tab-label__text">
+            <slot></slot>
+          </span>
+          <p class="sbb-tab-label__amount">
+            <slot name="amount">${this.amount}</slot>
+          </p>
+        </${v(e)}>
+    `}}})();var k=`:host{margin-block-end:var(--sbb-tab-group-content-gap)}
+`;let A=(()=>{let r=l(c),o,s=[],u=[];return class extends r{constructor(){super(...arguments),this.listChildLocalNames=[`a`],this.#e=t(this,s,null),this._resizeController=(t(this,u),new n(this,{target:null,callback:()=>this._onTabGroupElementResize()})),this._listElement=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;o=[a({reflect:!0})],e(this,null,o,{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},s,u),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-tab-nav-bar`}static{this.styles=[C,S,i(k)]}static{this.role=`navigation`}#e;get size(){return this.#e}set size(e){this.#e=e}_onTabGroupElementResize(){this.listChildren.forEach(e=>{e.assignedSlot?.parentElement?.toggleAttribute(`data-has-divider`,e===this.listChildren[0]||e.offsetLeft===this.listChildren[0].offsetLeft)}),this.style.setProperty(`--sbb-tab-group-width`,`${this._listElement?.clientWidth}px`)}firstUpdated(e){super.firstUpdated(e),this._updateWidthObserver(),this.shadowRoot?.addEventListener(`slotchange`,()=>this._updateWidthObserver())}_updateWidthObserver(){let e=this.shadowRoot?.querySelector(`.${this.localName}`);e&&this._listElement!==e?(this._listElement&&this._resizeController.unobserve(this._listElement),this._listElement=e,this._resizeController.observe(e)):!e&&this._listElement&&(this._resizeController.unobserve(this._listElement),this._listElement=null)}render(){return this.renderList()}}})();var j=`:host:after,:host:before{content:"\xA0";visibility:hidden;height:0;display:block;overflow:hidden}:host(:focus-visible){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(:not(:is(:state(active),[state--active]))){display:none!important}:host(:is(:state(active),[state--active])){opacity:1;transition-duration:var(--sbb-tab-group-animation-duration);transition-delay:var(--sbb-tab-group-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-behavior:allow-discrete;transition-property:opacity,height;display:block}@starting-style{:host(:is(:state(active),[state--active])){opacity:0}}
+`,M=class extends c{constructor(){super(...arguments),this._tabContentResizeObserver=new n(this,{target:null,skipInitial:!0,callback:()=>this._onTabContentElementResize()})}static{this.elementName=`sbb-tab`}static{this.role=`tabpanel`}static{this.styles=[p,i(j)]}static{this.events={active:`active`}}get label(){return this.previousElementSibling?.localName===`sbb-tab-label`?this.previousElementSibling:null}get group(){return this.closest(`sbb-tab-group`)}connectedCallback(){super.connectedCallback(),this.tabIndex=0,this.classList.add(`sbb-scrollbar`)}activate(){this.internals.states.add(`active`),this._tabContentResizeObserver.observe(this)}deactivate(){this._tabContentResizeObserver.unobserve(this),this.internals.states.delete(`active`)}_onTabContentElementResize(){this.group?.setTabContentHeight(Math.floor(this.getBoundingClientRect().height))}render(){return r`<slot></slot>`}};export{T as SbbTabChangeEvent,M as SbbTabElement,E as SbbTabGroupElement,O as SbbTabLabelElement,A as SbbTabNavBarElement,S as tabGroupCommonStyles,C as tabLabelCommonStyles};

package/tag.js

@@ -1,6 +1 @@
-import { t as e } from "./tag-group.component-CJwbkP70.js";
-import { t } from "./tag.component-r8diGGP-.js";
-import "./tag.pure.js";
-t.define(), e.define();
-//#endregion
-export { t as SbbTagElement, e as SbbTagGroupElement };
+import{SbbTagElement as e,SbbTagGroupElement as t}from"./tag.pure.js";export*from"./tag.pure.js";e.define(),t.define();