import { jsx as a, Fragment as p } from "@emotion/react/jsx-runtime";
import l from "clsx";
import d, { useMemo as S } from "react";
import { getPropDataTestId as y } from "../../../test/getNameDataTestId.js";
import { getComponentSlotRoot as g } from "../../../utils/getComponentSlotRoot.js";
import { useComponentSize as C } from "../../../hooks/useComponentSize/index.js";
import { ConcatenatedFormatterRootStyled as T } from "./slots/ConcatenatedFormatterSlots.js";
import { CONTATENATED_FORMATTER_KEY_COMPONENT as s } from "./constants.js";
import { ConcatenatedFormatterSlots as b } from "./slots/ConcatenatedFormatterEnum.js";
function F(t, o) {
  return t === null ? "" : Array.isArray(t) ? t.length === 0 ? "" : t.map((r) => r == null ? "" : typeof r == "string" || typeof r == "number" ? r.toString() : "").join(o.toString()).trim() : t.toString();
}
function _(t) {
  const { values: o = [], separator: e = " ", Component: n = T, color: m, size: r = "medium", dataTestid: u, className: c } = t, { currentSize: f } = C(r), i = S(
    () => F(o, e),
    [o, e]
  );
  return n === d.Fragment ? /* @__PURE__ */ a(p, { children: i }) : /* @__PURE__ */ a(
    n,
    {
      color: m,
      size: f,
      variant: "body",
      className: l(g(s), c),
      ...y(s, b.root, u),
      children: i
    }
  );
}
export {
  _ as ConcatenatedFormatter,
  F as getFormatConcatenated
};
