import { n as i, C as c } from "../chunks/lib-cortex-element.CVMmyPMC.js";
import { c as g } from "../chunks/component.styles.CRO4Odto.js";
import { c as p } from "../chunks/custom-element.L4WJXn1j.js";
import { i as d, x as f } from "../chunks/lit-element.jLBm65_O.js";
import { r as h } from "../chunks/state.CSDxrqLd.js";
import { e as x } from "../chunks/query.BBf1UFkC.js";
const _ = d`:host{display:inline-block}.button-group{row-gap:var(--cx-spacing-x-small);overflow:hidden;overflow:unset;flex-wrap:wrap;display:flex}`;
var m = Object.defineProperty, v = Object.getOwnPropertyDescriptor, a = (t, o, r, e) => {
  for (var u = e > 1 ? void 0 : e ? v(o, r) : o, l = t.length - 1, b; l >= 0; l--)
    (b = t[l]) && (u = (e ? b(o, r, u) : b(u)) || u);
  return e && u && m(o, r, u), u;
};
let n = class extends c {
  constructor() {
    super(...arguments), this.disableRole = !1, this.label = "";
  }
  handleFocus(t) {
    s(t.target)?.toggleAttribute("data-cx-button-group__button--focus", !0);
  }
  handleBlur(t) {
    s(t.target)?.toggleAttribute("data-cx-button-group__button--focus", !1);
  }
  handleMouseOver(t) {
    s(t.target)?.toggleAttribute("data-cx-button-group__button--hover", !0);
  }
  handleMouseOut(t) {
    s(t.target)?.toggleAttribute("data-cx-button-group__button--hover", !1);
  }
  handleSlotChange() {
    const t = [
      ...this.defaultSlot.assignedElements({ flatten: !0 })
    ];
    t.forEach((o) => {
      const r = t.indexOf(o), e = s(o);
      e && (e.toggleAttribute("data-cx-button-group__button", !0), e.toggleAttribute(
        "data-cx-button-group__button--first",
        r === 0
      ), e.toggleAttribute(
        "data-cx-button-group__button--inner",
        r > 0 && r < t.length - 1
      ), e.toggleAttribute(
        "data-cx-button-group__button--last",
        r === t.length - 1
      ), e.toggleAttribute(
        "data-cx-button-group__button--radio",
        e.tagName.toLowerCase() === "cx-radio-button"
      ));
    });
  }
  render() {
    return f`<div part="base" class="button-group" role=${this.disableRole ? "presentation" : "group"} aria-label=${this.label} @focusout=${this.handleBlur} @focusin=${this.handleFocus} @mouseover=${this.handleMouseOver} @mouseout=${this.handleMouseOut}><slot @slotchange=${this.handleSlotChange}></slot></div>`;
  }
};
n.styles = [g, _];
a([
  x("slot")
], n.prototype, "defaultSlot", 2);
a([
  h()
], n.prototype, "disableRole", 2);
a([
  i()
], n.prototype, "label", 2);
n = a([
  p("cx-button-group")
], n);
function s(t) {
  const o = "cx-button, cx-radio-button, cx-icon-button";
  return t.closest(o) ?? t.querySelector(o);
}
export {
  n as default
};
