@sbb-esta/lyne-elements 2.6.0 → 2.7.1

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

@@ -0,0 +1,260 @@
+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 { hostAttributes } from "../core/decorators.js";
+const style = css`@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) * 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"), hostAttributes({
+    role: "progressbar",
+    "aria-busy": "true"
+  })];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = 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);
+    }
+    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.styles = style, __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbLoadingIndicatorElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3IuanMiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9lbGVtZW50cy9sb2FkaW5nLWluZGljYXRvci9sb2FkaW5nLWluZGljYXRvci50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IENTU1Jlc3VsdEdyb3VwLCBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBodG1sLCBMaXRFbGVtZW50IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGN1c3RvbUVsZW1lbnQsIHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgeyBob3N0QXR0cmlidXRlcyB9IGZyb20gJy4uL2NvcmUvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL2xvYWRpbmctaW5kaWNhdG9yLnNjc3M/bGl0JmlubGluZSc7XG5cbi8qKlxuICogSXQgZGlzcGxheXMgYSBsb2FkaW5nIGluZGljYXRvci5cbiAqL1xuZXhwb3J0XG5AY3VzdG9tRWxlbWVudCgnc2JiLWxvYWRpbmctaW5kaWNhdG9yJylcbkBob3N0QXR0cmlidXRlcyh7XG4gIHJvbGU6ICdwcm9ncmVzc2JhcicsXG4gICdhcmlhLWJ1c3knOiAndHJ1ZScsXG59KVxuY2xhc3MgU2JiTG9hZGluZ0luZGljYXRvckVsZW1lbnQgZXh0ZW5kcyBMaXRFbGVtZW50IHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSBzdHlsZXM6IENTU1Jlc3VsdEdyb3VwID0gc3R5bGU7XG5cbiAgLyoqIFNpemUgdmFyaWFudCwgZWl0aGVyIHMgb3IgbS4gKi9cbiAgQHByb3BlcnR5KHsgcmVmbGVjdDogdHJ1ZSB9KSBwdWJsaWMgYWNjZXNzb3Igc2l6ZTogJ3MnIHwgJ2wnIHwgJ3hsJyB8ICd4eGwnIHwgJ3h4eGwnID0gJ3MnO1xuXG4gIC8qKiBDb2xvciB2YXJpYW50LiAqL1xuICBAcHJvcGVydHkoeyByZWZsZWN0OiB0cnVlIH0pIHB1YmxpYyBhY2Nlc3NvciBjb2xvcjogJ2RlZmF1bHQnIHwgJ3Ntb2tlJyB8ICd3aGl0ZScgPSAnZGVmYXVsdCc7XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICA8c3BhbiBjbGFzcz1cInNiYi1sb2FkaW5nLWluZGljYXRvclwiPlxuICAgICAgICA8c3BhbiBjbGFzcz1cInNiYi1sb2FkaW5nLWluZGljYXRvcl9fYW5pbWF0ZWQtZWxlbWVudFwiPlxuICAgICAgICAgIDxzcGFuPlxuICAgICAgICAgICAgPHNwYW4+XG4gICAgICAgICAgICAgIDxzcGFuPjwvc3Bhbj5cbiAgICAgICAgICAgICAgPHNwYW4+PC9zcGFuPlxuICAgICAgICAgICAgICA8c3Bhbj48L3NwYW4+XG4gICAgICAgICAgICAgIDxzcGFuPjwvc3Bhbj5cbiAgICAgICAgICAgICAgPHNwYW4+PC9zcGFuPlxuICAgICAgICAgICAgPC9zcGFuPlxuICAgICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPC9zcGFuPlxuICAgICAgPC9zcGFuPlxuICAgIGA7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi1sb2FkaW5nLWluZGljYXRvcic6IFNiYkxvYWRpbmdJbmRpY2F0b3JFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0lBaUJNLDhCQUEwQixNQUFBOztBQUwvQixNQUFBLG1CQUFBLENBQUEsY0FBYyx1QkFBdUIsR0FDckMsZUFBZTtBQUFBLElBQ2QsTUFBTTtBQUFBLElBQ04sYUFBYTtBQUFBLEVBQUEsQ0FDZCxDQUFDOzs7O29CQUN1Qzs7Ozs7OztBQUFSLEVBQUEsbUJBQVEsWUFBVTtBQUFBOztBQUlwQixpREFBQSxrQkFBQSxNQUFBLG9CQUEwRCxHQUFHO0FBRzdELG1EQUFBLGtCQUFBLE1BQUEsdUJBQUEsR0FBQSxrQkFBQSxNQUFBLHFCQUF1RCxTQUFTOzs7O0lBSGhFLElBQWdCLE9BQThDO0FBQUEsYUFBQSxtQkFBQTtBQUFBLElBQUE7QUFBQSxJQUE5RCxJQUFnQixLQUE4QyxPQUFBO0FBQUEseUJBQUEsd0JBQUE7QUFBQSxJQUFBO0FBQUE7QUFBQSxJQUc5RCxJQUFnQixRQUFpRDtBQUFBLGFBQUEsbUJBQUE7QUFBQSxJQUFBO0FBQUEsSUFBakUsSUFBZ0IsTUFBaUQsT0FBQTtBQUFBLHlCQUFBLHlCQUFBO0FBQUEsSUFBQTtBQUFBLElBRTNFLFNBQU07QUFDaEIsYUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQSxJQUFBO0FBQUEsS0FOb0Isd0NBR0E7O0FBSDVCLHVCQUFBLENBQUEsU0FBUyxFQUFFLFNBQVMsS0FBTSxDQUFBLENBQUM7QUFHM0Isd0JBQUEsQ0FBQSxTQUFTLEVBQUUsU0FBUyxLQUFNLENBQUEsQ0FBQztBQUhpQixpQkFBQSxJQUFBLE1BQUEsa0JBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxRQUFBLFFBQUEsT0FBQSxTQUFBLE9BQUEsUUFBQSxFQUFBLEtBQUEsQ0FBQSxRQUFBLFVBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFBLE1BQUEsS0FBQSxDQUFBLEtBQUEsVUFBQTtBQUFBLFVBQUEsT0FBOEM7QUFBQSxTQUFBLFVBQUEsYUFBQSxvQkFBQSx1QkFBQTtBQUc5QyxpQkFBQSxJQUFBLE1BQUEsbUJBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxTQUFBLFFBQUEsT0FBQSxTQUFBLE9BQUEsUUFBQSxFQUFBLEtBQUEsQ0FBQSxRQUFBLFdBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFBLE9BQUEsS0FBQSxDQUFBLEtBQUEsVUFBQTtBQUFBLFVBQUEsUUFBaUQ7QUFBQSxTQUFBLFVBQUEsYUFBQSxxQkFBQSx3QkFBQTtBQVBoRyxpQkEwQkMsTUFBQSxtQkFBQSxFQUFBLE9BQUEsV0FBQSxHQUFBLGtCQUFBLEVBQUEsTUFBQSxTQUFBLE1BQUEsV0FBQSxNQUFBLFVBQUEsVUFBQSxHQUFBLE1BQUEsdUJBQUE7OztRQXpCd0IsR0FBTSxTQUFtQixPQUQ1QyxrQkFBMEIsWUFBQSx1QkFBQSxHQUFDOzs7In0=

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

@@ -0,0 +1,146 @@
+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 { hostAttributes } from "../core/decorators.js";
+const style = css`*,
+::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: 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,
+    var(--sbb-loading-indicator-circle-background-color),
+    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"), hostAttributes({
+    role: "progressbar",
+    "aria-busy": "true"
+  })];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = 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);
+    }
+    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.styles = style, __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbLoadingIndicatorCircleElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvbG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlL2xvYWRpbmctaW5kaWNhdG9yLWNpcmNsZS50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IENTU1Jlc3VsdEdyb3VwLCBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBodG1sLCBMaXRFbGVtZW50IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGN1c3RvbUVsZW1lbnQsIHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgeyBob3N0QXR0cmlidXRlcyB9IGZyb20gJy4uL2NvcmUvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL2xvYWRpbmctaW5kaWNhdG9yLWNpcmNsZS5zY3NzP2xpdCZpbmxpbmUnO1xuXG4vKipcbiAqIEl0IGRpc3BsYXlzIGEgY2lyY2xlIGxvYWRpbmcgaW5kaWNhdG9yLlxuICovXG5leHBvcnRcbkBjdXN0b21FbGVtZW50KCdzYmItbG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlJylcbkBob3N0QXR0cmlidXRlcyh7XG4gIHJvbGU6ICdwcm9ncmVzc2JhcicsXG4gICdhcmlhLWJ1c3knOiAndHJ1ZScsXG59KVxuY2xhc3MgU2JiTG9hZGluZ0luZGljYXRvckNpcmNsZUVsZW1lbnQgZXh0ZW5kcyBMaXRFbGVtZW50IHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSBzdHlsZXM6IENTU1Jlc3VsdEdyb3VwID0gc3R5bGU7XG5cbiAgLyoqIENvbG9yIHZhcmlhbnQuICovXG4gIEBwcm9wZXJ0eSh7IHJlZmxlY3Q6IHRydWUgfSkgcHVibGljIGFjY2Vzc29yIGNvbG9yOiAnZGVmYXVsdCcgfCAnc21va2UnIHwgJ3doaXRlJyA9ICdkZWZhdWx0JztcblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVuZGVyKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGBcbiAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWxvYWRpbmctaW5kaWNhdG9yXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWxvYWRpbmctaW5kaWNhdG9yX19hbmltYXRlZC1lbGVtZW50XCI+PC9zcGFuPlxuICAgICAgPC9zcGFuPlxuICAgIGA7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi1sb2FkaW5nLWluZGljYXRvci1jaXJjbGUnOiBTYmJMb2FkaW5nSW5kaWNhdG9yQ2lyY2xlRWxlbWVudDtcbiAgfVxufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFpQk0sb0NBQWdDLE1BQUE7O0FBTHJDLE1BQUEsbUJBQUEsQ0FBQSxjQUFjLDhCQUE4QixHQUM1QyxlQUFlO0FBQUEsSUFDZCxNQUFNO0FBQUEsSUFDTixhQUFhO0FBQUEsRUFBQSxDQUNkLENBQUM7Ozs7b0JBQzZDOzs7O0FBQVIsRUFBQSxtQkFBUSxZQUFVO0FBQUE7O0FBSTFCLGtEQUFBLGtCQUFBLE1BQUEscUJBQXVELFNBQVM7Ozs7SUFBaEUsSUFBZ0IsUUFBaUQ7QUFBQSxhQUFBLG1CQUFBO0FBQUEsSUFBQTtBQUFBLElBQWpFLElBQWdCLE1BQWlELE9BQUE7QUFBQSx5QkFBQSx5QkFBQTtBQUFBLElBQUE7QUFBQSxJQUUzRSxTQUFNO0FBQ2hCLGFBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLElBQUE7QUFBQSxLQUhvQjs7QUFBNUIsd0JBQUEsQ0FBQSxTQUFTLEVBQUUsU0FBUyxLQUFNLENBQUEsQ0FBQztBQUFpQixpQkFBQSxJQUFBLE1BQUEsbUJBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxTQUFBLFFBQUEsT0FBQSxTQUFBLE9BQUEsUUFBQSxFQUFBLEtBQUEsQ0FBQSxRQUFBLFdBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFBLE9BQUEsS0FBQSxDQUFBLEtBQUEsVUFBQTtBQUFBLFVBQUEsUUFBaUQ7QUFBQSxTQUFBLFVBQUEsYUFBQSxxQkFBQSx3QkFBQTtBQUpoRyxpQkFhQyxNQUFBLG1CQUFBLEVBQUEsT0FBQSxXQUFBLEdBQUEsa0JBQUEsRUFBQSxNQUFBLFNBQUEsTUFBQSxXQUFBLE1BQUEsVUFBQSxVQUFBLEdBQUEsTUFBQSx1QkFBQTs7O1FBWndCLEdBQU0sU0FBbUIsT0FENUMsa0JBQWdDLFlBQUEsdUJBQUEsR0FBQzs7OyJ9

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

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

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

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

package/development/loading-indicator-circle.js

@@ -1,146 +1,5 @@
-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 { hostAttributes } from "./core/decorators.js";
-const style = css`*,
-::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: 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,
-    var(--sbb-loading-indicator-circle-background-color),
-    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"), hostAttributes({
-    role: "progressbar",
-    "aria-busy": "true"
-  })];
-  let _classDescriptor;
-  let _classExtraInitializers = [];
-  let _classThis;
-  let _classSuper = 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);
-    }
-    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.styles = style, __runInitializers(_classThis, _classExtraInitializers), _a;
-  return _classThis;
-})();
+import { SbbLoadingIndicatorCircleElement } from "./loading-indicator-circle/loading-indicator-circle.js";
 export {
   SbbLoadingIndicatorCircleElement
 };
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvZWxlbWVudHMvbG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlL2xvYWRpbmctaW5kaWNhdG9yLWNpcmNsZS50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IENTU1Jlc3VsdEdyb3VwLCBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBodG1sLCBMaXRFbGVtZW50IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGN1c3RvbUVsZW1lbnQsIHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgeyBob3N0QXR0cmlidXRlcyB9IGZyb20gJy4uL2NvcmUvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL2xvYWRpbmctaW5kaWNhdG9yLWNpcmNsZS5zY3NzP2xpdCZpbmxpbmUnO1xuXG4vKipcbiAqIEl0IGRpc3BsYXlzIGEgY2lyY2xlIGxvYWRpbmcgaW5kaWNhdG9yLlxuICovXG5leHBvcnRcbkBjdXN0b21FbGVtZW50KCdzYmItbG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlJylcbkBob3N0QXR0cmlidXRlcyh7XG4gIHJvbGU6ICdwcm9ncmVzc2JhcicsXG4gICdhcmlhLWJ1c3knOiAndHJ1ZScsXG59KVxuY2xhc3MgU2JiTG9hZGluZ0luZGljYXRvckNpcmNsZUVsZW1lbnQgZXh0ZW5kcyBMaXRFbGVtZW50IHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSBzdHlsZXM6IENTU1Jlc3VsdEdyb3VwID0gc3R5bGU7XG5cbiAgLyoqIENvbG9yIHZhcmlhbnQuICovXG4gIEBwcm9wZXJ0eSh7IHJlZmxlY3Q6IHRydWUgfSkgcHVibGljIGFjY2Vzc29yIGNvbG9yOiAnZGVmYXVsdCcgfCAnc21va2UnIHwgJ3doaXRlJyA9ICdkZWZhdWx0JztcblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVuZGVyKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGBcbiAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWxvYWRpbmctaW5kaWNhdG9yXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWxvYWRpbmctaW5kaWNhdG9yX19hbmltYXRlZC1lbGVtZW50XCI+PC9zcGFuPlxuICAgICAgPC9zcGFuPlxuICAgIGA7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi1sb2FkaW5nLWluZGljYXRvci1jaXJjbGUnOiBTYmJMb2FkaW5nSW5kaWNhdG9yQ2lyY2xlRWxlbWVudDtcbiAgfVxufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFpQk0sb0NBQWdDLE1BQUE7O0FBTHJDLE1BQUEsbUJBQUEsQ0FBQSxjQUFjLDhCQUE4QixHQUM1QyxlQUFlO0FBQUEsSUFDZCxNQUFNO0FBQUEsSUFDTixhQUFhO0FBQUEsRUFBQSxDQUNkLENBQUM7Ozs7b0JBQzZDOzs7O0FBQVIsRUFBQSxtQkFBUSxZQUFVO0FBQUE7O0FBSTFCLGtEQUFBLGtCQUFBLE1BQUEscUJBQXVELFNBQVM7Ozs7SUFBaEUsSUFBZ0IsUUFBaUQ7QUFBQSxhQUFBLG1CQUFBO0FBQUEsSUFBQTtBQUFBLElBQWpFLElBQWdCLE1BQWlELE9BQUE7QUFBQSx5QkFBQSx5QkFBQTtBQUFBLElBQUE7QUFBQSxJQUUzRSxTQUFNO0FBQ2hCLGFBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLElBQUE7QUFBQSxLQUhvQjs7QUFBNUIsd0JBQUEsQ0FBQSxTQUFTLEVBQUUsU0FBUyxLQUFNLENBQUEsQ0FBQztBQUFpQixpQkFBQSxJQUFBLE1BQUEsbUJBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxTQUFBLFFBQUEsT0FBQSxTQUFBLE9BQUEsUUFBQSxFQUFBLEtBQUEsQ0FBQSxRQUFBLFdBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFBLE9BQUEsS0FBQSxDQUFBLEtBQUEsVUFBQTtBQUFBLFVBQUEsUUFBaUQ7QUFBQSxTQUFBLFVBQUEsYUFBQSxxQkFBQSx3QkFBQTtBQUpoRyxpQkFhQyxNQUFBLG1CQUFBLEVBQUEsT0FBQSxXQUFBLEdBQUEsa0JBQUEsRUFBQSxNQUFBLFNBQUEsTUFBQSxXQUFBLE1BQUEsVUFBQSxVQUFBLEdBQUEsTUFBQSx1QkFBQTs7O1FBWndCLEdBQU0sU0FBbUIsT0FENUMsa0JBQWdDLFlBQUEsdUJBQUEsR0FBQzs7OyJ9
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1pbmRpY2F0b3ItY2lyY2xlLmpzIiwic291cmNlcyI6W10sInNvdXJjZXNDb250ZW50IjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjsifQ==

package/development/loading-indicator.d.ts

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

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

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