import { r as i, c as g, h as o, g as r } from "./index.61732cef.js";
import { c as l } from "./index-orsBiyT_.fc4357c3.js";
import "react";
import "react-dom";
const a = () => ":host{display:inline-block}:host *{box-sizing:border-box}.toggle-group{padding:var(--s-space-2);background-color:var(--s-surface-sunken-default);border-radius:var(--s-space-8);transition:box-shadow 0.3s}.toggle-group--elevated{box-shadow:var(--s-shadow-level-2)}.toggle-group--variant-outline{outline:var(--s-border-width-default) solid var(--s-border-strong);outline-offset:calc(var(--s-border-width-default) * -1)}", n = class {
  constructor(e) {
    i(this, e), this.selectedToggleChange = g(this, "selectedToggleChange", 7), this.variant = "flat", this.toggleButtons = [], this.onSlotChange = () => {
      this.toggleButtons = Array.from(this.el.querySelectorAll("swirl-toggle-button")), this.setTogglePressedStates();
    };
  }
  watchSelectedToggleId(e, t) {
    e !== t && (this.selectedToggleChange.emit(e), this.setTogglePressedStates());
  }
  onClick(e) {
    const t = e.target;
    if ((t == null ? void 0 : t.tagName) === "SWIRL-TOGGLE-BUTTON") {
      e.stopPropagation();
      const s = t;
      this.selectedToggleId = s.identifier;
    }
  }
  setTogglePressedStates() {
    var t;
    if (!((t = this.toggleButtons) != null && t.length))
      return;
    if (!this.selectedToggleId) {
      this.toggleButtonWithId(this.toggleButtons[0].identifier);
      return;
    }
    if (!this.toggleButtons.some((s) => s.identifier === this.selectedToggleId)) {
      this.toggleButtonWithId(this.toggleButtons[0].identifier);
      return;
    }
    this.toggleButtonWithId(this.selectedToggleId);
  }
  toggleButtonWithId(e) {
    var t;
    !((t = this.toggleButtons) != null && t.length) || this.toggleButtons.forEach((s) => {
      s.identifier === e ? s.isPressed = !0 : s.isPressed = !1;
    });
  }
  render() {
    const e = l("toggle-group", `toggle-group--variant-${this.variant}`, {
      "toggle-group--elevated": this.elevated
    });
    return o("swirl-stack", { key: "d7d63a7cc5ae1b951bb5ecf1a92ae284cfd03ee9", class: e, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, o("slot", { key: "dab02efe5e0c516088452c64eab6fff4da4111f2", onSlotchange: this.onSlotChange }));
  }
  get el() {
    return r(this);
  }
  static get watchers() {
    return {
      selectedToggleId: [{
        watchSelectedToggleId: 0
      }]
    };
  }
};
n.style = a();
export {
  n as swirl_toggle_group
};
