import { jsx, jsxs } from 'react/jsx-runtime';
import { c as cx } from './index-De1g9FRV.js';
import { forwardRef } from 'react';
import { t as textStyles } from './Text.module-BcVew1AQ.js';
import { A as AiMark } from './AiMark-voHPSerQ.js';
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjqeAJZ9.js';

const Text = forwardRef((props, ref) => {
  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
  if (props.variant === "headline") {
    const {
      variant: _,
      children,
      className,
      el: HeadlineElement,
      size = "medium",
      style,
      aiMark,
      ...rest
    } = componentProps;
    const TextClasses = cx(textStyles["headline"], className, {
      [textStyles[`${size}`]]: size !== "medium"
    });
    const styleCombined = { ...style, ...layoutStyles };
    const aiMarkSize = size === "small" ? "medium" : size;
    const aiMarkNode = aiMark && /* @__PURE__ */ jsx("span", { className: textStyles["headline-ai-mark"], children: /* @__PURE__ */ jsx(
      AiMark,
      {
        type: "gradient",
        collapsePadding: "block",
        size: aiMarkSize,
        popoverOrTooltipConfig: typeof aiMark === "object" ? aiMark : void 0
      }
    ) });
    return (
      // @ts-expect-error ts(2604) HeadlineElement will work as element tag
      /* @__PURE__ */ jsx(
        HeadlineElement,
        {
          ref,
          className: TextClasses,
          "data-anv": "text",
          style: styleCombined,
          ...rest,
          children: aiMarkNode ? /* @__PURE__ */ jsxs("span", { className: textStyles["headline-with-ai-mark"], children: [
            children,
            aiMarkNode
          ] }) : children
        }
      )
    );
  } else if (props.variant === "eyebrow") {
    const {
      variant: _,
      children,
      className,
      size = "medium",
      style,
      ...rest
    } = componentProps;
    const TextClasses = cx(textStyles["eyebrow"], className, {
      [textStyles[`${size}`]]: size !== "medium"
    });
    const styleCombined = { ...style, ...layoutStyles };
    return /* @__PURE__ */ jsx(
      "span",
      {
        ref,
        className: TextClasses,
        "data-anv": "text",
        style: styleCombined,
        ...rest,
        children
      }
    );
  } else {
    const {
      variant: _,
      children,
      className,
      subdued,
      inline,
      style,
      size = "medium",
      ...rest
    } = componentProps;
    const TextClasses = cx(textStyles["bodytext"], className, {
      [textStyles[`${size}`]]: size !== "medium",
      [textStyles["subdued"]]: subdued,
      [textStyles["inline"]]: inline
    });
    const styleCombined = { ...style, ...layoutStyles };
    if (inline) {
      return /* @__PURE__ */ jsx(
        "span",
        {
          ref,
          className: TextClasses,
          "data-anv": "text",
          style: styleCombined,
          ...rest,
          children
        }
      );
    } else {
      return /* @__PURE__ */ jsx(
        "p",
        {
          ref,
          className: TextClasses,
          "data-anv": "text",
          style: styleCombined,
          ...rest,
          children
        }
      );
    }
  }
});
Text.displayName = "Text";

export { Text as T };
//# sourceMappingURL=Text-mDcQHC2U.js.map
