import { r as o, h as e, H as l, g as r } from "./index.e6beb8d9.js";
import "react";
import "react-dom";
const a = () => ":host{position:relative;z-index:1;display:block}:host *{box-sizing:border-box}:host(:hover),:host(:focus-within){z-index:2}.table-row-group__header-row{position:relative;z-index:var(--s-z-10);padding:var(--s-space-12) var(--s-space-16);border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-surface-raised-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);display:flex;align-items:center}.table-row-group__label{position:sticky;left:var(--s-space-16)}.table-row-group__tooltip{display:inline-flex;margin-left:var(--s-space-4);vertical-align:middle}.table-row-group__tooltip-icon{color:var(--s-icon-default)}.table-row-group__collapse-icon{color:var(--s-icon-default);padding-right:var(--s-space-20)}.table-row-group__rows-container{overflow:visible clip;transition:height 0.3s ease-out}.table-row-group__rows-container.is-hidden{height:0}.sc-swirl-button-h{display:flex}", n = class {
  constructor(i) {
    o(this, i), this.collapsible = !1, this.collapseButtonLabel = "Previous slide", this.isVisible = !0, this.toggleShowItems = () => {
      if (this.headerRowElement.focus(), !this.tableRowElements)
        return;
      const t = this.tableRowElements.scrollHeight + "px";
      this.isVisible ? requestAnimationFrame(() => {
        this.tableRowElements.style.height = t, this.tableRowElements.setAttribute("aria-hidden", "true"), requestAnimationFrame(() => {
          this.tableRowElements.style.height = "0";
        });
      }) : requestAnimationFrame(() => {
        this.tableRowElements.style.height = t, this.tableRowElements.removeAttribute("aria-hidden"), setTimeout(() => {
          this.tableRowElements.style.height = "auto";
        }, 300);
      }), this.isVisible = !this.isVisible;
    };
  }
  render() {
    const i = this.el.querySelectorAll("swirl-table-row").length, t = this.isVisible ? "<swirl-icon-expand-less></swirl-icon-expand-less" : "<swirl-icon-expand-more></swirl-icon-expand-more";
    return e(l, { key: "3c06264a449535dd2b686748889becf5565fdbb7", class: "table-row-group", role: "rowgroup" }, e("div", { key: "7cb57d7fedc8b304fe44eb8b7c3ef45e9fc9c845", class: "table-row-group__header-row", role: "row", ref: (s) => this.headerRowElement = s }, this.collapsible && e("swirl-button", { key: "36e4894229f8e287f2dacc72fe3285e32a587edf", class: "table-row-group__collapse-icon", icon: t, label: this.collapseButtonLabel, onClick: this.toggleShowItems, swirlAriaExpanded: String(this.isVisible), variant: "plain", hideLabel: !0 }), e("span", { key: "7cee24537ffc1baaee6ab248fa3a29a9701dbd5c", "aria-rowspan": i, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && e("span", { key: "448a5fa0b0ec89b268352623923a363ee951419f", class: "table-row-group__tooltip" }, e("swirl-tooltip", { key: "1b4210904ffa6450ea3ef515b39012755482d2da", content: this.tooltip, position: "top" }, e("swirl-icon-info", { key: "80463b2a3a68ee50c11228b471d0b70925f871a9", size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" }))))), e("div", { key: "c16f340bcc41524d5775e0e1462751230d4c9d97", class: {
      "table-row-group__rows-container": !0,
      "table-row-group__rows-container--is-hidden": this.isVisible
    }, "aria-hidden": !this.isVisible, ref: (s) => this.tableRowElements = s }, e("slot", { key: "b5f7347bb721f23cd73212473a03d5463d1ff217" })));
  }
  get el() {
    return r(this);
  }
};
n.style = a();
export {
  n as swirl_table_row_group
};
