import { r as o, h as e, H as l, g as r } from "./index.61732cef.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: "0a840b08dcdcc219a8bece86aa28abe0f7aa3c06", class: "table-row-group", role: "rowgroup" }, e("div", { key: "8d894d81b7e274923496c1c605c0855b103862d4", class: "table-row-group__header-row", role: "row", ref: (s) => this.headerRowElement = s }, this.collapsible && e("swirl-button", { key: "743e492e1ebf1fc26983fb8671c2ad70e392329c", 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: "494de18f308bdc6f3a1c604b22e5342fc3c891b5", "aria-rowspan": i, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && e("span", { key: "f22b8320c67fa839015964b15ec267ee69781929", class: "table-row-group__tooltip" }, e("swirl-tooltip", { key: "9601728870528b93c24dd0041a264b18b3498da5", content: this.tooltip, position: "top" }, e("swirl-icon-info", { key: "c54c72a5846dc18c514619ff247e573d4ad1cea3", size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" }))))), e("div", { key: "1dd8261bf41eb8487776a7251559de9f84e66e78", 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: "05a6548f256f40831bcf91ec89fdebd48cdaa906" })));
  }
  get el() {
    return r(this);
  }
};
n.style = a();
export {
  n as swirl_table_row_group
};
