"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require$$0 = require("react/jsx-runtime");
const designSystem = require("@choiceform/design-system");
const iconsReact = require("@choiceform/icons-react");
const React = require("react");
const index$1 = require("../../../../../_vendor/usehooks-ts/dist-index.cjs");
const index = require("../../../../../i18n/index.cjs");
const textShimmerLoader = require("../../../../common/text-shimmer-loader/text-shimmer-loader.cjs");
const markdown = require("../../../../common/markdown/markdown.cjs");
const reasoningTv = designSystem.tcv({
  slots: {
    root: "text-secondary-foreground flex flex-col gap-2",
    header: "text-message flex items-center gap-1",
    icon: "text-icon-secondary flex size-5 items-center justify-center",
    button: "text-secondary-foreground hover:text-default-foreground flex items-center gap-1",
    content: "pl-1"
  },
  variants: {
    state: {
      thinking: {},
      completed: {}
    }
  },
  defaultVariants: {
    state: "thinking"
  }
});
const MessageReasoning = React.memo(function MessageReasoning2(props) {
  const { className, children, isStreaming = false, startTime, endTime, onToggleCollapse } = props;
  const [thoughtFor, setThoughtFor] = React.useState(void 0);
  const [displayContent, setDisplayContent] = React.useState("");
  const [isExpanded, setIsExpanded] = React.useState(true);
  const streamingRef = React.useRef();
  const wasStreamingRef = React.useRef(isStreaming);
  const content = typeof children === "string" ? children : "";
  const reasoningThinking = index.t("response", "reasoning-thinking");
  const reasoningThoughtFor = index.t("response", "reasoning-thought-for", {
    thoughtFor
  });
  React.useEffect(() => {
    if (wasStreamingRef.current && !isStreaming) {
      setTimeout(() => {
        setIsExpanded(false);
      }, 600);
    }
    wasStreamingRef.current = isStreaming;
  }, [isStreaming]);
  React.useEffect(() => {
    if (!isStreaming && startTime && endTime) {
      const duration = endTime.getTime() - startTime.getTime();
      const seconds = duration / 1e3;
      setThoughtFor(Math.round(seconds * 10) / 10);
    }
  }, [isStreaming, startTime, endTime]);
  React.useEffect(() => {
    if (isStreaming && content) {
      if (streamingRef.current) {
        clearInterval(streamingRef.current);
      }
      let currentIndex = displayContent.length;
      const targetLength = content.length;
      if (currentIndex < targetLength) {
        streamingRef.current = window.setInterval(() => {
          currentIndex += Math.min(3, targetLength - currentIndex);
          setDisplayContent(content.slice(0, currentIndex));
          if (currentIndex >= targetLength) {
            clearInterval(streamingRef.current);
          }
        }, 10);
      } else {
        setDisplayContent(content);
      }
    } else if (!isStreaming) {
      setDisplayContent(content);
    }
    return () => {
      if (streamingRef.current) {
        clearInterval(streamingRef.current);
      }
    };
  }, [content, isStreaming, displayContent.length]);
  const handleToggle = index$1.useEventCallback(() => {
    if (!isStreaming) {
      setIsExpanded(!isExpanded);
      if (onToggleCollapse) {
        onToggleCollapse();
      }
    }
  });
  const tv = reasoningTv({
    state: isStreaming ? "thinking" : "completed"
  });
  return /* @__PURE__ */ require$$0.jsxs("div", { className: designSystem.tcx(tv.root(), className), children: [
    /* @__PURE__ */ require$$0.jsxs("div", { className: tv.header(), children: [
      /* @__PURE__ */ require$$0.jsx("div", { className: tv.icon(), children: /* @__PURE__ */ require$$0.jsx(iconsReact.PromptMessageReasoning, {}) }),
      isStreaming && /* @__PURE__ */ require$$0.jsx(textShimmerLoader.TextShimmerLoader, { children: reasoningThinking }),
      !isStreaming && thoughtFor !== void 0 && /* @__PURE__ */ require$$0.jsxs(
        "button",
        {
          className: tv.button(),
          onClick: handleToggle,
          children: [
            reasoningThoughtFor,
            isExpanded ? /* @__PURE__ */ require$$0.jsx(iconsReact.ChevronDownSmall, {}) : /* @__PURE__ */ require$$0.jsx(iconsReact.ChevronRightSmall, {})
          ]
        }
      )
    ] }),
    (isStreaming || isExpanded && displayContent) && /* @__PURE__ */ require$$0.jsx("div", { className: tv.content(), children: /* @__PURE__ */ require$$0.jsx(markdown.Markdown, { mode: "compact", children: displayContent }) })
  ] });
});
exports.MessageReasoning = MessageReasoning;
//# sourceMappingURL=message-reasoning.cjs.map
