@sbb-esta/lyne-elements-dev 0.0.0 → 4.5.1-dev.1771849268

package/development/loading-indicator/loading-indicator.component.js

@@ -0,0 +1,255 @@
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+import { __esDecorate, __runInitializers } from "tslib";
+import { css, LitElement, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { SbbElementInternalsMixin } from "../core/mixins.js";
+import { boxSizingStyles } from "../core/styles.js";
+const style = css`@charset "UTF-8";
+:host {
+  --sbb-loading-indicator-color: var(--sbb-color-primary);
+  --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) * 0.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: "​";
+  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);
+  }
+  100% {
+    translate: 0;
+  }
+}
+@keyframes loading-rectangle1 {
+  0% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@keyframes loading-rectangle2 {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0.5;
+  }
+}
+@keyframes loading-rectangle3 {
+  0% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@keyframes loading-rectangle4 {
+  0% {
+    opacity: 0.25;
+  }
+  100% {
+    opacity: 0.5;
+  }
+}
+@keyframes loading-rectangle5 {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 0.25;
+  }
+}`;
+let SbbLoadingIndicatorElement = (() => {
+  var _size_accessor_storage, _color_accessor_storage, _a;
+  let _classDecorators = [customElement("sbb-loading-indicator")];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbElementInternalsMixin(LitElement);
+  let _size_decorators;
+  let _size_initializers = [];
+  let _size_extraInitializers = [];
+  let _color_decorators;
+  let _color_initializers = [];
+  let _color_extraInitializers = [];
+  _a = class extends _classSuper {
+    constructor() {
+      super(...arguments);
+      __privateAdd(this, _size_accessor_storage, __runInitializers(this, _size_initializers, "s"));
+      __privateAdd(this, _color_accessor_storage, (__runInitializers(this, _size_extraInitializers), __runInitializers(this, _color_initializers, "default")));
+      __runInitializers(this, _color_extraInitializers);
+    }
+    /** Size variant, either s or m. */
+    get size() {
+      return __privateGet(this, _size_accessor_storage);
+    }
+    set size(value) {
+      __privateSet(this, _size_accessor_storage, value);
+    }
+    /** Color variant. */
+    get color() {
+      return __privateGet(this, _color_accessor_storage);
+    }
+    set color(value) {
+      __privateSet(this, _color_accessor_storage, value);
+    }
+    connectedCallback() {
+      super.connectedCallback();
+      this.internals.ariaBusy = "true";
+    }
+    render() {
+      return html`
+      <span class="sbb-loading-indicator">
+        <span class="sbb-loading-indicator__animated-element">
+          <span>
+            <span>
+              <span></span>
+              <span></span>
+              <span></span>
+              <span></span>
+              <span></span>
+            </span>
+          </span>
+        </span>
+      </span>
+    `;
+    }
+  }, _size_accessor_storage = new WeakMap(), _color_accessor_storage = new WeakMap(), _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    _size_decorators = [property({ reflect: true })];
+    _color_decorators = [property({ reflect: true })];
+    __esDecorate(_a, null, _size_decorators, { kind: "accessor", name: "size", static: false, private: false, access: { has: (obj) => "size" in obj, get: (obj) => obj.size, set: (obj, value) => {
+      obj.size = value;
+    } }, metadata: _metadata }, _size_initializers, _size_extraInitializers);
+    __esDecorate(_a, null, _color_decorators, { kind: "accessor", name: "color", static: false, private: false, access: { has: (obj) => "color" in obj, get: (obj) => obj.color, set: (obj, value) => {
+      obj.color = value;
+    } }, metadata: _metadata }, _color_initializers, _color_extraInitializers);
+    __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+    _classThis = _classDescriptor.value;
+    if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+  })(), _a.role = "progressbar", _a.styles = [boxSizingStyles, style], __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbLoadingIndicatorElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3IuY29tcG9uZW50LmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvbG9hZGluZy1pbmRpY2F0b3IvbG9hZGluZy1pbmRpY2F0b3IuY29tcG9uZW50LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgQ1NTUmVzdWx0R3JvdXAsIFRlbXBsYXRlUmVzdWx0IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGh0bWwsIExpdEVsZW1lbnQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHkgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB7IFNiYkVsZW1lbnRJbnRlcm5hbHNNaXhpbiB9IGZyb20gJy4uL2NvcmUvbWl4aW5zLnRzJztcbmltcG9ydCB7IGJveFNpemluZ1N0eWxlcyB9IGZyb20gJy4uL2NvcmUvc3R5bGVzLnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vbG9hZGluZy1pbmRpY2F0b3Iuc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyBhIGxvYWRpbmcgaW5kaWNhdG9yLlxuICovXG5leHBvcnRcbkBjdXN0b21FbGVtZW50KCdzYmItbG9hZGluZy1pbmRpY2F0b3InKVxuY2xhc3MgU2JiTG9hZGluZ0luZGljYXRvckVsZW1lbnQgZXh0ZW5kcyBTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW4oTGl0RWxlbWVudCkge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHJlYWRvbmx5IHJvbGUgPSAncHJvZ3Jlc3NiYXInO1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBbYm94U2l6aW5nU3R5bGVzLCBzdHlsZV07XG5cbiAgLyoqIFNpemUgdmFyaWFudCwgZWl0aGVyIHMgb3IgbS4gKi9cbiAgQHByb3BlcnR5KHsgcmVmbGVjdDogdHJ1ZSB9KSBwdWJsaWMgYWNjZXNzb3Igc2l6ZTogJ3MnIHwgJ2wnIHwgJ3hsJyB8ICd4eGwnIHwgJ3h4eGwnID0gJ3MnO1xuXG4gIC8qKiBDb2xvciB2YXJpYW50LiAqL1xuICBAcHJvcGVydHkoeyByZWZsZWN0OiB0cnVlIH0pIHB1YmxpYyBhY2Nlc3NvciBjb2xvcjogJ2RlZmF1bHQnIHwgJ3Ntb2tlJyB8ICd3aGl0ZScgPSAnZGVmYXVsdCc7XG5cbiAgcHVibGljIG92ZXJyaWRlIGNvbm5lY3RlZENhbGxiYWNrKCk6IHZvaWQge1xuICAgIHN1cGVyLmNvbm5lY3RlZENhbGxiYWNrKCk7XG4gICAgdGhpcy5pbnRlcm5hbHMuYXJpYUJ1c3kgPSAndHJ1ZSc7XG4gIH1cblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVuZGVyKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGBcbiAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWxvYWRpbmctaW5kaWNhdG9yXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWxvYWRpbmctaW5kaWNhdG9yX19hbmltYXRlZC1lbGVtZW50XCI+XG4gICAgICAgICAgPHNwYW4+XG4gICAgICAgICAgICA8c3Bhbj5cbiAgICAgICAgICAgICAgPHNwYW4+PC9zcGFuPlxuICAgICAgICAgICAgICA8c3Bhbj48L3NwYW4+XG4gICAgICAgICAgICAgIDxzcGFuPjwvc3Bhbj5cbiAgICAgICAgICAgICAgPHNwYW4+PC9zcGFuPlxuICAgICAgICAgICAgICA8c3Bhbj48L3NwYW4+XG4gICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgPC9zcGFuPlxuICAgICAgICA8L3NwYW4+XG4gICAgICA8L3NwYW4+XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLWxvYWRpbmctaW5kaWNhdG9yJzogU2JiTG9hZGluZ0luZGljYXRvckVsZW1lbnQ7XG4gIH1cbn1cbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFjTSw4QkFBMEIsTUFBQTs7MEJBRC9CLGNBQWMsdUJBQXVCLENBQUM7Ozs7b0JBQ0UseUJBQXlCLFVBQVU7Ozs7Ozs7QUFBM0MsRUFBQSxtQkFBUSxZQUFvQztBQUFBOztBQUs5QyxpREFBQSxrQkFBQSxNQUFBLG9CQUEwRCxHQUFHO0FBRzdELG1EQUFBLGtCQUFBLE1BQUEsdUJBQUEsR0FBQSxrQkFBQSxNQUFBLHFCQUF1RCxTQUFTOzs7O0lBSGhFLElBQWdCLE9BQUk7QUFBQSxhQUFBLG1CQUFBO0FBQUEsSUFBQTtBQUFBLElBQXBCLElBQWdCLEtBQUksT0FBQTtBQUFBLHlCQUFBLHdCQUFBO0FBQUEsSUFBQTtBQUFBO0FBQUEsSUFHcEIsSUFBZ0IsUUFBSztBQUFBLGFBQUEsbUJBQUE7QUFBQSxJQUFBO0FBQUEsSUFBckIsSUFBZ0IsTUFBSyxPQUFBO0FBQUEseUJBQUEseUJBQUE7QUFBQSxJQUFBO0FBQUEsSUFFbEMsb0JBQWlCO0FBQy9CLFlBQU0sa0JBQUE7QUFDTixXQUFLLFVBQVUsV0FBVztBQUFBLElBQzVCO0FBQUEsSUFFbUIsU0FBTTtBQUN2QixhQUFPO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLElBZVQ7QUFBQSxLQTFCNkIsd0NBR0E7O0FBSDVCLHVCQUFBLENBQUEsU0FBUyxFQUFFLFNBQVMsS0FBQSxDQUFNLENBQUM7QUFHM0Isd0JBQUEsQ0FBQSxTQUFTLEVBQUUsU0FBUyxLQUFBLENBQU0sQ0FBQztBQUhDLGlCQUFBLElBQUEsTUFBQSxrQkFBQSxFQUFBLE1BQUEsWUFBQSxNQUFBLFFBQUEsUUFBQSxPQUFBLFNBQUEsT0FBQSxRQUFBLEVBQUEsS0FBQSxDQUFBLFFBQUEsVUFBQSxLQUFBLEtBQUEsQ0FBQSxRQUFBLElBQWdCLE1BQUksS0FBQSxDQUFBLEtBQUEsVUFBQTtBQUFBLFVBQUosT0FBSTtBQUFBLElBQUEsS0FBQSxVQUFBLFVBQUEsR0FBQSxvQkFBQSx1QkFBQTtBQUdwQixpQkFBQSxJQUFBLE1BQUEsbUJBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxTQUFBLFFBQUEsT0FBQSxTQUFBLE9BQUEsUUFBQSxFQUFBLEtBQUEsQ0FBQSxRQUFBLFdBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFnQixPQUFLLEtBQUEsQ0FBQSxLQUFBLFVBQUE7QUFBQSxVQUFMLFFBQUs7QUFBQSxJQUFBLEtBQUEsVUFBQSxVQUFBLEdBQUEscUJBQUEsd0JBQUE7QUFScEQsaUJBQUEsTUFBQSxtQkFBQSxFQUFBLE9BQUEsV0FBQSxHQUFBLGtCQUFBLEVBQUEsTUFBQSxTQUFBLE1BQUEsV0FBQSxNQUFBLFVBQUEsVUFBQSxHQUFBLE1BQUEsdUJBQUE7OztRQUNrQyxHQUFBLE9BQU8sZUFDaEIsR0FBQSxTQUF5QixDQUFDLGlCQUFpQixLQUFLLEdBRm5FLGtCQUFBLFlBQUEsdUJBQUEsR0FBMkI7OzsifQ==

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

@@ -0,0 +1,20 @@
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
+declare const SbbLoadingIndicatorCircleElement_base: import('../core/mixins.ts').AbstractConstructor<import('../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../core/mixins.ts').SbbElementInternalsConstructor;
+/**
+ * It displays a circle loading indicator.
+ */
+export declare class SbbLoadingIndicatorCircleElement extends SbbLoadingIndicatorCircleElement_base {
+    static readonly role = "progressbar";
+    static styles: CSSResultGroup;
+    /** Color variant. */
+    accessor color: 'default' | 'smoke' | 'white';
+    connectedCallback(): void;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-loading-indicator-circle': SbbLoadingIndicatorCircleElement;
+    }
+}
+export {};
+//# sourceMappingURL=loading-indicator-circle.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"loading-indicator-circle.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/loading-indicator-circle/loading-indicator-circle.component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AAQvC;;GAEG;AACH,qBAEM,gCAAiC,SAAQ,qCAAoC;IACjF,gBAAgC,IAAI,iBAAiB;IACrD,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE,qBAAqB;IACrB,SAA6C,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,OAAO,CAAa;IAE9E,iBAAiB,IAAI,IAAI;cAKtB,MAAM,IAAI,cAAc;CAO5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,8BAA8B,EAAE,gCAAgC,CAAC;KAClE;CACF"}

package/development/loading-indicator-circle/loading-indicator-circle.component.js

@@ -0,0 +1,142 @@
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+import { __esDecorate, __runInitializers } from "tslib";
+import { css, LitElement, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { SbbElementInternalsMixin } from "../core/mixins.js";
+import { boxSizingStyles } from "../core/styles.js";
+const style = css`:host {
+  display: inline-block;
+  line-height: 0;
+  --sbb-loading-indicator-circle-color: var(--sbb-color-primary);
+  --sbb-loading-indicator-circle-padding: 0.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,
+    transparent,
+    var(--sbb-loading-indicator-circle-color)
+  );
+  --sbb-loading-indicator-circle-animated-width: 0.1875em;
+  --sbb-loading-indicator-circle-animated-height: 0.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 0.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 {
+  from {
+    rotate: 0deg;
+  }
+  to {
+    rotate: 359deg;
+  }
+}`;
+let SbbLoadingIndicatorCircleElement = (() => {
+  var _color_accessor_storage, _a;
+  let _classDecorators = [customElement("sbb-loading-indicator-circle")];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbElementInternalsMixin(LitElement);
+  let _color_decorators;
+  let _color_initializers = [];
+  let _color_extraInitializers = [];
+  _a = class extends _classSuper {
+    constructor() {
+      super(...arguments);
+      __privateAdd(this, _color_accessor_storage, __runInitializers(this, _color_initializers, "default"));
+      __runInitializers(this, _color_extraInitializers);
+    }
+    /** Color variant. */
+    get color() {
+      return __privateGet(this, _color_accessor_storage);
+    }
+    set color(value) {
+      __privateSet(this, _color_accessor_storage, value);
+    }
+    connectedCallback() {
+      super.connectedCallback();
+      this.internals.ariaBusy = "true";
+    }
+    render() {
+      return html`
+      <span class="sbb-loading-indicator">
+        <span class="sbb-loading-indicator__animated-element"></span>
+      </span>
+    `;
+    }
+  }, _color_accessor_storage = new WeakMap(), _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    _color_decorators = [property({ reflect: true })];
+    __esDecorate(_a, null, _color_decorators, { kind: "accessor", name: "color", static: false, private: false, access: { has: (obj) => "color" in obj, get: (obj) => obj.color, set: (obj, value) => {
+      obj.color = value;
+    } }, metadata: _metadata }, _color_initializers, _color_extraInitializers);
+    __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+    _classThis = _classDescriptor.value;
+    if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+  })(), _a.role = "progressbar", _a.styles = [boxSizingStyles, style], __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbLoadingIndicatorCircleElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlLmNvbXBvbmVudC5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL2xvYWRpbmctaW5kaWNhdG9yLWNpcmNsZS9sb2FkaW5nLWluZGljYXRvci1jaXJjbGUuY29tcG9uZW50LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgQ1NTUmVzdWx0R3JvdXAsIFRlbXBsYXRlUmVzdWx0IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGh0bWwsIExpdEVsZW1lbnQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHkgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB7IFNiYkVsZW1lbnRJbnRlcm5hbHNNaXhpbiB9IGZyb20gJy4uL2NvcmUvbWl4aW5zLnRzJztcbmltcG9ydCB7IGJveFNpemluZ1N0eWxlcyB9IGZyb20gJy4uL2NvcmUvc3R5bGVzLnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vbG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlLnNjc3M/bGl0JmlubGluZSc7XG5cbi8qKlxuICogSXQgZGlzcGxheXMgYSBjaXJjbGUgbG9hZGluZyBpbmRpY2F0b3IuXG4gKi9cbmV4cG9ydFxuQGN1c3RvbUVsZW1lbnQoJ3NiYi1sb2FkaW5nLWluZGljYXRvci1jaXJjbGUnKVxuY2xhc3MgU2JiTG9hZGluZ0luZGljYXRvckNpcmNsZUVsZW1lbnQgZXh0ZW5kcyBTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW4oTGl0RWxlbWVudCkge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHJlYWRvbmx5IHJvbGUgPSAncHJvZ3Jlc3NiYXInO1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBbYm94U2l6aW5nU3R5bGVzLCBzdHlsZV07XG5cbiAgLyoqIENvbG9yIHZhcmlhbnQuICovXG4gIEBwcm9wZXJ0eSh7IHJlZmxlY3Q6IHRydWUgfSkgcHVibGljIGFjY2Vzc29yIGNvbG9yOiAnZGVmYXVsdCcgfCAnc21va2UnIHwgJ3doaXRlJyA9ICdkZWZhdWx0JztcblxuICBwdWJsaWMgb3ZlcnJpZGUgY29ubmVjdGVkQ2FsbGJhY2soKTogdm9pZCB7XG4gICAgc3VwZXIuY29ubmVjdGVkQ2FsbGJhY2soKTtcbiAgICB0aGlzLmludGVybmFscy5hcmlhQnVzeSA9ICd0cnVlJztcbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSByZW5kZXIoKTogVGVtcGxhdGVSZXN1bHQge1xuICAgIHJldHVybiBodG1sYFxuICAgICAgPHNwYW4gY2xhc3M9XCJzYmItbG9hZGluZy1pbmRpY2F0b3JcIj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJzYmItbG9hZGluZy1pbmRpY2F0b3JfX2FuaW1hdGVkLWVsZW1lbnRcIj48L3NwYW4+XG4gICAgICA8L3NwYW4+XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLWxvYWRpbmctaW5kaWNhdG9yLWNpcmNsZSc6IFNiYkxvYWRpbmdJbmRpY2F0b3JDaXJjbGVFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFjTSxvQ0FBZ0MsTUFBQTs7MEJBRHJDLGNBQWMsOEJBQThCLENBQUM7Ozs7b0JBQ0MseUJBQXlCLFVBQVU7Ozs7QUFBM0MsRUFBQSxtQkFBUSxZQUFvQztBQUFBOztBQUtwRCxrREFBQSxrQkFBQSxNQUFBLHFCQUF1RCxTQUFTOzs7O0lBQWhFLElBQWdCLFFBQUs7QUFBQSxhQUFBLG1CQUFBO0FBQUEsSUFBQTtBQUFBLElBQXJCLElBQWdCLE1BQUssT0FBQTtBQUFBLHlCQUFBLHlCQUFBO0FBQUEsSUFBQTtBQUFBLElBRWxDLG9CQUFpQjtBQUMvQixZQUFNLGtCQUFBO0FBQ04sV0FBSyxVQUFVLFdBQVc7QUFBQSxJQUM1QjtBQUFBLElBRW1CLFNBQU07QUFDdkIsYUFBTztBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUEsSUFLVDtBQUFBLEtBYjZCOztBQUE1Qix3QkFBQSxDQUFBLFNBQVMsRUFBRSxTQUFTLEtBQUEsQ0FBTSxDQUFDO0FBQUMsaUJBQUEsSUFBQSxNQUFBLG1CQUFBLEVBQUEsTUFBQSxZQUFBLE1BQUEsU0FBQSxRQUFBLE9BQUEsU0FBQSxPQUFBLFFBQUEsRUFBQSxLQUFBLENBQUEsUUFBQSxXQUFBLEtBQUEsS0FBQSxDQUFBLFFBQUEsSUFBZ0IsT0FBSyxLQUFBLENBQUEsS0FBQSxVQUFBO0FBQUEsVUFBTCxRQUFLO0FBQUEsSUFBQSxLQUFBLFVBQUEsVUFBQSxHQUFBLHFCQUFBLHdCQUFBO0FBTHBELGlCQUFBLE1BQUEsbUJBQUEsRUFBQSxPQUFBLFdBQUEsR0FBQSxrQkFBQSxFQUFBLE1BQUEsU0FBQSxNQUFBLFdBQUEsTUFBQSxVQUFBLFVBQUEsR0FBQSxNQUFBLHVCQUFBOzs7UUFDa0MsR0FBQSxPQUFPLGVBQ2hCLEdBQUEsU0FBeUIsQ0FBQyxpQkFBaUIsS0FBSyxHQUZuRSxrQkFBQSxZQUFBLHVCQUFBLEdBQWlDOzs7In0=

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

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

package/development/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;;GAEG;AACH,cAAc,kEAAkE,CAAC"}

package/development/loading-indicator-circle.js

@@ -0,0 +1,5 @@
+import { SbbLoadingIndicatorCircleElement } from "./loading-indicator-circle/loading-indicator-circle.component.js";
+export {
+  SbbLoadingIndicatorCircleElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlLmpzIiwic291cmNlcyI6W10sInNvdXJjZXNDb250ZW50IjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjsifQ==

package/development/loading-indicator.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @entrypoint
+ */
+export * from './loading-indicator/loading-indicator.component.ts';
+//# sourceMappingURL=loading-indicator.d.ts.map

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

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

package/development/loading-indicator.js

@@ -0,0 +1,5 @@
+import { SbbLoadingIndicatorElement } from "./loading-indicator/loading-indicator.component.js";
+export {
+  SbbLoadingIndicatorElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3IuanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOyJ9

package/development/logo/logo.component.d.ts

@@ -0,0 +1,23 @@
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
+import { SbbProtectiveRoom } from '../core/interfaces.ts';
+declare const SbbLogoElement_base: import('../core/mixins.ts').AbstractConstructor<import('../core/mixins.ts').SbbNegativeMixinType> & typeof LitElement;
+/**
+ * It displays the SBB logo.
+ *
+ * @cssprop [--sbb-logo-height=auto] - Can be used to set the height of the logo.
+ */
+export declare class SbbLogoElement extends SbbLogoElement_base {
+    static styles: CSSResultGroup;
+    /** Visual protective room around logo. */
+    accessor protectiveRoom: SbbProtectiveRoom;
+    /** Accessibility label which will be forwarded to the SVG logo. */
+    accessor accessibilityLabel: string;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-logo': SbbLogoElement;
+    }
+}
+export {};
+//# sourceMappingURL=logo.component.d.ts.map

package/development/logo/logo.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"logo.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/logo/logo.component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAIvC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;;AAM/D;;;;GAIG;AACH,qBAEM,cAAe,SAAQ,mBAA4B;IACvD,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE,0CAA0C;IAC1C,SACgB,cAAc,EAAE,iBAAiB,CAAW;IAE5D,mEAAmE;IACnE,SAEgB,kBAAkB,EAAE,MAAM,CAAU;cAEjC,MAAM,IAAI,cAAc;CAoB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}

package/development/logo/logo.component.js

@@ -0,0 +1,152 @@
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+import { __esDecorate, __runInitializers } from "tslib";
+import { css, LitElement, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { forceType } from "../core/decorators.js";
+import { SbbNegativeMixin } from "../core/mixins.js";
+import { boxSizingStyles } from "../core/styles.js";
+const style = css`:host {
+  display: block;
+  height: var(--sbb-logo-height);
+  --sbb-logo-panel-color: var(--sbb-color-brand);
+  --sbb-logo-signet-color: var(--sbb-color-white);
+  --sbb-logo-word-mark-color: var(--sbb-color-black);
+  --sbb-logo-word-mark-color: light-dark(var(--sbb-color-black), var(--sbb-color-white));
+  --sbb-logo-aspect-ratio: 454 / 48;
+  --sbb-logo-svg-container-height: auto;
+  --sbb-logo-background-color: none;
+}
+@media (forced-colors: active) {
+  :host {
+    --sbb-logo-panel-color: ButtonText !important;
+    --sbb-logo-signet-color: Canvas !important;
+    --sbb-logo-word-mark-color: ButtonText !important;
+  }
+}
+
+:host([negative]) {
+  --sbb-logo-word-mark-color: var(--sbb-color-white);
+}
+
+:host([protective-room=minimal]) {
+  --sbb-logo-aspect-ratio: 502 / 96;
+  --sbb-logo-svg-container-height: 50%;
+}
+
+:host([protective-room=ideal]) {
+  --sbb-logo-aspect-ratio: 550 / 144;
+  --sbb-logo-svg-container-height: calc(48 / 144 * 100%);
+}
+
+.sbb-logo {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: var(--sbb-logo-background-color);
+  aspect-ratio: var(--sbb-logo-aspect-ratio);
+  height: 100%;
+  width: 100%;
+}
+
+.sbb-logo .sbb-logo__svg-container {
+  display: flex;
+  height: var(--sbb-logo-svg-container-height);
+}
+
+.sbb-logo svg {
+  width: 100%;
+  height: 100%;
+}
+
+#sbb-logo__word-mark {
+  fill: var(--sbb-logo-word-mark-color);
+}
+
+#sbb-logo__panel {
+  fill: var(--sbb-logo-panel-color);
+  stroke: var(--sbb-logo-panel-color);
+}
+
+#sbb-logo__signet {
+  fill: var(--sbb-logo-signet-color);
+}`;
+let SbbLogoElement = (() => {
+  var _protectiveRoom_accessor_storage, _accessibilityLabel_accessor_storage, _a;
+  let _classDecorators = [customElement("sbb-logo")];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbNegativeMixin(LitElement);
+  let _protectiveRoom_decorators;
+  let _protectiveRoom_initializers = [];
+  let _protectiveRoom_extraInitializers = [];
+  let _accessibilityLabel_decorators;
+  let _accessibilityLabel_initializers = [];
+  let _accessibilityLabel_extraInitializers = [];
+  _a = class extends _classSuper {
+    constructor() {
+      super(...arguments);
+      __privateAdd(this, _protectiveRoom_accessor_storage, __runInitializers(this, _protectiveRoom_initializers, "ideal"));
+      __privateAdd(this, _accessibilityLabel_accessor_storage, (__runInitializers(this, _protectiveRoom_extraInitializers), __runInitializers(this, _accessibilityLabel_initializers, "Logo")));
+      __runInitializers(this, _accessibilityLabel_extraInitializers);
+    }
+    /** Visual protective room around logo. */
+    get protectiveRoom() {
+      return __privateGet(this, _protectiveRoom_accessor_storage);
+    }
+    set protectiveRoom(value) {
+      __privateSet(this, _protectiveRoom_accessor_storage, value);
+    }
+    /** Accessibility label which will be forwarded to the SVG logo. */
+    get accessibilityLabel() {
+      return __privateGet(this, _accessibilityLabel_accessor_storage);
+    }
+    set accessibilityLabel(value) {
+      __privateSet(this, _accessibilityLabel_accessor_storage, value);
+    }
+    render() {
+      return html`
+      <span class="sbb-logo">
+        <span class="sbb-logo__svg-container">
+          <svg focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 454 48">
+            <title .textContent=${this.accessibilityLabel}></title>
+            <path
+              id="sbb-logo__word-mark"
+              d="M238.2 34.6c4.1 0 6.2-1.4 6.2-4.5 0-3.2-2-4.6-6.6-4.6h-7v9h7.4zm-.4-14.4c3.5 0 5.6-1.4 5.6-3.8 0-2.7-1.9-4-5.7-4h-7v7.8h7.1zm1.1-13.4c7.3 0 11.4 3.1 11.4 8.5 0 3-1.4 5.1-4.6 6.9 4.1 1.5 5.9 4.1 5.9 8.5 0 5.9-4.6 9.6-11.9 9.6h-15.9V6.8h15.1zm-33.7 27.8c4.1 0 6.2-1.4 6.2-4.5 0-3.2-2-4.6-6.6-4.6H198v9h7.2zm-.3-14.4c3.5 0 5.6-1.4 5.6-3.8 0-2.7-1.9-4-5.7-4H198v7.8h6.9zM206 6.8c7.3 0 11.4 3.1 11.4 8.5 0 3-1.4 5.1-4.6 6.9 4.1 1.5 5.9 4.1 5.9 8.5 0 5.9-4.6 9.6-11.9 9.6H191V6.8h15zm-28 9.9c-.4-3.4-2.4-5-6.5-5-3.4 0-5.6 1.5-5.6 3.9 0 2 1.3 3.2 4.1 3.7l6 1c6.4 1.1 9.8 4.6 9.8 9.7 0 6.6-5.3 10.8-13.7 10.8-8.9 0-14.1-4.3-14.1-11.9h7.1c.4 4.4 2.6 6.2 7.3 6.2 3.6 0 6.2-1.9 6.2-4.6 0-2.1-1.4-3.4-4.1-3.9l-5.5-1c-7-1.3-10.2-4.3-10.2-9.7 0-6.2 4.9-10 12.9-10 7.8 0 12.7 4 12.9 10.6l-6.6.2zm158.7-3.9v7.8h15v5.8h-15v13.7h-7V6.8h23.5v6h-16.5zm-29.4 0v7.8h14.8v5.8h-14.8v13.7h-7V6.8h23.3v6h-16.3zm-11.8 15.7C295 36.2 289.3 41 281 41c-9.4 0-15.6-6.8-15.6-17.4 0-10.5 6.4-17.5 15.7-17.5 8.1 0 13.5 4.5 14.1 11.6h-7c-.8-3.8-3.2-5.7-7.1-5.7-5.3 0-8.8 4.6-8.8 11.6s3.4 11.6 8.6 11.6c4.3 0 6.7-2.1 7.5-6.7h7.1zm150.7-11.8c-.4-3.4-2.4-5-6.5-5-3.4 0-5.6 1.5-5.6 3.9 0 2 1.3 3.2 4.1 3.7l6 1c6.4 1.1 9.8 4.6 9.8 9.7 0 6.6-5.3 10.8-13.7 10.8-8.9 0-14-4.3-14.1-11.9h7.1c.4 4.4 2.6 6.2 7.3 6.2 3.7 0 6.2-1.9 6.2-4.6 0-2.1-1.4-3.4-4.1-3.9l-5.5-1c-7-1.3-10.2-4.3-10.2-9.7 0-6.2 4.9-10 12.9-10 7.8 0 12.7 4 13 10.6l-6.7.2zm-40.4-3.9v7.8h14.9v5.8h-14.9v13.7h-7V6.8h23.4v6h-16.4zm-29.7 0v7.8h15v5.8h-15v13.7h-7V6.8h23.5v6h-16.5z"
+            ></path>
+            <path id="sbb-logo__panel" stroke-width="1" d="M1 47h141V1H1v46z"></path>
+            <path
+              id="sbb-logo__signet"
+              d="M87 40h9.3L83.8 27.7h15.5V40h7.4V27.7h15.6L109.7 40h9.3l16-16-15.9-16h-9.3l12.5 12.3h-15.6V8h-7.4v12.3H83.8L96.3 8H87L71 24l16 16z"
+            ></path>
+          </svg>
+        </span>
+      </span>
+    `;
+    }
+  }, _protectiveRoom_accessor_storage = new WeakMap(), _accessibilityLabel_accessor_storage = new WeakMap(), _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    _protectiveRoom_decorators = [property({ attribute: "protective-room", reflect: true })];
+    _accessibilityLabel_decorators = [forceType(), property({ attribute: "accessibility-label" })];
+    __esDecorate(_a, null, _protectiveRoom_decorators, { kind: "accessor", name: "protectiveRoom", static: false, private: false, access: { has: (obj) => "protectiveRoom" in obj, get: (obj) => obj.protectiveRoom, set: (obj, value) => {
+      obj.protectiveRoom = value;
+    } }, metadata: _metadata }, _protectiveRoom_initializers, _protectiveRoom_extraInitializers);
+    __esDecorate(_a, null, _accessibilityLabel_decorators, { kind: "accessor", name: "accessibilityLabel", static: false, private: false, access: { has: (obj) => "accessibilityLabel" in obj, get: (obj) => obj.accessibilityLabel, set: (obj, value) => {
+      obj.accessibilityLabel = value;
+    } }, metadata: _metadata }, _accessibilityLabel_initializers, _accessibilityLabel_extraInitializers);
+    __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+    _classThis = _classDescriptor.value;
+    if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+  })(), _a.styles = [boxSizingStyles, style], __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbLogoElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9nby5jb21wb25lbnQuanMiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9lbGVtZW50cy9sb2dvL2xvZ28uY29tcG9uZW50LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgQ1NTUmVzdWx0R3JvdXAsIFRlbXBsYXRlUmVzdWx0IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGh0bWwsIExpdEVsZW1lbnQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHkgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB7IGZvcmNlVHlwZSB9IGZyb20gJy4uL2NvcmUvZGVjb3JhdG9ycy50cyc7XG5pbXBvcnQgdHlwZSB7IFNiYlByb3RlY3RpdmVSb29tIH0gZnJvbSAnLi4vY29yZS9pbnRlcmZhY2VzLnRzJztcbmltcG9ydCB7IFNiYk5lZ2F0aXZlTWl4aW4gfSBmcm9tICcuLi9jb3JlL21peGlucy50cyc7XG5pbXBvcnQgeyBib3hTaXppbmdTdHlsZXMgfSBmcm9tICcuLi9jb3JlL3N0eWxlcy50cyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL2xvZ28uc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyB0aGUgU0JCIGxvZ28uXG4gKlxuICogQGNzc3Byb3AgWy0tc2JiLWxvZ28taGVpZ2h0PWF1dG9dIC0gQ2FuIGJlIHVzZWQgdG8gc2V0IHRoZSBoZWlnaHQgb2YgdGhlIGxvZ28uXG4gKi9cbmV4cG9ydFxuQGN1c3RvbUVsZW1lbnQoJ3NiYi1sb2dvJylcbmNsYXNzIFNiYkxvZ29FbGVtZW50IGV4dGVuZHMgU2JiTmVnYXRpdmVNaXhpbihMaXRFbGVtZW50KSB7XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IFtib3hTaXppbmdTdHlsZXMsIHN0eWxlXTtcblxuICAvKiogVmlzdWFsIHByb3RlY3RpdmUgcm9vbSBhcm91bmQgbG9nby4gKi9cbiAgQHByb3BlcnR5KHsgYXR0cmlidXRlOiAncHJvdGVjdGl2ZS1yb29tJywgcmVmbGVjdDogdHJ1ZSB9KVxuICBwdWJsaWMgYWNjZXNzb3IgcHJvdGVjdGl2ZVJvb206IFNiYlByb3RlY3RpdmVSb29tID0gJ2lkZWFsJztcblxuICAvKiogQWNjZXNzaWJpbGl0eSBsYWJlbCB3aGljaCB3aWxsIGJlIGZvcndhcmRlZCB0byB0aGUgU1ZHIGxvZ28uICovXG4gIEBmb3JjZVR5cGUoKVxuICBAcHJvcGVydHkoeyBhdHRyaWJ1dGU6ICdhY2Nlc3NpYmlsaXR5LWxhYmVsJyB9KVxuICBwdWJsaWMgYWNjZXNzb3IgYWNjZXNzaWJpbGl0eUxhYmVsOiBzdHJpbmcgPSAnTG9nbyc7XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICA8c3BhbiBjbGFzcz1cInNiYi1sb2dvXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWxvZ29fX3N2Zy1jb250YWluZXJcIj5cbiAgICAgICAgICA8c3ZnIGZvY3VzYWJsZT1cImZhbHNlXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiIHZpZXdCb3g9XCIwIDAgNDU0IDQ4XCI+XG4gICAgICAgICAgICA8dGl0bGUgLnRleHRDb250ZW50PSR7dGhpcy5hY2Nlc3NpYmlsaXR5TGFiZWx9PjwvdGl0bGU+XG4gICAgICAgICAgICA8cGF0aFxuICAgICAgICAgICAgICBpZD1cInNiYi1sb2dvX193b3JkLW1hcmtcIlxuICAgICAgICAgICAgICBkPVwiTTIzOC4yIDM0LjZjNC4xIDAgNi4yLTEuNCA2LjItNC41IDAtMy4yLTItNC42LTYuNi00LjZoLTd2OWg3LjR6bS0uNC0xNC40YzMuNSAwIDUuNi0xLjQgNS42LTMuOCAwLTIuNy0xLjktNC01LjctNGgtN3Y3LjhoNy4xem0xLjEtMTMuNGM3LjMgMCAxMS40IDMuMSAxMS40IDguNSAwIDMtMS40IDUuMS00LjYgNi45IDQuMSAxLjUgNS45IDQuMSA1LjkgOC41IDAgNS45LTQuNiA5LjYtMTEuOSA5LjZoLTE1LjlWNi44aDE1LjF6bS0zMy43IDI3LjhjNC4xIDAgNi4yLTEuNCA2LjItNC41IDAtMy4yLTItNC42LTYuNi00LjZIMTk4djloNy4yem0tLjMtMTQuNGMzLjUgMCA1LjYtMS40IDUuNi0zLjggMC0yLjctMS45LTQtNS43LTRIMTk4djcuOGg2Ljl6TTIwNiA2LjhjNy4zIDAgMTEuNCAzLjEgMTEuNCA4LjUgMCAzLTEuNCA1LjEtNC42IDYuOSA0LjEgMS41IDUuOSA0LjEgNS45IDguNSAwIDUuOS00LjYgOS42LTExLjkgOS42SDE5MVY2LjhoMTV6bS0yOCA5LjljLS40LTMuNC0yLjQtNS02LjUtNS0zLjQgMC01LjYgMS41LTUuNiAzLjkgMCAyIDEuMyAzLjIgNC4xIDMuN2w2IDFjNi40IDEuMSA5LjggNC42IDkuOCA5LjcgMCA2LjYtNS4zIDEwLjgtMTMuNyAxMC44LTguOSAwLTE0LjEtNC4zLTE0LjEtMTEuOWg3LjFjLjQgNC40IDIuNiA2LjIgNy4zIDYuMiAzLjYgMCA2LjItMS45IDYuMi00LjYgMC0yLjEtMS40LTMuNC00LjEtMy45bC01LjUtMWMtNy0xLjMtMTAuMi00LjMtMTAuMi05LjcgMC02LjIgNC45LTEwIDEyLjktMTAgNy44IDAgMTIuNyA0IDEyLjkgMTAuNmwtNi42LjJ6bTE1OC43LTMuOXY3LjhoMTV2NS44aC0xNXYxMy43aC03VjYuOGgyMy41djZoLTE2LjV6bS0yOS40IDB2Ny44aDE0Ljh2NS44aC0xNC44djEzLjdoLTdWNi44aDIzLjN2NmgtMTYuM3ptLTExLjggMTUuN0MyOTUgMzYuMiAyODkuMyA0MSAyODEgNDFjLTkuNCAwLTE1LjYtNi44LTE1LjYtMTcuNCAwLTEwLjUgNi40LTE3LjUgMTUuNy0xNy41IDguMSAwIDEzLjUgNC41IDE0LjEgMTEuNmgtN2MtLjgtMy44LTMuMi01LjctNy4xLTUuNy01LjMgMC04LjggNC42LTguOCAxMS42czMuNCAxMS42IDguNiAxMS42YzQuMyAwIDYuNy0yLjEgNy41LTYuN2g3LjF6bTE1MC43LTExLjhjLS40LTMuNC0yLjQtNS02LjUtNS0zLjQgMC01LjYgMS41LTUuNiAzLjkgMCAyIDEuMyAzLjIgNC4xIDMuN2w2IDFjNi40IDEuMSA5LjggNC42IDkuOCA5LjcgMCA2LjYtNS4zIDEwLjgtMTMuNyAxMC44LTguOSAwLTE0LTQuMy0xNC4xLTExLjloNy4xYy40IDQuNCAyLjYgNi4yIDcuMyA2LjIgMy43IDAgNi4yLTEuOSA2LjItNC42IDAtMi4xLTEuNC0zLjQtNC4xLTMuOWwtNS41LTFjLTctMS4zLTEwLjItNC4zLTEwLjItOS43IDAtNi4yIDQuOS0xMCAxMi45LTEwIDcuOCAwIDEyLjcgNCAxMyAxMC42bC02LjcuMnptLTQwLjQtMy45djcuOGgxNC45djUuOGgtMTQuOXYxMy43aC03VjYuOGgyMy40djZoLTE2LjR6bS0yOS43IDB2Ny44aDE1djUuOGgtMTV2MTMuN2gtN1Y2LjhoMjMuNXY2aC0xNi41elwiXG4gICAgICAgICAgICA+PC9wYXRoPlxuICAgICAgICAgICAgPHBhdGggaWQ9XCJzYmItbG9nb19fcGFuZWxcIiBzdHJva2Utd2lkdGg9XCIxXCIgZD1cIk0xIDQ3aDE0MVYxSDF2NDZ6XCI+PC9wYXRoPlxuICAgICAgICAgICAgPHBhdGhcbiAgICAgICAgICAgICAgaWQ9XCJzYmItbG9nb19fc2lnbmV0XCJcbiAgICAgICAgICAgICAgZD1cIk04NyA0MGg5LjNMODMuOCAyNy43aDE1LjVWNDBoNy40VjI3LjdoMTUuNkwxMDkuNyA0MGg5LjNsMTYtMTYtMTUuOS0xNmgtOS4zbDEyLjUgMTIuM2gtMTUuNlY4aC03LjR2MTIuM0g4My44TDk2LjMgOEg4N0w3MSAyNGwxNiAxNnpcIlxuICAgICAgICAgICAgPjwvcGF0aD5cbiAgICAgICAgICA8L3N2Zz5cbiAgICAgICAgPC9zcGFuPlxuICAgICAgPC9zcGFuPlxuICAgIGA7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi1sb2dvJzogU2JiTG9nb0VsZW1lbnQ7XG4gIH1cbn1cbiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFrQk0sa0JBQWMsTUFBQTs7MEJBRG5CLGNBQWMsVUFBVSxDQUFDOzs7O29CQUNHLGlCQUFpQixVQUFVOzs7Ozs7O0FBQW5DLEVBQUEsbUJBQVEsWUFBNEI7QUFBQTs7QUFLdkQsMkRBQUEsa0JBQUEsTUFBQSw4QkFBb0QsT0FBTztBQUszRCxnRUFBQSxrQkFBQSxNQUFBLGlDQUFBLEdBQUEsa0JBQUEsTUFBQSxrQ0FBNkMsTUFBTTs7OztJQUxuRCxJQUFnQixpQkFBYztBQUFBLGFBQUEsbUJBQUE7QUFBQSxJQUFBO0FBQUEsSUFBOUIsSUFBZ0IsZUFBYyxPQUFBO0FBQUEseUJBQUEsa0NBQUE7QUFBQSxJQUFBO0FBQUE7QUFBQSxJQUs5QixJQUFnQixxQkFBa0I7QUFBQSxhQUFBLG1CQUFBO0FBQUEsSUFBQTtBQUFBLElBQWxDLElBQWdCLG1CQUFrQixPQUFBO0FBQUEseUJBQUEsc0NBQUE7QUFBQSxJQUFBO0FBQUEsSUFFZixTQUFNO0FBQ3ZCLGFBQU87QUFBQTtBQUFBO0FBQUE7QUFBQSxrQ0FJdUIsS0FBSyxrQkFBa0I7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLElBY3ZEO0FBQUEsS0ExQkEsa0RBS0E7O2tDQU5DLFNBQVMsRUFBRSxXQUFXLG1CQUFtQixTQUFTLEtBQUEsQ0FBTSxDQUFDO3NDQUl6RCxhQUNBLFNBQVMsRUFBRSxXQUFXLHNCQUFBLENBQXVCLENBQUM7QUFKL0MsaUJBQUEsSUFBQSxNQUFBLDRCQUFBLEVBQUEsTUFBQSxZQUFBLE1BQUEsa0JBQUEsUUFBQSxPQUFBLFNBQUEsT0FBQSxRQUFBLEVBQUEsS0FBQSxDQUFBLFFBQUEsb0JBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFnQixnQkFBYyxLQUFBLENBQUEsS0FBQSxVQUFBO0FBQUEsVUFBZCxpQkFBYztBQUFBLElBQUEsS0FBQSxVQUFBLFVBQUEsR0FBQSw4QkFBQSxpQ0FBQTtBQUs5QixpQkFBQSxJQUFBLE1BQUEsZ0NBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxzQkFBQSxRQUFBLE9BQUEsU0FBQSxPQUFBLFFBQUEsRUFBQSxLQUFBLENBQUEsUUFBQSx3QkFBQSxLQUFBLEtBQUEsQ0FBQSxRQUFBLElBQWdCLG9CQUFrQixLQUFBLENBQUEsS0FBQSxVQUFBO0FBQUEsVUFBbEIscUJBQWtCO0FBQUEsSUFBQSxLQUFBLFVBQUEsVUFBQSxHQUFBLGtDQUFBLHFDQUFBO0FBVnBDLGlCQUFBLE1BQUEsbUJBQUEsRUFBQSxPQUFBLFdBQUEsR0FBQSxrQkFBQSxFQUFBLE1BQUEsU0FBQSxNQUFBLFdBQUEsTUFBQSxVQUFBLFVBQUEsR0FBQSxNQUFBLHVCQUFBOzs7UUFDeUIsR0FBQSxTQUF5QixDQUFDLGlCQUFpQixLQUFLLEdBRG5FLGtCQUFBLFlBQUEsdUJBQUEsR0FBZTs7OyJ9