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

package/development/table/table-wrapper/table-wrapper.component.js

@@ -0,0 +1,126 @@
+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 { ResizeController } from "@lit-labs/observers/resize-controller.js";
+import { css, LitElement, isServer, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { forceType } from "../../core/decorators.js";
+import { SbbNegativeMixin, SbbElementInternalsMixin } from "../../core/mixins.js";
+const style = css`:host {
+  display: block;
+  overflow: auto;
+}
+
+:host(:focus-visible) {
+  outline-offset: var(--sbb-focus-outline-offset);
+  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);
+}
+
+::slotted(.sbb-table) {
+  width: 100%;
+}`;
+let SbbTableWrapperElement = (() => {
+  var _focusable_accessor_storage, _a;
+  let _classDecorators = [customElement("sbb-table-wrapper")];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbNegativeMixin(SbbElementInternalsMixin(LitElement));
+  let _focusable_decorators;
+  let _focusable_initializers = [];
+  let _focusable_extraInitializers = [];
+  _a = class extends _classSuper {
+    constructor() {
+      super();
+      __privateAdd(this, _focusable_accessor_storage, __runInitializers(this, _focusable_initializers, false));
+      __runInitializers(this, _focusable_extraInitializers);
+      this.addController(new ResizeController(this, {
+        skipInitial: true,
+        callback: () => this._checkHorizontalScrollbarOffset()
+      }));
+      this.addEventListener?.("scroll", () => this._checkHorizontalScrollbarOffset(), {
+        passive: true
+      });
+    }
+    /** Whether the table wrapper is focusable. */
+    get focusable() {
+      return __privateGet(this, _focusable_accessor_storage);
+    }
+    set focusable(value) {
+      __privateSet(this, _focusable_accessor_storage, value);
+    }
+    connectedCallback() {
+      super.connectedCallback();
+      this._updateScrollbarClass();
+    }
+    willUpdate(changedProperties) {
+      super.willUpdate(changedProperties);
+      if (changedProperties.has("focusable")) {
+        if (this.focusable) {
+          if (!this.hasAttribute("tabindex")) {
+            this.setAttribute("tabindex", "0");
+          }
+        } else {
+          this.removeAttribute("tabindex");
+        }
+      }
+      if (changedProperties.has("negative")) {
+        this._updateScrollbarClass();
+      }
+    }
+    _updateScrollbarClass() {
+      if (isServer) {
+        return;
+      }
+      if (this.negative) {
+        this.classList.remove("sbb-scrollbar-thick-track-visible");
+        this.classList.add("sbb-scrollbar-thick-negative-track-visible");
+      } else {
+        this.classList.remove("sbb-scrollbar-thick-negative-track-visible");
+        this.classList.add("sbb-scrollbar-thick-track-visible");
+      }
+    }
+    /**
+     *  Calculates whether the table is horizontally scrolled and adds the
+     *  corresponding class `sbb-table-wrapper-offset-${none | left | right | both}`
+     */
+    _checkHorizontalScrollbarOffset() {
+      const state = this._calculateScrollOffset();
+      this.classList.remove(`sbb-table-wrapper-offset-none`, `sbb-table-wrapper-offset-left`, `sbb-table-wrapper-offset-right`, `sbb-table-wrapper-offset-both`);
+      this.classList.add(`sbb-table-wrapper-offset-${state}`);
+    }
+    _calculateScrollOffset() {
+      if (this.scrollWidth === this.offsetWidth) {
+        return "none";
+      }
+      const isAtStart = this.scrollLeft === 0;
+      const isAtEnd = this.scrollWidth - this.scrollLeft - this.offsetWidth <= 1;
+      if (isAtStart) {
+        return isAtEnd ? "none" : "right";
+      }
+      return isAtEnd ? "left" : "both";
+    }
+    render() {
+      return html`<slot></slot>`;
+    }
+  }, _focusable_accessor_storage = new WeakMap(), _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    _focusable_decorators = [forceType(), property({ reflect: true, type: Boolean })];
+    __esDecorate(_a, null, _focusable_decorators, { kind: "accessor", name: "focusable", static: false, private: false, access: { has: (obj) => "focusable" in obj, get: (obj) => obj.focusable, set: (obj, value) => {
+      obj.focusable = value;
+    } }, metadata: _metadata }, _focusable_initializers, _focusable_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 = "section", _a.styles = style, __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbTableWrapperElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUtd3JhcHBlci5jb21wb25lbnQuanMiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9lbGVtZW50cy90YWJsZS90YWJsZS13cmFwcGVyL3RhYmxlLXdyYXBwZXIuY29tcG9uZW50LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFJlc2l6ZUNvbnRyb2xsZXIgfSBmcm9tICdAbGl0LWxhYnMvb2JzZXJ2ZXJzL3Jlc2l6ZS1jb250cm9sbGVyLmpzJztcbmltcG9ydCB7XG4gIHR5cGUgQ1NTUmVzdWx0R3JvdXAsXG4gIGh0bWwsXG4gIGlzU2VydmVyLFxuICBMaXRFbGVtZW50LFxuICB0eXBlIFByb3BlcnR5VmFsdWVzLFxuICB0eXBlIFRlbXBsYXRlUmVzdWx0LFxufSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHkgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB7IGZvcmNlVHlwZSB9IGZyb20gJy4uLy4uL2NvcmUvZGVjb3JhdG9ycy50cyc7XG5pbXBvcnQgeyBTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW4sIFNiYk5lZ2F0aXZlTWl4aW4gfSBmcm9tICcuLi8uLi9jb3JlL21peGlucy50cyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL3RhYmxlLXdyYXBwZXIuc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBXcmFwcyBhIHRhYmxlIHRvIGVuaGFuY2UgaXRzIGZ1bmN0aW9uYWxpdHkuXG4gKlxuICogQHNsb3QgLSBVc2UgdGhlIHVubmFtZWQgc2xvdCB0byBhZGQgdGhlIHRhYmxlLlxuICovXG5leHBvcnRcbkBjdXN0b21FbGVtZW50KCdzYmItdGFibGUtd3JhcHBlcicpXG5jbGFzcyBTYmJUYWJsZVdyYXBwZXJFbGVtZW50IGV4dGVuZHMgU2JiTmVnYXRpdmVNaXhpbihTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW4oTGl0RWxlbWVudCkpIHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSByZWFkb25seSByb2xlID0gJ3NlY3Rpb24nO1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBzdHlsZTtcblxuICAvKiogV2hldGhlciB0aGUgdGFibGUgd3JhcHBlciBpcyBmb2N1c2FibGUuICovXG4gIEBmb3JjZVR5cGUoKVxuICBAcHJvcGVydHkoeyByZWZsZWN0OiB0cnVlLCB0eXBlOiBCb29sZWFuIH0pXG4gIHB1YmxpYyBhY2Nlc3NvciBmb2N1c2FibGU6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBwdWJsaWMgY29uc3RydWN0b3IoKSB7XG4gICAgc3VwZXIoKTtcbiAgICB0aGlzLmFkZENvbnRyb2xsZXIoXG4gICAgICBuZXcgUmVzaXplQ29udHJvbGxlcih0aGlzLCB7XG4gICAgICAgIHNraXBJbml0aWFsOiB0cnVlLFxuICAgICAgICBjYWxsYmFjazogKCkgPT4gdGhpcy5fY2hlY2tIb3Jpem9udGFsU2Nyb2xsYmFyT2Zmc2V0KCksXG4gICAgICB9KSxcbiAgICApO1xuXG4gICAgdGhpcy5hZGRFdmVudExpc3RlbmVyPy4oJ3Njcm9sbCcsICgpID0+IHRoaXMuX2NoZWNrSG9yaXpvbnRhbFNjcm9sbGJhck9mZnNldCgpLCB7XG4gICAgICBwYXNzaXZlOiB0cnVlLFxuICAgIH0pO1xuICB9XG5cbiAgcHVibGljIG92ZXJyaWRlIGNvbm5lY3RlZENhbGxiYWNrKCk6IHZvaWQge1xuICAgIHN1cGVyLmNvbm5lY3RlZENhbGxiYWNrKCk7XG5cbiAgICAvLyBBcyB3ZSBjYW4ndCBpbmNsdWRlIHRoZSBzY3JvbGxiYXIgbWl4aW4gb24gdGhlIGhvc3QgYW5kIHRvIG1pbmltaXplXG4gICAgLy8gcGF5bG9hZCwgd2UgZGVjaWRlZCB0byBhZGQgdGhlIHNjcm9sbGJhciBjbGFzcyBoZXJlLlxuICAgIC8vIFRoaXMgaXMgYW4gZXhjZXB0aW9uIGFzIHdlIG5vcm1hbGx5IGRvbid0IGFsdGVyIHRoZSBjbGFzc0xpc3Qgb2YgdGhlIGhvc3QuXG4gICAgdGhpcy5fdXBkYXRlU2Nyb2xsYmFyQ2xhc3MoKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSB3aWxsVXBkYXRlKGNoYW5nZWRQcm9wZXJ0aWVzOiBQcm9wZXJ0eVZhbHVlczx0aGlzPik6IHZvaWQge1xuICAgIHN1cGVyLndpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXMpO1xuXG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnZm9jdXNhYmxlJykpIHtcbiAgICAgIGlmICh0aGlzLmZvY3VzYWJsZSkge1xuICAgICAgICBpZiAoIXRoaXMuaGFzQXR0cmlidXRlKCd0YWJpbmRleCcpKSB7XG4gICAgICAgICAgdGhpcy5zZXRBdHRyaWJ1dGUoJ3RhYmluZGV4JywgJzAnKTtcbiAgICAgICAgfVxuICAgICAgfSBlbHNlIHtcbiAgICAgICAgdGhpcy5yZW1vdmVBdHRyaWJ1dGUoJ3RhYmluZGV4Jyk7XG4gICAgICB9XG4gICAgfVxuXG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnbmVnYXRpdmUnKSkge1xuICAgICAgdGhpcy5fdXBkYXRlU2Nyb2xsYmFyQ2xhc3MoKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIF91cGRhdGVTY3JvbGxiYXJDbGFzcygpOiB2b2lkIHtcbiAgICBpZiAoaXNTZXJ2ZXIpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgaWYgKHRoaXMubmVnYXRpdmUpIHtcbiAgICAgIHRoaXMuY2xhc3NMaXN0LnJlbW92ZSgnc2JiLXNjcm9sbGJhci10aGljay10cmFjay12aXNpYmxlJyk7XG4gICAgICB0aGlzLmNsYXNzTGlzdC5hZGQoJ3NiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUtdHJhY2stdmlzaWJsZScpO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmNsYXNzTGlzdC5yZW1vdmUoJ3NiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUtdHJhY2stdmlzaWJsZScpO1xuICAgICAgdGhpcy5jbGFzc0xpc3QuYWRkKCdzYmItc2Nyb2xsYmFyLXRoaWNrLXRyYWNrLXZpc2libGUnKTtcbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogIENhbGN1bGF0ZXMgd2hldGhlciB0aGUgdGFibGUgaXMgaG9yaXpvbnRhbGx5IHNjcm9sbGVkIGFuZCBhZGRzIHRoZVxuICAgKiAgY29ycmVzcG9uZGluZyBjbGFzcyBgc2JiLXRhYmxlLXdyYXBwZXItb2Zmc2V0LSR7bm9uZSB8IGxlZnQgfCByaWdodCB8IGJvdGh9YFxuICAgKi9cbiAgcHJpdmF0ZSBfY2hlY2tIb3Jpem9udGFsU2Nyb2xsYmFyT2Zmc2V0KCk6IHZvaWQge1xuICAgIGNvbnN0IHN0YXRlID0gdGhpcy5fY2FsY3VsYXRlU2Nyb2xsT2Zmc2V0KCk7XG4gICAgdGhpcy5jbGFzc0xpc3QucmVtb3ZlKFxuICAgICAgYHNiYi10YWJsZS13cmFwcGVyLW9mZnNldC1ub25lYCxcbiAgICAgIGBzYmItdGFibGUtd3JhcHBlci1vZmZzZXQtbGVmdGAsXG4gICAgICBgc2JiLXRhYmxlLXdyYXBwZXItb2Zmc2V0LXJpZ2h0YCxcbiAgICAgIGBzYmItdGFibGUtd3JhcHBlci1vZmZzZXQtYm90aGAsXG4gICAgKTtcbiAgICB0aGlzLmNsYXNzTGlzdC5hZGQoYHNiYi10YWJsZS13cmFwcGVyLW9mZnNldC0ke3N0YXRlfWApO1xuICB9XG5cbiAgcHJpdmF0ZSBfY2FsY3VsYXRlU2Nyb2xsT2Zmc2V0KCk6ICdub25lJyB8ICdsZWZ0JyB8ICdyaWdodCcgfCAnYm90aCcge1xuICAgIGlmICh0aGlzLnNjcm9sbFdpZHRoID09PSB0aGlzLm9mZnNldFdpZHRoKSB7XG4gICAgICByZXR1cm4gJ25vbmUnO1xuICAgIH1cbiAgICBjb25zdCBpc0F0U3RhcnQgPSB0aGlzLnNjcm9sbExlZnQgPT09IDA7XG4gICAgLy8gSW4gc29tZSBjYXNlcyB0aGUgY29tYmluZWQgdmFsdWUgb2Ygc2Nyb2xsTGVmdCBhbmQgb2Zmc2V0V2lkdGggaXMgb2ZmIGJ5XG4gICAgLy8gMSBwaXhlbCBmcm9tIHRoZSBzY3JvbGxXaWR0aC5cbiAgICBjb25zdCBpc0F0RW5kID0gdGhpcy5zY3JvbGxXaWR0aCAtIHRoaXMuc2Nyb2xsTGVmdCAtIHRoaXMub2Zmc2V0V2lkdGggPD0gMTtcblxuICAgIGlmIChpc0F0U3RhcnQpIHtcbiAgICAgIHJldHVybiBpc0F0RW5kID8gJ25vbmUnIDogJ3JpZ2h0JztcbiAgICB9XG4gICAgcmV0dXJuIGlzQXRFbmQgPyAnbGVmdCcgOiAnYm90aCc7XG4gIH1cblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVuZGVyKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGA8c2xvdD48L3Nsb3Q+YDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLXRhYmxlLXdyYXBwZXInOiBTYmJUYWJsZVdyYXBwZXJFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUF1Qk0sMEJBQXNCLE1BQUE7OzBCQUQzQixjQUFjLG1CQUFtQixDQUFDOzs7O0FBQ0UsTUFBQSxjQUFBLGlCQUFpQix5QkFBeUIsVUFBVSxDQUFDOzs7O0FBQTdELEVBQUEsbUJBQVEsWUFBc0Q7QUFBQSxJQVN6RixjQUFBO0FBQ0UsWUFBQTtBQUhGLHNEQUFBLGtCQUFBLE1BQUEseUJBQXFDLEtBQUs7O0FBSXhDLFdBQUssY0FDSCxJQUFJLGlCQUFpQixNQUFNO0FBQUEsUUFDekIsYUFBYTtBQUFBLFFBQ2IsVUFBVSxNQUFNLEtBQUssZ0NBQUE7QUFBQSxNQUErQixDQUNyRCxDQUFDO0FBR0osV0FBSyxtQkFBbUIsVUFBVSxNQUFNLEtBQUssbUNBQW1DO0FBQUEsUUFDOUUsU0FBUztBQUFBLE1BQUEsQ0FDVjtBQUFBLElBQ0Y7QUFBQTtBQUFBLElBZEQsSUFB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

package/development/table/table-wrapper.d.ts

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

package/development/table/table-wrapper.d.ts.map

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

package/development/table/table-wrapper.js

@@ -0,0 +1,5 @@
+import { SbbTableWrapperElement } from "./table-wrapper/table-wrapper.component.js";
+export {
+  SbbTableWrapperElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUtd3JhcHBlci5qcyIsInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W10sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7In0=

package/development/table.d.ts

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

package/development/table.d.ts.map

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

package/development/table.js

@@ -0,0 +1,5 @@
+import { SbbTableWrapperElement } from "./table/table-wrapper/table-wrapper.component.js";
+export {
+  SbbTableWrapperElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUuanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOyJ9

package/development/tabs/common.d.ts

@@ -0,0 +1,4 @@
+/**
+ * @entrypoint
+ */
+//# sourceMappingURL=common.d.ts.map

package/development/tabs/common.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../src/elements/tabs/common.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AAC5F,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,2CAA2C,CAAC"}

package/development/tabs/common.js

@@ -0,0 +1,171 @@
+import { css } from "lit";
+const tabGroupCommon = css`:host {
+  display: flex;
+  flex-direction: column;
+}
+
+:host(:not([size])) {
+  --sbb-tab-group-content-gap: var(--sbb-tab-group-content-gap-default);
+}
+
+:host([size=s]) {
+  --sbb-tab-group-content-gap: var(--sbb-tab-group-content-gap-size-s);
+}
+
+:host([size=l]) {
+  --sbb-tab-group-content-gap: var(--sbb-tab-group-content-gap-size-l);
+}
+
+:host([size=xl]) {
+  --sbb-tab-group-content-gap: var(--sbb-tab-group-content-gap-size-xl);
+}
+
+.sbb-tab-group,
+.sbb-tab-nav-bar {
+  display: flex;
+  flex-wrap: wrap;
+}`;
+const tabLabelCommon = css`:host {
+  --sbb-tab-label-animation-duration: var(
+    --sbb-disable-animation-duration,
+    var(--sbb-animation-duration-2x)
+  );
+  --sbb-tab-label-outline-border-radius-internal: calc(
+    var(--sbb-tab-label-outline-border-radius) - var(--sbb-focus-outline-offset)
+  );
+}
+
+:host(:is(:is(:state(size-s),[state--size-s]), [size=s])) {
+  --sbb-tab-label-height: var(--sbb-size-element-xs);
+  --sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xxxs);
+  --sbb-tab-label-font-size: var(--sbb-text-font-size-s);
+}
+
+:host(:is(:is(:state(size-l),[state--size-l]), [size=l])) {
+  --sbb-tab-label-height: var(--sbb-size-element-m);
+  --sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);
+  --sbb-tab-label-font-size: var(--sbb-text-font-size-m);
+}
+
+:host(:is(:is(:state(size-xl),[state--size-xl]), [size=xl])) {
+  --sbb-tab-label-height: var(--sbb-size-element-m);
+  --sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);
+  --sbb-tab-label-font-size: var(--sbb-text-font-size-xl);
+}
+
+:host(sbb-tab-label),
+:host(sbb-tab-nav-bar) ::slotted(a) {
+  pointer-events: var(--sbb-tab-label-pointer-events, unset);
+}
+@media (forced-colors: active) {
+  :host(sbb-tab-label),
+  :host(sbb-tab-nav-bar) ::slotted(a) {
+    --sbb-tab-label-color: ButtonText;
+    --sbb-tab-label-amount-color: ButtonText;
+  }
+}
+
+:host(sbb-tab-nav-bar) ::slotted(a),
+:host(sbb-tab-label) .sbb-tab-label {
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: var(--sbb-tab-label-gap);
+  color: var(--sbb-tab-label-color);
+  margin: 0;
+  padding-inline: var(--sbb-tab-label-inline-padding);
+  min-height: var(--sbb-tab-label-height);
+  transition: color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);
+  font-size: var(--sbb-tab-label-font-size);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  font-weight: var(--sbb-tab-label-font-weight);
+  text-decoration: var(--sbb-tab-label-text-decoration);
+}
+:host(sbb-tab-nav-bar) ::slotted(a)::after,
+:host(sbb-tab-label) .sbb-tab-label::after {
+  position: absolute;
+  content: "";
+  inset-inline: 0;
+  inset-block-end: 0;
+  height: var(--sbb-tab-label-marker-thickness);
+  background-color: var(--sbb-tab-label-color);
+  scale: var(--sbb-tab-label-marker-scale, 0);
+  transition-duration: var(--sbb-tab-label-animation-duration);
+  transition-timing-function: var(--sbb-tab-label-animation-easing);
+  transition-property: scale, background-color;
+}
+
+:host(sbb-tab-nav-bar) .sbb-tab-nav-bar > [data-has-divider],
+:host(sbb-tab-label:is(:state(has-divider),[state--has-divider])) {
+  position: relative;
+}
+:host(sbb-tab-nav-bar) .sbb-tab-nav-bar > [data-has-divider]::before,
+:host(sbb-tab-label:is(:state(has-divider),[state--has-divider]))::before {
+  content: "";
+  position: absolute;
+  inset-inline-start: 0;
+  inset-block-end: 0;
+  width: var(--sbb-tab-group-width);
+  height: var(--sbb-border-width-1x);
+  background-color: var(--sbb-tab-label-line-color);
+}
+
+:host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),
+:host(sbb-tab-label[disabled]) {
+  --sbb-tab-label-cursor: unset;
+  --sbb-tab-label-pointer-events: none;
+  --sbb-tab-label-text-decoration: line-through;
+}
+@media (forced-colors: active) {
+  :host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),
+  :host(sbb-tab-label[disabled]) {
+    --sbb-tab-label-color: GrayText;
+    --sbb-tab-label-amount-color: GrayText;
+  }
+}
+
+:host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),
+:host(sbb-tab-label[active]:not([disabled])) {
+  --sbb-tab-label-color: var(--sbb-color-3);
+  --sbb-tab-label-cursor: unset;
+  --sbb-tab-label-pointer-events: none;
+  --sbb-tab-label-marker-scale: 1;
+}
+@media (forced-colors: active) {
+  :host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),
+  :host(sbb-tab-label[active]:not([disabled])) {
+    --sbb-tab-label-color: ButtonText;
+    --sbb-tab-label-amount-color: ButtonText;
+  }
+}
+
+@media (any-hover: hover) {
+  :host(sbb-tab-nav-bar) ::slotted(a:hover:not(.sbb-disabled)),
+  :host(sbb-tab-label:hover:not([disabled])) {
+    --sbb-tab-label-marker-scale: 1;
+  }
+}
+
+:host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),
+:host(sbb-tab-label:active) {
+  --sbb-tab-label-color: var(--sbb-color-3);
+}
+@media (forced-colors: active) {
+  :host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),
+  :host(sbb-tab-label:active) {
+    --sbb-tab-label-color: ButtonText;
+    --sbb-tab-label-amount-color: ButtonText;
+  }
+}
+
+:host(sbb-tab-nav-bar) ::slotted(a:focus-visible),
+:host(sbb-tab-label:focus-visible) .sbb-tab-label {
+  outline-offset: var(--sbb-focus-outline-offset);
+  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);
+  border-radius: var(--sbb-tab-label-outline-border-radius-internal);
+}`;
+export {
+  tabGroupCommon as tabGroupCommonStyles,
+  tabLabelCommon as tabLabelCommonStyles
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tbW9uLmpzIiwic291cmNlcyI6W10sInNvdXJjZXNDb250ZW50IjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OzsifQ==

package/development/tabs/tab/tab.component.d.ts

@@ -0,0 +1,36 @@
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
+import { SbbTabGroupElement } from '../tab-group/tab-group.component.ts';
+import { SbbTabLabelElement } from '../tab-label.ts';
+declare const SbbTabElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
+/**
+ * Combined with a `sbb-tab-group` and `sbb-tab-label`, it displays a tab's content.
+ *
+ * @slot - Use the unnamed slot to provide content.
+ * @event {Event} active - The `active` event fires when the sbb-tab has been activated via user selection on the sbb-tab-label.
+ */
+export declare class SbbTabElement extends SbbTabElement_base {
+    static role: string;
+    static styles: CSSResultGroup;
+    static readonly events: {
+        readonly active: "active";
+    };
+    private _tabContentResizeObserver;
+    /** The `sbb-tab-label` associated with the tab. */
+    get label(): SbbTabLabelElement | null;
+    /** Get the parent `sbb-tab-group`. */
+    get group(): SbbTabGroupElement | null;
+    connectedCallback(): void;
+    /** @internal */
+    protected activate(): void;
+    /** @internal */
+    protected deactivate(): void;
+    private _onTabContentElementResize;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-tab': SbbTabElement;
+    }
+}
+export {};
+//# sourceMappingURL=tab.component.d.ts.map

package/development/tabs/tab/tab.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/tabs/tab/tab.component.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAIvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;;AAM1D;;;;;GAKG;AACH,qBAEM,aAAc,SAAQ,kBAAoC;IAC9D,OAAuB,IAAI,SAAc;IACzC,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,OAAO,CAAC,yBAAyB,CAI9B;IAEH,mDAAmD;IACnD,IAAW,KAAK,IAAI,kBAAkB,GAAG,IAAI,CAI5C;IAED,sCAAsC;IACtC,IAAW,KAAK,IAAI,kBAAkB,GAAG,IAAI,CAE5C;IAEe,iBAAiB,IAAI,IAAI;IAYzC,gBAAgB;IAChB,SAAS,CAAC,QAAQ,IAAI,IAAI;IAK1B,gBAAgB;IAChB,SAAS,CAAC,UAAU,IAAI,IAAI;IAK5B,OAAO,CAAC,0BAA0B;cAIf,MAAM,IAAI,cAAc;CAG5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,SAAS,EAAE,aAAa,CAAC;KAC1B;CACF"}

package/development/tabs/tab/tab.component.js

@@ -0,0 +1,98 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { ResizeController } from "@lit-labs/observers/resize-controller.js";
+import { css, LitElement, html } from "lit";
+import { customElement } from "lit/decorators.js";
+import { SbbElementInternalsMixin } from "../../core/mixins.js";
+const style = css`@charset "UTF-8";
+:host::after, :host::before {
+  content: " ";
+  display: block;
+  visibility: hidden;
+  height: 0;
+  overflow: hidden;
+}
+
+:host(:focus-visible) {
+  outline-offset: var(--sbb-focus-outline-offset);
+  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);
+}
+
+:host(:not(:is(:state(active),[state--active]))) {
+  display: none !important;
+}
+
+:host(:is(:state(active),[state--active])) {
+  display: block;
+  opacity: 1;
+  transition-duration: var(--sbb-tab-group-animation-duration);
+  transition-delay: var(--sbb-tab-group-animation-duration);
+  transition-timing-function: var(--sbb-animation-easing);
+  transition-property: opacity, height;
+  transition-behavior: allow-discrete;
+}
+@starting-style {
+  :host(:is(:state(active),[state--active])) {
+    opacity: 0;
+  }
+}`;
+let nextId = 0;
+let SbbTabElement = (() => {
+  var _a;
+  let _classDecorators = [customElement("sbb-tab")];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbElementInternalsMixin(LitElement);
+  _a = class extends _classSuper {
+    constructor() {
+      super(...arguments);
+      this._tabContentResizeObserver = new ResizeController(this, {
+        target: null,
+        skipInitial: true,
+        callback: () => this._onTabContentElementResize()
+      });
+    }
+    /** The `sbb-tab-label` associated with the tab. */
+    get label() {
+      return this.previousElementSibling?.localName === "sbb-tab-label" ? this.previousElementSibling : null;
+    }
+    /** Get the parent `sbb-tab-group`. */
+    get group() {
+      return this.closest("sbb-tab-group");
+    }
+    connectedCallback() {
+      super.connectedCallback();
+      this.id ||= `sbb-tab-${nextId++}`;
+      this.tabIndex = 0;
+      this.classList.add("sbb-scrollbar");
+    }
+    /** @internal */
+    activate() {
+      this.internals.states.add("active");
+      this._tabContentResizeObserver.observe(this);
+    }
+    /** @internal */
+    deactivate() {
+      this._tabContentResizeObserver.unobserve(this);
+      this.internals.states.delete("active");
+    }
+    _onTabContentElementResize() {
+      this.group?.["setTabContentHeight"](Math.floor(this.getBoundingClientRect().height));
+    }
+    render() {
+      return html`<slot></slot>`;
+    }
+  }, _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    __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 = "tabpanel", _a.styles = style, _a.events = {
+    active: "active"
+  }, __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbTabElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFiLmNvbXBvbmVudC5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL3RhYnMvdGFiL3RhYi5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgUmVzaXplQ29udHJvbGxlciB9IGZyb20gJ0BsaXQtbGFicy9vYnNlcnZlcnMvcmVzaXplLWNvbnRyb2xsZXIuanMnO1xuaW1wb3J0IHR5cGUgeyBDU1NSZXN1bHRHcm91cCwgVGVtcGxhdGVSZXN1bHQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgaHRtbCwgTGl0RWxlbWVudCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBjdXN0b21FbGVtZW50IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgeyBTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW4gfSBmcm9tICcuLi8uLi9jb3JlL21peGlucy50cyc7XG5pbXBvcnQgdHlwZSB7IFNiYlRhYkdyb3VwRWxlbWVudCB9IGZyb20gJy4uL3RhYi1ncm91cC90YWItZ3JvdXAuY29tcG9uZW50LnRzJztcbmltcG9ydCB0eXBlIHsgU2JiVGFiTGFiZWxFbGVtZW50IH0gZnJvbSAnLi4vdGFiLWxhYmVsLnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vdGFiLnNjc3M/bGl0JmlubGluZSc7XG5cbmxldCBuZXh0SWQgPSAwO1xuXG4vKipcbiAqIENvbWJpbmVkIHdpdGggYSBgc2JiLXRhYi1ncm91cGAgYW5kIGBzYmItdGFiLWxhYmVsYCwgaXQgZGlzcGxheXMgYSB0YWIncyBjb250ZW50LlxuICpcbiAqIEBzbG90IC0gVXNlIHRoZSB1bm5hbWVkIHNsb3QgdG8gcHJvdmlkZSBjb250ZW50LlxuICogQGV2ZW50IHtFdmVudH0gYWN0aXZlIC0gVGhlIGBhY3RpdmVgIGV2ZW50IGZpcmVzIHdoZW4gdGhlIHNiYi10YWIgaGFzIGJlZW4gYWN0aXZhdGVkIHZpYSB1c2VyIHNlbGVjdGlvbiBvbiB0aGUgc2JiLXRhYi1sYWJlbC5cbiAqL1xuZXhwb3J0XG5AY3VzdG9tRWxlbWVudCgnc2JiLXRhYicpXG5jbGFzcyBTYmJUYWJFbGVtZW50IGV4dGVuZHMgU2JiRWxlbWVudEludGVybmFsc01peGluKExpdEVsZW1lbnQpIHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSByb2xlID0gJ3RhYnBhbmVsJztcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSBzdHlsZXM6IENTU1Jlc3VsdEdyb3VwID0gc3R5bGU7XG4gIHB1YmxpYyBzdGF0aWMgcmVhZG9ubHkgZXZlbnRzID0ge1xuICAgIGFjdGl2ZTogJ2FjdGl2ZScsXG4gIH0gYXMgY29uc3Q7XG5cbiAgcHJpdmF0ZSBfdGFiQ29udGVudFJlc2l6ZU9ic2VydmVyID0gbmV3IFJlc2l6ZUNvbnRyb2xsZXIodGhpcywge1xuICAgIHRhcmdldDogbnVsbCxcbiAgICBza2lwSW5pdGlhbDogdHJ1ZSxcbiAgICBjYWxsYmFjazogKCkgPT4gdGhpcy5fb25UYWJDb250ZW50RWxlbWVudFJlc2l6ZSgpLFxuICB9KTtcblxuICAvKiogVGhlIGBzYmItdGFiLWxhYmVsYCBhc3NvY2lhdGVkIHdpdGggdGhlIHRhYi4gKi9cbiAgcHVibGljIGdldCBsYWJlbCgpOiBTYmJUYWJMYWJlbEVsZW1lbnQgfCBudWxsIHtcbiAgICByZXR1cm4gdGhpcy5wcmV2aW91c0VsZW1lbnRTaWJsaW5nPy5sb2NhbE5hbWUgPT09ICdzYmItdGFiLWxhYmVsJ1xuICAgICAgPyAodGhpcy5wcmV2aW91c0VsZW1lbnRTaWJsaW5nIGFzIFNiYlRhYkxhYmVsRWxlbWVudClcbiAgICAgIDogbnVsbDtcbiAgfVxuXG4gIC8qKiBHZXQgdGhlIHBhcmVudCBgc2JiLXRhYi1ncm91cGAuICovXG4gIHB1YmxpYyBnZXQgZ3JvdXAoKTogU2JiVGFiR3JvdXBFbGVtZW50IHwgbnVsbCB7XG4gICAgcmV0dXJuIHRoaXMuY2xvc2VzdCgnc2JiLXRhYi1ncm91cCcpO1xuICB9XG5cbiAgcHVibGljIG92ZXJyaWRlIGNvbm5lY3RlZENhbGxiYWNrKCk6IHZvaWQge1xuICAgIHN1cGVyLmNvbm5lY3RlZENhbGxiYWNrKCk7XG5cbiAgICB0aGlzLmlkIHx8PSBgc2JiLXRhYi0ke25leHRJZCsrfWA7XG4gICAgdGhpcy50YWJJbmRleCA9IDA7XG5cbiAgICAvLyBBcyB3ZSBjYW4ndCBpbmNsdWRlIHRoZSBzY3JvbGxiYXIgbWl4aW4gb24gdGhlIGhvc3QgYW5kIHRvIG1pbmltaXplXG4gICAgLy8gcGF5bG9hZCwgd2UgZGVjaWRlZCB0byBhZGQgdGhlIHNjcm9sbGJhciBjbGFzcyBoZXJlLlxuICAgIC8vIFRoaXMgaXMgYW4gZXhjZXB0aW9uIGFzIHdlIG5vcm1hbGx5IGRvbid0IGFsdGVyIHRoZSBjbGFzc0xpc3Qgb2YgdGhlIGhvc3QuXG4gICAgdGhpcy5jbGFzc0xpc3QuYWRkKCdzYmItc2Nyb2xsYmFyJyk7XG4gIH1cblxuICAvKiogQGludGVybmFsICovXG4gIHByb3RlY3RlZCBhY3RpdmF0ZSgpOiB2b2lkIHtcbiAgICB0aGlzLmludGVybmFscy5zdGF0ZXMuYWRkKCdhY3RpdmUnKTtcbiAgICB0aGlzLl90YWJDb250ZW50UmVzaXplT2JzZXJ2ZXIub2JzZXJ2ZSh0aGlzKTtcbiAgfVxuXG4gIC8qKiBAaW50ZXJuYWwgKi9cbiAgcHJvdGVjdGVkIGRlYWN0aXZhdGUoKTogdm9pZCB7XG4gICAgdGhpcy5fdGFiQ29udGVudFJlc2l6ZU9ic2VydmVyLnVub2JzZXJ2ZSh0aGlzKTtcbiAgICB0aGlzLmludGVybmFscy5zdGF0ZXMuZGVsZXRlKCdhY3RpdmUnKTtcbiAgfVxuXG4gIHByaXZhdGUgX29uVGFiQ29udGVudEVsZW1lbnRSZXNpemUoKTogdm9pZCB7XG4gICAgdGhpcy5ncm91cD8uWydzZXRUYWJDb250ZW50SGVpZ2h0J10oTWF0aC5mbG9vcih0aGlzLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLmhlaWdodCkpO1xuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgPHNsb3Q+PC9zbG90PmA7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi10YWInOiBTYmJUYWJFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQVdBLElBQUksU0FBUztJQVVQLGlCQUFhLE1BQUE7OzBCQURsQixjQUFjLFNBQVMsQ0FBQzs7OztvQkFDRyx5QkFBeUIsVUFBVTtBQUEzQyxFQUFBLG1CQUFRLFlBQW9DO0FBQUE7O0FBT3RELFdBQUEsNEJBQTRCLElBQUksaUJBQWlCLE1BQU07QUFBQSxRQUM3RCxRQUFRO0FBQUEsUUFDUixhQUFhO0FBQUEsUUFDYixVQUFVLE1BQU0sS0FBSywyQkFBQTtBQUFBLE1BQTBCLENBQ2hEO0FBQUEsSUE2Q0g7QUFBQTtBQUFBLElBMUNFLElBQVcsUUFBSztBQUNkLGFBQU8sS0FBSyx3QkFBd0IsY0FBYyxrQkFDN0MsS0FBSyx5QkFDTjtBQUFBLElBQ047QUFBQTtBQUFBLElBR0EsSUFBVyxRQUFLO0FBQ2QsYUFBTyxLQUFLLFFBQVEsZUFBZTtBQUFBLElBQ3JDO0FBQUEsSUFFZ0Isb0JBQWlCO0FBQy9CLFlBQU0sa0JBQUE7QUFFTixXQUFLLE9BQU8sV0FBVyxRQUFRO0FBQy9CLFdBQUssV0FBVztBQUtoQixXQUFLLFVBQVUsSUFBSSxlQUFlO0FBQUEsSUFDcEM7QUFBQTtBQUFBLElBR1UsV0FBUTtBQUNoQixXQUFLLFVBQVUsT0FBTyxJQUFJLFFBQVE7QUFDbEMsV0FBSywwQkFBMEIsUUFBUSxJQUFJO0FBQUEsSUFDN0M7QUFBQTtBQUFBLElBR1UsYUFBVTtBQUNsQixXQUFLLDBCQUEwQixVQUFVLElBQUk7QUFDN0MsV0FBSyxVQUFVLE9BQU8sT0FBTyxRQUFRO0FBQUEsSUFDdkM7QUFBQSxJQUVRLDZCQUEwQjtBQUNoQyxXQUFLLFFBQVEscUJBQXFCLEVBQUUsS0FBSyxNQUFNLEtBQUssd0JBQXdCLE1BQU0sQ0FBQztBQUFBLElBQ3JGO0FBQUEsSUFFbUIsU0FBTTtBQUN2QixhQUFPO0FBQUEsSUFDVDtBQUFBOztBQXZERixpQkFBQSxNQUFBLG1CQUFBLEVBQUEsT0FBQSxXQUFBLEdBQUEsa0JBQUEsRUFBQSxNQUFBLFNBQUEsTUFBQSxXQUFBLE1BQUEsVUFBQSxVQUFBLEdBQUEsTUFBQSx1QkFBQTs7O1FBQ3lCLEdBQUEsT0FBTyxZQUNQLEdBQUEsU0FBeUIsT0FDekIsR0FBQSxTQUFTO0FBQUEsSUFDOUIsUUFBUTtBQUFBLEVBQUEsR0FKTixrQkFBQSxZQUFBLHVCQUFBLEdBQWM7OzsifQ==

package/development/tabs/tab-group/tab-group.component.d.ts

@@ -0,0 +1,82 @@
+import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
+import { SbbTabLabelElement } from '../tab-label.ts';
+import { SbbTabElement } from '../tab.ts';
+export type SbbTabChangedEventDetails = {
+    activeIndex: number;
+    activeTabLabel: SbbTabLabelElement;
+    activeTab: SbbTabElement;
+    previousIndex: number;
+    previousTabLabel: SbbTabLabelElement | undefined;
+    previousTab: SbbTabElement | undefined;
+};
+declare const SbbTabGroupElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbHydrationMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
+/**
+ * It displays one or more tabs, each one with a label and some content.
+ *
+ * @slot - Use the unnamed slot to add content to the `sbb-tab-group` via `sbb-tab-label` and `sbb-tab` instances.
+ * @event {CustomEvent<SbbTabChangedEventDetails>} tabchange - The tabchange event is dispatched when a tab is selected.
+ */
+export declare class SbbTabGroupElement extends SbbTabGroupElement_base {
+    static styles: CSSResultGroup;
+    static readonly events: {
+        readonly tabchange: "tabchange";
+    };
+    private _tabGroupElement;
+    private _tabGroupResizeObserver;
+    /**
+     * Size variant, either s, l or xl.
+     * @default 'l' / 's' (lean)
+     */
+    accessor size: 's' | 'l' | 'xl';
+    /**
+     * Sets the initial tab. If it matches a disabled tab or exceeds the length of
+     * the tab group, the first enabled tab will be selected.
+     */
+    accessor initialSelectedIndex: number;
+    /**
+     * If set to true, the `sbb-tab` elements take 100% height of the `sbb-tab-group`.
+     * It enables controlling the height on the `sbb-tab-group` element.
+     * The content becomes scrollable on overflow.
+     */
+    accessor fixedHeight: boolean;
+    /** Gets the slotted `sbb-tab-label`s. */
+    get labels(): SbbTabLabelElement[];
+    /** Gets the slotted `sbb-tab`s. */
+    get tabs(): SbbTabElement[];
+    constructor();
+    protected firstUpdated(changedProperties: PropertyValues<this>): void;
+    /**
+     * Disables a tab by index.
+     * @param index The index of the tab you want to disable.
+     */
+    disableTab(index: number): void;
+    /**
+     * Enables a tab by index.
+     * @param index The index of the tab you want to enable.
+     */
+    enableTab(index: number): void;
+    /**
+     * Activates a tab by index.
+     * @param index The index of the tab you want to activate.
+     */
+    activateTab(index: number): void;
+    private _enabledTabs;
+    private _onContentSlotChange;
+    private _onLabelSlotChange;
+    private _ensureActiveTab;
+    private _initSelection;
+    private _onTabGroupElementResize;
+    private _handleKeyDown;
+    /**
+     * @internal
+     */
+    protected setTabContentHeight(contentHeight: number): void;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-tab-group': SbbTabGroupElement;
+    }
+}
+export {};
+//# sourceMappingURL=tab-group.component.d.ts.map

package/development/tabs/tab-group/tab-group.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-group.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/tabs/tab-group/tab-group.component.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAevC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAI/C,MAAM,MAAM,yBAAyB,GAAG;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,kBAAkB,CAAC;IACnC,SAAS,EAAE,aAAa,CAAC;IACzB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,kBAAkB,GAAG,SAAS,CAAC;IACjD,WAAW,EAAE,aAAa,GAAG,SAAS,CAAC;CACxC,CAAC;;AAEF;;;;;GAKG;AACH,qBAEM,kBAAmB,SAAQ,uBAAuD;IACtF,OAAuB,MAAM,EAAE,cAAc,CAAkD;IAC/F,gBAAuB,MAAM;;MAElB;IAEX,OAAO,CAAC,gBAAgB,CAAe;IACvC,OAAO,CAAC,uBAAuB,CAI5B;IAEH;;;OAGG;IACH,SACgB,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,IAAI,CAAwB;IAE9D;;;OAGG;IACH,SAEgB,oBAAoB,EAAE,MAAM,CAAK;IAEjD;;;;OAIG;IACH,SAEgB,WAAW,EAAE,OAAO,CAAS;IAE7C,yCAAyC;IACzC,IAAW,MAAM,IAAI,kBAAkB,EAAE,CAQxC;IAED,mCAAmC;IACnC,IAAW,IAAI,IAAI,aAAa,EAAE,CAQjC;;cAOkB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAW9E;;;OAGG;IACI,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAMtC;;;OAGG;IACI,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAMrC;;;OAGG;IACI,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAIvC,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,oBAAoB,CAG1B;IAEF,OAAO,CAAC,kBAAkB,CAGxB;IAEF,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,cAAc;IAgBtB,OAAO,CAAC,wBAAwB;IAYhC,OAAO,CAAC,cAAc;IAoBtB;;OAEG;IACH,SAAS,CAAC,mBAAmB,CAAC,aAAa,EAAE,MAAM,GAAG,IAAI;cAIvC,MAAM,IAAI,cAAc;CAkB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,kBAAkB,CAAC;KACrC;CACF"}