@sbb-esta/lyne-elements 1.15.1 → 2.0.0

package/loading-indicator-circle/loading-indicator-circle.d.ts

@@ -0,0 +1,16 @@
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
+/**
+ * It displays a circle loading indicator.
+ */
+export declare class SbbLoadingIndicatorCircleElement extends LitElement {
+    static styles: CSSResultGroup;
+    /** Color variant. */
+    accessor color: 'default' | 'smoke' | 'white';
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-loading-indicator-circle': SbbLoadingIndicatorCircleElement;
+    }
+}
+//# sourceMappingURL=loading-indicator-circle.d.ts.map

package/loading-indicator-circle/loading-indicator-circle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading-indicator-circle.d.ts","sourceRoot":"","sources":["../../../src/elements/loading-indicator-circle/loading-indicator-circle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAOvC;;GAEG;AACH,qBAMM,gCAAiC,SAAQ,UAAU;IACvD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,qBAAqB;IACrB,SAA6C,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,OAAO,CAAa;cAE3E,MAAM,IAAI,cAAc;CAO5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,8BAA8B,EAAE,gCAAgC,CAAC;KAClE;CACF"}

package/loading-indicator-circle.d.ts

@@ -0,0 +1,2 @@
+export * from './loading-indicator-circle/loading-indicator-circle.js';
+//# sourceMappingURL=loading-indicator-circle.d.ts.map

package/loading-indicator-circle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading-indicator-circle.d.ts","sourceRoot":"","sources":["../../src/elements/loading-indicator-circle.ts"],"names":[],"mappings":"AAAA,cAAc,wDAAwD,CAAC"}

package/loading-indicator-circle.js

@@ -0,0 +1,46 @@
+var m = (i) => {
+  throw TypeError(i);
+};
+var u = (i, a, r) => a.has(i) || m("Cannot " + r);
+var h = (i, a, r) => (u(i, a, "read from private field"), r ? r.call(i) : a.get(i)), p = (i, a, r) => a.has(i) ? m("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(i) : a.set(i, r), v = (i, a, r, o) => (u(i, a, "write to private field"), o ? o.call(i, r) : a.set(i, r), r);
+import { __esDecorate as _, __runInitializers as l } from "tslib";
+import { css as k, html as y, LitElement as w } from "lit";
+import { customElement as x, property as S } from "lit/decorators.js";
+import { hostAttributes as z } from "./core/decorators.js";
+const E = k`*,:before,:after{box-sizing:border-box}:host{display:inline-block;line-height:0;--sbb-loading-indicator-circle-color: var(--sbb-color-red);--sbb-loading-indicator-circle-padding: .125rem;--sbb-loading-indicator-circle-duration: var(--sbb-disable-animation-duration, 1.5s);--sbb-loading-indicator-circle-background-color: var(--sbb-color-white);--sbb-loading-indicator-circle-background: conic-gradient( from 90deg, var(--sbb-loading-indicator-circle-background-color), var(--sbb-loading-indicator-circle-color) );--sbb-loading-indicator-circle-animated-width: .1875em;--sbb-loading-indicator-circle-animated-height: .1875em;--sbb-loading-indicator-circle-animated-border-radius: 50%}@media (forced-colors: active){:host{--sbb-loading-indicator-circle-color: CanvasText !important;--sbb-loading-indicator-circle-animated-width: 50%;--sbb-loading-indicator-circle-animated-height: 100%;--sbb-loading-indicator-circle-animated-border-radius: 0;--sbb-loading-indicator-circle-background: transparent}}:host([color=smoke]){--sbb-loading-indicator-circle-color: var(--sbb-color-smoke)}:host([color=white]){--sbb-loading-indicator-circle-color: var(--sbb-color-white)}:host([color=white]){--sbb-loading-indicator-circle-background-color: var(--sbb-color-iron)}.sbb-loading-indicator{display:inline-flex;padding:var(--sbb-loading-indicator-circle-padding);vertical-align:middle;line-height:1}.sbb-loading-indicator__animated-element{width:1.25em;height:1.25em;display:inline-block;color:transparent;position:relative;margin:0 auto;overflow:hidden;border-radius:50%;background:var(--sbb-loading-indicator-circle-background);mask:radial-gradient(circle .4375em,rgba(0,0,0,0) 98%,var(--sbb-loading-indicator-circle-background-color));animation:rotation var(--sbb-loading-indicator-circle-duration) infinite linear}.sbb-loading-indicator__animated-element:after{content:"";width:var(--sbb-loading-indicator-circle-animated-width);height:var(--sbb-loading-indicator-circle-animated-height);background:var(--sbb-loading-indicator-circle-color);border-radius:var(--sbb-loading-indicator-circle-animated-border-radius);position:absolute;top:50%;right:0;translate:0 -50%;overflow:hidden;margin:auto}@keyframes rotation{0%{rotate:0deg}to{rotate:359deg}}`;
+let T = (() => {
+  var c, t;
+  let i = [x("sbb-loading-indicator-circle"), z({
+    role: "progressbar",
+    "aria-busy": "true"
+  })], a, r = [], o, d = w, s, b = [], g = [];
+  return t = class extends d {
+    constructor() {
+      super(...arguments);
+      p(this, c, l(this, b, "default"));
+      l(this, g);
+    }
+    /** Color variant. */
+    get color() {
+      return h(this, c);
+    }
+    set color(e) {
+      v(this, c, e);
+    }
+    render() {
+      return y`
+      <span class="sbb-loading-indicator">
+        <span class="sbb-loading-indicator__animated-element"></span>
+      </span>
+    `;
+    }
+  }, c = new WeakMap(), o = t, (() => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(d[Symbol.metadata] ?? null) : void 0;
+    s = [S({ reflect: !0 })], _(t, null, s, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (n) => "color" in n, get: (n) => n.color, set: (n, f) => {
+      n.color = f;
+    } }, metadata: e }, b, g), _(null, a = { value: o }, i, { kind: "class", name: o.name, metadata: e }, null, r), o = a.value, e && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+  })(), t.styles = E, l(o, r), o;
+})();
+export {
+  T as SbbLoadingIndicatorCircleElement
+};

package/loading-indicator.js

@@ -1,76 +1,66 @@
-var E = (i) => {
+var z = (i) => {
   throw TypeError(i);
 };
-var D = (i, n, t) => n.has(i) || E("Cannot " + t);
-var g = (i, n, t) => (D(i, n, "read from private field"), t ? t.call(i) : n.get(i)), m = (i, n, t) => n.has(i) ? E("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(i) : n.set(i, t), h = (i, n, t, r) => (D(i, n, "write to private field"), r ? r.call(i, t) : n.set(i, t), t);
-import { __esDecorate as w, __runInitializers as d } from "tslib";
-import { css as L, html as j, nothing as O, LitElement as T } from "lit";
-import { customElement as Y, property as p } from "lit/decorators.js";
-import { hostAttributes as A } from "./core/decorators.js";
-const C = L`*,:before,:after{box-sizing:border-box}:host{--sbb-loading-indicator-color: var(--sbb-color-red);display:inline-block;line-height:0}:host([color=smoke]){--sbb-loading-indicator-color: var(--sbb-color-smoke)}:host([color=white]){--sbb-loading-indicator-color: var(--sbb-color-white)}:host([variant=circle]){--sbb-loading-indicator-padding: var(--sbb-border-width-2x);--sbb-loading-indicator-duration: var(--sbb-disable-animation-zero-time, 1.5s);--sbb-loading-indicator-background-color: var(--sbb-color-white);--sbb-loading-indicator-circle-background: conic-gradient( from 90deg, var(--sbb-loading-indicator-background-color), var(--sbb-loading-indicator-color) );--sbb-loading-indicator-circle-animated-width: .1875em;--sbb-loading-indicator-circle-animated-height: .1875em;--sbb-loading-indicator-circle-animated-border-radius: 50%}:host([color=white][variant=circle]){--sbb-loading-indicator-background-color: var(--sbb-color-iron)}:host([variant=circle]) .sbb-loading-indicator{display:inline-flex;height:auto;width:auto;padding-inline:var(--sbb-loading-indicator-padding);padding-block:var(--sbb-loading-indicator-padding);vertical-align:middle;line-height:1}:host([variant=circle]) .sbb-loading-indicator__animated-element{width:1.25em;height:1.25em;display:inline-block;color:transparent;position:relative;margin:0 auto;overflow:hidden;border-radius:50%;background:var(--sbb-loading-indicator-circle-background);-webkit-mask:radial-gradient(circle .4375em,rgba(0,0,0,0) 98%,var(--sbb-loading-indicator-background-color));mask:radial-gradient(circle .4375em,rgba(0,0,0,0) 98%,var(--sbb-loading-indicator-background-color));animation:rotation var(--sbb-loading-indicator-duration) infinite linear}:host([variant=circle]) .sbb-loading-indicator__animated-element:after{content:"";width:var(--sbb-loading-indicator-circle-animated-width);height:var(--sbb-loading-indicator-circle-animated-height);background:var(--sbb-loading-indicator-color);border-radius:var(--sbb-loading-indicator-circle-animated-border-radius);position:absolute;top:50%;right:0;transform:translateY(-50%);overflow:hidden;margin:auto}@media (forced-colors: active){:host([variant=circle]) .sbb-loading-indicator__animated-element:after{--sbb-loading-indicator-color: CanvasText;--sbb-loading-indicator-circle-animated-width: 50%;--sbb-loading-indicator-circle-animated-height: 100%;--sbb-loading-indicator-circle-animated-border-radius: 0}}@media (forced-colors: active){:host([variant=circle]) .sbb-loading-indicator__animated-element{--sbb-loading-indicator-circle-background: transparent}}@media (forced-colors: active){:host([color=white][variant=circle]) .sbb-loading-indicator__animated-element:after{--sbb-loading-indicator-color: var(--sbb-color-white)}}:host([variant=window]){--sbb-loading-indicator-padding: 0;--sbb-loading-indicator-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) )}:host([variant=window][size=s]){--sbb-loading-indicator-window-height: 1.66666625rem;--sbb-loading-indicator-window-padding-block-start: .66666625rem;--sbb-loading-indicator-window-element-width: 3.46666625rem;--sbb-loading-indicator-window-element-height: .333333125rem;--sbb-loading-indicator-window-element-perspective: 6rem;--sbb-loading-indicator-window-element-animation-name: loading-container-small;--sbb-loading-indicator-window-last-span-width: .533333125rem;--sbb-loading-indicator-window-last-span-height: .333333125rem;--sbb-loading-indicator-window-last-span-margin: .2rem;--sbb-loading-indicator-window-last-span-transform: translate3d( -.1rem, 0, 0 )}:host([variant=window][size=l]){--sbb-loading-indicator-window-height: 3rem;--sbb-loading-indicator-window-padding-block-start: 1.2rem;--sbb-loading-indicator-window-element-width: 5.79980625rem;--sbb-loading-indicator-window-element-height: .599609375rem;--sbb-loading-indicator-window-element-perspective: 8rem;--sbb-loading-indicator-window-element-animation-name: loading-container-large;--sbb-loading-indicator-window-last-span-width: 1rem;--sbb-loading-indicator-window-last-span-height: .599609375rem;--sbb-loading-indicator-window-last-span-margin: .2rem}:host([variant=window]) span{display:inline-block}:host([variant=window]) .sbb-loading-indicator{display:flex;height:var(--sbb-loading-indicator-window-height);padding-block-start:var(--sbb-loading-indicator-window-padding-block-start)}:host([variant=window]) .sbb-loading-indicator__animated-element{margin:0 auto;transform-origin:center;transform:translate3d(-2em,0,0);backface-visibility:hidden;transform-style:preserve-3d;width:var(--sbb-loading-indicator-window-element-width);height:var(--sbb-loading-indicator-window-element-height);perspective:var(--sbb-loading-indicator-window-element-perspective)}:host([variant=window]) .sbb-loading-indicator__animated-element>span{position:relative;transform:rotateY(50deg) translateZ(1em);transform-origin:right;backface-visibility:hidden}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span{position:relative;display:flex;animation-name:var(--sbb-loading-indicator-window-element-animation-name);animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:var(--sbb-loading-indicator-duration)}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span>span{background:var(--sbb-loading-indicator-color);backface-visibility:hidden;outline:var(--sbb-border-width-1x) solid rgba(0,0,0,0);width:var(--sbb-loading-indicator-window-last-span-width);height:var(--sbb-loading-indicator-window-last-span-height);margin-right:var(--sbb-loading-indicator-window-last-span-margin);transform:var(--sbb-loading-indicator-window-last-span-transform)}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span>span:nth-child(1){animation:loading-rectangle1 var(--sbb-loading-indicator-duration) linear infinite}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span>span:nth-child(2){animation:loading-rectangle2 var(--sbb-loading-indicator-duration) linear infinite}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span>span:nth-child(3){animation:loading-rectangle3 var(--sbb-loading-indicator-duration) linear infinite}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span>span:nth-child(4){animation:loading-rectangle4 var(--sbb-loading-indicator-duration) linear infinite}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span>span:nth-child(5){animation:loading-rectangle5 var(--sbb-loading-indicator-duration) linear infinite}:host([variant=window]) .sbb-loading-indicator__animated-element>span>span>span:last-child{margin-right:0}@keyframes loading-container-small{0%{transform:translate(.73333em)}to{transform:translate(0)}}@keyframes loading-container-large{0%{transform:translate(1.2em)}to{transform:translate(0)}}@keyframes loading-rectangle1{0%{opacity:.5}to{opacity:0}}@keyframes loading-rectangle2{0%{opacity:1}to{opacity:.5}}@keyframes loading-rectangle3{0%{opacity:.5}to{opacity:1}}@keyframes loading-rectangle4{0%{opacity:.25}to{opacity:.5}}@keyframes loading-rectangle5{0%{opacity:0}to{opacity:.25}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(359deg)}}`;
-let G = (() => {
-  var s, l, c, e;
-  let i = [Y("sbb-loading-indicator"), A({
+var k = (i, a, n) => a.has(i) || z("Cannot " + n);
+var b = (i, a, n) => (k(i, a, "read from private field"), n ? n.call(i) : a.get(i)), g = (i, a, n) => a.has(i) ? z("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(i) : a.set(i, n), m = (i, a, n, e) => (k(i, a, "write to private field"), e ? e.call(i, n) : a.set(i, n), n);
+import { __esDecorate as p, __runInitializers as d } from "tslib";
+import { css as S, html as I, LitElement as E } from "lit";
+import { customElement as j, property as x } from "lit/decorators.js";
+import { hostAttributes as D } from "./core/decorators.js";
+const L = S`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{--sbb-loading-indicator-color: var(--sbb-color-red);--sbb-loading-indicator-padding: 0;--sbb-loading-indicator-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-loading-indicator-window-element-rotation: 55.24deg;--_sbb-loading-indicator-window-first-span-width: calc( var(--sbb-loading-indicator-window-height) * .58 );--_sbb-loading-indicator-window-unit: calc( var(--_sbb-loading-indicator-window-first-span-width) / 5.5 );--_sbb-loading-indicator-window-element-animation-speed: calc( var(--_sbb-loading-indicator-window-unit) * 6.5 );--sbb-loading-indicator-window-height: 1.125rem;--sbb-loading-indicator-window-element-width: 3.4375rem;display:inline-block;line-height:0}:host([color=smoke]){--sbb-loading-indicator-color: var(--sbb-color-smoke)}:host([color=white]){--sbb-loading-indicator-color: var(--sbb-color-white)}:host([size=l]){--sbb-loading-indicator-window-height: 2rem;--sbb-loading-indicator-window-element-width: 6.25rem}:host([size=xl]){--sbb-loading-indicator-window-height: 3.1875rem;--sbb-loading-indicator-window-element-width: 8.75rem}:host([size=xxl]){--sbb-loading-indicator-window-height: 6.125rem;--sbb-loading-indicator-window-element-width: 15.625rem}:host([size=xxxl]){--sbb-loading-indicator-window-height: 9.1875rem;--sbb-loading-indicator-window-element-width: 22.5rem}span{display:inline-block}.sbb-loading-indicator{display:flex;height:var(--sbb-loading-indicator-window-height);align-items:center}.sbb-loading-indicator:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-loading-indicator__animated-element{position:relative;justify-content:center;display:flex;margin:0 auto;transform-origin:center;translate:25%;backface-visibility:hidden;width:var(--sbb-loading-indicator-window-element-width);perspective:var(--sbb-loading-indicator-window-height)}.sbb-loading-indicator__animated-element>span{position:relative;align-self:center;transform-origin:left;rotate:y var(--sbb-loading-indicator-window-element-rotation);backface-visibility:hidden}.sbb-loading-indicator__animated-element>span>span{position:relative;display:flex;animation:loading-container var(--sbb-loading-indicator-duration) linear infinite}.sbb-loading-indicator__animated-element>span>span>span{background:var(--sbb-loading-indicator-color);backface-visibility:hidden;outline:var(--sbb-border-width-1x) solid transparent;width:var(--_sbb-loading-indicator-window-first-span-width);height:var(--sbb-loading-indicator-window-height);margin-inline-end:var(--_sbb-loading-indicator-window-unit)}.sbb-loading-indicator__animated-element>span>span>span:nth-child(1){animation:loading-rectangle1 var(--sbb-loading-indicator-duration) linear infinite}.sbb-loading-indicator__animated-element>span>span>span:nth-child(2){animation:loading-rectangle2 var(--sbb-loading-indicator-duration) linear infinite}.sbb-loading-indicator__animated-element>span>span>span:nth-child(3){animation:loading-rectangle3 var(--sbb-loading-indicator-duration) linear infinite}.sbb-loading-indicator__animated-element>span>span>span:nth-child(4){animation:loading-rectangle4 var(--sbb-loading-indicator-duration) linear infinite}.sbb-loading-indicator__animated-element>span>span>span:nth-child(5){animation:loading-rectangle5 var(--sbb-loading-indicator-duration) linear infinite}.sbb-loading-indicator__animated-element>span>span>span:last-child{margin-inline-end:0}@keyframes loading-container{0%{translate:var(--_sbb-loading-indicator-window-element-animation-speed)}to{translate:0}}@keyframes loading-rectangle1{0%{opacity:.5}to{opacity:0}}@keyframes loading-rectangle2{0%{opacity:1}to{opacity:.5}}@keyframes loading-rectangle3{0%{opacity:.5}to{opacity:1}}@keyframes loading-rectangle4{0%{opacity:.25}to{opacity:.5}}@keyframes loading-rectangle5{0%{opacity:0}to{opacity:.25}}`;
+let q = (() => {
+  var r, l, o;
+  let i = [j("sbb-loading-indicator"), D({
     role: "progressbar",
     "aria-busy": "true"
-  })], n, t = [], r, v = T, u, f = [], _ = [], k, y = [], z = [], x, I = [], S = [];
-  return e = class extends v {
+  })], a, n = [], e, h = E, w, _ = [], u = [], f, v = [], y = [];
+  return o = class extends h {
     constructor() {
       super(...arguments);
-      m(this, s, d(this, f, "window"));
-      m(this, l, (d(this, _), d(this, y, "s")));
-      m(this, c, (d(this, z), d(this, I, "default")));
-      d(this, S);
-    }
-    /** Variant of the loading indicator; `circle` is meant to be used inline, while `window` as overlay. */
-    get variant() {
-      return g(this, s);
-    }
-    set variant(o) {
-      h(this, s, o);
+      g(this, r, d(this, _, "s"));
+      g(this, l, (d(this, u), d(this, v, "default")));
+      d(this, y);
     }
     /** Size variant, either s or m. */
     get size() {
-      return g(this, l);
+      return b(this, r);
     }
-    set size(o) {
-      h(this, l, o);
+    set size(s) {
+      m(this, r, s);
     }
     /** Color variant. */
     get color() {
-      return g(this, c);
+      return b(this, l);
     }
-    set color(o) {
-      h(this, c, o);
+    set color(s) {
+      m(this, l, s);
     }
     render() {
-      return j`
+      return I`
       <span class="sbb-loading-indicator">
         <span class="sbb-loading-indicator__animated-element">
-          ${this.variant === "window" ? j`<span>
-                <span>
-                  <span></span>
-                  <span></span>
-                  <span></span>
-                  <span></span>
-                  <span></span>
-                </span>
-              </span>` : O}
+          <span>
+            <span>
+              <span></span>
+              <span></span>
+              <span></span>
+              <span></span>
+              <span></span>
+            </span>
+          </span>
         </span>
       </span>
     `;
     }
-  }, s = new WeakMap(), l = new WeakMap(), c = new WeakMap(), r = e, (() => {
-    const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
-    u = [p({ reflect: !0 })], k = [p({ reflect: !0 })], x = [p({ reflect: !0 })], w(e, null, u, { kind: "accessor", name: "variant", static: !1, private: !1, access: { has: (a) => "variant" in a, get: (a) => a.variant, set: (a, b) => {
-      a.variant = b;
-    } }, metadata: o }, f, _), w(e, null, k, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (a) => "size" in a, get: (a) => a.size, set: (a, b) => {
-      a.size = b;
-    } }, metadata: o }, y, z), w(e, null, x, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (a) => "color" in a, get: (a) => a.color, set: (a, b) => {
-      a.color = b;
-    } }, metadata: o }, I, S), w(null, n = { value: r }, i, { kind: "class", name: r.name, metadata: o }, null, t), r = n.value, o && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o });
-  })(), e.styles = C, d(r, t), r;
+  }, r = new WeakMap(), l = new WeakMap(), e = o, (() => {
+    const s = typeof Symbol == "function" && Symbol.metadata ? Object.create(h[Symbol.metadata] ?? null) : void 0;
+    w = [x({ reflect: !0 })], f = [x({ reflect: !0 })], p(o, null, w, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (t) => "size" in t, get: (t) => t.size, set: (t, c) => {
+      t.size = c;
+    } }, metadata: s }, _, u), p(o, null, f, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (t) => "color" in t, get: (t) => t.color, set: (t, c) => {
+      t.color = c;
+    } }, metadata: s }, v, y), p(null, a = { value: e }, i, { kind: "class", name: e.name, metadata: s }, null, n), e = a.value, s && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s });
+  })(), o.styles = L, d(e, n), e;
 })();
 export {
-  G as SbbLoadingIndicatorElement
+  q as SbbLoadingIndicatorElement
 };

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

@@ -1 +1 @@
-{"version":3,"file":"map-container.d.ts","sourceRoot":"","sources":["../../../src/elements/map-container/map-container.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAShD,OAAO,8BAA8B,CAAC;AAEtC;;;;;;;;;;;;;;GAcG;AACH,qBAEM,sBAAuB,SAAQ,UAAU;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,2EAA2E;IAC3E,SAEgB,kBAAkB,EAAE,OAAO,CAAS;IAE3C,OAAO,CAAC,QAAQ,CAAC,sBAAsB,CAAS;IAEzD,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,SAAS,CAGd;cAEgB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAczD,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAO9E,OAAO,CAAC,YAAY;IAIpB;;;OAGG;IACH,OAAO,CAAC,oBAAoB;IAI5B;;;;OAIG;IACH,OAAO,CAAC,kCAAkC;cAQvB,MAAM,IAAI,cAAc;CA2B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}
+{"version":3,"file":"map-container.d.ts","sourceRoot":"","sources":["../../../src/elements/map-container/map-container.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAShD,OAAO,4BAA4B,CAAC;AAEpC;;;;;;;;;;;;;;GAcG;AACH,qBAEM,sBAAuB,SAAQ,UAAU;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,2EAA2E;IAC3E,SAEgB,kBAAkB,EAAE,OAAO,CAAS;IAE3C,OAAO,CAAC,QAAQ,CAAC,sBAAsB,CAAS;IAEzD,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,SAAS,CAGd;cAEgB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAczD,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAO9E,OAAO,CAAC,YAAY;IAIpB;;;OAGG;IACH,OAAO,CAAC,oBAAoB;IAI5B;;;;OAIG;IACH,OAAO,CAAC,kCAAkC;cAQvB,MAAM,IAAI,cAAc;CA2B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}

package/map-container.js

@@ -1,8 +1,8 @@
-var y = (a) => {
+var B = (a) => {
   throw TypeError(a);
 };
-var B = (a, i, o) => i.has(a) || y("Cannot " + o);
-var m = (a, i, o) => (B(a, i, "read from private field"), o ? o.call(a) : i.get(a)), p = (a, i, o) => i.has(a) ? y("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(a) : i.set(a, o), c = (a, i, o, s) => (B(a, i, "write to private field"), s ? s.call(a, o) : i.set(a, o), o);
+var y = (a, i, o) => i.has(a) || B("Cannot " + o);
+var m = (a, i, o) => (y(a, i, "read from private field"), o ? o.call(a) : i.get(a)), p = (a, i, o) => i.has(a) ? B("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(a) : i.set(a, o), c = (a, i, o, s) => (y(a, i, "write to private field"), s ? s.call(a, o) : i.set(a, o), o);
 import { __runInitializers as d, __esDecorate as u } from "tslib";
 import { IntersectionController as x } from "@lit-labs/observers/intersection-controller.js";
 import { css as S, html as U, nothing as V, LitElement as z } from "lit";
@@ -10,8 +10,8 @@ import { customElement as I, property as C, state as E } from "lit/decorators.js
 import { SbbLanguageController as O } from "./core/controllers.js";
 import { forceType as $ } from "./core/decorators.js";
 import { i18nMapContainerButtonLabel as D } from "./core/i18n.js";
-import "./button/tertiary-button.js";
-const L = S`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-map-container-map-height-zero: 18.4375rem;--sbb-map-container-map-height-small: 20rem;--sbb-map-container-sidebar-width: 25rem;--sbb-map-container-sidebar-background-color: var(--sbb-color-white);--sbb-map-container-border-radius: var(--sbb-border-radius-4x);--sbb-map-container-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-zero) + var(--sbb-map-container-border-radius) );--sbb-map-container-mobile-sticky-block-start: 0}@media (min-width: 37.5rem){:host{--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-small) + var(--sbb-map-container-border-radius) )}}@media (min-width: 80rem){:host{--sbb-map-container-sidebar-width: 30rem}}.sbb-map-container{display:grid;grid-template-rows:auto auto}@media (min-width: 52.5rem){.sbb-map-container{grid-template-columns:max(var(--sbb-map-container-sidebar-width)) calc(100% - var(--sbb-map-container-sidebar-width));position:fixed;inset:var(--sbb-map-container-margin-start, var(--sbb-header-height)) 0 0 0}}.sbb-map-container__sidebar-button{position:fixed;left:50%;inset-block-end:var(--sbb-spacing-fixed-5x);visibility:hidden;opacity:0;transform:translate(-50%) translateY(calc(100% + var(--sbb-spacing-fixed-5x)));transition:opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing) var(--sbb-map-container-animation-duration),transform var(--sbb-map-container-animation-duration) var(--sbb-animation-easing)}:host([data-scroll-up-button-visible]) .sbb-map-container__sidebar-button{transition:visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),transform var(--sbb-map-container-animation-duration) ease-out;visibility:visible;opacity:1;transform:translate(-50%) translateY(0)}@media (min-width: 52.5rem){.sbb-map-container__sidebar-button{display:none}}.sbb-map-container__sidebar{--sbb-scrollbar-thumb-width: .5rem;--sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);--sbb-scrollbar-width-firefox: auto;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: var(--sbb-color-cloud);--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-map-container__sidebar::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-map-container__sidebar::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-map-container__sidebar::-webkit-scrollbar-button,.sbb-map-container__sidebar::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-map-container__sidebar{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-map-container__sidebar{grid-column:1/3;grid-row:2/3;width:100%;overflow:hidden auto;position:relative;border-start-end-radius:var(--sbb-map-container-border-radius);border-start-start-radius:var(--sbb-map-container-border-radius);margin-block-start:calc(var(--sbb-map-container-border-radius) * -1);background-color:var(--sbb-map-container-sidebar-background-color)}@media (min-width: 52.5rem){.sbb-map-container__sidebar{grid-column:1/2;grid-row:1/3;border-radius:0;margin-block-start:0;border-block-start:var(--sbb-border-width-1x) solid var(--sbb-color-cloud)}}.sbb-map-container__map{position:sticky;inset-block-start:0;inset-inline:0;grid-row:1/2;grid-column:1/3}@media (max-width: 52.4375rem){.sbb-map-container__map{inset-block-start:var(--sbb-map-container-mobile-sticky-block-start);height:var(--sbb-map-container-map-height)}}@media (min-width: 52.5rem){.sbb-map-container__map{grid-row:1/3;grid-column:2/3;position:relative}}`;
+import "./button/accent-button.js";
+const L = S`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-map-container-map-height-zero: 18.4375rem;--sbb-map-container-map-height-small: 20rem;--sbb-map-container-sidebar-width: 25rem;--sbb-map-container-sidebar-background-color: var(--sbb-color-white);--sbb-map-container-border-radius: var(--sbb-border-radius-4x);--sbb-map-container-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-zero) + var(--sbb-map-container-border-radius) );--sbb-map-container-mobile-sticky-block-start: 0}@media (min-width: 37.5rem){:host{--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-small) + var(--sbb-map-container-border-radius) )}}@media (min-width: 80rem){:host{--sbb-map-container-sidebar-width: 30rem}}.sbb-map-container{display:grid;grid-template-rows:auto auto}@media (min-width: 52.5rem){.sbb-map-container{grid-template-columns:max(var(--sbb-map-container-sidebar-width)) calc(100% - var(--sbb-map-container-sidebar-width));position:fixed;inset:var(--sbb-map-container-margin-start, var(--sbb-header-height)) 0 0 0}}.sbb-map-container__sidebar-button{position:fixed;left:50%;inset-block-end:var(--sbb-spacing-fixed-5x);visibility:hidden;opacity:0;transform:translate(-50%) translateY(calc(100% + var(--sbb-spacing-fixed-5x)));transition:opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing) var(--sbb-map-container-animation-duration),transform var(--sbb-map-container-animation-duration) var(--sbb-animation-easing)}:host([data-scroll-up-button-visible]) .sbb-map-container__sidebar-button{transition:visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),transform var(--sbb-map-container-animation-duration) ease-out;visibility:visible;opacity:1;transform:translate(-50%) translateY(0)}@media (min-width: 52.5rem){.sbb-map-container__sidebar-button{display:none}}.sbb-map-container__sidebar{--sbb-scrollbar-thumb-width: .5rem;--sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);--sbb-scrollbar-width-firefox: auto;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: var(--sbb-color-cloud);--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-map-container__sidebar::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-map-container__sidebar::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-map-container__sidebar::-webkit-scrollbar-button,.sbb-map-container__sidebar::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-map-container__sidebar{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-map-container__sidebar{grid-column:1/3;grid-row:2/3;width:100%;overflow:hidden auto;position:relative;border-start-end-radius:var(--sbb-map-container-border-radius);border-start-start-radius:var(--sbb-map-container-border-radius);margin-block-start:calc(var(--sbb-map-container-border-radius) * -1);background-color:var(--sbb-map-container-sidebar-background-color)}@media (min-width: 52.5rem){.sbb-map-container__sidebar{grid-column:1/2;grid-row:1/3;border-radius:0;margin-block-start:0;border-block-start:var(--sbb-border-width-1x) solid var(--sbb-color-cloud)}}.sbb-map-container__map{position:sticky;inset-block-start:0;inset-inline:0;grid-row:1/2;grid-column:1/3}@media (max-width: 52.4375rem){.sbb-map-container__map{inset-block-start:var(--sbb-map-container-mobile-sticky-block-start);height:var(--sbb-map-container-map-height)}}@media (min-width: 52.5rem){.sbb-map-container__map{grid-row:1/3;grid-column:2/3;position:relative}}`;
 let J = (() => {
   var b, n, e;
   let a = [I("sbb-map-container")], i, o = [], s, h = z, _, v = [], g = [], w, f = [], k = [];
@@ -80,7 +80,7 @@ let J = (() => {
 
           <slot></slot>
 
-          ${this.hideScrollUpButton ? V : U`<sbb-tertiary-button
+          ${this.hideScrollUpButton ? V : U`<sbb-accent-button
                 class="sbb-map-container__sidebar-button"
                 size="l"
                 icon-name="location-pin-map-small"
@@ -89,7 +89,7 @@ let J = (() => {
                 ?inert=${!this._scrollUpButtonVisible}
               >
                 ${D[this._language.current]}
-              </sbb-tertiary-button>`}
+              </sbb-accent-button>`}
         </div>
       </div>
     `;

package/menu/common.js

@@ -2,7 +2,7 @@ var l = (o) => {
   throw TypeError(o);
 };
 var u = (o, t, e) => t.has(o) || l("Cannot " + e);
-var d = (o, t, e) => (u(o, t, "read from private field"), e ? e.call(o) : t.get(o)), m = (o, t, e) => t.has(o) ? l("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(o) : t.set(o, e), f = (o, t, e, i) => (u(o, t, "write to private field"), i ? i.call(o, e) : t.set(o, e), e);
+var d = (o, t, e) => (u(o, t, "read from private field"), e ? e.call(o) : t.get(o)), m = (o, t, e) => t.has(o) ? l("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(o) : t.set(o, e), f = (o, t, e, n) => (u(o, t, "write to private field"), n ? n.call(o, e) : t.set(o, e), e);
 import { __esDecorate as g, __runInitializers as p } from "tslib";
 import { css as x, nothing as _ } from "lit";
 import { property as y } from "lit/decorators.js";
@@ -10,10 +10,10 @@ import { html as h } from "lit/static-html.js";
 import { forceType as w } from "../core/decorators.js";
 import { SbbDisabledMixin as z } from "../core/mixins.js";
 import { SbbIconNameMixin as k } from "../icon.js";
-const S = x`*,:before,:after{box-sizing:border-box}:host{outline:none!important;--sbb-menu-action-border-radius: var(--sbb-border-radius-infinity);--sbb-menu-action-outer-horizontal-padding: var(--sbb-spacing-fixed-3x);--sbb-menu-action-gap: var(--sbb-spacing-fixed-2x);--sbb-menu-action-cursor: pointer;--sbb-menu-action-color: var(--sbb-color-white);--sbb-menu-action-forced-color-border-color: CanvasText;display:block}@media (any-hover: hover){:host(:hover:not([disabled])){--sbb-menu-background-color: var(--sbb-color-iron);--sbb-menu-action-forced-color-border-color: Highlight}}:host([disabled]){--sbb-menu-action-cursor: default;--sbb-menu-action-color: var(--sbb-color-graphite);--sbb-menu-action-forced-color-border-color: GrayText;pointer-events:none;cursor:default}@media (forced-colors: active){:host([disabled]){--sbb-menu-action-color: GrayText}}@media (forced-colors: active){:host([role=button]){--sbb-menu-action-color: ButtonText}}:is(.sbb-menu-button,.sbb-menu-link){text-decoration:none;display:block;width:100%;color:var(--sbb-menu-action-color);padding:var(--sbb-spacing-fixed-1x) var(--sbb-menu-action-outer-horizontal-padding);cursor:var(--sbb-menu-action-cursor);outline:none}.sbb-menu-action__content{--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);display:flex;align-items:center;gap:var(--sbb-menu-action-gap);padding:var(--sbb-spacing-fixed-1x) var(--sbb-spacing-fixed-2x);border-radius:var(--sbb-menu-action-border-radius);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background-color:var(--sbb-menu-background-color)}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-menu-action__content,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) :focus-visible .sbb-menu-action__content{--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}@media (forced-colors: active){.sbb-menu-action__content{border:var(--sbb-border-width-2x) solid var(--sbb-menu-action-forced-color-border-color)}}.sbb-menu-action__icon{display:flex;min-width:var(--sbb-size-icon-ui-small);min-height:var(--sbb-size-icon-ui-small)}.sbb-menu-action__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([disabled]) .sbb-menu-action__label{text-decoration:line-through}.sbb-menu-action__amount{--sbb-text-font-size: var(--sbb-font-size-text-xxs);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;display:flex;align-items:center;justify-content:center;padding-inline:var(--sbb-spacing-fixed-1x);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-color-red);color:var(--sbb-color-white);min-width:fit-content;margin-inline-start:auto;width:var(--sbb-spacing-fixed-4x);max-height:var(--sbb-spacing-fixed-4x)}@media (forced-colors: active){.sbb-menu-action__amount{color:var(--sbb-menu-action-color)}}`, A = (o) => (() => {
-  var a, n;
-  let e = k(z(o)), i, b = [], c = [];
-  return n = class extends e {
+const S = x`*,:before,:after{box-sizing:border-box}:host{outline:none!important;--sbb-menu-action-border-radius: var(--sbb-border-radius-infinity);--sbb-menu-action-outer-horizontal-padding: var(--sbb-spacing-fixed-3x);--sbb-menu-action-gap: var(--sbb-spacing-fixed-2x);--sbb-menu-action-cursor: pointer;--sbb-menu-action-color: var(--sbb-color-white);--sbb-menu-action-forced-color-border-color: CanvasText;display:block}@media (any-hover: hover){:host(:hover:not([disabled],:disabled,[disabled-interactive])){--sbb-menu-background-color: var(--sbb-color-iron);--sbb-menu-action-forced-color-border-color: Highlight}}:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-menu-action-cursor: default;--sbb-menu-action-color: var(--sbb-color-graphite);--sbb-menu-action-forced-color-border-color: GrayText;pointer-events:none;cursor:default}@media (forced-colors: active){:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-menu-action-color: GrayText}}@media (forced-colors: active){:host([data-button]){--sbb-menu-action-color: ButtonText}}:is(.sbb-menu-button,.sbb-menu-link){text-decoration:none;display:block;width:100%;color:var(--sbb-menu-action-color);padding:var(--sbb-spacing-fixed-1x) var(--sbb-menu-action-outer-horizontal-padding);cursor:var(--sbb-menu-action-cursor);outline:none}.sbb-menu-action__content{--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);display:flex;align-items:center;gap:var(--sbb-menu-action-gap);padding:var(--sbb-spacing-fixed-1x) var(--sbb-spacing-fixed-2x);border-radius:var(--sbb-menu-action-border-radius);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background-color:var(--sbb-menu-background-color)}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-menu-action__content,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) :focus-visible .sbb-menu-action__content{--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}@media (forced-colors: active){.sbb-menu-action__content{border:var(--sbb-border-width-2x) solid var(--sbb-menu-action-forced-color-border-color)}}.sbb-menu-action__icon{display:flex;min-width:var(--sbb-size-icon-ui-small);min-height:var(--sbb-size-icon-ui-small)}.sbb-menu-action__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(:is([disabled],:disabled,[disabled-interactive])) .sbb-menu-action__label{text-decoration:line-through}.sbb-menu-action__amount{--sbb-text-font-size: var(--sbb-font-size-text-xxs);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;display:flex;align-items:center;justify-content:center;padding-inline:var(--sbb-spacing-fixed-1x);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-color-red);color:var(--sbb-color-white);min-width:fit-content;margin-inline-start:auto;width:var(--sbb-spacing-fixed-4x);max-height:var(--sbb-spacing-fixed-4x)}@media (forced-colors: active){.sbb-menu-action__amount{color:var(--sbb-menu-action-color)}}`, A = (o) => (() => {
+  var a, i;
+  let e = k(z(o)), n, b = [], c = [];
+  return i = class extends e {
     constructor() {
       super(...arguments);
       m(this, a, p(this, b, ""));
@@ -39,10 +39,10 @@ const S = x`*,:before,:after{box-sizing:border-box}:host{outline:none!important;
     }
   }, a = new WeakMap(), (() => {
     const s = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
-    i = [w(), y()], g(n, null, i, { kind: "accessor", name: "amount", static: !1, private: !1, access: { has: (r) => "amount" in r, get: (r) => r.amount, set: (r, v) => {
+    n = [w(), y()], g(i, null, n, { kind: "accessor", name: "amount", static: !1, private: !1, access: { has: (r) => "amount" in r, get: (r) => r.amount, set: (r, v) => {
       r.amount = v;
-    } }, metadata: s }, b, c), s && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s });
-  })(), n.styles = S, n;
+    } }, metadata: s }, b, c), s && Object.defineProperty(i, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s });
+  })(), i.styles = S, i;
 })();
 export {
   A as SbbMenuActionCommonElementMixin

package/menu/menu/menu.d.ts

@@ -48,6 +48,9 @@ export declare class SbbMenuElement extends SbbMenuElement_base {
      * Closes the menu.
      */
     close(): void;
+    private _isZeroAnimationDuration;
+    private _handleOpening;
+    private _handleClosing;
     /**
      * Handles click and checks if its target is a sbb-menu-button/sbb-menu-link.
      */

package/menu/menu/menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/elements/menu/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAYrE,OAAO,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAgBtE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;;AAkB1D;;;;;;;;;;;GAWG;AACH,qBAEM,cAAe,SAAQ,mBAGH;IACxB,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,mBAA4B,mBAAmB,WAAwC;IAEvF;;;OAGG;IACH,IACW,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,EAIpD;IACD,IAAW,OAAO,IAAI,MAAM,GAAG,WAAW,GAAG,IAAI,CAEhD;IACD,OAAO,CAAC,QAAQ,CAAqC;IAErD;;;OAGG;IACH,SAEgB,sBAAsB,EAAE,MAAM,CAAM;IAEpD,OAAO,CAAC,KAAK,CAAkB;IAC/B,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,yBAAyB,CAAkB;IACnD,OAAO,CAAC,eAAe,CAAmB;IAC1C,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,aAAa,CAAyB;IAC9C,OAAO,CAAC,cAAc,CAA0B;IAChD,OAAO,CAAC,gBAAgB,CAAgC;IACxD,OAAO,CAAC,aAAa,CAQlB;IAEH;;OAEG;IACI,IAAI,IAAI,IAAI;IAmBnB;;OAEG;IACI,KAAK,IAAI,IAAI;IAapB;;OAEG;IACH,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,cAAc;YAqBR,eAAe;IAY7B,OAAO,CAAC,2BAA2B;IAWnB,iBAAiB,IAAI,IAAI;IAgBzB,oBAAoB,IAAI,IAAI;IAQ5C,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,UAAU;IAsBlB,OAAO,CAAC,mBAAmB;IAwB3B,OAAO,CAAC,+BAA+B;IAQvC,OAAO,CAAC,oBAAoB,CAE1B;IAGF,OAAO,CAAC,qBAAqB,CAI3B;IAMF,OAAO,CAAC,mBAAmB;IA8B3B,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,gBAAgB;cAyBL,MAAM,IAAI,cAAc;CAqB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/elements/menu/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAYrE,OAAO,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAoBtE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;;AAkB1D;;;;;;;;;;;GAWG;AACH,qBAEM,cAAe,SAAQ,mBAGH;IACxB,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,mBAA4B,mBAAmB,WAAwC;IAEvF;;;OAGG;IACH,IACW,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,EAIpD;IACD,IAAW,OAAO,IAAI,MAAM,GAAG,WAAW,GAAG,IAAI,CAEhD;IACD,OAAO,CAAC,QAAQ,CAAqC;IAErD;;;OAGG;IACH,SAEgB,sBAAsB,EAAE,MAAM,CAAM;IAEpD,OAAO,CAAC,KAAK,CAAkB;IAC/B,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,yBAAyB,CAAkB;IACnD,OAAO,CAAC,eAAe,CAAmB;IAC1C,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,aAAa,CAAyB;IAC9C,OAAO,CAAC,cAAc,CAA0B;IAChD,OAAO,CAAC,gBAAgB,CAAgC;IACxD,OAAO,CAAC,aAAa,CAQlB;IAEH;;OAEG;IACI,IAAI,IAAI,IAAI;IAyBnB;;OAEG;IACI,KAAK,IAAI,IAAI;IAmBpB,OAAO,CAAC,wBAAwB;IAIhC,OAAO,CAAC,cAAc;IAStB,OAAO,CAAC,cAAc;IAoBtB;;OAEG;IACH,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,cAAc;YAqBR,eAAe;IAY7B,OAAO,CAAC,2BAA2B;IAWnB,iBAAiB,IAAI,IAAI;IAgBzB,oBAAoB,IAAI,IAAI;IAQ5C,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,UAAU;IAsBlB,OAAO,CAAC,mBAAmB;IAwB3B,OAAO,CAAC,+BAA+B;IAQvC,OAAO,CAAC,oBAAoB,CAE1B;IAGF,OAAO,CAAC,qBAAqB,CAI3B;IAMF,OAAO,CAAC,mBAAmB;IAS3B,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,gBAAgB;cAyBL,MAAM,IAAI,cAAc;CAqB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}

package/menu/menu.js

@@ -1,20 +1,20 @@
-var y = (s) => {
-  throw TypeError(s);
+var y = (n) => {
+  throw TypeError(n);
 };
-var k = (s, n, r) => n.has(s) || y("Cannot " + r);
-var x = (s, n, r) => (k(s, n, "read from private field"), r ? r.call(s) : n.get(s)), E = (s, n, r) => n.has(s) ? y("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(s) : n.set(s, r), h = (s, n, r, o) => (k(s, n, "write to private field"), o ? o.call(s, r) : n.set(s, r), r);
+var k = (n, s, r) => s.has(n) || y("Cannot " + r);
+var x = (n, s, r) => (k(n, s, "read from private field"), r ? r.call(n) : s.get(n)), E = (n, s, r) => s.has(n) ? y("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(n) : s.set(n, r), h = (n, s, r, o) => (k(n, s, "write to private field"), o ? o.call(n, r) : s.set(n, r), r);
 import { __runInitializers as d, __esDecorate as m } from "tslib";
-import { css as N, html as C } from "lit";
-import { customElement as O, property as L } from "lit/decorators.js";
+import { css as O, html as C } from "lit";
+import { customElement as N, property as L } from "lit/decorators.js";
 import { ref as B } from "lit/directives/ref.js";
-import { SbbFocusHandler as M, isArrowKeyPressed as T, interactivityChecker as I, getNextElementIndex as P, setModalityOnNextFocus as S, IS_FOCUSABLE_QUERY as H } from "../core/a11y.js";
-import { SbbOpenCloseBaseElement as z } from "../core/base-elements.js";
-import { SbbConnectedAbortController as K, SbbInertController as D, SbbMediaMatcherController as F, SbbMediaQueryBreakpointSmallAndBelow as u } from "../core/controllers.js";
+import { SbbFocusHandler as M, setModalityOnNextFocus as A, isArrowKeyPressed as T, interactivityChecker as I, getNextElementIndex as D, IS_FOCUSABLE_QUERY as P } from "../core/a11y.js";
+import { SbbOpenCloseBaseElement as H } from "../core/base-elements.js";
+import { SbbConnectedAbortController as K, SbbInertController as z, SbbMediaMatcherController as F, SbbMediaQueryBreakpointSmallAndBelow as u } from "../core/controllers.js";
 import { forceType as U } from "../core/decorators.js";
-import { SbbScrollHandler as $, findReferencedElement as R } from "../core/dom.js";
-import { SbbNamedSlotListMixin as Y } from "../core/mixins.js";
-import { isEventOnElement as A, removeAriaOverlayTriggerAttributes as q, setAriaOverlayTriggerAttributes as V, getElementPosition as j } from "../core/overlay.js";
-const Q = N`*,:before,:after{box-sizing:border-box}:host{display:contents;--sbb-menu-position-x: 0;--sbb-menu-position-y: 0;--sbb-menu-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-menu-animation-easing: ease;--sbb-menu-transform: translateY(100%);--sbb-menu-max-width: 100%;--sbb-menu-min-width: 100%;--sbb-menu-inset: 0 auto auto 0;--sbb-menu-container-height: 100dvh;--sbb-menu-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-menu-min-height: 3.03125rem;--sbb-menu-border-radius: var(--sbb-border-radius-4x);--sbb-menu-visibility: hidden;--sbb-menu-backdrop-color: transparent}@media (min-width: 52.5rem){:host{--sbb-menu-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-menu-max-width: 20rem;--sbb-menu-min-width: 11.25rem}}:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-visibility: visible;--sbb-menu-backdrop-color: var(--sbb-color-black-alpha-20)}@media (min-width: 52.5rem){:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-backdrop-color: transparent}}:host(:not([data-state=closed])){--sbb-menu-inset: 0}::slotted(:not(sbb-menu-button,sbb-menu-link,sbb-divider)){display:block;padding-inline:var(--sbb-spacing-fixed-5x)}::slotted(sbb-divider){--sbb-divider-color: var(--sbb-color-iron);margin-block:var(--sbb-spacing-fixed-2x)}.sbb-menu__container{position:fixed;pointer-events:none;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);z-index:var(--sbb-menu-z-index, var(--sbb-overlay-default-z-index))}.sbb-menu__container:before{content:"";visibility:var(--sbb-menu-visibility);pointer-events:all;position:fixed;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);background-color:var(--sbb-menu-backdrop-color);transition-duration:var(--sbb-menu-animation-duration);transition-timing-function:var(--sbb-menu-animation-easing);transition-property:background-color,visibility}.sbb-menu{display:none;opacity:0;pointer-events:none;max-width:var(--sbb-menu-max-width);min-width:var(--sbb-menu-min-width);text-align:start;position:absolute;inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:unset;color:var(--sbb-color-white);border:none;border-radius:var(--sbb-menu-border-radius) var(--sbb-menu-border-radius) 0 0;background-color:var(--sbb-color-black);padding:0;overflow:hidden}:host([data-state]:not([data-state=closed])) .sbb-menu{display:block;opacity:1;pointer-events:all;animation-name:open;animation-duration:var(--sbb-menu-animation-duration);animation-timing-function:var(--sbb-menu-animation-easing)}:host([data-state][data-state=closing]) .sbb-menu{pointer-events:none;animation-name:close}@media (forced-colors: active){.sbb-menu{outline:var(--sbb-border-width-1x) solid CanvasText}}@media (min-width: 52.5rem){.sbb-menu{top:0;bottom:unset;left:0;right:unset;max-height:fit-content;border-radius:var(--sbb-menu-border-radius)}:host(:not([data-state=closed])) .sbb-menu{top:var(--sbb-menu-position-y);left:var(--sbb-menu-position-x);max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}}.sbb-menu__content{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-menu__content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-menu__content::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-menu__content::-webkit-scrollbar-button,.sbb-menu__content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-menu__content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-menu__content{max-height:var(--sbb-menu-max-height);padding-block:var(--sbb-spacing-fixed-1x);overflow:auto;outline:none}.sbb-menu__content:after{content:"";display:block;height:var(--sbb-spacing-fixed-8x)}@media (min-width: 52.5rem){.sbb-menu__content{max-height:fit-content}:host(:not([data-state=closed])) .sbb-menu__content{max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}.sbb-menu__content:after{display:none}}.sbb-menu-list{list-style:none;margin:0;padding:0;font-size:inherit}@keyframes open{0%{opacity:0;transform:var(--sbb-menu-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-menu-transform)}}`, W = 8, G = [
+import { SbbScrollHandler as $, isZeroAnimationDuration as R, findReferencedElement as Y } from "../core/dom.js";
+import { SbbNamedSlotListMixin as q } from "../core/mixins.js";
+import { isEventOnElement as S, removeAriaOverlayTriggerAttributes as Z, setAriaOverlayTriggerAttributes as V, getElementPosition as j } from "../core/overlay.js";
+const Q = O`*,:before,:after{box-sizing:border-box}:host{display:contents;--sbb-menu-position-x: 0;--sbb-menu-position-y: 0;--sbb-menu-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-menu-animation-easing: ease;--sbb-menu-transform: translateY(100%);--sbb-menu-max-width: 100%;--sbb-menu-min-width: 100%;--sbb-menu-inset: 0 auto auto 0;--sbb-menu-container-height: 100dvh;--sbb-menu-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-menu-min-height: 3.03125rem;--sbb-menu-border-radius: var(--sbb-border-radius-4x);--sbb-menu-visibility: hidden;--sbb-menu-backdrop-color: transparent}@media (min-width: 52.5rem){:host{--sbb-menu-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-menu-max-width: 20rem;--sbb-menu-min-width: 11.25rem}}:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-visibility: visible;--sbb-menu-backdrop-color: var(--sbb-color-black-alpha-20)}@media (min-width: 52.5rem){:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-backdrop-color: transparent}}:host(:not([data-state=closed])){--sbb-menu-inset: 0}::slotted(:not(sbb-menu-button,sbb-menu-link,sbb-divider)){display:block;padding-inline:var(--sbb-spacing-fixed-5x)}::slotted(sbb-divider){--sbb-divider-color: var(--sbb-color-iron);margin-block:var(--sbb-spacing-fixed-2x)}.sbb-menu__container{position:fixed;pointer-events:none;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);z-index:var(--sbb-menu-z-index, var(--sbb-overlay-default-z-index))}.sbb-menu__container:before{content:"";visibility:var(--sbb-menu-visibility);pointer-events:all;position:fixed;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);background-color:var(--sbb-menu-backdrop-color);transition-duration:var(--sbb-menu-animation-duration);transition-timing-function:var(--sbb-menu-animation-easing);transition-property:background-color,visibility}.sbb-menu{display:none;opacity:0;pointer-events:none;max-width:var(--sbb-menu-max-width);min-width:var(--sbb-menu-min-width);text-align:start;position:absolute;inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:unset;color:var(--sbb-color-white);border:none;border-radius:var(--sbb-menu-border-radius) var(--sbb-menu-border-radius) 0 0;background-color:var(--sbb-color-black);padding:0;overflow:hidden}:host([data-state]:not([data-state=closed])) .sbb-menu{display:block;opacity:1;pointer-events:all;animation-name:open;animation-duration:var(--sbb-menu-animation-duration);animation-timing-function:var(--sbb-menu-animation-easing)}:host([data-state][data-state=closing]) .sbb-menu{pointer-events:none;animation-name:close}@media (forced-colors: active){.sbb-menu{outline:var(--sbb-border-width-1x) solid CanvasText}}@media (min-width: 52.5rem){.sbb-menu{top:0;bottom:unset;left:0;right:unset;max-height:fit-content;border-radius:var(--sbb-menu-border-radius)}:host(:not([data-state=closed])) .sbb-menu{top:var(--sbb-menu-position-y);left:var(--sbb-menu-position-x);max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}}.sbb-menu__content{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-menu__content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-menu__content::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-menu__content::-webkit-scrollbar-button,.sbb-menu__content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-menu__content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-menu__content{max-height:var(--sbb-menu-max-height);padding-block:var(--sbb-spacing-fixed-1x);overflow:auto;outline:none}.sbb-menu__content:after{content:"";display:block;height:var(--sbb-spacing-fixed-8x)}@media (min-width: 52.5rem){.sbb-menu__content{max-height:fit-content}:host(:not([data-state=closed])) .sbb-menu__content{max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}.sbb-menu__content:after{display:none}}.sbb-menu-list{list-style:none;margin:0;padding:0;font-size:inherit}@keyframes open{0%{opacity:0;transform:var(--sbb-menu-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-menu-transform)}}`, W = 8, G = [
   "A",
   "BUTTON",
   "SBB-BUTTON",
@@ -24,21 +24,21 @@ const Q = N`*,:before,:after{box-sizing:border-box}:host{display:contents;--sbb-
   "SBB-LINK-BUTTON",
   "SBB-BLOCK-LINK-BUTTON"
 ];
-let J = 0, dt = (() => {
-  var c, a;
-  let s = [O("sbb-menu")], n, r = [], o, g = Y(z), _ = [], v, p, f = [], w = [];
-  return a = class extends g {
+let J = 0, ht = (() => {
+  var b, a;
+  let n = [N("sbb-menu")], s, r = [], o, _ = q(H), g = [], v, p, f = [], w = [];
+  return a = class extends _ {
     constructor() {
       super(...arguments);
-      E(this, c);
-      this.listChildLocalNames = (d(this, _), ["sbb-menu-button", "sbb-menu-link"]), this._trigger = null, h(this, c, d(this, f, "")), this._menu = d(this, w), this._triggerElement = null, this._isPointerDownEventOnMenu = !1, this._abort = new K(this), this._focusHandler = new M(), this._scrollHandler = new $(), this._inertController = new D(this), this._mediaMatcher = new F(this, {
+      E(this, b);
+      this.listChildLocalNames = (d(this, g), ["sbb-menu-button", "sbb-menu-link"]), this._trigger = null, h(this, b, d(this, f, "")), this._menu = d(this, w), this._triggerElement = null, this._isPointerDownEventOnMenu = !1, this._abort = new K(this), this._focusHandler = new M(), this._scrollHandler = new $(), this._inertController = new z(this), this._mediaMatcher = new F(this, {
         [u]: (t) => {
           t && (this.state === "opening" || this.state === "opened") ? this._scrollHandler.disableScroll() : this._scrollHandler.enableScroll();
         }
       }), this._pointerDownListener = (t) => {
-        this._isPointerDownEventOnMenu = A(this._menu, t);
+        this._isPointerDownEventOnMenu = S(this._menu, t);
       }, this._closeOnBackdropClick = (t) => {
-        !this._isPointerDownEventOnMenu && !A(this._menu, t) && this.close();
+        !this._isPointerDownEventOnMenu && !S(this._menu, t) && this.close();
       };
     }
     /**
@@ -57,24 +57,37 @@ let J = 0, dt = (() => {
      * Used only if the menu automatically renders the actions inside as a list.
      */
     get listAccessibilityLabel() {
-      return x(this, c);
+      return x(this, b);
     }
     set listAccessibilityLabel(t) {
-      h(this, c, t);
+      h(this, b, t);
     }
     /**
      * Opens the menu on trigger click.
      */
     open() {
       var t;
-      this.state === "closing" || !this._menu || this.willOpen.emit() && (this.state = "opening", this._setMenuPosition(), (t = this._triggerElement) == null || t.setAttribute("aria-expanded", "true"), this._mediaMatcher.matches(u) && this._scrollHandler.disableScroll());
+      this.state === "closing" || !this._menu || this.willOpen.emit() && (this.state = "opening", this._setMenuPosition(), (t = this._triggerElement) == null || t.setAttribute("aria-expanded", "true"), this._mediaMatcher.matches(u) && this._scrollHandler.disableScroll(), this._isZeroAnimationDuration() && this._handleOpening());
     }
     /**
      * Closes the menu.
      */
     close() {
       var t;
-      this.state !== "opening" && this.willClose.emit() && (this.state = "closing", (t = this._triggerElement) == null || t.setAttribute("aria-expanded", "false"));
+      this.state !== "opening" && this.willClose.emit() && (this.state = "closing", (t = this._triggerElement) == null || t.setAttribute("aria-expanded", "false"), this._isZeroAnimationDuration() && this._handleClosing());
+    }
+    _isZeroAnimationDuration() {
+      return R(this, "--sbb-menu-animation-duration");
+    }
+    _handleOpening() {
+      this.state = "opened", this.didOpen.emit(), this._inertController.activate(), this._setMenuFocus(), this._focusHandler.trap(this), this._attachWindowEvents();
+    }
+    _handleClosing() {
+      var t, e, i, l;
+      this.state = "closed", (e = (t = this._menu) == null ? void 0 : t.firstElementChild) == null || e.scrollTo(0, 0), this._inertController.deactivate(), A(this._triggerElement), (i = this._triggerElement) == null || i.focus({
+        // When inside the sbb-header, we prevent the scroll to avoid the snapping to the top of the page
+        preventScroll: this._triggerElement.localName === "sbb-header-button" || this._triggerElement.localName === "sbb-header-link"
+      }), this.didClose.emit(), (l = this._windowEventsController) == null || l.abort(), this._focusHandler.disconnect(), this._scrollHandler.enableScroll();
     }
     /**
      * Handles click and checks if its target is a sbb-menu-button/sbb-menu-link.
@@ -87,8 +100,8 @@ let J = 0, dt = (() => {
       if (!T(t))
         return;
       t.preventDefault();
-      const e = Array.from(this.querySelectorAll("sbb-menu-button, sbb-menu-link")).filter((l) => (!l.disabled || l.disabledInteractive) && I.isVisible(l)), i = e.findIndex((l) => l === t.target), b = P(t, i, e.length);
-      e[b].focus();
+      const e = Array.from(this.querySelectorAll("sbb-menu-button, sbb-menu-link")).filter((c) => (!c.disabled || c.disabledInteractive) && I.isVisible(c)), i = e.findIndex((c) => c === t.target), l = D(t, i, e.length);
+      e[l].focus();
     }
     // Closes the menu on "Esc" key pressed and traps focus within the menu.
     async _onKeydownEvent(t) {
@@ -99,8 +112,8 @@ let J = 0, dt = (() => {
     }
     // Removes trigger click listener on trigger change.
     _removeTriggerClickListener(t, e) {
-      var i, b;
-      t !== e && ((i = this._menuController) == null || i.abort(), (b = this._windowEventsController) == null || b.abort(), this._configure(this.trigger));
+      var i, l;
+      t !== e && ((i = this._menuController) == null || i.abort(), (l = this._windowEventsController) == null || l.abort(), this._configure(this.trigger));
     }
     connectedCallback() {
       var e;
@@ -122,7 +135,7 @@ let J = 0, dt = (() => {
     // Check if the trigger is valid and attach click event listeners.
     _configure(t) {
       var e;
-      q(this._triggerElement), t && (this._triggerElement = R(t), this._triggerElement && (this.id = this.id || `sbb-menu-${J++}`, V(this._triggerElement, "menu", this.id, this.state), (e = this._menuController) == null || e.abort(), this._menuController = new AbortController(), this._triggerElement.addEventListener("click", () => this.open(), {
+      Z(this._triggerElement), t && (this._triggerElement = Y(t), this._triggerElement && (this.id = this.id || `sbb-menu-${J++}`, V(this._triggerElement, "menu", this.id, this.state), (e = this._menuController) == null || e.abort(), this._menuController = new AbortController(), this._triggerElement.addEventListener("click", () => this.open(), {
         signal: this._menuController.signal
       })));
     }
@@ -151,16 +164,12 @@ let J = 0, dt = (() => {
     // In rare cases it can be that the animationEnd event is triggered twice.
     // To avoid entering a corrupt state, exit when state is not expected.
     _onMenuAnimationEnd(t) {
-      var e, i, b, l;
-      t.animationName === "open" && this.state === "opening" ? (this.state = "opened", this.didOpen.emit(), this._inertController.activate(), this._setMenuFocus(), this._focusHandler.trap(this), this._attachWindowEvents()) : t.animationName === "close" && this.state === "closing" && (this.state = "closed", (i = (e = this._menu) == null ? void 0 : e.firstElementChild) == null || i.scrollTo(0, 0), this._inertController.deactivate(), S(this._triggerElement), (b = this._triggerElement) == null || b.focus({
-        // When inside the sbb-header, we prevent the scroll to avoid the snapping to the top of the page
-        preventScroll: this._triggerElement.localName === "sbb-header-button" || this._triggerElement.localName === "sbb-header-link"
-      }), this.didClose.emit(), (l = this._windowEventsController) == null || l.abort(), this._focusHandler.disconnect(), this._scrollHandler.enableScroll());
+      t.animationName === "open" && this.state === "opening" ? this._handleOpening() : t.animationName === "close" && this.state === "closing" && this._handleClosing();
     }
     // Set focus on the first focusable element.
     _setMenuFocus() {
-      const t = this.querySelector(H);
-      S(t), t.focus();
+      const t = this.querySelector(P);
+      A(t), t.focus();
     }
     // Set menu position and max height if the breakpoint is medium-ultra.
     _setMenuPosition() {
@@ -175,7 +184,7 @@ let J = 0, dt = (() => {
       return C`
       <div class="sbb-menu__container">
         <div
-          @animationend=${(t) => this._onMenuAnimationEnd(t)}
+          @animationend=${this._onMenuAnimationEnd}
           class="sbb-menu"
           ${B((t) => this._menu = t)}
         >
@@ -189,15 +198,15 @@ let J = 0, dt = (() => {
       </div>
     `;
     }
-  }, c = new WeakMap(), o = a, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(g[Symbol.metadata] ?? null) : void 0;
+  }, b = new WeakMap(), o = a, (() => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(_[Symbol.metadata] ?? null) : void 0;
     v = [L()], p = [U(), L({ attribute: "list-accessibility-label" })], m(a, null, v, { kind: "setter", name: "trigger", static: !1, private: !1, access: { has: (e) => "trigger" in e, set: (e, i) => {
       e.trigger = i;
-    } }, metadata: t }, null, _), m(a, null, p, { kind: "accessor", name: "listAccessibilityLabel", static: !1, private: !1, access: { has: (e) => "listAccessibilityLabel" in e, get: (e) => e.listAccessibilityLabel, set: (e, i) => {
+    } }, metadata: t }, null, g), m(a, null, p, { kind: "accessor", name: "listAccessibilityLabel", static: !1, private: !1, access: { has: (e) => "listAccessibilityLabel" in e, get: (e) => e.listAccessibilityLabel, set: (e, i) => {
       e.listAccessibilityLabel = i;
-    } }, metadata: t }, f, w), m(null, n = { value: o }, s, { kind: "class", name: o.name, metadata: t }, null, r), o = n.value, t && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+    } }, metadata: t }, f, w), m(null, s = { value: o }, n, { kind: "class", name: o.name, metadata: t }, null, r), o = s.value, t && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
   })(), a.styles = Q, d(o, r), o;
 })();
 export {
-  dt as SbbMenuElement
+  ht as SbbMenuElement
 };

package/navigation/common/navigation-action-common.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-action-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/navigation/common/navigation-action-common.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAExE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAGhE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAI5E,OAAO,eAAe,CAAC;AAEvB,MAAM,MAAM,uBAAuB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEtD,MAAM,CAAC,OAAO,OAAO,yCAAyC;IAC5D,SAAgB,IAAI,EAAE,uBAAuB,CAAC;IAC9C,IAAW,MAAM,IAAI,0BAA0B,GAAG,IAAI,CAAC;IACvD,IAAW,OAAO,IAAI,2BAA2B,GAAG,IAAI,CAAC;IAClD,gBAAgB,EAAE,2BAA2B,GAAG,IAAI,CAAC;CAC7D;AAGD,eAAO,MAAM,qCAAqC,GAChD,CAAC,SAAS,mBAAmB,CAAC,oBAAoB,CAAC,cAEvC,CAAC,KACZ,mBAAmB,CAAC,yCAAyC,CAAC,GAAG,CA4DnE,CAAC"}
+{"version":3,"file":"navigation-action-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/navigation/common/navigation-action-common.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAGxE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAGhE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAI5E,OAAO,eAAe,CAAC;AAEvB,MAAM,MAAM,uBAAuB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEtD,MAAM,CAAC,OAAO,OAAO,yCAAyC;IAC5D,SAAgB,IAAI,EAAE,uBAAuB,CAAC;IAC9C,IAAW,MAAM,IAAI,0BAA0B,GAAG,IAAI,CAAC;IACvD,IAAW,OAAO,IAAI,2BAA2B,GAAG,IAAI,CAAC;IAClD,gBAAgB,EAAE,2BAA2B,GAAG,IAAI,CAAC;CAC7D;AAGD,eAAO,MAAM,qCAAqC,GAChD,CAAC,SAAS,mBAAmB,CAAC,oBAAoB,CAAC,cAEvC,CAAC,KACZ,mBAAmB,CAAC,yCAAyC,CAAC,GAAG,CAiEnE,CAAC"}