import { j as i } from "../../_virtual/jsx-runtime.js";
import { useState as I, useRef as E, useEffect as F } from "react";
import g from "../../icons/CloseCircleFilled.js";
import { getId as y } from "../../utils/index.js";
import { Spinner as z } from "../Spinner/index.js";
import { getChipVariant as B, SpinnerWrapper as N, IconWrapper as P, CloseButton as R } from "./styles.js";
function G({
  id: x,
  className: d,
  label: t,
  value: f,
  variant: c,
  icon: p,
  disabled: n = !1,
  isLoading: a = !1,
  selected: r = !1,
  showClose: e = !1,
  onClick: m,
  onRemove: u,
  ...s
}) {
  const j = B(c), [C, k] = I(0), o = E(null);
  F(() => {
    o.current && k(o.current.offsetWidth);
  }, [o, c, r, t]);
  function l(W) {
    W.stopPropagation(), !n && !a && u ? u(f || t) : m(f || t);
  }
  function S() {
    r && e || !a && !n && m(f || t);
  }
  const h = y(s["data-testid"]);
  return /* @__PURE__ */ i.jsx(
    j,
    {
      id: x || t,
      className: d || t,
      ref: o,
      onClick: S,
      disabled: n,
      selected: r,
      showClose: e,
      isLoading: a,
      "data-testid": h(),
      "data-trackid": s["data-trackid"],
      "aria-label": s["aria-label"] || t,
      "aria-selected": r,
      children: a && !n ? /* @__PURE__ */ i.jsx(N, { width: C, selected: r, children: /* @__PURE__ */ i.jsx(z, { size: "XS", variant: r ? "inverse" : "secondary" }) }) : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
        p && /* @__PURE__ */ i.jsx(P, { children: p }),
        t,
        r && e && /* @__PURE__ */ i.jsx(
          R,
          {
            "aria-label": "close-button",
            selected: r,
            disabled: n,
            onClick: l,
            "data-testid": h("close-button"),
            children: /* @__PURE__ */ i.jsx(g, {})
          }
        )
      ] })
    }
  );
}
export {
  G as Chip
};
