@sbb-esta/lyne-elements 0.52.2 → 1.0.0

package/development/selection-expansion-panel.js

@@ -0,0 +1,340 @@
+import { css, LitElement, html } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import { SbbLanguageController, SbbConnectedAbortController, SbbSlotStateController } from "./core/controllers.js";
+import { EventEmitter } from "./core/eventing.js";
+import { i18nExpanded, i18nCollapsed } from "./core/i18n.js";
+import { SbbHydrationMixin } from "./core/mixins.js";
+import "./divider.js";
+const style = css`/**
+ * Better font rendering (on OS X)
+ * http://maximilianhoffmann.com/posts/better-font-rendering-on-osx
+ *
+ * Usage:
+ *
+ * .var_dark_on_light {
+ * 	@include font-smoothing;
+ * }
+ * .var_light_on_dark {
+ * 	@include font-smoothing-reset;
+ * }
+ */
+/** This mixin can be used to avoid spacing problems by inserting an invisible space as pseudo element. */
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+:host {
+  --sbb-selection-expansion-panel-background: var(--sbb-color-white);
+  --sbb-selection-expansion-panel-border-color: var(--sbb-color-cloud);
+  --sbb-selection-expansion-panel-inner-background: transparent;
+  --sbb-selection-expansion-panel-inner-border-width: 0px;
+  --sbb-selection-expansion-panel-animation-duration: var(
+    --sbb-disable-animation-zero-time,
+    var(--sbb-animation-duration-4x)
+  );
+  --sbb-selection-expansion-panel-border-width: var(--sbb-border-width-1x);
+  --sbb-selection-expansion-panel-content-visibility: hidden;
+  --sbb-selection-expansion-panel-content-padding-inline: var(--sbb-spacing-responsive-xxs);
+  --sbb-selection-expansion-panel-border-radius: var(--sbb-border-radius-4x);
+  --sbb-focus-outline-color: var(--sbb-focus-outline-color-default);
+  display: contents;
+}
+
+:host([color=milk]) {
+  --sbb-selection-expansion-panel-background: var(--sbb-color-milk);
+}
+
+:host([data-checked]:not([data-disabled])) {
+  --sbb-selection-expansion-panel-border-color: var(--sbb-color-charcoal);
+  --sbb-selection-expansion-panel-border-width: var(--sbb-border-width-2x);
+}
+
+:host([data-slot-names~=content][data-disabled]) {
+  --sbb-selection-expansion-panel-border-color: var(--sbb-color-cloud);
+}
+
+:host([borderless]:not([data-checked])) {
+  --sbb-selection-expansion-panel-border-color: transparent;
+}
+
+:host([data-slot-names~=content]:where([data-state=opening], [data-state=opened])) {
+  --sbb-selection-expansion-panel-content-visibility: visible;
+  --sbb-selection-expansion-panel-content-padding-block-end: var(--sbb-spacing-responsive-xs);
+}
+
+.sbb-selection-expansion-panel {
+  flex: auto;
+  position: relative;
+  width: 100%;
+  background-color: var(--sbb-selection-expansion-panel-background);
+  border-radius: var(--sbb-selection-expansion-panel-border-radius);
+  box-shadow: inset 0 0 0 var(--sbb-selection-expansion-panel-border-width) var(--sbb-selection-expansion-panel-border-color);
+  transition-duration: var(--sbb-selection-expansion-panel-animation-duration);
+  transition-timing-function: var(--sbb-animation-easing);
+  transition-property: box-shadow;
+}
+@media (forced-colors: active) {
+  .sbb-selection-expansion-panel::after {
+    content: "";
+    display: block;
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+    border: var(--sbb-selection-expansion-panel-border-width) solid var(--sbb-selection-expansion-panel-border-color);
+    border-radius: var(--sbb-selection-expansion-panel-border-radius);
+  }
+}
+
+.sbb-selection-expansion-panel__content--wrapper {
+  display: grid;
+  visibility: var(--sbb-selection-expansion-panel-content-visibility);
+  grid-template-rows: 0fr;
+  opacity: 0;
+}
+:host([data-state=opened]) .sbb-selection-expansion-panel__content--wrapper {
+  grid-template-rows: 1fr;
+  opacity: 1;
+}
+:host([data-state=opening]) .sbb-selection-expansion-panel__content--wrapper {
+  animation-name: open, open-opacity;
+  animation-fill-mode: forwards;
+  animation-duration: var(--sbb-selection-expansion-panel-animation-duration);
+  animation-timing-function: var(--sbb-animation-easing);
+  animation-delay: 0s, var(--sbb-selection-expansion-panel-animation-duration);
+}
+:host([data-state=closing]) .sbb-selection-expansion-panel__content--wrapper {
+  animation-name: close;
+  animation-duration: var(--sbb-selection-expansion-panel-animation-duration);
+  animation-timing-function: var(--sbb-animation-easing);
+}
+:host(:not([data-slot-names~=content])) .sbb-selection-expansion-panel__content--wrapper {
+  display: none;
+}
+
+.sbb-selection-expansion-panel__content {
+  overflow: hidden;
+  padding-inline: var(--sbb-selection-expansion-panel-content-padding-inline);
+  padding-block-end: var(--sbb-selection-expansion-panel-content-padding-block-end);
+  transition: padding var(--sbb-selection-expansion-panel-animation-duration) var(--sbb-animation-easing);
+}
+
+sbb-divider {
+  margin-block-end: var(--sbb-spacing-responsive-xxs);
+}
+
+@keyframes open {
+  from {
+    grid-template-rows: 0fr;
+  }
+  to {
+    grid-template-rows: 1fr;
+  }
+}
+@keyframes open-opacity {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes close {
+  from {
+    grid-template-rows: 1fr;
+    opacity: 1;
+  }
+  to {
+    grid-template-rows: 0fr;
+    opacity: 0;
+  }
+}`;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let SbbSelectionExpansionPanelElement = class extends SbbHydrationMixin(LitElement) {
+  constructor() {
+    super();
+    this.color = "white";
+    this.forceOpen = false;
+    this.borderless = false;
+    this._willOpen = new EventEmitter(
+      this,
+      SbbSelectionExpansionPanelElement.events.willOpen
+    );
+    this._didOpen = new EventEmitter(
+      this,
+      SbbSelectionExpansionPanelElement.events.didOpen
+    );
+    this._willClose = new EventEmitter(
+      this,
+      SbbSelectionExpansionPanelElement.events.willClose
+    );
+    this._didClose = new EventEmitter(
+      this,
+      SbbSelectionExpansionPanelElement.events.didClose
+    );
+    this._language = new SbbLanguageController(this);
+    this._abort = new SbbConnectedAbortController(this);
+    this._initialized = false;
+    new SbbSlotStateController(this);
+  }
+  set _state(state2) {
+    this.setAttribute("data-state", state2);
+  }
+  get _state() {
+    return this.getAttribute("data-state");
+  }
+  /** Whether the selection panel is checked. */
+  set _checked(checked) {
+    this.toggleAttribute("data-checked", checked);
+  }
+  get _checked() {
+    return this.hasAttribute("data-checked");
+  }
+  /** Whether the selection panel is disabled. */
+  set _disabled(disabled) {
+    this.toggleAttribute("data-disabled", disabled);
+  }
+  /**
+   * Whether it has an expandable content
+   */
+  get _hasContent() {
+    var _a;
+    return ((_a = this.querySelectorAll) == null ? void 0 : _a.call(this, '[slot="content"]').length) > 0;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("panelConnected", this._initFromInput.bind(this), {
+      signal: this._abort.signal
+    });
+    this._state || (this._state = "closed");
+  }
+  willUpdate(changedProperties) {
+    super.willUpdate(changedProperties);
+    if (changedProperties.has("forceOpen")) {
+      this._updateState();
+    }
+  }
+  firstUpdated(changedProperties) {
+    super.firstUpdated(changedProperties);
+    this._initialized = true;
+  }
+  _updateState() {
+    if (!this._hasContent) {
+      return;
+    }
+    this.forceOpen || this._checked ? this._open(!this._initialized) : this._close();
+    this._updateExpandedLabel(this.forceOpen || this._checked);
+  }
+  _open(skipAnimation = false) {
+    if (this._state !== "closed" && this._state !== "closing") {
+      return;
+    }
+    this._state = "opening";
+    this._willOpen.emit();
+    if (skipAnimation) {
+      this._state = "opened";
+      this._didOpen.emit();
+    }
+  }
+  _close() {
+    if (this._state !== "opened" && this._state !== "opening") {
+      return;
+    }
+    this._state = "closing";
+    this._willClose.emit();
+  }
+  _initFromInput(event) {
+    const input = event.target;
+    this._checked = input.checked;
+    this._disabled = input.disabled;
+    this._updateState();
+  }
+  _onInputStateChange(event) {
+    if (event.detail.type === "disabled") {
+      this._disabled = event.detail.disabled;
+      return;
+    } else if (event.detail.type !== "checked") {
+      return;
+    }
+    this._checked = event.detail.checked;
+    this._updateState();
+  }
+  _onAnimationEnd(event) {
+    if (event.animationName === "open-opacity" && this._state === "opening") {
+      this._state = "opened";
+      this._didOpen.emit();
+    } else if (event.animationName === "close" && this._state === "closing") {
+      this._state = "closed";
+      this._didClose.emit();
+    }
+  }
+  async _updateExpandedLabel(open) {
+    await this.hydrationComplete;
+    const panelElement = this.querySelector(
+      "sbb-radio-button-panel, sbb-checkbox-panel"
+    );
+    if (!panelElement) {
+      return;
+    }
+    if (!this._hasContent) {
+      panelElement.expansionState = "";
+      return;
+    }
+    panelElement.expansionState = open ? ", " + i18nExpanded[this._language.current] : ", " + i18nCollapsed[this._language.current];
+  }
+  render() {
+    return html`
+      <div class="sbb-selection-expansion-panel">
+        <div class="sbb-selection-expansion-panel__input" @stateChange=${this._onInputStateChange}>
+          <slot></slot>
+        </div>
+        <div
+          class="sbb-selection-expansion-panel__content--wrapper"
+          .inert=${this._state !== "opened"}
+          @animationend=${(event) => this._onAnimationEnd(event)}
+        >
+          <div class="sbb-selection-expansion-panel__content">
+            <sbb-divider></sbb-divider>
+            <slot name="content"></slot>
+          </div>
+        </div>
+      </div>
+    `;
+  }
+};
+SbbSelectionExpansionPanelElement.styles = style;
+SbbSelectionExpansionPanelElement.events = {
+  willOpen: "willOpen",
+  didOpen: "didOpen",
+  willClose: "willClose",
+  didClose: "didClose"
+};
+__decorateClass([
+  property()
+], SbbSelectionExpansionPanelElement.prototype, "color", 2);
+__decorateClass([
+  property({ attribute: "force-open", type: Boolean })
+], SbbSelectionExpansionPanelElement.prototype, "forceOpen", 2);
+__decorateClass([
+  property({ reflect: true, type: Boolean })
+], SbbSelectionExpansionPanelElement.prototype, "borderless", 2);
+__decorateClass([
+  state()
+], SbbSelectionExpansionPanelElement.prototype, "_state", 1);
+SbbSelectionExpansionPanelElement = __decorateClass([
+  customElement("sbb-selection-expansion-panel")
+], SbbSelectionExpansionPanelElement);
+export {
+  SbbSelectionExpansionPanelElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VsZWN0aW9uLWV4cGFuc2lvbi1wYW5lbC5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2VsZW1lbnRzL3NlbGVjdGlvbi1leHBhbnNpb24tcGFuZWwvc2VsZWN0aW9uLWV4cGFuc2lvbi1wYW5lbC50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IENTU1Jlc3VsdEdyb3VwLCBQcm9wZXJ0eVZhbHVlcywgVGVtcGxhdGVSZXN1bHQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgaHRtbCwgTGl0RWxlbWVudCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBjdXN0b21FbGVtZW50LCBwcm9wZXJ0eSwgc3RhdGUgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB0eXBlIHsgU2JiQ2hlY2tib3hQYW5lbEVsZW1lbnQgfSBmcm9tICcuLi9jaGVja2JveC5qcyc7XG5pbXBvcnQge1xuICBTYmJDb25uZWN0ZWRBYm9ydENvbnRyb2xsZXIsXG4gIFNiYkxhbmd1YWdlQ29udHJvbGxlcixcbiAgU2JiU2xvdFN0YXRlQ29udHJvbGxlcixcbn0gZnJvbSAnLi4vY29yZS9jb250cm9sbGVycy5qcyc7XG5pbXBvcnQgeyBFdmVudEVtaXR0ZXIgfSBmcm9tICcuLi9jb3JlL2V2ZW50aW5nLmpzJztcbmltcG9ydCB7IGkxOG5Db2xsYXBzZWQsIGkxOG5FeHBhbmRlZCB9IGZyb20gJy4uL2NvcmUvaTE4bi5qcyc7XG5pbXBvcnQgdHlwZSB7IFNiYk9wZW5lZENsb3NlZFN0YXRlLCBTYmJTdGF0ZUNoYW5nZSB9IGZyb20gJy4uL2NvcmUvaW50ZXJmYWNlcy5qcyc7XG5pbXBvcnQgeyBTYmJIeWRyYXRpb25NaXhpbiB9IGZyb20gJy4uL2NvcmUvbWl4aW5zLmpzJztcbmltcG9ydCB0eXBlIHsgU2JiUmFkaW9CdXR0b25QYW5lbEVsZW1lbnQgfSBmcm9tICcuLi9yYWRpby1idXR0b24uanMnO1xuXG5pbXBvcnQgc3R5bGUgZnJvbSAnLi9zZWxlY3Rpb24tZXhwYW5zaW9uLXBhbmVsLnNjc3M/bGl0JmlubGluZSc7XG5cbmltcG9ydCAnLi4vZGl2aWRlci5qcyc7XG5cbi8qKlxuICogSXQgZGlzcGxheXMgYW4gZXhwYW5kYWJsZSBwYW5lbCBjb25uZWN0ZWQgdG8gYSBgc2JiLWNoZWNrYm94YCBvciB0byBhIGBzYmItcmFkaW8tYnV0dG9uYC5cbiAqXG4gKiBAc2xvdCAtIFVzZSB0aGUgdW5uYW1lZCBzbG90IHRvIGFkZCBgc2JiLWNoZWNrYm94YCBvciBgc2JiLXJhZGlvLWJ1dHRvbmAgZWxlbWVudHMgdG8gdGhlIGBzYmItc2VsZWN0aW9uLWV4cGFuc2lvbi1wYW5lbGAuXG4gKiBAc2xvdCBjb250ZW50IC0gVXNlIHRoaXMgc2xvdCB0byBwcm92aWRlIGN1c3RvbSBjb250ZW50IGZvciB0aGUgcGFuZWwgKG9wdGlvbmFsKS5cbiAqIEBldmVudCB7Q3VzdG9tRXZlbnQ8dm9pZD59IHdpbGxPcGVuIC0gRW1pdHMgd2hlbmV2ZXIgdGhlIGNvbnRlbnQgc2VjdGlvbiBzdGFydHMgdGhlIG9wZW5pbmcgdHJhbnNpdGlvbi5cbiAqIEBldmVudCB7Q3VzdG9tRXZlbnQ8dm9pZD59IGRpZE9wZW4gLSBFbWl0cyB3aGVuZXZlciB0aGUgY29udGVudCBzZWN0aW9uIGlzIG9wZW5lZC5cbiAqIEBldmVudCB7Q3VzdG9tRXZlbnQ8dm9pZD59IHdpbGxDbG9zZSAtIEVtaXRzIHdoZW5ldmVyIHRoZSBjb250ZW50IHNlY3Rpb24gYmVnaW5zIHRoZSBjbG9zaW5nIHRyYW5zaXRpb24uXG4gKiBAZXZlbnQge0N1c3RvbUV2ZW50PHZvaWQ+fSBkaWRDbG9zZSAtIEVtaXRzIHdoZW5ldmVyIHRoZSBjb250ZW50IHNlY3Rpb24gaXMgY2xvc2VkLlxuICovXG5AY3VzdG9tRWxlbWVudCgnc2JiLXNlbGVjdGlvbi1leHBhbnNpb24tcGFuZWwnKVxuZXhwb3J0IGNsYXNzIFNiYlNlbGVjdGlvbkV4cGFuc2lvblBhbmVsRWxlbWVudCBleHRlbmRzIFNiYkh5ZHJhdGlvbk1peGluKExpdEVsZW1lbnQpIHtcbiAgLy8gRklYTUUgaW5oZXJpdGluZyBmcm9tIFNiYk9wZW5DbG9zZUJhc2VFbGVtZW50IHJlcXVpcmVzOiBodHRwczovL2dpdGh1Yi5jb20vb3Blbi13Yy9jdXN0b20tZWxlbWVudHMtbWFuaWZlc3QvaXNzdWVzLzI1M1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBzdHlsZTtcbiAgcHVibGljIHN0YXRpYyByZWFkb25seSBldmVudHM6IFJlY29yZDxzdHJpbmcsIHN0cmluZz4gPSB7XG4gICAgd2lsbE9wZW46ICd3aWxsT3BlbicsXG4gICAgZGlkT3BlbjogJ2RpZE9wZW4nLFxuICAgIHdpbGxDbG9zZTogJ3dpbGxDbG9zZScsXG4gICAgZGlkQ2xvc2U6ICdkaWRDbG9zZScsXG4gIH0gYXMgY29uc3Q7XG5cbiAgLyoqIFRoZSBiYWNrZ3JvdW5kIGNvbG9yIG9mIHRoZSBwYW5lbC4gKi9cbiAgQHByb3BlcnR5KCkgcHVibGljIGNvbG9yOiAnd2hpdGUnIHwgJ21pbGsnID0gJ3doaXRlJztcblxuICAvKiogV2hldGhlciB0aGUgY29udGVudCBzZWN0aW9uIGlzIGFsd2F5cyB2aXNpYmxlLiAqL1xuICBAcHJvcGVydHkoeyBhdHRyaWJ1dGU6ICdmb3JjZS1vcGVuJywgdHlwZTogQm9vbGVhbiB9KSBwdWJsaWMgZm9yY2VPcGVuID0gZmFsc2U7XG5cbiAgLyoqIFdoZXRoZXIgdGhlIHVuc2VsZWN0ZWQgcGFuZWwgaGFzIGEgYm9yZGVyLiAqL1xuICBAcHJvcGVydHkoeyByZWZsZWN0OiB0cnVlLCB0eXBlOiBCb29sZWFuIH0pIHB1YmxpYyBib3JkZXJsZXNzID0gZmFsc2U7XG5cbiAgLyoqIFRoZSBzdGF0ZSBvZiB0aGUgc2VsZWN0aW9uIHBhbmVsLiAqL1xuICBAc3RhdGUoKVxuICBwcml2YXRlIHNldCBfc3RhdGUoc3RhdGU6IFNiYk9wZW5lZENsb3NlZFN0YXRlKSB7XG4gICAgdGhpcy5zZXRBdHRyaWJ1dGUoJ2RhdGEtc3RhdGUnLCBzdGF0ZSk7XG4gIH1cbiAgcHJpdmF0ZSBnZXQgX3N0YXRlKCk6IFNiYk9wZW5lZENsb3NlZFN0YXRlIHtcbiAgICByZXR1cm4gdGhpcy5nZXRBdHRyaWJ1dGUoJ2RhdGEtc3RhdGUnKSBhcyBTYmJPcGVuZWRDbG9zZWRTdGF0ZTtcbiAgfVxuXG4gIC8qKiBXaGV0aGVyIHRoZSBzZWxlY3Rpb24gcGFuZWwgaXMgY2hlY2tlZC4gKi9cbiAgcHJpdmF0ZSBzZXQgX2NoZWNrZWQoY2hlY2tlZDogYm9vbGVhbikge1xuICAgIHRoaXMudG9nZ2xlQXR0cmlidXRlKCdkYXRhLWNoZWNrZWQnLCBjaGVja2VkKTtcbiAgfVxuICBwcml2YXRlIGdldCBfY2hlY2tlZCgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5oYXNBdHRyaWJ1dGUoJ2RhdGEtY2hlY2tlZCcpO1xuICB9XG5cbiAgLyoqIFdoZXRoZXIgdGhlIHNlbGVjdGlvbiBwYW5lbCBpcyBkaXNhYmxlZC4gKi9cbiAgcHJpdmF0ZSBzZXQgX2Rpc2FibGVkKGRpc2FibGVkOiBib29sZWFuKSB7XG4gICAgdGhpcy50b2dnbGVBdHRyaWJ1dGUoJ2RhdGEtZGlzYWJsZWQnLCBkaXNhYmxlZCk7XG4gIH1cblxuICAvKiogRW1pdHMgd2hlbmV2ZXIgdGhlIGNvbnRlbnQgc2VjdGlvbiBzdGFydHMgdGhlIG9wZW5pbmcgdHJhbnNpdGlvbi4gKi9cbiAgcHJpdmF0ZSBfd2lsbE9wZW46IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXIoXG4gICAgdGhpcyxcbiAgICBTYmJTZWxlY3Rpb25FeHBhbnNpb25QYW5lbEVsZW1lbnQuZXZlbnRzLndpbGxPcGVuLFxuICApO1xuXG4gIC8qKiBFbWl0cyB3aGVuZXZlciB0aGUgY29udGVudCBzZWN0aW9uIGlzIG9wZW5lZC4gKi9cbiAgcHJpdmF0ZSBfZGlkT3BlbjogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcihcbiAgICB0aGlzLFxuICAgIFNiYlNlbGVjdGlvbkV4cGFuc2lvblBhbmVsRWxlbWVudC5ldmVudHMuZGlkT3BlbixcbiAgKTtcblxuICAvKiogRW1pdHMgd2hlbmV2ZXIgdGhlIGNvbnRlbnQgc2VjdGlvbiBiZWdpbnMgdGhlIGNsb3NpbmcgdHJhbnNpdGlvbi4gKi9cbiAgcHJpdmF0ZSBfd2lsbENsb3NlOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyKFxuICAgIHRoaXMsXG4gICAgU2JiU2VsZWN0aW9uRXhwYW5zaW9uUGFuZWxFbGVtZW50LmV2ZW50cy53aWxsQ2xvc2UsXG4gICk7XG5cbiAgLyoqIEVtaXRzIHdoZW5ldmVyIHRoZSBjb250ZW50IHNlY3Rpb24gaXMgY2xvc2VkLiAqL1xuICBwcml2YXRlIF9kaWRDbG9zZTogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcihcbiAgICB0aGlzLFxuICAgIFNiYlNlbGVjdGlvbkV4cGFuc2lvblBhbmVsRWxlbWVudC5ldmVudHMuZGlkQ2xvc2UsXG4gICk7XG5cbiAgcHJpdmF0ZSBfbGFuZ3VhZ2UgPSBuZXcgU2JiTGFuZ3VhZ2VDb250cm9sbGVyKHRoaXMpO1xuICBwcml2YXRlIF9hYm9ydCA9IG5ldyBTYmJDb25uZWN0ZWRBYm9ydENvbnRyb2xsZXIodGhpcyk7XG4gIHByaXZhdGUgX2luaXRpYWxpemVkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIFdoZXRoZXIgaXQgaGFzIGFuIGV4cGFuZGFibGUgY29udGVudFxuICAgKi9cbiAgcHJpdmF0ZSBnZXQgX2hhc0NvbnRlbnQoKTogYm9vbGVhbiB7XG4gICAgLy8gV2UgY2Fubm90IHVzZSB0aGUgTmFtZWRTbG90cyBiZWNhdXNlIGl0J3MgdG9vIHNsb3cgdG8gaW5pdGlhbGl6ZVxuICAgIHJldHVybiB0aGlzLnF1ZXJ5U2VsZWN0b3JBbGw/LignW3Nsb3Q9XCJjb250ZW50XCJdJykubGVuZ3RoID4gMDtcbiAgfVxuXG4gIHB1YmxpYyBjb25zdHJ1Y3RvcigpIHtcbiAgICBzdXBlcigpO1xuICAgIG5ldyBTYmJTbG90U3RhdGVDb250cm9sbGVyKHRoaXMpO1xuICB9XG5cbiAgcHVibGljIG92ZXJyaWRlIGNvbm5lY3RlZENhbGxiYWNrKCk6IHZvaWQge1xuICAgIHN1cGVyLmNvbm5lY3RlZENhbGxiYWNrKCk7XG5cbiAgICB0aGlzLmFkZEV2ZW50TGlzdGVuZXIoJ3BhbmVsQ29ubmVjdGVkJywgdGhpcy5faW5pdEZyb21JbnB1dC5iaW5kKHRoaXMpLCB7XG4gICAgICBzaWduYWw6IHRoaXMuX2Fib3J0LnNpZ25hbCxcbiAgICB9KTtcblxuICAgIHRoaXMuX3N0YXRlIHx8PSAnY2xvc2VkJztcbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSB3aWxsVXBkYXRlKGNoYW5nZWRQcm9wZXJ0aWVzOiBQcm9wZXJ0eVZhbHVlczx0aGlzPik6IHZvaWQge1xuICAgIHN1cGVyLndpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXMpO1xuXG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnZm9yY2VPcGVuJykpIHtcbiAgICAgIHRoaXMuX3VwZGF0ZVN0YXRlKCk7XG4gICAgfVxuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIGZpcnN0VXBkYXRlZChjaGFuZ2VkUHJvcGVydGllczogUHJvcGVydHlWYWx1ZXM8dGhpcz4pOiB2b2lkIHtcbiAgICBzdXBlci5maXJzdFVwZGF0ZWQoY2hhbmdlZFByb3BlcnRpZXMpO1xuXG4gICAgdGhpcy5faW5pdGlhbGl6ZWQgPSB0cnVlO1xuICB9XG5cbiAgcHJpdmF0ZSBfdXBkYXRlU3RhdGUoKTogdm9pZCB7XG4gICAgaWYgKCF0aGlzLl9oYXNDb250ZW50KSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgdGhpcy5mb3JjZU9wZW4gfHwgdGhpcy5fY2hlY2tlZCA/IHRoaXMuX29wZW4oIXRoaXMuX2luaXRpYWxpemVkKSA6IHRoaXMuX2Nsb3NlKCk7XG4gICAgdGhpcy5fdXBkYXRlRXhwYW5kZWRMYWJlbCh0aGlzLmZvcmNlT3BlbiB8fCB0aGlzLl9jaGVja2VkKTtcbiAgfVxuXG4gIHByaXZhdGUgX29wZW4oc2tpcEFuaW1hdGlvbiA9IGZhbHNlKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuX3N0YXRlICE9PSAnY2xvc2VkJyAmJiB0aGlzLl9zdGF0ZSAhPT0gJ2Nsb3NpbmcnKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgdGhpcy5fc3RhdGUgPSAnb3BlbmluZyc7XG4gICAgdGhpcy5fd2lsbE9wZW4uZW1pdCgpO1xuXG4gICAgaWYgKHNraXBBbmltYXRpb24pIHtcbiAgICAgIHRoaXMuX3N0YXRlID0gJ29wZW5lZCc7XG4gICAgICB0aGlzLl9kaWRPcGVuLmVtaXQoKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIF9jbG9zZSgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5fc3RhdGUgIT09ICdvcGVuZWQnICYmIHRoaXMuX3N0YXRlICE9PSAnb3BlbmluZycpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB0aGlzLl9zdGF0ZSA9ICdjbG9zaW5nJztcbiAgICB0aGlzLl93aWxsQ2xvc2UuZW1pdCgpO1xuICB9XG5cbiAgcHJpdmF0ZSBfaW5pdEZyb21JbnB1dChldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBjb25zdCBpbnB1dCA9IGV2ZW50LnRhcmdldCBhcyBTYmJDaGVja2JveFBhbmVsRWxlbWVudCB8IFNiYlJhZGlvQnV0dG9uUGFuZWxFbGVtZW50O1xuXG4gICAgdGhpcy5fY2hlY2tlZCA9IGlucHV0LmNoZWNrZWQ7XG4gICAgdGhpcy5fZGlzYWJsZWQgPSBpbnB1dC5kaXNhYmxlZDtcbiAgICB0aGlzLl91cGRhdGVTdGF0ZSgpO1xuICB9XG5cbiAgcHJpdmF0ZSBfb25JbnB1dFN0YXRlQ2hhbmdlKGV2ZW50OiBDdXN0b21FdmVudDxTYmJTdGF0ZUNoYW5nZT4pOiB2b2lkIHtcbiAgICBpZiAoZXZlbnQuZGV0YWlsLnR5cGUgPT09ICdkaXNhYmxlZCcpIHtcbiAgICAgIHRoaXMuX2Rpc2FibGVkID0gZXZlbnQuZGV0YWlsLmRpc2FibGVkO1xuICAgICAgcmV0dXJuO1xuICAgIH0gZWxzZSBpZiAoZXZlbnQuZGV0YWlsLnR5cGUgIT09ICdjaGVja2VkJykge1xuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIHRoaXMuX2NoZWNrZWQgPSBldmVudC5kZXRhaWwuY2hlY2tlZDtcbiAgICB0aGlzLl91cGRhdGVTdGF0ZSgpO1xuICB9XG5cbiAgcHJpdmF0ZSBfb25BbmltYXRpb25FbmQoZXZlbnQ6IEFuaW1hdGlvbkV2ZW50KTogdm9pZCB7XG4gICAgaWYgKGV2ZW50LmFuaW1hdGlvbk5hbWUgPT09ICdvcGVuLW9wYWNpdHknICYmIHRoaXMuX3N0YXRlID09PSAnb3BlbmluZycpIHtcbiAgICAgIHRoaXMuX3N0YXRlID0gJ29wZW5lZCc7XG4gICAgICB0aGlzLl9kaWRPcGVuLmVtaXQoKTtcbiAgICB9IGVsc2UgaWYgKGV2ZW50LmFuaW1hdGlvbk5hbWUgPT09ICdjbG9zZScgJiYgdGhpcy5fc3RhdGUgPT09ICdjbG9zaW5nJykge1xuICAgICAgdGhpcy5fc3RhdGUgPSAnY2xvc2VkJztcbiAgICAgIHRoaXMuX2RpZENsb3NlLmVtaXQoKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIGFzeW5jIF91cGRhdGVFeHBhbmRlZExhYmVsKG9wZW46IGJvb2xlYW4pOiBQcm9taXNlPHZvaWQ+IHtcbiAgICBhd2FpdCB0aGlzLmh5ZHJhdGlvbkNvbXBsZXRlO1xuXG4gICAgY29uc3QgcGFuZWxFbGVtZW50ID0gdGhpcy5xdWVyeVNlbGVjdG9yPFNiYlJhZGlvQnV0dG9uUGFuZWxFbGVtZW50IHwgU2JiQ2hlY2tib3hQYW5lbEVsZW1lbnQ+KFxuICAgICAgJ3NiYi1yYWRpby1idXR0b24tcGFuZWwsIHNiYi1jaGVja2JveC1wYW5lbCcsXG4gICAgKTtcbiAgICBpZiAoIXBhbmVsRWxlbWVudCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIGlmICghdGhpcy5faGFzQ29udGVudCkge1xuICAgICAgcGFuZWxFbGVtZW50LmV4cGFuc2lvblN0YXRlID0gJyc7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgcGFuZWxFbGVtZW50LmV4cGFuc2lvblN0YXRlID0gb3BlblxuICAgICAgPyAnLCAnICsgaTE4bkV4cGFuZGVkW3RoaXMuX2xhbmd1YWdlLmN1cnJlbnRdXG4gICAgICA6ICcsICcgKyBpMThuQ29sbGFwc2VkW3RoaXMuX2xhbmd1YWdlLmN1cnJlbnRdO1xuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICA8ZGl2IGNsYXNzPVwic2JiLXNlbGVjdGlvbi1leHBhbnNpb24tcGFuZWxcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInNiYi1zZWxlY3Rpb24tZXhwYW5zaW9uLXBhbmVsX19pbnB1dFwiIEBzdGF0ZUNoYW5nZT0ke3RoaXMuX29uSW5wdXRTdGF0ZUNoYW5nZX0+XG4gICAgICAgICAgPHNsb3Q+PC9zbG90PlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNsYXNzPVwic2JiLXNlbGVjdGlvbi1leHBhbnNpb24tcGFuZWxfX2NvbnRlbnQtLXdyYXBwZXJcIlxuICAgICAgICAgIC5pbmVydD0ke3RoaXMuX3N0YXRlICE9PSAnb3BlbmVkJ31cbiAgICAgICAgICBAYW5pbWF0aW9uZW5kPSR7KGV2ZW50OiBBbmltYXRpb25FdmVudCkgPT4gdGhpcy5fb25BbmltYXRpb25FbmQoZXZlbnQpfVxuICAgICAgICA+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cInNiYi1zZWxlY3Rpb24tZXhwYW5zaW9uLXBhbmVsX19jb250ZW50XCI+XG4gICAgICAgICAgICA8c2JiLWRpdmlkZXI+PC9zYmItZGl2aWRlcj5cbiAgICAgICAgICAgIDxzbG90IG5hbWU9XCJjb250ZW50XCI+PC9zbG90PlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgIGA7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi1zZWxlY3Rpb24tZXhwYW5zaW9uLXBhbmVsJzogU2JiU2VsZWN0aW9uRXhwYW5zaW9uUGFuZWxFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOlsic3RhdGUiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQStCTyxJQUFNLG9DQUFOLGNBQWdELGtCQUFrQixVQUFVLEVBQUU7QUFBQSxFQTZFNUUsY0FBYztBQUNiO0FBbkVJLFNBQU8sUUFBMEI7QUFHUyxTQUFPLFlBQVk7QUFHN0IsU0FBTyxhQUFhO0FBeUJoRSxTQUFRLFlBQWdDLElBQUk7QUFBQSxNQUMxQztBQUFBLE1BQ0Esa0NBQWtDLE9BQU87QUFBQSxJQUFBO0FBSTNDLFNBQVEsV0FBK0IsSUFBSTtBQUFBLE1BQ3pDO0FBQUEsTUFDQSxrQ0FBa0MsT0FBTztBQUFBLElBQUE7QUFJM0MsU0FBUSxhQUFpQyxJQUFJO0FBQUEsTUFDM0M7QUFBQSxNQUNBLGtDQUFrQyxPQUFPO0FBQUEsSUFBQTtBQUkzQyxTQUFRLFlBQWdDLElBQUk7QUFBQSxNQUMxQztBQUFBLE1BQ0Esa0NBQWtDLE9BQU87QUFBQSxJQUFBO0FBR25DLFNBQUEsWUFBWSxJQUFJLHNCQUFzQixJQUFJO0FBQzFDLFNBQUEsU0FBUyxJQUFJLDRCQUE0QixJQUFJO0FBQ3JELFNBQVEsZUFBd0I7QUFZOUIsUUFBSSx1QkFBdUIsSUFBSTtBQUFBLEVBQ2pDO0FBQUEsRUEzREEsSUFBWSxPQUFPQSxRQUE2QjtBQUN6QyxTQUFBLGFBQWEsY0FBY0EsTUFBSztBQUFBLEVBQ3ZDO0FBQUEsRUFDQSxJQUFZLFNBQStCO0FBQ2xDLFdBQUEsS0FBSyxhQUFhLFlBQVk7QUFBQSxFQUN2QztBQUFBO0FBQUEsRUFHQSxJQUFZLFNBQVMsU0FBa0I7QUFDaEMsU0FBQSxnQkFBZ0IsZ0JBQWdCLE9BQU87QUFBQSxFQUM5QztBQUFBLEVBQ0EsSUFBWSxXQUFvQjtBQUN2QixXQUFBLEtBQUssYUFBYSxjQUFjO0FBQUEsRUFDekM7QUFBQTtBQUFBLEVBR0EsSUFBWSxVQUFVLFVBQW1CO0FBQ2xDLFNBQUEsZ0JBQWdCLGlCQUFpQixRQUFRO0FBQUEsRUFDaEQ7QUFBQTtBQUFBO0FBQUE7QUFBQSxFQWlDQSxJQUFZLGNBQXVCOztBQUVqQyxhQUFPLFVBQUsscUJBQUwsOEJBQXdCLG9CQUFvQixVQUFTO0FBQUEsRUFDOUQ7QUFBQSxFQU9nQixvQkFBMEI7QUFDeEMsVUFBTSxrQkFBa0I7QUFFeEIsU0FBSyxpQkFBaUIsa0JBQWtCLEtBQUssZUFBZSxLQUFLLElBQUksR0FBRztBQUFBLE1BQ3RFLFFBQVEsS0FBSyxPQUFPO0FBQUEsSUFBQSxDQUNyQjtBQUVELFNBQUssV0FBTCxLQUFLLFNBQVc7QUFBQSxFQUNsQjtBQUFBLEVBRW1CLFdBQVcsbUJBQStDO0FBQzNFLFVBQU0sV0FBVyxpQkFBaUI7QUFFOUIsUUFBQSxrQkFBa0IsSUFBSSxXQUFXLEdBQUc7QUFDdEMsV0FBSyxhQUFhO0FBQUEsSUFDcEI7QUFBQSxFQUNGO0FBQUEsRUFFbUIsYUFBYSxtQkFBK0M7QUFDN0UsVUFBTSxhQUFhLGlCQUFpQjtBQUVwQyxTQUFLLGVBQWU7QUFBQSxFQUN0QjtBQUFBLEVBRVEsZUFBcUI7QUFDdkIsUUFBQSxDQUFDLEtBQUssYUFBYTtBQUNyQjtBQUFBLElBQ0Y7QUFFSyxTQUFBLGFBQWEsS0FBSyxXQUFXLEtBQUssTUFBTSxDQUFDLEtBQUssWUFBWSxJQUFJLEtBQUssT0FBTztBQUMvRSxTQUFLLHFCQUFxQixLQUFLLGFBQWEsS0FBSyxRQUFRO0FBQUEsRUFDM0Q7QUFBQSxFQUVRLE1BQU0sZ0JBQWdCLE9BQWE7QUFDekMsUUFBSSxLQUFLLFdBQVcsWUFBWSxLQUFLLFdBQVcsV0FBVztBQUN6RDtBQUFBLElBQ0Y7QUFFQSxTQUFLLFNBQVM7QUFDZCxTQUFLLFVBQVU7QUFFZixRQUFJLGVBQWU7QUFDakIsV0FBSyxTQUFTO0FBQ2QsV0FBSyxTQUFTO0lBQ2hCO0FBQUEsRUFDRjtBQUFBLEVBRVEsU0FBZTtBQUNyQixRQUFJLEtBQUssV0FBVyxZQUFZLEtBQUssV0FBVyxXQUFXO0FBQ3pEO0FBQUEsSUFDRjtBQUVBLFNBQUssU0FBUztBQUNkLFNBQUssV0FBVztFQUNsQjtBQUFBLEVBRVEsZUFBZSxPQUFvQjtBQUN6QyxVQUFNLFFBQVEsTUFBTTtBQUVwQixTQUFLLFdBQVcsTUFBTTtBQUN0QixTQUFLLFlBQVksTUFBTTtBQUN2QixTQUFLLGFBQWE7QUFBQSxFQUNwQjtBQUFBLEVBRVEsb0JBQW9CLE9BQTBDO0FBQ2hFLFFBQUEsTUFBTSxPQUFPLFNBQVMsWUFBWTtBQUMvQixXQUFBLFlBQVksTUFBTSxPQUFPO0FBQzlCO0FBQUEsSUFDUyxXQUFBLE1BQU0sT0FBTyxTQUFTLFdBQVc7QUFDMUM7QUFBQSxJQUNGO0FBRUssU0FBQSxXQUFXLE1BQU0sT0FBTztBQUM3QixTQUFLLGFBQWE7QUFBQSxFQUNwQjtBQUFBLEVBRVEsZ0JBQWdCLE9BQTZCO0FBQ25ELFFBQUksTUFBTSxrQkFBa0Isa0JBQWtCLEtBQUssV0FBVyxXQUFXO0FBQ3ZFLFdBQUssU0FBUztBQUNkLFdBQUssU0FBUztJQUFLLFdBQ1YsTUFBTSxrQkFBa0IsV0FBVyxLQUFLLFdBQVcsV0FBVztBQUN2RSxXQUFLLFNBQVM7QUFDZCxXQUFLLFVBQVU7SUFDakI7QUFBQSxFQUNGO0FBQUEsRUFFQSxNQUFjLHFCQUFxQixNQUE4QjtBQUMvRCxVQUFNLEtBQUs7QUFFWCxVQUFNLGVBQWUsS0FBSztBQUFBLE1BQ3hCO0FBQUEsSUFBQTtBQUVGLFFBQUksQ0FBQyxjQUFjO0FBQ2pCO0FBQUEsSUFDRjtBQUVJLFFBQUEsQ0FBQyxLQUFLLGFBQWE7QUFDckIsbUJBQWEsaUJBQWlCO0FBQzlCO0FBQUEsSUFDRjtBQUVBLGlCQUFhLGlCQUFpQixPQUMxQixPQUFPLGFBQWEsS0FBSyxVQUFVLE9BQU8sSUFDMUMsT0FBTyxjQUFjLEtBQUssVUFBVSxPQUFPO0FBQUEsRUFDakQ7QUFBQSxFQUVtQixTQUF5QjtBQUNuQyxXQUFBO0FBQUE7QUFBQSx5RUFFOEQsS0FBSyxtQkFBbUI7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLG1CQUs5RSxLQUFLLFdBQVcsUUFBUTtBQUFBLDBCQUNqQixDQUFDLFVBQTBCLEtBQUssZ0JBQWdCLEtBQUssQ0FBQztBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQSxFQVM5RTtBQUNGO0FBL01hLGtDQUVZLFNBQXlCO0FBRnJDLGtDQUdZLFNBQWlDO0FBQUEsRUFDdEQsVUFBVTtBQUFBLEVBQ1YsU0FBUztBQUFBLEVBQ1QsV0FBVztBQUFBLEVBQ1gsVUFBVTtBQUNaO0FBR21CLGdCQUFBO0FBQUEsRUFBbEIsU0FBUztBQUFBLEdBWEMsa0NBV1EsV0FBQSxTQUFBLENBQUE7QUFHMEMsZ0JBQUE7QUFBQSxFQUE1RCxTQUFTLEVBQUUsV0FBVyxjQUFjLE1BQU0sU0FBUztBQUFBLEdBZHpDLGtDQWNrRCxXQUFBLGFBQUEsQ0FBQTtBQUdWLGdCQUFBO0FBQUEsRUFBbEQsU0FBUyxFQUFFLFNBQVMsTUFBTSxNQUFNLFNBQVM7QUFBQSxHQWpCL0Isa0NBaUJ3QyxXQUFBLGNBQUEsQ0FBQTtBQUl2QyxnQkFBQTtBQUFBLEVBRFgsTUFBTTtBQUFBLEdBcEJJLGtDQXFCQyxXQUFBLFVBQUEsQ0FBQTtBQXJCRCxvQ0FBTixnQkFBQTtBQUFBLEVBRE4sY0FBYywrQkFBK0I7QUFBQSxHQUNqQyxpQ0FBQTsifQ==

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

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

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

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

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

@@ -0,0 +1,24 @@
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
+import { SbbTabLabelElement } from '../tab-label.js';
+
+/**
+ * Combined with a `sbb-tab-group`, it displays a tab's content.
+ *
+ * @slot - Use the unnamed slot to provide content.
+ */
+export declare class SbbTabElement extends LitElement {
+    static styles: CSSResultGroup;
+    /** The `sbb-tab-label` associated with the tab. */
+    get label(): SbbTabLabelElement | null;
+    private _label;
+    private _getTabLabel;
+    /** @internal */
+    configure(): void;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-tab': SbbTabElement;
+    }
+}
+//# sourceMappingURL=tab.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tab.d.ts","sourceRoot":"","sources":["../../../../../src/elements/tabs/tab/tab.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAGvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAI1D;;;;GAIG;AACH,qBACa,aAAc,SAAQ,UAAU;IAC3C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,mDAAmD;IACnD,IAAW,KAAK,IAAI,kBAAkB,GAAG,IAAI,CAE5C;IACD,OAAO,CAAC,MAAM,CAAmC;IAEjD,OAAO,CAAC,YAAY;IAQpB,gBAAgB;IACT,SAAS,IAAI,IAAI;cAIL,MAAM,IAAI,cAAc;CAO5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,SAAS,EAAE,aAAa,CAAC;KAC1B;CACF"}

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

@@ -1,5 +1,16 @@
 import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
+import { SbbTabLabelElement } from '../tab-label.js';
+import { SbbTabElement } from '../tab.js';
 
+export type SbbTabSupportedContentType = SbbTabElement | SbbTabGroupElement;
+export type SbbTabChangedEventDetails = {
+    activeIndex: number;
+    activeTabLabel: SbbTabLabelElement;
+    activeTab: SbbTabElement;
+    previousIndex: number;
+    previousTabLabel: SbbTabLabelElement | undefined;
+    previousTab: SbbTabElement | undefined;
+};
 export interface InterfaceSbbTabGroupActions {
     activate(): void;
     deactivate(): void;
@@ -7,10 +18,10 @@ export interface InterfaceSbbTabGroupActions {
     disable(): void;
     select(): void;
 }
-export interface InterfaceSbbTabGroupTab extends HTMLElement {
+export interface InterfaceSbbTabGroupTab extends SbbTabLabelElement {
     active?: boolean;
-    disabled?: boolean;
-    relatedContent?: HTMLElement;
+    disabled: boolean;
+    relatedContent?: SbbTabSupportedContentType;
     index?: number;
     tabGroupActions?: InterfaceSbbTabGroupActions;
     size: 's' | 'l' | 'xl';
@@ -18,13 +29,11 @@ export interface InterfaceSbbTabGroupTab extends HTMLElement {
 /**
  * It displays one or more tab, each one with a title and a content.
  *
- * @slot - Use the unnamed slot to add html-content to the `sbb-tab-group`.
- * Wrap the content in a `div`, a `section`, an `article` or provide a nested `sbb-tab-group`:
- * This is correct: `<div>Some text <p>Some other text</p></div>`
- * This is not correct: `<span>Some text</span><p>Some other text</p>`
- * @slot tab-bar - When you provide the `sbb-tab-title` tag through the unnamed slot,
+ * @slot - Use the unnamed slot to add html-content to the `sbb-tab-group`;
+ * wrap the content in a `sbb-tab` or provide a nested `sbb-tab-group`.
+ * @slot tab-bar - When you provide the `sbb-tab-label` tag through the unnamed slot,
  * it will be automatically moved to this slot. You do not need to use it directly.
- * @event {CustomEvent<void>} didChange - Emits an event on selected tab change
+ * @event {CustomEvent<SbbTabChangedEventDetails>} didChange - Emits an event on selected tab change.
  */
 export declare class SbbTabGroupElement extends LitElement {
     static styles: CSSResultGroup;
@@ -39,9 +48,7 @@ export declare class SbbTabGroupElement extends LitElement {
     private _tabAttributeObserver;
     private _tabGroupResizeObserver;
     private _tabContentResizeObserver;
-    /**
-     * Size variant, either s, l or xl.
-     */
+    /** Size variant, either s, l or xl. */
     set size(value: InterfaceSbbTabGroupTab['size']);
     get size(): InterfaceSbbTabGroupTab['size'];
     private _size;
@@ -51,9 +58,7 @@ export declare class SbbTabGroupElement extends LitElement {
      */
     initialSelectedIndex: number;
     private _updateSize;
-    /**
-     * Emits an event on selected tab change
-     */
+    /** Emits an event on selected tab change. */
     private _selectedTabChanged;
     /**
      * Disables a tab by index.

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

@@ -1 +1 @@
-{"version":3,"file":"tab-group.d.ts","sourceRoot":"","sources":["../../../../../src/elements/tabs/tab-group/tab-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAYvC,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,IAAI,IAAI,CAAC;IACjB,UAAU,IAAI,IAAI,CAAC;IACnB,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,IAAI,IAAI,CAAC;IAChB,MAAM,IAAI,IAAI,CAAC;CAChB;AAED,MAAM,WAAW,uBAAwB,SAAQ,WAAW;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,2BAA2B,CAAC;IAC9C,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;CACxB;AAUD;;;;;;;;;;GAUG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IAChD,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,OAAO,CAAC,KAAK,CAAiC;IAC9C,OAAO,CAAC,YAAY,CAAC,CAA0B;IAC/C,OAAO,CAAC,gBAAgB,CAAe;IACvC,OAAO,CAAC,kBAAkB,CAAe;IACzC,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,qBAAqB,CAE3B;IACF,OAAO,CAAC,uBAAuB,CAE7B;IACF,OAAO,CAAC,yBAAyB,CAE/B;IAEF;;OAEG;IACH,IACW,IAAI,CAAC,KAAK,EAAE,uBAAuB,CAAC,MAAM,CAAC,EAGrD;IACD,IAAW,IAAI,IAAI,uBAAuB,CAAC,MAAM,CAAC,CAEjD;IACD,OAAO,CAAC,KAAK,CAAwC;IAErD;;;OAGG;IACqE,oBAAoB,SAAK;IAEjG,OAAO,CAAC,WAAW;IAMnB;;OAEG;IACH,OAAO,CAAC,mBAAmB,CAGzB;IAEF;;;OAGG;IACI,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIzC;;;OAGG;IACI,SAAS,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIxC;;;OAGG;IACI,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAI1C,OAAO,CAAC,QAAQ;IAMhB,OAAO,KAAK,YAAY,GAEvB;IAEe,iBAAiB,IAAI,IAAI;cAOtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAS9D,oBAAoB,IAAI,IAAI;IAO5C,OAAO,CAAC,oBAAoB,CAS1B;IAEF,OAAO,CAAC,iBAAiB,CAavB;IAEF,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,cAAc;IAYtB,OAAO,CAAC,sBAAsB;IAwB9B,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,0BAA0B;IAQlC,OAAO,CAAC,UAAU;IA4FlB,OAAO,CAAC,cAAc;cAoBH,MAAM,IAAI,cAAc;CAe5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,kBAAkB,CAAC;KACrC;CACF"}
+{"version":3,"file":"tab-group.d.ts","sourceRoot":"","sources":["../../../../../src/elements/tabs/tab-group/tab-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAQvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAI1C,MAAM,MAAM,0BAA0B,GAAG,aAAa,GAAG,kBAAkB,CAAC;AAE5E,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,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,IAAI,IAAI,CAAC;IACjB,UAAU,IAAI,IAAI,CAAC;IACnB,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,IAAI,IAAI,CAAC;IAChB,MAAM,IAAI,IAAI,CAAC;CAChB;AAED,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,0BAA0B,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,2BAA2B,CAAC;IAC9C,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;CACxB;AAUD;;;;;;;;GAQG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IAChD,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,OAAO,CAAC,KAAK,CAAiC;IAC9C,OAAO,CAAC,YAAY,CAAC,CAA0B;IAC/C,OAAO,CAAC,gBAAgB,CAAe;IACvC,OAAO,CAAC,kBAAkB,CAAe;IACzC,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,qBAAqB,CAE3B;IACF,OAAO,CAAC,uBAAuB,CAE7B;IACF,OAAO,CAAC,yBAAyB,CAE/B;IAEF,uCAAuC;IACvC,IACW,IAAI,CAAC,KAAK,EAAE,uBAAuB,CAAC,MAAM,CAAC,EAGrD;IACD,IAAW,IAAI,IAAI,uBAAuB,CAAC,MAAM,CAAC,CAEjD;IACD,OAAO,CAAC,KAAK,CAAwC;IAErD;;;OAGG;IACqE,oBAAoB,SAAK;IAEjG,OAAO,CAAC,WAAW;IAMnB,6CAA6C;IAC7C,OAAO,CAAC,mBAAmB,CAGzB;IAEF;;;OAGG;IACI,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIzC;;;OAGG;IACI,SAAS,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIxC;;;OAGG;IACI,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAI1C,OAAO,CAAC,QAAQ;IAMhB,OAAO,KAAK,YAAY,GAEvB;IAEe,iBAAiB,IAAI,IAAI;cAOtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAS9D,oBAAoB,IAAI,IAAI;IAO5C,OAAO,CAAC,oBAAoB,CAS1B;IAEF,OAAO,CAAC,iBAAiB,CAavB;IAEF,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,cAAc;IAYtB,OAAO,CAAC,sBAAsB;IAwB9B,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,0BAA0B;IAQlC,OAAO,CAAC,UAAU;IAqGlB,OAAO,CAAC,cAAc;cAoBH,MAAM,IAAI,cAAc;CAe5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,kBAAkB,CAAC;KACrC;CACF"}