import { jsxs as p, jsx as a } from "react/jsx-runtime";
import { cloneElement as B } from "react";
import C from "../../foundation/Icon/Generated/IconCross.es.js";
import { IconSize as c } from "../../foundation/Icon/IconSize.es.js";
import { FOCUS_VISIBLE_STYLE as d } from "../../utilities/focusStyle.es.js";
import { merge as m } from "../../utilities/merge.es.js";
import { BadgeStatusIcon as j } from "./BadgeStatusIcon.es.js";
import { getCircularSizeClasses as v, getSizeClasses as z, getStyleClasses as h } from "./helpers.es.js";
import { BadgeEmphasis as g, BadgeStyle as E } from "./types.es.js";
const $ = ({
  children: e,
  status: r,
  icon: i,
  style: x = E.Primary,
  size: w = "medium",
  emphasis: b = g.None,
  disabled: l = !1,
  onClick: n,
  onDismiss: s,
  "data-test-id": o = "badge",
  withTitleAttribute: S = !0
}) => {
  if (!e && !i && !r)
    return null;
  const y = n ? "button" : "span", u = (t) => ["string", "number"].includes(typeof t) ? t : Array.isArray(t) ? t.map(u).join("") : t && typeof t == "object" && "props" in t ? u(t.props.children) : "", f = u(e), N = !e && !s && !!(r || i);
  return /* @__PURE__ */ p(
    "div",
    {
      className: m([
        "tw-relative tw-rounded-full tw-inline-flex tw-items-center tw-align-top tw-min-w-0 tw-flex-initial tw-transition-color",
        l ? "tw-bg-box-disabled tw-text-box-disabled-inverse" : h(x, !!n, b === g.Strong)
      ]),
      "data-test-id": o,
      children: [
        /* @__PURE__ */ p(
          y,
          {
            onClick: () => {
              n && n();
            },
            className: m([
              "tw-inline-flex tw-items-center tw-justify-center tw-rounded-full tw-select-none tw-flex-initial tw-min-w-0",
              n && !l ? "hover:tw-cursor-pointer" : "tw-cursor-default",
              N ? v(w) : z(e, r, i, w, !!s),
              d
            ]),
            "data-test-id": `${o}-button`,
            title: S ? f : void 0,
            children: [
              r ? /* @__PURE__ */ a(j, { status: r, disabled: l, "data-test-id": o }) : null,
              i ? /* @__PURE__ */ a(
                "span",
                {
                  "data-test-id": `${o}-icon`,
                  className: m(["tw-flex-none tw-leading-none", l && "tw-opacity-30"]),
                  children: B(i, { size: c.Size16 })
                }
              ) : null,
              e ? /* @__PURE__ */ a("span", { className: "tw-text-center tw-text-xxs tw-font-sans tw-font-normal tw-truncate", children: e }) : null
            ]
          }
        ),
        s ? /* @__PURE__ */ a(
          "button",
          {
            type: "button",
            "data-test-id": `${o}-dismiss`,
            className: m([
              "tw-absolute tw-rounded tw-leading-4",
              d,
              w === "medium" ? "tw-right-1.5" : "tw-right-1"
            ]),
            onClick: () => s(),
            "aria-label": `Dismiss ${f}`,
            children: /* @__PURE__ */ a(C, { size: c.Size16 })
          }
        ) : null
      ]
    }
  );
};
$.displayName = "FondueBadge";
export {
  $ as Badge
};
//# sourceMappingURL=Badge.es.js.map
