@synergy-design-system/components/dist/chunks/chunk.2SOIXTV6.js

This package provides the base of the Synergy Design System as native web components. It uses [lit](https://www.lit.dev) and parts of [shoelace](https://shoelace.style/). Synergy officially supports the latest two versions of all major browsers (as define

import {
  tab_panel_custom_styles_default
} from "./chunk.XHWYGYMQ.js";
import {
  tab_panel_styles_default
} from "./chunk.HVXG4JG6.js";
import {
  watch
} from "./chunk.BVZQ6QSY.js";
import {
  component_styles_default
} from "./chunk.NLYVOJGK.js";
import {
  SynergyElement
} from "./chunk.3THJTCRO.js";
import {
  __decorateClass
} from "./chunk.Z4XV3SMG.js";

// src/components/tab-panel/tab-panel.component.ts
import { classMap } from "lit/directives/class-map.js";
import { html } from "lit";
import { property } from "lit/decorators.js";
var id = 0;
var SynTabPanel = class extends SynergyElement {
  constructor() {
    super(...arguments);
    this.attrId = ++id;
    this.componentId = `syn-tab-panel-${this.attrId}`;
    this.name = "";
    this.active = false;
  }
  connectedCallback() {
    super.connectedCallback();
    this.id = this.id.length > 0 ? this.id : this.componentId;
    this.setAttribute("role", "tabpanel");
  }
  handleActiveChange() {
    this.setAttribute("aria-hidden", this.active ? "false" : "true");
  }
  render() {
    return html`
      <slot
        part="base"
        class=${classMap({
      "tab-panel": true,
      "tab-panel--active": this.active
    })}
      ></slot>
    `;
  }
};
SynTabPanel.styles = [component_styles_default, tab_panel_styles_default, tab_panel_custom_styles_default];
__decorateClass([
  property({ reflect: true })
], SynTabPanel.prototype, "name", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SynTabPanel.prototype, "active", 2);
__decorateClass([
  watch("active")
], SynTabPanel.prototype, "handleActiveChange", 1);

export {
  SynTabPanel
};
//# sourceMappingURL=chunk.2SOIXTV6.js.map