@sbb-esta/lyne-elements 1.5.0 → 1.7.0

package/button/mini-button-group/index.d.ts

@@ -0,0 +1,2 @@
+export * from './mini-button-group.js';
+//# sourceMappingURL=index.d.ts.map

package/button/mini-button-group/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/mini-button-group/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC"}

package/button/mini-button-group/mini-button-group.d.ts

@@ -0,0 +1,28 @@
+import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
+import { SbbMiniButtonElement } from '../mini-button/mini-button.js';
+export type SbbMiniButtonGroupSize = 's' | 'm' | 'l' | 'xl';
+declare const SbbMiniButtonGroupElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNegativeMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNamedSlotListMixinType<SbbMiniButtonElement>> & typeof LitElement;
+/**
+ * Display a list of `sbb-mini-button` elements in a horizontal container,
+ * possibly separated by a `sbb-divider` component.
+ *
+ * @slot - Use the unnamed slot to add `sbb-mini-button` and `sbb-divider` elements.
+ */
+export declare class SbbMiniButtonGroupElement extends SbbMiniButtonGroupElement_base {
+    static styles: CSSResultGroup;
+    protected readonly listChildLocalNames: string[];
+    /** This will be forwarded as aria-label to the list that contains the buttons. */
+    accessibilityLabel?: string;
+    /** Size variant, either s, m, l or xl. */
+    size: SbbMiniButtonGroupSize;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    private _proxyNegative;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-mini-button-group': SbbMiniButtonGroupElement;
+    }
+}
+export {};
+//# sourceMappingURL=mini-button-group.d.ts.map

package/button/mini-button-group/mini-button-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mini-button-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/mini-button-group/mini-button-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAI1E,MAAM,MAAM,sBAAsB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;;AAE5D;;;;;GAKG;AACH,qBACa,yBAA0B,SAAQ,8BAE9C;IACC,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,mBAA4B,mBAAmB,WAAsC;IAErF,kFAAkF;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAEnF,0CAA0C;IACN,IAAI,EAAE,sBAAsB,CAAO;cAEpD,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5E,OAAO,CAAC,cAAc;cAMH,MAAM,IAAI,cAAc;CAQ5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,uBAAuB,EAAE,yBAAyB,CAAC;KACpD;CACF"}

package/button/mini-button-group.d.ts

@@ -0,0 +1,2 @@
+export * from './mini-button-group/mini-button-group.js';
+//# sourceMappingURL=mini-button-group.d.ts.map

package/button/mini-button-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mini-button-group.d.ts","sourceRoot":"","sources":["../../../src/elements/button/mini-button-group.ts"],"names":[],"mappings":"AAAA,cAAc,0CAA0C,CAAC"}

package/button/mini-button-group.js

@@ -0,0 +1,47 @@
+import { css as u, LitElement as d, html as p } from "lit";
+import { property as l, customElement as g } from "lit/decorators.js";
+import { SbbNegativeMixin as m, SbbNamedSlotListMixin as c } from "../core/mixins.js";
+const v = u`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-mini-button-group-background: var(--sbb-color-white);--sbb-mini-button-group-border-color: var(--sbb-color-cloud);--sbb-mini-button-group-border-width: var(--sbb-border-width-2x);--sbb-mini-button-group-border: var(--sbb-mini-button-group-border-width) solid var(--sbb-mini-button-group-border-color);--sbb-mini-button-group-gap: var(--sbb-spacing-fixed-2x);--sbb-mini-button-group-min-height: var(--sbb-size-element-s);--sbb-mini-button-group-padding-inline: var(--sbb-spacing-fixed-3x)}:host([negative]){--sbb-mini-button-group-background: var(--sbb-color-midnight);--sbb-mini-button-group-border-color: var(--sbb-color-anthracite);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}:host([size=s]){--sbb-mini-button-group-min-height: var(--sbb-size-element-xs);--sbb-mini-button-group-padding-inline: var(--sbb-spacing-fixed-2x)}:host([size=l]){--sbb-mini-button-group-min-height: var(--sbb-size-element-m)}:host([size=xl]){--sbb-mini-button-group-min-height: var(--sbb-size-element-l);--sbb-mini-button-group-padding-inline: var(--sbb-spacing-fixed-4x)}::slotted(:is(sbb-mini-button,sbb-divider)){display:flex}::slotted(sbb-divider){--sbb-divider-border-width: var(--sbb-border-width-1x);padding-block:var(--sbb-spacing-fixed-1x);padding-inline:var(--sbb-spacing-fixed-1x);height:var(--sbb-size-icon-ui-small)}.sbb-mini-button-group{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-wrap:nowrap;align-items:center;gap:var(--sbb-mini-button-group-gap);width:fit-content;min-height:var(--sbb-mini-button-group-min-height);background-color:var(--sbb-mini-button-group-background);border:var(--sbb-mini-button-group-border);border-radius:var(--sbb-border-radius-infinity);padding-inline:calc(var(--sbb-mini-button-group-padding-inline) - var(--sbb-mini-button-group-border-width))}`;
+var h = Object.defineProperty, f = Object.getOwnPropertyDescriptor, a = (i, t, o, e) => {
+  for (var b = e > 1 ? void 0 : e ? f(t, o) : t, n = i.length - 1, s; n >= 0; n--)
+    (s = i[n]) && (b = (e ? s(t, o, b) : s(b)) || b);
+  return e && b && h(t, o, b), b;
+};
+let r = class extends m(
+  c(d)
+) {
+  constructor() {
+    super(...arguments), this.listChildLocalNames = ["sbb-mini-button", "sbb-divider"], this.size = "m";
+  }
+  willUpdate(i) {
+    super.willUpdate(i), i.has("negative") && this._proxyNegative();
+  }
+  _proxyNegative() {
+    var i;
+    (i = this.querySelectorAll) == null || i.call(
+      this,
+      "sbb-divider, sbb-mini-button"
+    ).forEach((t) => t.negative = this.negative);
+  }
+  render() {
+    return p`
+      ${this.renderList(
+      { ariaLabel: this.accessibilityLabel },
+      { localNameVisualOnly: ["sbb-divider"] }
+    )}
+    `;
+  }
+};
+r.styles = v;
+a([
+  l({ attribute: "accessibility-label" })
+], r.prototype, "accessibilityLabel", 2);
+a([
+  l({ reflect: !0 })
+], r.prototype, "size", 2);
+r = a([
+  g("sbb-mini-button-group")
+], r);
+export {
+  r as SbbMiniButtonGroupElement
+};

package/button/secondary-button/secondary-button.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbSecondaryButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'secondary' variant.

package/button/secondary-button-link/secondary-button-link.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbSecondaryButtonLinkElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'primary' variant, which will behave as a link.

package/button/secondary-button-static/secondary-button-static.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core/base-elements.js';
-
 declare const SbbSecondaryButtonStaticElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'secondary' variant.

package/button/tertiary-button/tertiary-button.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbTertiaryButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'tertiary' variant.

package/button/tertiary-button-link/tertiary-button-link.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbTertiaryButtonLinkElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'tertiary' variant, which will behave as a link.

package/button/tertiary-button-static/tertiary-button-static.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core/base-elements.js';
-
 declare const SbbTertiaryButtonStaticElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'tertiary' variant.

package/button/transparent-button/transparent-button.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbTransparentButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'transparent' variant.

package/button/transparent-button-link/transparent-button-link.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbTransparentButtonLinkElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'transparent' variant, which will behave as a link.

package/button/transparent-button-static/transparent-button-static.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core/base-elements.js';
-
 declare const SbbTransparentButtonStaticElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'transparent' variant.

package/button.d.ts

@@ -3,6 +3,7 @@ export * from './button/secondary-button.js';
 export * from './button/tertiary-button.js';
 export * from './button/transparent-button.js';
 export * from './button/mini-button.js';
+export * from './button/mini-button-group.js';
 export * from './button/button-link.js';
 export * from './button/secondary-button-link.js';
 export * from './button/tertiary-button-link.js';

package/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/elements/button.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,mCAAmC,CAAC;AAClD,cAAc,kCAAkC,CAAC;AACjD,cAAc,qCAAqC,CAAC;AACpD,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qCAAqC,CAAC;AACpD,cAAc,oCAAoC,CAAC;AACnD,cAAc,uCAAuC,CAAC;AACtD,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/elements/button.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,yBAAyB,CAAC;AACxC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,yBAAyB,CAAC;AACxC,cAAc,mCAAmC,CAAC;AAClD,cAAc,kCAAkC,CAAC;AACjD,cAAc,qCAAqC,CAAC;AACpD,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qCAAqC,CAAC;AACpD,cAAc,oCAAoC,CAAC;AACnD,cAAc,uCAAuC,CAAC;AACtD,cAAc,oBAAoB,CAAC"}

package/button.js

@@ -3,6 +3,7 @@ export * from "./button/secondary-button.js";
 export * from "./button/tertiary-button.js";
 export * from "./button/transparent-button.js";
 export * from "./button/mini-button.js";
+export * from "./button/mini-button-group.js";
 export * from "./button/button-link.js";
 export * from "./button/secondary-button-link.js";
 export * from "./button/tertiary-button-link.js";

package/calendar/calendar.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
 import { SbbDateLike } from '../core/interfaces.js';
-
 export interface Day {
     value: string;
     dayValue: string;

package/calendar.js

@@ -12,7 +12,7 @@ import { SbbHydrationMixin as B } from "./core/mixins.js";
 import "./button/secondary-button.js";
 import "./icon.js";
 import "./screen-reader-only.js";
-const q = Y`*,:before,:after{box-sizing:border-box}:host{--sbb-calendar-cell-size: 2.5rem;--sbb-calendar-hover-shift: .0625rem;--sbb-calendar-wide-cell-size: 4.375rem;--sbb-calendar-cell-disabled-color: var(--sbb-color-granite);--sbb-calendar-header-color: var(--sbb-color-granite);--sbb-calendar-cell-background-color: transparent;--sbb-calendar-cell-padding: .125rem;--sbb-calendar-cell-color: var(--sbb-color-charcoal);--sbb-calendar-cell-selected-color: var(--sbb-color-white);--sbb-calendar-cell-selected-background-color: var(--sbb-color-charcoal);--sbb-calendar-cell-disabled-height: .09375rem;--sbb-calendar-cell-disabled-width: 1.59375rem;--sbb-calendar-cell-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-calendar-cell-transition-easing-function: var(--sbb-animation-easing);--sbb-calendar-tables-gap: var(--sbb-spacing-fixed-10x);--sbb-calendar-table-animation-shift: .00625rem;--sbb-calendar-table-animation-duration: .1ms;--sbb-calendar-table-column-spaces: 12;--sbb-calendar-control-view-change-height: 2.75rem;--sbb-calendar-control-view-change-color: var(--sbb-color-charcoal);--sbb-calendar-control-view-change-background: var(--sbb-color-white);display:block;width:max-content}@media (min-width: 22.5rem){:host{--sbb-calendar-cell-size: 2.75rem;--sbb-calendar-wide-cell-size: 4.8125rem;--sbb-calendar-control-view-change-height: 3rem}}.sbb-calendar__wrapper{width:100%;display:block;transition-duration:var(--sbb-calendar-cell-transition-duration)}.sbb-calendar__controls{width:100%;display:inline-flex;align-items:center;gap:var(--sbb-spacing-fixed-2x);margin-block-end:var(--sbb-spacing-fixed-4x)}.sbb-calendar__controls-month{width:100%;display:flex;gap:var(--sbb-calendar-tables-gap)}#sbb-calendar__controls-previous,#sbb-calendar__controls-next{-webkit-tap-highlight-color:transparent}.sbb-calendar__controls-change-date{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;align-items:center;margin:auto;height:var(--sbb-calendar-control-view-change-height);text-transform:capitalize;cursor:pointer;padding-inline:var(--sbb-spacing-fixed-5x) var(--sbb-spacing-fixed-2x);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-calendar-control-view-change-background);color:var(--sbb-calendar-control-view-change-color);transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color,padding-block-end}.sbb-calendar__controls-change-date:disabled{--sbb-calendar-control-view-change-background: var(--sbb-color-milk);--sbb-calendar-control-view-change-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__controls-change-date:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch]){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-1x)}@media (any-hover: hover){.sbb-calendar__controls-change-date:not(:active,:disabled):hover{padding-block-end:var(--sbb-calendar-hover-shift)}}.sbb-calendar__controls-change-date:not(:disabled):active{--sbb-calendar-control-view-change-background: var(--sbb-color-milk)}.sbb-calendar__table-month-view,.sbb-calendar__table-year-view{--sbb-calendar-table-column-spaces: 6}.sbb-calendar__table-container{display:flex;gap:var(--sbb-calendar-tables-gap);--sbb-calendar-min-width: calc(7 * var(--sbb-calendar-cell-size));--sbb-calendar-overflow: calc(100% - var(--sbb-calendar-min-width));--sbb-calendar-start-offset: min( 0px, -1 * (var(--sbb-calendar-overflow) / var(--sbb-calendar-table-column-spaces)) );--sbb-calendar-margin: var(--sbb-calendar-start-offset);margin-inline:var(--sbb-calendar-margin)}:host([data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 2 * 7 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) );--sbb-calendar-margin: calc(.5 * var(--sbb-calendar-start-offset))}.sbb-calendar__table{width:100%;border-collapse:collapse;height:max-content;animation-name:show;animation-duration:var(--sbb-calendar-table-animation-duration)}.sbb-calendar__table.sbb-calendar__table-hide{--sbb-calendar-cell-transition-duration: 0ms;animation-name:hide;animation-duration:var(--sbb-calendar-table-animation-duration)}:host(:not([data-wide])) .sbb-calendar__table{min-width:100%}.sbb-calendar__table-header{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-calendar-header-color);width:var(--sbb-calendar-cell-size);padding:0;padding-block-end:var(--sbb-spacing-fixed-4x);text-align:center}.sbb-calendar__table-data{position:relative;padding:0;text-align:center}.sbb-calendar__cell{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);height:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-cell-color);cursor:pointer;position:relative;z-index:0}.sbb-calendar__cell:before{content:"";position:absolute;inset:var(--sbb-calendar-cell-padding);background-color:var(--sbb-calendar-cell-background-color);border-radius:50%;z-index:-1;transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color}@media (any-hover: hover){.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover{--sbb-calendar-cell-background-color: var(--sbb-color-milk);padding-block-end:var(--sbb-calendar-hover-shift)}}@media (any-hover: hover) and (forced-colors: active){.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}}.sbb-calendar__cell:disabled{--sbb-calendar-cell-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__cell:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active{--sbb-calendar-cell-background-color: var(--sbb-color-cloud)}@media (forced-colors: active){.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}}.sbb-calendar__day{border-radius:50%;width:var(--sbb-calendar-cell-size)}.sbb-calendar__day:before{border-radius:50%}.sbb-calendar__pill{width:var(--sbb-calendar-wide-cell-size);border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__pill:before{border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__crossed-out:after{content:"";height:var(--sbb-calendar-cell-disabled-height);width:var(--sbb-calendar-cell-disabled-width);position:absolute;background-color:var(--sbb-calendar-cell-disabled-color);top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg)}.sbb-calendar__cell-current{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700}.sbb-calendar__selected{--sbb-calendar-cell-color: var(--sbb-calendar-cell-selected-color);--sbb-calendar-cell-background-color: var(--sbb-calendar-cell-selected-background-color)}@media (forced-colors: active){.sbb-calendar__selected{--sbb-calendar-cell-background-color: ButtonText !important}}@keyframes show{0%{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}to{opacity:1;transform:translateY(0)}}@keyframes hide{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}}`;
+const q = Y`*,:before,:after{box-sizing:border-box}:host{display:block;width:max-content;--sbb-calendar-cell-size: 2.5rem;--sbb-calendar-hover-shift: .0625rem;--sbb-calendar-wide-cell-size: 4.375rem;--sbb-calendar-cell-disabled-color: var(--sbb-color-granite);--sbb-calendar-header-color: var(--sbb-color-granite);--sbb-calendar-cell-background-color: transparent;--sbb-calendar-cell-padding: .125rem;--sbb-calendar-cell-color: var(--sbb-color-charcoal);--sbb-calendar-cell-selected-color: var(--sbb-color-white);--sbb-calendar-cell-selected-background-color: var(--sbb-color-charcoal);--sbb-calendar-cell-disabled-height: .09375rem;--sbb-calendar-cell-disabled-width: 1.59375rem;--sbb-calendar-cell-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-calendar-cell-transition-easing-function: var(--sbb-animation-easing);--sbb-calendar-tables-gap: var(--sbb-spacing-fixed-10x);--sbb-calendar-table-animation-shift: .00625rem;--sbb-calendar-table-animation-duration: .1ms;--sbb-calendar-table-column-spaces: 12;--sbb-calendar-control-view-change-height: 2.75rem;--sbb-calendar-control-view-change-color: var(--sbb-color-charcoal);--sbb-calendar-control-view-change-background: var(--sbb-color-white)}@media (min-width: 22.5rem){:host{--sbb-calendar-cell-size: 2.75rem;--sbb-calendar-wide-cell-size: 4.8125rem;--sbb-calendar-control-view-change-height: 3rem}}.sbb-calendar__wrapper{width:100%;display:block;transition-duration:var(--sbb-calendar-cell-transition-duration)}.sbb-calendar__controls{width:100%;display:inline-flex;align-items:center;gap:var(--sbb-spacing-fixed-2x);margin-block-end:var(--sbb-spacing-fixed-4x)}.sbb-calendar__controls-month{width:100%;display:flex;gap:var(--sbb-calendar-tables-gap)}#sbb-calendar__controls-previous,#sbb-calendar__controls-next{-webkit-tap-highlight-color:transparent}.sbb-calendar__controls-change-date{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;align-items:center;margin:auto;height:var(--sbb-calendar-control-view-change-height);text-transform:capitalize;cursor:pointer;padding-inline:var(--sbb-spacing-fixed-5x) var(--sbb-spacing-fixed-2x);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-calendar-control-view-change-background);color:var(--sbb-calendar-control-view-change-color);transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color,padding-block-end}.sbb-calendar__controls-change-date:disabled{--sbb-calendar-control-view-change-background: var(--sbb-color-milk);--sbb-calendar-control-view-change-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__controls-change-date:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch]){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-1x)}@media (any-hover: hover){.sbb-calendar__controls-change-date:not(:active,:disabled):hover{padding-block-end:var(--sbb-calendar-hover-shift)}}.sbb-calendar__controls-change-date:not(:disabled):active{--sbb-calendar-control-view-change-background: var(--sbb-color-milk)}.sbb-calendar__table-month-view,.sbb-calendar__table-year-view{--sbb-calendar-table-column-spaces: 6}.sbb-calendar__table-container{display:flex;gap:var(--sbb-calendar-tables-gap);margin-inline:var(--sbb-calendar-margin);--sbb-calendar-min-width: calc(7 * var(--sbb-calendar-cell-size));--sbb-calendar-overflow: calc(100% - var(--sbb-calendar-min-width));--sbb-calendar-start-offset: min( 0px, -1 * (var(--sbb-calendar-overflow) / var(--sbb-calendar-table-column-spaces)) );--sbb-calendar-margin: var(--sbb-calendar-start-offset)}:host([data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 2 * 7 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) );--sbb-calendar-margin: calc(.5 * var(--sbb-calendar-start-offset))}.sbb-calendar__table{width:100%;border-collapse:collapse;height:max-content;animation-name:show;animation-duration:var(--sbb-calendar-table-animation-duration)}.sbb-calendar__table.sbb-calendar__table-hide{--sbb-calendar-cell-transition-duration: 0ms;animation-name:hide;animation-duration:var(--sbb-calendar-table-animation-duration)}:host(:not([data-wide])) .sbb-calendar__table{min-width:100%}.sbb-calendar__table-header{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-calendar-header-color);width:var(--sbb-calendar-cell-size);padding:0;padding-block-end:var(--sbb-spacing-fixed-4x);text-align:center}.sbb-calendar__table-data{position:relative;padding:0;text-align:center}.sbb-calendar__cell{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);height:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-cell-color);cursor:pointer;position:relative;z-index:0}.sbb-calendar__cell:before{content:"";position:absolute;inset:var(--sbb-calendar-cell-padding);background-color:var(--sbb-calendar-cell-background-color);border-radius:50%;z-index:-1;transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color}@media (any-hover: hover){.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover{--sbb-calendar-cell-background-color: var(--sbb-color-milk);padding-block-end:var(--sbb-calendar-hover-shift)}}@media (any-hover: hover) and (forced-colors: active){.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}}.sbb-calendar__cell:disabled{--sbb-calendar-cell-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__cell:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active{--sbb-calendar-cell-background-color: var(--sbb-color-cloud)}@media (forced-colors: active){.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}}.sbb-calendar__day{border-radius:50%;width:var(--sbb-calendar-cell-size)}.sbb-calendar__day:before{border-radius:50%}.sbb-calendar__pill{width:var(--sbb-calendar-wide-cell-size);border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__pill:before{border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__crossed-out:after{content:"";height:var(--sbb-calendar-cell-disabled-height);width:var(--sbb-calendar-cell-disabled-width);position:absolute;background-color:var(--sbb-calendar-cell-disabled-color);top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg)}.sbb-calendar__cell-current{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700}.sbb-calendar__selected{--sbb-calendar-cell-color: var(--sbb-calendar-cell-selected-color);--sbb-calendar-cell-background-color: var(--sbb-calendar-cell-selected-background-color)}@media (forced-colors: active){.sbb-calendar__selected{--sbb-calendar-cell-background-color: ButtonText !important}}@keyframes show{0%{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}to{opacity:1;transform:translateY(0)}}@keyframes hide{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}}`;
 var K = Object.defineProperty, H = Object.getOwnPropertyDescriptor, b = (e, t, a, r) => {
   for (var s = r > 1 ? void 0 : r ? H(t, a) : t, i = e.length - 1, n; i >= 0; i--)
     (n = e[i]) && (s = (r ? n(t, a, s) : n(s)) || s);

package/card/card/card.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
-
 /**
  * It displays content related to a single subject.
  *

package/card/card-badge/card-badge.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
-
 /**
  * It displays content within a badge.
  *

package/card/card-button/card-button.d.ts

@@ -1,5 +1,4 @@
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbCardButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbCardActionCommonElementMixinType> & typeof SbbButtonBaseElement;
 /**
  * It turns the `sbb-card` into a button element.

package/card/card-link/card-link.d.ts

@@ -1,5 +1,4 @@
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbCardLinkElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbCardActionCommonElementMixinType> & typeof SbbLinkBaseElement;
 /**
  * It turns the `sbb-card` into a link element.

package/card/card.js

@@ -1,6 +1,6 @@
 import { css as l, LitElement as v, html as c, nothing as p } from "lit";
 import { property as n, customElement as h } from "lit/decorators.js";
-const g = l`*,:before,:after{box-sizing:border-box}:host{--sbb-card-background-color: var(--sbb-color-white);--sbb-card-border-radius: var(--sbb-border-radius-4x);--sbb-card-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-1x) );--sbb-card-animation-easing: var(--sbb-animation-easing);--sbb-card-border-color: transparent;--sbb-card-border-style: solid;--sbb-card-hover-shift: 0;--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);display:block}@media (forced-colors: active){:host{--sbb-card-border-color: CanvasText;--sbb-card-border-width: var(--sbb-border-width-2x)}}:host([color=milk]){--sbb-card-background-color: var(--sbb-color-milk);--sbb-card-border-color: transparent}:host([color=transparent-bordered]){--sbb-card-background-color: transparent;--sbb-card-border-color: var(--sbb-color-cloud);--sbb-card-border-width: var(--sbb-border-width-1x);--sbb-focus-outline-color: inherit}:host([color=transparent-bordered-dashed]){--sbb-card-background-color: transparent;--sbb-card-border-color: var(--sbb-color-cement);--sbb-card-border-width: var(--sbb-border-width-1x);--sbb-card-border-style: dashed;--sbb-focus-outline-color: inherit}:host([data-has-active-action]){--sbb-card-border-color: var(--sbb-color-charcoal);--sbb-card-border-width: var(--sbb-border-width-2x);--sbb-card-border-style: solid}@media (forced-colors: active){:host([data-has-active-action]){--sbb-card-border-color: Highlight}}:host([size=xs]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-fixed-3x);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=s]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-xxxs);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=m]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-s);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-xxxs);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=m][data-has-card-badge]){--sbb-card-padding-block-start: var(--sbb-spacing-fixed-6x);--sbb-card-padding-block-end: var(--sbb-spacing-responsive-xxxs)}:host([size=l]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-fixed-4x);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=l][data-has-card-badge]){--sbb-card-padding-block-start: var(--sbb-spacing-fixed-6x);--sbb-card-padding-block-end: var(--sbb-spacing-fixed-4x)}:host([size=xl]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=xl][data-has-card-badge]){--sbb-card-padding-block-start: var(--sbb-spacing-fixed-6x);--sbb-card-padding-block-end: var(--sbb-spacing-responsive-xxs)}:host([size=xxl]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-s);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-s);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=xxxl]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-l);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-l);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}@media (forced-colors: active){:host([data-has-action]){--sbb-title-text-color-normal-override: var(--sbb-card-color)}}@media (any-hover: hover){:host([data-has-action]:not([data-has-active-action]):hover){--sbb-card-hover-shift: -.125rem}:host([data-has-action]:not([data-has-active-action]):hover) .sbb-card{box-shadow:var(--sbb-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-hard-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-hard-1-color)}}@media (any-hover: hover) and (forced-colors: active){:host([data-has-action]:not([data-has-active-action]):hover){--sbb-card-border-color: Highlight}}@media (forced-colors: active){:host([data-has-action][data-action-role=button]){--sbb-card-color: ButtonText}}@media (forced-colors: active){:host([data-has-action][data-action-role=link]){--sbb-card-color: LinkText}}.sbb-card{display:block;position:relative;padding-inline:var(--sbb-card-padding-inline);padding-block:var(--sbb-card-padding-block-start) var(--sbb-card-padding-block-end);border-radius:var(--sbb-card-border-radius);background-color:var(--sbb-card-background-color);box-shadow:none;transition:box-shadow var(--sbb-card-animation-duration) var(--sbb-card-animation-easing);color:var(--sbb-card-color);width:100%;height:100%}.sbb-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-color:transparent;border:var(--sbb-card-border-width) var(--sbb-card-border-style) var(--sbb-card-border-color);border-radius:var(--sbb-card-border-radius);pointer-events:none}.sbb-card__wrapper{display:block;height:100%}:host([data-has-action]) .sbb-card__wrapper{pointer-events:none;transform:translateY(var(--sbb-card-hover-shift));transition:transform var(--sbb-card-animation-duration) var(--sbb-card-animation-easing)}.sbb-card__badge-wrapper{overflow:hidden;position:absolute;top:0;right:0;bottom:0;left:0;inset-block-end:unset;border-start-start-radius:var(--sbb-card-border-radius);border-start-end-radius:var(--sbb-card-border-radius)}:host([data-has-action]) .sbb-card__badge-wrapper{pointer-events:none}:host(:not([data-has-card-badge])) .sbb-card__badge-wrapper{display:none}::slotted(sbb-title){margin-block-start:0}`;
+const g = l`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-card-background-color: var(--sbb-color-white);--sbb-card-border-radius: var(--sbb-border-radius-4x);--sbb-card-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-1x) );--sbb-card-animation-easing: var(--sbb-animation-easing);--sbb-card-border-color: transparent;--sbb-card-border-style: solid;--sbb-card-hover-shift: 0;--sbb-focus-outline-color: var(--sbb-focus-outline-color-default)}@media (forced-colors: active){:host{--sbb-card-border-color: CanvasText;--sbb-card-border-width: var(--sbb-border-width-2x)}}:host([color=milk]){--sbb-card-background-color: var(--sbb-color-milk);--sbb-card-border-color: transparent}:host([color=transparent-bordered]){--sbb-card-background-color: transparent;--sbb-card-border-color: var(--sbb-color-cloud);--sbb-card-border-width: var(--sbb-border-width-1x);--sbb-focus-outline-color: inherit}:host([color=transparent-bordered-dashed]){--sbb-card-background-color: transparent;--sbb-card-border-color: var(--sbb-color-cement);--sbb-card-border-width: var(--sbb-border-width-1x);--sbb-card-border-style: dashed;--sbb-focus-outline-color: inherit}:host([data-has-active-action]){--sbb-card-border-color: var(--sbb-color-charcoal);--sbb-card-border-width: var(--sbb-border-width-2x);--sbb-card-border-style: solid}@media (forced-colors: active){:host([data-has-active-action]){--sbb-card-border-color: Highlight}}:host([size=xs]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-fixed-3x);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=s]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-xxxs);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=m]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-s);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-xxxs);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=m][data-has-card-badge]){--sbb-card-padding-block-start: var(--sbb-spacing-fixed-6x);--sbb-card-padding-block-end: var(--sbb-spacing-responsive-xxxs)}:host([size=l]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-fixed-4x);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=l][data-has-card-badge]){--sbb-card-padding-block-start: var(--sbb-spacing-fixed-6x);--sbb-card-padding-block-end: var(--sbb-spacing-fixed-4x)}:host([size=xl]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-xxs);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=xl][data-has-card-badge]){--sbb-card-padding-block-start: var(--sbb-spacing-fixed-6x);--sbb-card-padding-block-end: var(--sbb-spacing-responsive-xxs)}:host([size=xxl]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-s);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-s);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}:host([size=xxxl]){--sbb-card-padding-inline: var(--sbb-spacing-responsive-l);--sbb-card-padding-block-start: var(--sbb-spacing-responsive-l);--sbb-card-padding-block-end: var(--sbb-card-padding-block-start)}@media (forced-colors: active){:host([data-has-action]){--sbb-title-text-color-normal-override: var(--sbb-card-color)}}@media (any-hover: hover){:host([data-has-action]:not([data-has-active-action]):hover){--sbb-card-hover-shift: -.125rem}:host([data-has-action]:not([data-has-active-action]):hover) .sbb-card{box-shadow:var(--sbb-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-hard-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-hard-1-color)}}@media (any-hover: hover) and (forced-colors: active){:host([data-has-action]:not([data-has-active-action]):hover){--sbb-card-border-color: Highlight}}@media (forced-colors: active){:host([data-has-action][data-action-role=button]){--sbb-card-color: ButtonText}}@media (forced-colors: active){:host([data-has-action][data-action-role=link]){--sbb-card-color: LinkText}}.sbb-card{width:100%;height:100%;display:block;position:relative;padding-inline:var(--sbb-card-padding-inline);padding-block:var(--sbb-card-padding-block-start) var(--sbb-card-padding-block-end);border-radius:var(--sbb-card-border-radius);background-color:var(--sbb-card-background-color);box-shadow:none;transition:box-shadow var(--sbb-card-animation-duration) var(--sbb-card-animation-easing);color:var(--sbb-card-color)}.sbb-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-color:transparent;border:var(--sbb-card-border-width) var(--sbb-card-border-style) var(--sbb-card-border-color);border-radius:var(--sbb-card-border-radius);pointer-events:none}.sbb-card__wrapper{display:block;height:100%}:host([data-has-action]) .sbb-card__wrapper{pointer-events:none;transform:translateY(var(--sbb-card-hover-shift));transition:transform var(--sbb-card-animation-duration) var(--sbb-card-animation-easing)}.sbb-card__badge-wrapper{overflow:hidden;position:absolute;top:0;right:0;bottom:0;left:0;inset-block-end:unset;border-start-start-radius:var(--sbb-card-border-radius);border-start-end-radius:var(--sbb-card-border-radius)}:host([data-has-action]) .sbb-card__badge-wrapper{pointer-events:none}:host(:not([data-has-card-badge])) .sbb-card__badge-wrapper{display:none}::slotted(sbb-title){margin-block-start:0}`;
 var x = Object.defineProperty, u = Object.getOwnPropertyDescriptor, t = (i, s, o, b) => {
   for (var a = b > 1 ? void 0 : b ? u(s, o) : s, d = i.length - 1, e; d >= 0; d--)
     (e = i[d]) && (a = (b ? e(s, o, a) : e(a)) || a);

package/card/common/card-action-common.d.ts

@@ -1,6 +1,5 @@
 import { SbbActionBaseElement } from '../../core/base-elements.js';
 import { AbstractConstructor } from '../../core/mixins.js';
-
 export declare class SbbCardActionCommonElementMixinType {
     active: boolean;
     protected actionRole: 'link' | 'button';

package/checkbox/checkbox/checkbox.d.ts

@@ -1,7 +1,6 @@
 import { LitElement, CSSResultGroup, TemplateResult } from 'lit';
 import { SbbIconPlacement } from '../../core/interfaces.js';
 import { SbbCheckboxSize } from '../common.js';
-
 declare const SbbCheckboxElement_base: import('../../core/mixins.js').Constructor<import('../common.js').SbbCheckboxCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & typeof LitElement;
 /**
  * It displays a checkbox enhanced with the SBB Design.

package/checkbox/checkbox-group/checkbox-group.d.ts

@@ -3,7 +3,6 @@ import { SbbHorizontalFrom, SbbOrientation } from '../../core/interfaces.js';
 import { SbbCheckboxPanelElement } from '../checkbox-panel.js';
 import { SbbCheckboxElement } from '../checkbox.js';
 import { SbbCheckboxSize } from '../common.js';
-
 declare const SbbCheckboxGroupElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof LitElement;
 /**
  * It can be used as a container for one or more `sbb-checkbox`.

package/checkbox/checkbox-panel/checkbox-panel.d.ts

@@ -2,7 +2,6 @@ import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit'
 import { EventEmitter } from '../../core/eventing.js';
 import { SbbCheckedStateChange, SbbDisabledStateChange, SbbStateChange } from '../../core/interfaces/types.js';
 import { SbbPanelSize } from '../../core/mixins.js';
-
 export type SbbCheckboxPanelStateChange = Extract<SbbStateChange, SbbDisabledStateChange | SbbCheckedStateChange>;
 declare const SbbCheckboxPanelElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbPanelMixinType> & import('../../core/mixins.js').Constructor<import('../common.js').SbbCheckboxCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbUpdateSchedulerMixinType> & typeof LitElement;
 /**

package/checkbox/common/checkbox-common.d.ts

@@ -1,7 +1,6 @@
 import { LitElement } from 'lit';
 import { Constructor, SbbDisabledMixinType, SbbFormAssociatedCheckboxMixinType, SbbRequiredMixinType } from '../../core/mixins.js';
 import { SbbCheckboxGroupElement } from '../checkbox-group.js';
-
 export type SbbCheckboxSize = 'xs' | 's' | 'm';
 export declare class SbbCheckboxCommonElementMixinType extends SbbFormAssociatedCheckboxMixinType implements Partial<SbbDisabledMixinType>, Partial<SbbRequiredMixinType> {
     indeterminate: boolean;

package/chip/chip.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
-
 /**
  * It displays brief and compact information.
  *

package/chip.js

@@ -1,6 +1,6 @@
 import { css as n, LitElement as p, html as h } from "lit";
 import { property as l, customElement as d } from "lit/decorators.js";
-const x = n`*,:before,:after{box-sizing:border-box}:host{display:inline-block}:host([color=milk]){--sbb-chip-color: var(--sbb-color-granite);--sbb-chip-background-color: var(--sbb-color-milk)}:host([color=charcoal]){--sbb-chip-color: var(--sbb-color-white);--sbb-chip-background-color: var(--sbb-color-charcoal)}:host([color=white]){--sbb-chip-color: var(--sbb-color-granite);--sbb-chip-background-color: var(--sbb-color-white)}:host([color=granite]){--sbb-chip-color: var(--sbb-color-white);--sbb-chip-background-color: var(--sbb-color-granite)}:host([size=xxs]){--sbb-chip-padding-block: 0em;--sbb-chip-padding-inline: var(--sbb-spacing-fixed-2x);--sbb-text-font-size: var(--sbb-font-size-text-xxs)}:host([size=xs]){--sbb-chip-padding-block: var(--sbb-spacing-fixed-1x);--sbb-chip-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-text-font-size: var(--sbb-font-size-text-xs)}:host([size=s]){--sbb-chip-padding-block: var(--sbb-spacing-fixed-1x);--sbb-chip-padding-inline: var(--sbb-spacing-fixed-4x);--sbb-text-font-size: var(--sbb-font-size-text-s)}.sbb-chip{font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);line-height:2;display:inline-flex;align-items:center;justify-content:center;height:calc(var(--sbb-typo-line-height-body-text) * var(--sbb-text-font-size) + var(--sbb-chip-padding-block) * 2);background-color:var(--sbb-chip-background-color);padding-inline:var(--sbb-chip-padding-inline);border-radius:var(--sbb-border-radius-infinity);color:var(--sbb-chip-color);overflow:hidden;display:flex}@media (forced-colors: active){.sbb-chip{outline:var(--sbb-border-width-1x) solid CanvasText;outline-offset:calc(-1 * var(--sbb-border-width-1x))}}.sbb-chip__text-wrapper{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block}`;
+const x = n`*,:before,:after{box-sizing:border-box}:host{display:inline-block}:host([color=milk]){--sbb-chip-color: var(--sbb-color-granite);--sbb-chip-background-color: var(--sbb-color-milk)}:host([color=charcoal]){--sbb-chip-color: var(--sbb-color-white);--sbb-chip-background-color: var(--sbb-color-charcoal)}:host([color=white]){--sbb-chip-color: var(--sbb-color-granite);--sbb-chip-background-color: var(--sbb-color-white)}:host([color=granite]){--sbb-chip-color: var(--sbb-color-white);--sbb-chip-background-color: var(--sbb-color-granite)}:host([size=xxs]){--sbb-chip-padding-block: 0em;--sbb-chip-padding-inline: var(--sbb-spacing-fixed-2x);--sbb-text-font-size: var(--sbb-font-size-text-xxs)}:host([size=xs]){--sbb-chip-padding-block: var(--sbb-spacing-fixed-1x);--sbb-chip-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-text-font-size: var(--sbb-font-size-text-xs)}:host([size=s]){--sbb-chip-padding-block: var(--sbb-spacing-fixed-1x);--sbb-chip-padding-inline: var(--sbb-spacing-fixed-4x);--sbb-text-font-size: var(--sbb-font-size-text-s)}.sbb-chip{font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);line-height:2;display:inline-flex;align-items:center;justify-content:center;height:calc(var(--sbb-typo-line-height-body-text) * var(--sbb-text-font-size) + var(--sbb-chip-padding-block) * 2);background-color:var(--sbb-chip-background-color);padding-inline:var(--sbb-chip-padding-inline);border-radius:var(--sbb-border-radius-infinity);color:var(--sbb-chip-color);overflow:hidden}@media (forced-colors: active){.sbb-chip{outline:var(--sbb-border-width-1x) solid CanvasText;outline-offset:calc(-1 * var(--sbb-border-width-1x))}}.sbb-chip{display:flex}.sbb-chip__text-wrapper{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block}`;
 var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, c = (a, b, i, e) => {
   for (var o = e > 1 ? void 0 : e ? v(b, i) : b, r = a.length - 1, t; r >= 0; r--)
     (t = a[r]) && (o = (e ? t(b, i, o) : t(o)) || o);

package/clock/clock.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
 import { SbbTime } from '../core/interfaces.js';
-
 /**
  * It displays an analog clock with the classic SBB face.
  */

package/clock/clock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"clock.d.ts","sourceRoot":"","sources":["../../../src/elements/clock/clock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAkB,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AA2CrD;;GAEG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACgB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAQ;IAE9C,kCAAkC;IAClC,OAAO,CAAC,eAAe,CAAe;IAEtC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,wCAAwC;IACxC,OAAO,CAAC,MAAM,CAAU;IAExB,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,wCAAwC;IACxC,OAAO,CAAC,gBAAgB,CAAqC;IAE7D,0CAA0C;IAC1C,OAAO,CAAC,kBAAkB,CAAuC;IAEjE,0CAA0C;IAC1C,OAAO,CAAC,aAAa,CAAC,CAAiC;cAE9B,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAQlE,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAS7E,oBAAoB,IAAI,IAAI;IAK5C,OAAO,CAAC,2BAA2B,CAMjC;YAEY,sBAAsB;IAUpC,6FAA6F;YAC/E,WAAW;IAqBzB,sDAAsD;YACxC,UAAU;IAcxB,uEAAuE;IACvE,OAAO,CAAC,yBAAyB;IA4CjC,yGAAyG;IACzG,OAAO,CAAC,kBAAkB;IAW1B,sDAAsD;IACtD,OAAO,CAAC,eAAe;IAOvB,6CAA6C;IAC7C,OAAO,CAAC,cAAc;IAYtB,+CAA+C;IAC/C,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,sBAAsB;IAK9B;;;;OAIG;IACH,OAAO,CAAC,0BAA0B;IAUlC,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,2BAA2B;IAMnC,OAAO,CAAC,6BAA6B;cAOlB,MAAM,IAAI,cAAc;CA4B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}
+{"version":3,"file":"clock.d.ts","sourceRoot":"","sources":["../../../src/elements/clock/clock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAkB,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AA2CrD;;GAEG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACgB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAQ;IAE9C,kCAAkC;IAClC,OAAO,CAAC,eAAe,CAAe;IAEtC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,wCAAwC;IACxC,OAAO,CAAC,MAAM,CAAU;IAExB,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,wCAAwC;IACxC,OAAO,CAAC,gBAAgB,CAAqC;IAE7D,0CAA0C;IAC1C,OAAO,CAAC,kBAAkB,CAAuC;IAEjE,0CAA0C;IAC1C,OAAO,CAAC,aAAa,CAAC,CAAiC;cAE9B,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAQlE,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAS7E,oBAAoB,IAAI,IAAI;IAK5C,OAAO,CAAC,2BAA2B,CAMjC;YAEY,sBAAsB;IAUpC,6FAA6F;YAC/E,WAAW;IAsBzB,sDAAsD;YACxC,UAAU;IAcxB,uEAAuE;IACvE,OAAO,CAAC,yBAAyB;IA4CjC,yGAAyG;IACzG,OAAO,CAAC,kBAAkB;IAW1B,sDAAsD;IACtD,OAAO,CAAC,eAAe;IAOvB,6CAA6C;IAC7C,OAAO,CAAC,cAAc;IAYtB,+CAA+C;IAC/C,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,sBAAsB;IAK9B;;;;OAIG;IACH,OAAO,CAAC,0BAA0B;IAWlC,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,2BAA2B;IAMnC,OAAO,CAAC,6BAA6B;cAOlB,MAAM,IAAI,cAAc;CA4B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}

package/clock.js

@@ -6,10 +6,10 @@ const z = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0
 `, w = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path d="M55.1,64.5h-5.2l0.8-58h3.6L55.1,64.5z"/></svg>
 `, L = `<svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 105 105"><path d="M57.8,21.3c0-2.9-2.4-5.2-5.2-5.2s-5.3,2.3-5.3,5.2c0,2.7,2,4.8,4.5,5.2V69h1.5V26.5C55.8,26.2,57.8,24,57.8,21.3z"/></svg>
 `, C = p`*,:before,:after{box-sizing:border-box}:host{--sbb-clock-hours-animation-start-angle: 0deg;--sbb-clock-seconds-animation-start-angle: 0deg;--sbb-clock-hours-animation-duration: 0s;--sbb-clock-seconds-animation-duration: 0s;--sbb-clock-animation-play-state: paused;--sbb-clock-seconds-hand-color: var(--sbb-color-red);display:block}.sbb-clock{position:relative;width:100%;height:100%;aspect-ratio:1/1;overflow:hidden;contain:content}.sbb-clock__face,.sbb-clock__hand-hours,.sbb-clock__hand-minutes,.sbb-clock__hand-seconds{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:center center;transform:rotate(0);transform-style:preserve-3d;backface-visibility:hidden}.sbb-clock__hand-minutes{transition:transform .2s cubic-bezier(.4,2.08,.55,.44)}@supports not (aspect-ratio: 1/1){.sbb-clock__hand-minutes{transform-origin:50% 49.625%}}.sbb-clock__hand-hours{animation-name:rotate;animation-duration:43200s;animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:var(--sbb-clock-animation-play-state)}.sbb-clock__hand-hours--initial-hour{animation-name:hand-hours-animation-initial-hour;animation-duration:var(--sbb-clock-hours-animation-duration);animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:1}.sbb-clock__hand-minutes--no-transition{transition:none}.sbb-clock__hand-seconds{animation-name:hand-seconds-animation;animation-duration:60s;animation-timing-function:linear;animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:infinite;fill:var(--sbb-clock-seconds-hand-color)}.sbb-clock__hand-seconds--initial-minute{animation-name:hand-seconds-animation-initial-minute;animation-duration:var(--sbb-clock-seconds-animation-duration);animation-play-state:var(--sbb-clock-animation-play-state);animation-iteration-count:1}:host(:not([data-initialized])) :is(.sbb-clock__hand-hours,.sbb-clock__hand-minutes,.sbb-clock__hand-seconds){display:none}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes hand-hours-animation-initial-hour{0%{transform:rotate(var(--sbb-clock-hours-animation-start-angle))}to{transform:rotate(360deg)}}@keyframes hand-seconds-animation{0%{transform:rotate(0)}97.5%,to{transform:rotate(360deg)}}@keyframes hand-seconds-animation-initial-minute{0%{transform:rotate(var(--sbb-clock-seconds-animation-start-angle))}97.5%,to{transform:rotate(360deg)}}`;
-var E = Object.defineProperty, A = Object.getOwnPropertyDescriptor, k = (t, n, s, i) => {
-  for (var o = i > 1 ? void 0 : i ? A(n, s) : n, e = t.length - 1, a; e >= 0; e--)
-    (a = t[e]) && (o = (i ? a(n, s, o) : a(o)) || o);
-  return i && o && E(n, s, o), o;
+var E = Object.defineProperty, A = Object.getOwnPropertyDescriptor, k = (t, n, o, s) => {
+  for (var i = s > 1 ? void 0 : s ? A(n, o) : n, e = t.length - 1, a; e >= 0; e--)
+    (a = t[e]) && (i = (s ? a(n, o, i) : a(i)) || i);
+  return s && i && E(n, o, i), i;
 };
 const O = 12, P = 60, u = 60, T = 50, b = 360, v = 30, N = 6, F = 360 / 58.5, I = 60, x = 3600, M = {
   once: !0,
@@ -45,35 +45,35 @@ let c = class extends H {
       this._moveMinutesHandFn,
       M
     ), await new Promise(
-      () => setTimeout(() => {
+      (o) => setTimeout(() => {
         var s;
-        this._setHandsStartingPosition(), (s = this.style) == null || s.setProperty("--sbb-clock-animation-play-state", "running");
+        this._setHandsStartingPosition(), (s = this.style) == null || s.setProperty("--sbb-clock-animation-play-state", "running"), o();
       }, T)
     );
   }
   /** Stops the clock by removing all the animations. */
   async _stopClock() {
-    var t, n, s, i;
-    clearInterval(this._handMovement), this._removeSecondsAnimationStyles(), this._removeHoursAnimationStyles(), (t = this._clockHandHours) == null || t.removeEventListener("animationend", this._moveHoursHandFn), (n = this._clockHandSeconds) == null || n.removeEventListener("animationend", this._moveMinutesHandFn), (s = this._clockHandMinutes) == null || s.classList.add("sbb-clock__hand-minutes--no-transition"), (i = this.style) == null || i.setProperty("--sbb-clock-animation-play-state", "paused");
+    var t, n, o, s;
+    clearInterval(this._handMovement), this._removeSecondsAnimationStyles(), this._removeHoursAnimationStyles(), (t = this._clockHandHours) == null || t.removeEventListener("animationend", this._moveHoursHandFn), (n = this._clockHandSeconds) == null || n.removeEventListener("animationend", this._moveMinutesHandFn), (o = this._clockHandMinutes) == null || o.classList.add("sbb-clock__hand-minutes--no-transition"), (s = this.style) == null || s.setProperty("--sbb-clock-animation-play-state", "paused");
   }
   /** Set the starting position for the three hands on the clock face. */
   _setHandsStartingPosition() {
     var e, a, l, d, h, m;
     this._assignCurrentTime();
-    const t = u - this._seconds, n = P - this._minutes, s = O - this._hours;
-    let i = 0, o = 0;
-    t > 0 && (i += t, o = 1), n > 0 && (i += (n - o) * I, o = 1), s > 0 && (i += (s - o) * x), (e = this.style) == null || e.setProperty(
+    const t = u - this._seconds, n = P - this._minutes, o = O - this._hours;
+    let s = 0, i = 0;
+    t > 0 && (s += t, i = 1), n > 0 && (s += (n - i) * I, i = 1), o > 0 && (s += (o - i) * x), (e = this.style) == null || e.setProperty(
       "--sbb-clock-hours-animation-start-angle",
       `${Math.ceil(this._hours * v + this._minutes / 2)}deg`
-    ), (a = this.style) == null || a.setProperty("--sbb-clock-hours-animation-duration", `${i}s`), (l = this.style) == null || l.setProperty(
+    ), (a = this.style) == null || a.setProperty("--sbb-clock-hours-animation-duration", `${s}s`), (l = this.style) == null || l.setProperty(
       "--sbb-clock-seconds-animation-start-angle",
       `${Math.ceil(this._seconds * F)}deg`
     ), (d = this.style) == null || d.setProperty("--sbb-clock-seconds-animation-duration", `${t}s`), this._setMinutesHand(), (h = this._clockHandSeconds) == null || h.classList.add("sbb-clock__hand-seconds--initial-minute"), (m = this._clockHandHours) == null || m.classList.add("sbb-clock__hand-hours--initial-hour"), this.toggleAttribute("data-initialized", !0);
   }
   /** Given the current date, calculates the hh/mm/ss values and the hh/mm/ss left to the next midnight. */
   _assignCurrentTime() {
-    const t = this.now ? null : /* @__PURE__ */ new Date(), [n, s, i] = t ? [t.getHours(), t.getMinutes(), t.getSeconds()] : this.now.split(":").map((o) => +o);
-    this._hours = n % 12, this._minutes = s, this._seconds = i;
+    const t = this.now ? null : /* @__PURE__ */ new Date(), [n, o, s] = t ? [t.getHours(), t.getMinutes(), t.getSeconds()] : this.now.split(":").map((i) => +i);
+    this._hours = n % 12, this._minutes = o, this._seconds = s;
   }
   /** Set the starting position for the minutes hand. */
   _setMinutesHand() {

package/container/container/container.d.ts

@@ -1,10 +1,10 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-
 /**
  * It displays its content with the default page spacing.
  *
  * @slot - Use the unnamed slot to add anything to the container.
  * @slot sticky-bar - The slot used by the sbb-sticky-bar component.
+ * @slot image - The slot used to slot an `sbb-image` to use as background.
  */
 export declare class SbbContainerElement extends LitElement {
     static styles: CSSResultGroup;

package/container/container/container.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../../src/elements/container/container/container.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAKb;;;;;GAKG;AACH,qBACa,mBAAoB,SAAQ,UAAU;IACjD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,yCAAyC;IACU,QAAQ,UAAS;IAEpE,sFAAsF;IAE/E,kBAAkB,UAAS;IAElC,2DAA2D;IACvB,KAAK,EAAE,aAAa,GAAG,OAAO,GAAG,MAAM,CAAW;cAEnE,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAQzD,MAAM,IAAI,cAAc;CAQ5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,mBAAmB,CAAC;KACtC;CACF"}
+{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../../src/elements/container/container/container.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAOb;;;;;;GAMG;AACH,qBAEa,mBAAoB,SAAQ,UAAU;IACjD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,yCAAyC;IACU,QAAQ,UAAS;IAEpE,sFAAsF;IAE/E,kBAAkB,UAAS;IAElC,2DAA2D;IACvB,KAAK,EAAE,aAAa,GAAG,OAAO,GAAG,MAAM,CAAW;cAEnE,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAQzD,MAAM,IAAI,cAAc;CAW5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,mBAAmB,CAAC;KACtC;CACF"}

package/container/container.js

@@ -1,40 +1,45 @@
-import { css as l, LitElement as d, html as p } from "lit";
-import { property as c, customElement as u } from "lit/decorators.js";
-const h = l`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{display:block}:host([color=white]){--sbb-container-background-color: var(--sbb-color-white)}:host([color=milk]){--sbb-container-background-color: var(--sbb-color-milk)}:host(:not([expanded])[background-expanded]){background-color:var(--sbb-container-background-color)}.sbb-container{background-color:var(--sbb-container-background-color)}.sbb-container:after,.sbb-container:before{content:" ";display:block;visibility:hidden;height:0;overflow:hidden}:host([color=transparent]) .sbb-container{background-color:transparent}:host(:not([expanded])) .sbb-container{padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([expanded])) .sbb-container{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))}}:host([expanded]) .sbb-container{padding-inline:var(--sbb-spacing-responsive-xxs)}`;
-var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, s = (n, e, t, a) => {
-  for (var o = a > 1 ? void 0 : a ? v(e, t) : e, b = n.length - 1, i; b >= 0; b--)
-    (i = n[b]) && (o = (a ? i(e, t, o) : i(o)) || o);
-  return a && o && f(e, t, o), o;
+import { css as l, LitElement as c, html as p } from "lit";
+import { property as d, customElement as m } from "lit/decorators.js";
+import { slotState as g } from "../core/decorators.js";
+const u = l`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{display:block}:host([color=white]){--sbb-container-background-color: var(--sbb-color-white)}:host([color=milk]){--sbb-container-background-color: var(--sbb-color-milk)}:host([data-slot-names~=image]){--sbb-container-background-color: transparent;--sbb-container-padding: var(--sbb-spacing-responsive-xxl)}:host(:not([expanded])[background-expanded]){background-color:var(--sbb-container-background-color)}.sbb-container{background-color:var(--sbb-container-background-color);padding:var(--sbb-container-padding)}.sbb-container:after,.sbb-container:before{content:" ";display:block;visibility:hidden;height:0;overflow:hidden}:host([color=transparent]) .sbb-container{background-color:transparent}:host(:not([expanded])) .sbb-container{padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([expanded])) .sbb-container{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))}}:host([expanded]) .sbb-container{padding-inline:var(--sbb-spacing-responsive-xxs)}:host([data-slot-names~=image]) .sbb-container{position:relative}.sbb-container__content{position:relative}::slotted([slot=image]){--sbb-image-border-radius: 0;position:absolute;top:0;right:0;bottom:0;left:0}@media (min-width: 90rem){:host(:not([expanded])) ::slotted([slot=image]){--sbb-image-border-radius: var(--sbb-border-radius-4x);border-radius:var(--sbb-border-radius-4x)}}::slotted(img[slot=image]){object-fit:cover;height:100%;width:100%}`;
+var h = Object.defineProperty, v = Object.getOwnPropertyDescriptor, s = (a, e, t, n) => {
+  for (var o = n > 1 ? void 0 : n ? v(e, t) : e, i = a.length - 1, b; i >= 0; i--)
+    (b = a[i]) && (o = (n ? b(e, t, o) : b(o)) || o);
+  return n && o && h(e, t, o), o;
 };
-let r = class extends d {
+let r = class extends c {
   constructor() {
     super(...arguments), this.expanded = !1, this.backgroundExpanded = !1, this.color = "white";
   }
-  willUpdate(n) {
+  willUpdate(a) {
     var e, t;
-    super.willUpdate(n), n.has("expanded") && ((t = (e = this.querySelector) == null ? void 0 : e.call(this, "sbb-sticky-bar")) == null || t.toggleAttribute("data-expanded", this.expanded));
+    super.willUpdate(a), a.has("expanded") && ((t = (e = this.querySelector) == null ? void 0 : e.call(this, "sbb-sticky-bar")) == null || t.toggleAttribute("data-expanded", this.expanded));
   }
   render() {
     return p`
       <div class="sbb-container">
-        <slot></slot>
+        <slot name="image"></slot>
+        <div class="sbb-container__content">
+          <slot></slot>
+        </div>
       </div>
       <slot name="sticky-bar"></slot>
     `;
   }
 };
-r.styles = h;
+r.styles = u;
 s([
-  c({ type: Boolean, reflect: !0 })
+  d({ type: Boolean, reflect: !0 })
 ], r.prototype, "expanded", 2);
 s([
-  c({ type: Boolean, reflect: !0, attribute: "background-expanded" })
+  d({ type: Boolean, reflect: !0, attribute: "background-expanded" })
 ], r.prototype, "backgroundExpanded", 2);
 s([
-  c({ reflect: !0 })
+  d({ reflect: !0 })
 ], r.prototype, "color", 2);
 r = s([
-  u("sbb-container")
+  m("sbb-container"),
+  g()
 ], r);
 export {
   r as SbbContainerElement

package/container/sticky-bar/sticky-bar.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-
 /**
  * A container that sticks to the bottom of the page if slotted into `sbb-container`.
  *