@agentiffai/design 1.3.18 → 1.3.19

package/dist/copilotkit/index.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
 var button = require('@react-aria/button');
-var react = require('react');
-var styled8 = require('styled-components');
+var React = require('react');
+var styled9 = require('styled-components');
 var jsxRuntime = require('react/jsx-runtime');
 var reactCore = require('@copilotkit/react-core');
 var reactUi = require('@copilotkit/react-ui');
@@ -10,7 +10,8 @@ var textfield = require('@react-aria/textfield');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var styled8__default = /*#__PURE__*/_interopDefault(styled8);
+var React__default = /*#__PURE__*/_interopDefault(React);
+var styled9__default = /*#__PURE__*/_interopDefault(styled9);
 
 // src/components/copilotkit/Button/Button.tsx
 
@@ -173,7 +174,7 @@ var tokens = {
 
 // src/components/copilotkit/Button/Button.styles.ts
 var variantStyles = {
-  primary: styled8.css`
+  primary: styled9.css`
     background-color: ${tokens.colors.primary};
     color: ${tokens.colors.text.primary};
     border: none;
@@ -193,7 +194,7 @@ var variantStyles = {
       outline-offset: 2px;
     }
   `,
-  secondary: styled8.css`
+  secondary: styled9.css`
     background-color: transparent;
     color: ${tokens.colors.text.primary};
     border: 1px solid ${tokens.colors.border.default};
@@ -212,7 +213,7 @@ var variantStyles = {
       outline-offset: 2px;
     }
   `,
-  icon: styled8.css`
+  icon: styled9.css`
     background-color: transparent;
     color: ${tokens.colors.text.primary};
     border: none;
@@ -235,26 +236,26 @@ var variantStyles = {
   `
 };
 var sizeStyles = {
-  small: styled8.css`
+  small: styled9.css`
     padding: ${tokens.spacing.xs} ${tokens.spacing.sm};
     font-size: ${tokens.typography.fontSize.sm};
     min-width: 60px;
     height: 28px;
   `,
-  medium: styled8.css`
+  medium: styled9.css`
     padding: ${tokens.spacing.sm} ${tokens.spacing.md};
     font-size: ${tokens.typography.fontSize.base};
     min-width: 80px;
     height: 36px;
   `,
-  large: styled8.css`
+  large: styled9.css`
     padding: ${tokens.spacing.md} ${tokens.spacing.lg};
     font-size: ${tokens.typography.fontSize.lg};
     min-width: 100px;
     height: 44px;
   `
 };
-var StyledButton = styled8__default.default.button`
+var StyledButton = styled9__default.default.button`
   /* Base styles */
   display: inline-flex;
   align-items: center;
@@ -275,19 +276,19 @@ var StyledButton = styled8__default.default.button`
   ${({ $size, $variant }) => $variant !== "icon" && sizeStyles[$size]}
 
   /* Icon variant size overrides */
-  ${({ $variant, $size }) => $variant === "icon" && styled8.css`
+  ${({ $variant, $size }) => $variant === "icon" && styled9.css`
       width: ${$size === "small" ? "28px" : $size === "large" ? "44px" : "36px"};
       height: ${$size === "small" ? "28px" : $size === "large" ? "44px" : "36px"};
       border-radius: ${tokens.borderRadius.sm};
     `}
 
   /* Pressed state */
-  ${({ $isPressed }) => $isPressed && styled8.css`
+  ${({ $isPressed }) => $isPressed && styled9.css`
       transform: scale(0.98);
     `}
 
   /* Loading state */
-  ${({ $isLoading }) => $isLoading && styled8.css`
+  ${({ $isLoading }) => $isLoading && styled9.css`
       cursor: wait;
       opacity: 0.7;
     `}
@@ -313,7 +314,7 @@ function Button({
   isLoading = false,
   ...ariaProps
 }) {
-  const ref = react.useRef(null);
+  const ref = React.useRef(null);
   const { buttonProps, isPressed } = button.useButton(
     {
       ...ariaProps,
@@ -337,15 +338,15 @@ function Button({
   );
 }
 Button.displayName = "Button";
-var ActionsContainer = styled8__default.default.div`
+var ActionsContainer = styled9__default.default.div`
   display: flex;
   gap: ${tokens.spacing.sm};
   align-items: center;
 
-  ${({ $layout }) => $layout === "horizontal" ? styled8.css`
+  ${({ $layout }) => $layout === "horizontal" ? styled9.css`
           flex-direction: row;
           flex-wrap: wrap;
-        ` : styled8.css`
+        ` : styled9.css`
           flex-direction: column;
           align-items: stretch;
 
@@ -371,7 +372,7 @@ function Actions({ actions, layout = "horizontal", className }) {
   )) });
 }
 Actions.displayName = "Actions";
-var dotPulse = styled8.keyframes`
+var dotPulse = styled9.keyframes`
   0%, 100% {
     opacity: 0.3;
     transform: scale(0.8);
@@ -381,7 +382,7 @@ var dotPulse = styled8.keyframes`
     transform: scale(1);
   }
 `;
-var fadeIn = styled8.keyframes`
+var fadeIn = styled9.keyframes`
   from {
     opacity: 0;
   }
@@ -389,7 +390,7 @@ var fadeIn = styled8.keyframes`
     opacity: 1;
   }
 `;
-var blink = styled8.keyframes`
+var blink = styled9.keyframes`
   0%, 49% {
     opacity: 1;
   }
@@ -397,7 +398,7 @@ var blink = styled8.keyframes`
     opacity: 0;
   }
 `;
-var ResponseContainer = styled8__default.default.div`
+var ResponseContainer = styled9__default.default.div`
   display: inline-flex;
   align-items: center;
   gap: ${tokens.spacing.sm};
@@ -409,13 +410,13 @@ var ResponseContainer = styled8__default.default.div`
   max-width: fit-content;
   margin: 0 auto;
 `;
-var LoadingDots = styled8__default.default.div`
+var LoadingDots = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
   padding: 0 ${tokens.spacing.xs};
 `;
-var Dot = styled8__default.default.span`
+var Dot = styled9__default.default.span`
   width: ${tokens.spacing.xs};
   height: ${tokens.spacing.xs};
   border-radius: ${tokens.borderRadius.full};
@@ -423,7 +424,7 @@ var Dot = styled8__default.default.span`
   animation: ${dotPulse} 1.4s ease-in-out infinite;
   animation-delay: ${(props) => props.delay}s;
 `;
-var TypingIndicator = styled8__default.default.div`
+var TypingIndicator = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
@@ -436,14 +437,14 @@ var TypingIndicator = styled8__default.default.div`
     animation: ${dotPulse} 1.4s ease-in-out infinite;
   }
 `;
-var Message = styled8__default.default.span`
+var Message = styled9__default.default.span`
   font-size: ${tokens.typography.fontSize.sm};
   color: ${tokens.colors.text.primary};
   font-weight: ${tokens.typography.fontWeight.regular};
   line-height: ${tokens.typography.lineHeight.normal};
   white-space: nowrap;
 `;
-var StreamingText = styled8__default.default.div`
+var StreamingText = styled9__default.default.div`
   font-size: ${tokens.typography.fontSize.sm};
   line-height: ${tokens.typography.lineHeight.normal};
   color: ${tokens.colors.text.primary};
@@ -494,7 +495,7 @@ var Response = ({
   }
   return null;
 };
-var dotPulse2 = styled8.keyframes`
+var dotPulse2 = styled9.keyframes`
   0%, 100% {
     opacity: 0.3;
     transform: scale(0.8);
@@ -504,7 +505,7 @@ var dotPulse2 = styled8.keyframes`
     transform: scale(1);
   }
 `;
-var shake = styled8.keyframes`
+var shake = styled9.keyframes`
   0%, 100% {
     transform: translateX(0);
   }
@@ -515,7 +516,7 @@ var shake = styled8.keyframes`
     transform: translateX(5px);
   }
 `;
-var AgentStateContainer = styled8__default.default.div`
+var AgentStateContainer = styled9__default.default.div`
   display: inline-flex;
   flex-direction: column;
   align-items: center;
@@ -529,35 +530,35 @@ var AgentStateContainer = styled8__default.default.div`
   max-width: fit-content;
   margin: 0 auto;
 `;
-var StateContent = styled8__default.default.div`
+var StateContent = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   gap: ${tokens.spacing.sm};
   align-items: center;
   width: 100%;
 `;
-var IdleIndicator = styled8__default.default.div`
+var IdleIndicator = styled9__default.default.div`
   width: ${tokens.spacing.xs};
   height: ${tokens.spacing.xs};
   background-color: ${tokens.colors.status.idle};
   border-radius: ${tokens.borderRadius.full};
   animation: ${dotPulse2} 2s infinite ease-in-out;
 `;
-var ErrorIndicator = styled8__default.default.div`
+var ErrorIndicator = styled9__default.default.div`
   width: ${tokens.spacing.xs};
   height: ${tokens.spacing.xs};
   background-color: ${tokens.colors.error};
   border-radius: ${tokens.borderRadius.full};
   animation: ${shake} 0.5s ease-in-out;
 `;
-var StateLabel = styled8__default.default.span`
+var StateLabel = styled9__default.default.span`
   font-size: ${tokens.typography.fontSize.sm};
   font-weight: ${tokens.typography.fontWeight.regular};
   color: ${tokens.colors.text.primary};
   line-height: ${tokens.typography.lineHeight.normal};
   white-space: nowrap;
 `;
-styled8__default.default.p`
+styled9__default.default.p`
   font-size: ${tokens.typography.fontSize.sm};
   color: ${tokens.colors.text.tertiary};
   line-height: ${tokens.typography.lineHeight.normal};
@@ -565,7 +566,7 @@ styled8__default.default.p`
   text-align: center;
   white-space: nowrap;
 `;
-var ProgressBar = styled8__default.default.div`
+var ProgressBar = styled9__default.default.div`
   width: 100%;
   height: ${tokens.spacing.xs};
   background-color: ${tokens.colors.surface.elevated};
@@ -573,7 +574,7 @@ var ProgressBar = styled8__default.default.div`
   overflow: hidden;
   margin-top: ${tokens.spacing.xs};
 `;
-var ProgressBarFill = styled8__default.default.div`
+var ProgressBarFill = styled9__default.default.div`
   height: 100%;
   width: ${(props) => Math.min(Math.max(props.progress, 0), 100)}%;
   background: linear-gradient(135deg, ${tokens.colors.accent} 0%, ${tokens.colors.primary} 100%);
@@ -602,11 +603,11 @@ var AgentState = ({ state, message, progress, className }) => {
   }
   return null;
 };
-var Container = styled8__default.default.div`
+var Container = styled9__default.default.div`
   margin: ${tokens.spacing.sm} 0;
   padding: 0 ${tokens.spacing.sm};
 `;
-var ToolName = styled8__default.default.div`
+var ToolName = styled9__default.default.div`
   font-size: ${tokens.typography.fontSize.xs};
   color: ${tokens.colors.text.tertiary};
   margin-bottom: ${tokens.spacing.xs};
@@ -656,7 +657,7 @@ var ActionExecutionAdapter = ({ message, inProgress }) => {
   ] });
 };
 ActionExecutionAdapter.displayName = "ActionExecutionAdapter";
-var dotPulse3 = styled8.keyframes`
+var dotPulse3 = styled9.keyframes`
   0%, 100% {
     opacity: 0.3;
     transform: scale(0.8);
@@ -666,7 +667,7 @@ var dotPulse3 = styled8.keyframes`
     transform: scale(1);
   }
 `;
-var pulse = styled8.keyframes`
+var pulse = styled9.keyframes`
   0%, 100% {
     opacity: 0.5;
     transform: scale(1);
@@ -676,7 +677,7 @@ var pulse = styled8.keyframes`
     transform: scale(1.2);
   }
 `;
-var wave = styled8.keyframes`
+var wave = styled9.keyframes`
   0%, 40%, 100% {
     transform: translateY(0);
   }
@@ -713,7 +714,7 @@ var getSizeValue = (size = "md") => {
       };
   }
 };
-var Container2 = styled8__default.default.div`
+var Container2 = styled9__default.default.div`
   display: inline-flex;
   align-items: center;
   gap: ${tokens.spacing.md};
@@ -725,7 +726,7 @@ var Container2 = styled8__default.default.div`
   max-width: fit-content;
   margin: 0 auto;
 `;
-var Avatar = styled8__default.default.div`
+var Avatar = styled9__default.default.div`
   width: ${(props) => getSizeValue(props.size).avatar};
   height: ${(props) => getSizeValue(props.size).avatar};
   border-radius: ${tokens.borderRadius.full};
@@ -736,23 +737,23 @@ var Avatar = styled8__default.default.div`
   flex-shrink: 0;
   box-shadow: ${tokens.shadows.glow.primary};
 `;
-var HeadphonesIcon = styled8__default.default.svg`
+var HeadphonesIcon = styled9__default.default.svg`
   width: ${(props) => getSizeValue(props.size).icon};
   height: ${(props) => getSizeValue(props.size).icon};
   color: ${tokens.colors.text.primary};
 `;
-var Content = styled8__default.default.div`
+var Content = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.sm};
 `;
-var LoadingDots2 = styled8__default.default.div`
+var LoadingDots2 = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${(props) => props.variant === "wave" ? "2px" : `${tokens.spacing.xs}`};
   padding: 0 ${tokens.spacing.xs};
 `;
-var Dot2 = styled8__default.default.span`
+var Dot2 = styled9__default.default.span`
   width: ${(props) => getSizeValue(props.size).dotSize};
   height: ${(props) => getSizeValue(props.size).dotSize};
   border-radius: ${tokens.borderRadius.full};
@@ -770,7 +771,7 @@ var Dot2 = styled8__default.default.span`
 }}
     1.4s ease-in-out infinite;
 `;
-var Message2 = styled8__default.default.span`
+var Message2 = styled9__default.default.span`
   font-size: ${(props) => getSizeValue(props.size).fontSize};
   color: ${tokens.colors.text.secondary};
   font-weight: ${tokens.typography.fontWeight.regular};
@@ -784,7 +785,7 @@ function AssistantThinking({
   variant = "dots",
   size = "md"
 }) {
-  const containerRef = react.useRef(null);
+  const containerRef = React.useRef(null);
   const renderLoadingIndicator = () => {
     switch (variant) {
       case "dots":
@@ -830,11 +831,114 @@ function AssistantThinking({
   );
 }
 AssistantThinking.displayName = "AssistantThinking";
+var IconWrapper = styled9__default.default.span`
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: ${({ $size }) => $size}px;
+  height: ${({ $size }) => $size}px;
+  color: ${({ $color }) => $color};
+  line-height: 1;
+
+  img {
+    width: 100%;
+    height: 100%;
+    filter: ${({ $color }) => {
+  if ($color === "currentColor" || !$color) return "inherit";
+  if ($color === "white" || $color === tokens.colors.text.primary || $color === "#fff") {
+    return "brightness(0) saturate(100%) invert(100%)";
+  }
+  if ($color === tokens.colors.text.secondary || $color === "#b9bbbe") {
+    return "brightness(0) saturate(100%) invert(75%) sepia(8%) saturate(223%) hue-rotate(180deg) brightness(94%) contrast(86%)";
+  }
+  if ($color === tokens.colors.error || $color === "#ed4245" || $color === "#f04747") {
+    return "brightness(0) saturate(100%) invert(38%) sepia(97%) saturate(1459%) hue-rotate(334deg) brightness(95%) contrast(93%)";
+  }
+  return "none";
+}};
+  }
+`;
+
+// src/components/layout/Icon/icons.ts
+var ICON_BASE_PATH = "/assets/icon-set";
+var iconFiles = {
+  "mic-fill": "Icon-mic-fill.svg",
+  "mic-off-fill": "Icon-mic-off-fill.svg",
+  "headphone-fill": "Icon-headphone-fill.svg",
+  "volume-mute-fill": "Icon-volume-mute-fill.svg",
+  "settings-3-line": "Icon-settings-3-line.svg",
+  "home-fill": "Icon-home-fill.svg",
+  "add-circle-fill": "Icon-add-circle-fill.svg",
+  "compass-discover-fill": "Icon-compass-discover-fill.svg",
+  "download-2-fill": "Icon-download-2-fill.svg",
+  "arrow-left-fill": "Icon-arrow-left-fill.svg",
+  "calendar-fill": "Icon-calendar-fill.svg",
+  "chat-1-fill": "Icon-chat-1-fill.svg",
+  "flow-chart": "Icon-flow-chart.svg",
+  "logout-circle-r-fill": "Icon-logout-circle-r-fill.svg",
+  "logout-circle-r-line": "Icon-logout-circle-r-line.svg",
+  "side-bar-fill": "Icon-side-bar-fill.svg",
+  "check-fill": "Icon-check-fill.svg",
+  "checkbox-circle-fill": "Icon-checkbox-circle-fill.svg",
+  "close-circle-fill": "Icon-close-circle-fill.svg",
+  "error-warning-fill": "Icon-error-warning-fill.svg",
+  "hammer-fill": "Icon-hammer-fill.svg",
+  "rocket-fill": "Icon-rocket-fill.svg",
+  "coupon-2-fill": "Icon-coupon-2-fill.svg",
+  "clipboard-fill": "Icon-clipboard-fill.svg"
+};
+function getIconPath(name) {
+  return `${ICON_BASE_PATH}/${iconFiles[name]}`;
+}
+function Icon({
+  name,
+  size = 20,
+  color = "currentColor",
+  className,
+  ...imgProps
+}) {
+  const iconPath = getIconPath(name);
+  return /* @__PURE__ */ jsxRuntime.jsx(IconWrapper, { $size: size, $color: color, className, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: iconPath, alt: "", width: size, height: size, ...imgProps }) });
+}
+Icon.displayName = "Icon";
 function parseMarkdown(text) {
   if (!text) return [];
   text = text.replace(/<!--TOOL_CALL:[^:]+:[\s\S]+?-->/g, "").replace(/__TOOL_CALL__:[^:]+:\{[^}]*(?:\{[^}]*\}[^}]*)*\}/g, "").replace(/<!--TOOL_CALL:[\s\S]*$/g, "").replace(/__TOOL_CALL__:[\s\S]*$/g, "");
   const elements = [];
   let key = 0;
+  const codeBlockRegex = /```(?:\w*)\n?([\s\S]*?)```/g;
+  let lastCodeEnd = 0;
+  let codeMatch;
+  while ((codeMatch = codeBlockRegex.exec(text)) !== null) {
+    if (codeMatch.index > lastCodeEnd) {
+      const beforeCode = text.slice(lastCodeEnd, codeMatch.index);
+      const parsed = parseMarkdownParagraphs(beforeCode, key);
+      elements.push(...parsed.elements);
+      key = parsed.nextKey;
+    }
+    const codeContent = (codeMatch[1] ?? "").replace(/\n$/, "");
+    elements.push(
+      /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "code-block", children: /* @__PURE__ */ jsxRuntime.jsx("code", { children: codeContent }) }, key++)
+    );
+    lastCodeEnd = codeMatch.index + codeMatch[0].length;
+  }
+  const remaining = text.slice(lastCodeEnd);
+  if (remaining) {
+    const parsed = parseMarkdownParagraphs(remaining, key);
+    elements.push(...parsed.elements);
+    key = parsed.nextKey;
+  }
+  return elements;
+}
+function isMarkdownTable(lines) {
+  if (lines.length < 2) return false;
+  const firstLine = (lines[0] ?? "").trim();
+  const secondLine = (lines[1] ?? "").trim();
+  return firstLine.startsWith("|") && secondLine.startsWith("|") && /^\|[\s-:|]+\|$/.test(secondLine);
+}
+function parseMarkdownParagraphs(text, startKey) {
+  const elements = [];
+  let key = startKey;
   const paragraphs = text.split(/\n\n+/);
   paragraphs.forEach((paragraph, pIndex) => {
     if (pIndex > 0) {
@@ -842,16 +946,30 @@ function parseMarkdown(text) {
       elements.push(/* @__PURE__ */ jsxRuntime.jsx("br", {}, key++));
     }
     const lines = paragraph.split("\n");
+    if (isMarkdownTable(lines)) {
+      elements.push(
+        /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "code-block", children: /* @__PURE__ */ jsxRuntime.jsx("code", { children: paragraph }) }, key++)
+      );
+      return;
+    }
     lines.forEach((line, lineIndex) => {
       if (lineIndex > 0) {
         elements.push(/* @__PURE__ */ jsxRuntime.jsx("br", {}, key++));
       }
+      const headingMatch = line.match(/^(#{1,4})\s+(.+)$/);
+      if (headingMatch && headingMatch[1] && headingMatch[2]) {
+        const level = headingMatch[1].length;
+        const parsed2 = parseInlineMarkdown(headingMatch[2], key);
+        key = parsed2.nextKey;
+        elements.push(React__default.default.createElement(`h${level}`, { key: key++ }, ...parsed2.elements));
+        return;
+      }
       const parsed = parseInlineMarkdown(line, key);
       elements.push(...parsed.elements);
       key = parsed.nextKey;
     });
   });
-  return elements;
+  return { elements, nextKey: key };
 }
 function parseInlineMarkdown(text, startKey) {
   const elements = [];
@@ -884,7 +1002,7 @@ function parseInlineMarkdown(text, startKey) {
   }
   return { elements, nextKey: key };
 }
-var Container3 = styled8__default.default.div`
+var Container3 = styled9__default.default.div`
   font-family: ${(props) => props.$variant === "code" ? tokens.typography.fontFamily.monospace : tokens.typography.fontFamily.primary};
   white-space: pre-wrap;
   word-break: break-word;
@@ -911,6 +1029,24 @@ var Container3 = styled8__default.default.div`
     font-size: 0.9em;
   }
 
+  pre.code-block {
+    background: ${tokens.colors.surface.overlay};
+    border-radius: ${tokens.borderRadius.md};
+    padding: ${tokens.spacing.md};
+    margin: ${tokens.spacing.sm} 0;
+    overflow-x: auto;
+    white-space: pre;
+    -webkit-overflow-scrolling: touch;
+
+    code {
+      background: none;
+      padding: 0;
+      border-radius: 0;
+      font-size: 0.85em;
+      line-height: 1.5;
+    }
+  }
+
   a {
     color: ${tokens.colors.primary};
     text-decoration: none;
@@ -919,8 +1055,19 @@ var Container3 = styled8__default.default.div`
       text-decoration: underline;
     }
   }
+
+  h1, h2, h3, h4 {
+    margin: ${tokens.spacing.sm} 0 ${tokens.spacing.xs} 0;
+    color: ${tokens.colors.text.primary};
+    line-height: 1.3;
+  }
+
+  h1 { font-size: 1.4em; font-weight: ${tokens.typography.fontWeight.bold}; }
+  h2 { font-size: 1.2em; font-weight: ${tokens.typography.fontWeight.bold}; }
+  h3 { font-size: 1.05em; font-weight: ${tokens.typography.fontWeight.semibold}; }
+  h4 { font-size: 1em; font-weight: ${tokens.typography.fontWeight.semibold}; }
 `;
-var Cursor = styled8__default.default.span`
+var Cursor = styled9__default.default.span`
   display: inline-block;
   width: 2px;
   height: 1em;
@@ -950,9 +1097,9 @@ var StreamingTextBase = ({
   onStreamComplete,
   className
 }) => {
-  const wasStreamingRef = react.useRef(isStreaming);
-  const completionCalledRef = react.useRef(false);
-  react.useEffect(() => {
+  const wasStreamingRef = React.useRef(isStreaming);
+  const completionCalledRef = React.useRef(false);
+  React.useEffect(() => {
     if (wasStreamingRef.current && !isStreaming && !completionCalledRef.current) {
       completionCalledRef.current = true;
       onStreamComplete?.();
@@ -963,7 +1110,7 @@ var StreamingTextBase = ({
     wasStreamingRef.current = isStreaming;
   }, [isStreaming, onStreamComplete]);
   const showCursor = isStreaming && cursor;
-  const renderedContent = react.useMemo(() => {
+  const renderedContent = React.useMemo(() => {
     if (variant === "markdown") {
       return parseMarkdown(content);
     }
@@ -974,9 +1121,9 @@ var StreamingTextBase = ({
     showCursor && /* @__PURE__ */ jsxRuntime.jsx(Cursor, {})
   ] });
 };
-var StreamingText2 = react.memo(StreamingTextBase);
+var StreamingText2 = React.memo(StreamingTextBase);
 StreamingText2.displayName = "StreamingText";
-var MessageContainer = styled8__default.default.div`
+var MessageContainer = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   gap: ${tokens.spacing.xs};
@@ -986,20 +1133,20 @@ var MessageContainer = styled8__default.default.div`
   will-change: contents;
   contain: content;
 `;
-var AvatarContainer = styled8__default.default.div`
+var AvatarContainer = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
   flex-shrink: 0;
 `;
-var Avatar2 = styled8__default.default.img`
+var Avatar2 = styled9__default.default.img`
   width: 20px;
   height: 20px;
   border-radius: ${tokens.borderRadius.full};
   object-fit: cover;
   background-color: transparent;
 `;
-var AvatarInitials = styled8__default.default.div`
+var AvatarInitials = styled9__default.default.div`
   width: 20px;
   height: 20px;
   border-radius: ${tokens.borderRadius.full};
@@ -1017,16 +1164,16 @@ var AvatarInitials = styled8__default.default.div`
     object-fit: contain;
   }
 `;
-var AvatarLabel = styled8__default.default.span`
+var AvatarLabel = styled9__default.default.span`
   font-size: ${tokens.typography.fontSize.xs};
   font-weight: ${tokens.typography.fontWeight.medium};
   color: ${tokens.colors.text.secondary};
 `;
-var ContentContainer = styled8__default.default.div`
+var ContentContainer = styled9__default.default.div`
   width: 100%;
   min-width: 0;
 `;
-var MessageContent = styled8__default.default.div`
+var MessageContent = styled9__default.default.div`
   /* Use solid color instead of backdrop-filter for performance during streaming */
   background-color: ${tokens.colors.surface.elevated};
   padding: ${tokens.spacing.sm};
@@ -1040,7 +1187,7 @@ var MessageContent = styled8__default.default.div`
   /* Optimize text rendering */
   text-rendering: optimizeSpeed;
 `;
-var LoadingDots3 = styled8__default.default.div`
+var LoadingDots3 = styled9__default.default.div`
   display: flex;
   gap: ${tokens.spacing.xs};
   padding: ${tokens.spacing.sm};
@@ -1049,7 +1196,7 @@ var LoadingDots3 = styled8__default.default.div`
   border-radius: ${tokens.borderRadius.lg};
   width: fit-content;
 `;
-var pulse2 = styled8.keyframes`
+var pulse2 = styled9.keyframes`
   0%, 100% {
     opacity: 0.4;
   }
@@ -1057,7 +1204,7 @@ var pulse2 = styled8.keyframes`
     opacity: 1;
   }
 `;
-var LoadingDot = styled8__default.default.div`
+var LoadingDot = styled9__default.default.div`
   width: ${tokens.spacing.sm};
   height: ${tokens.spacing.sm};
   border-radius: ${tokens.borderRadius.full};
@@ -1066,7 +1213,7 @@ var LoadingDot = styled8__default.default.div`
   animation: ${pulse2} 1.4s ease-in-out infinite;
   animation-delay: ${(props) => props.delay}s;
 `;
-var FileAttachmentContainer = styled8__default.default.div`
+var FileAttachmentContainer = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.sm};
@@ -1102,7 +1249,7 @@ var FileAttachmentContainer = styled8__default.default.div`
     }
   `}
 `;
-var FileIconContainer = styled8__default.default.div`
+var FileIconContainer = styled9__default.default.div`
   flex-shrink: 0;
   width: ${tokens.spacing.xl};
   height: ${tokens.spacing.xl};
@@ -1112,14 +1259,14 @@ var FileIconContainer = styled8__default.default.div`
   font-size: ${tokens.typography.fontSize["2xl"]};
   line-height: 1;
 `;
-var FileInfo = styled8__default.default.div`
+var FileInfo = styled9__default.default.div`
   flex: 1;
   min-width: 0;
   display: flex;
   flex-direction: column;
   gap: 2px;
 `;
-var FileTitle = styled8__default.default.div`
+var FileTitle = styled9__default.default.div`
   font-size: ${tokens.typography.fontSize.sm};
   font-weight: ${tokens.typography.fontWeight.medium};
   color: ${tokens.colors.text.primary};
@@ -1129,7 +1276,7 @@ var FileTitle = styled8__default.default.div`
   text-overflow: ellipsis;
   white-space: nowrap;
 `;
-var FileMetadata = styled8__default.default.div`
+var FileMetadata = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
@@ -1139,7 +1286,7 @@ var FileMetadata = styled8__default.default.div`
   line-height: ${tokens.typography.lineHeight.tight};
   overflow: hidden;
 `;
-var FileSubtitle = styled8__default.default.span`
+var FileSubtitle = styled9__default.default.span`
   color: ${tokens.colors.text.tertiary};
   white-space: nowrap;
   overflow: hidden;
@@ -1159,7 +1306,7 @@ var FileAttachment = ({
   className,
   ...ariaProps
 }) => {
-  const ref = react.useRef(null);
+  const ref = React.useRef(null);
   const isInteractive = !!(onClick || onPress);
   const handlePress = (e) => {
     if (onClick) onClick();
@@ -1195,13 +1342,13 @@ var FileAttachment = ({
     }
   );
 };
-var AttachmentsContainer = styled8__default.default.div`
+var AttachmentsContainer = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   gap: ${tokens.spacing.sm};
   margin-top: ${tokens.spacing.sm};
 `;
-var ActionButton = styled8__default.default.button`
+var ActionButton = styled9__default.default.button`
   display: inline-flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
@@ -1225,19 +1372,19 @@ var ActionButton = styled8__default.default.button`
     transform: scale(0.98);
   }
 `;
-var ActionsContainer2 = styled8__default.default.div`
+var ActionsContainer2 = styled9__default.default.div`
   display: flex;
   gap: ${tokens.spacing.xs};
   flex-wrap: wrap;
   margin-top: ${tokens.spacing.sm};
 `;
-var MessageTime = styled8__default.default.time`
+var MessageTime = styled9__default.default.time`
   font-size: ${tokens.typography.fontSize.xs};
   color: ${tokens.colors.text.tertiary};
   margin-top: ${tokens.spacing.xs};
   display: block;
 `;
-var StreamingIndicator = styled8__default.default.span`
+var StreamingIndicator = styled9__default.default.span`
   display: inline-block;
   width: ${tokens.spacing.xs};
   height: ${tokens.spacing.xs};
@@ -1308,8 +1455,36 @@ var AssistantMessageBase = ({
     /* @__PURE__ */ jsxRuntime.jsx(ContentContainer, { children: renderContent() })
   ] });
 };
-var AssistantMessage = react.memo(AssistantMessageBase);
+var AssistantMessage = React.memo(AssistantMessageBase);
 AssistantMessage.displayName = "AssistantMessage";
+var REGISTRY_KEY = "__agentiffai_tool_call_registry__";
+var TOOL_CALL_TTL_MS = 5 * 60 * 1e3;
+function getRegistryMap() {
+  const g = globalThis;
+  if (!g[REGISTRY_KEY]) {
+    g[REGISTRY_KEY] = /* @__PURE__ */ new Map();
+  }
+  return g[REGISTRY_KEY];
+}
+function registerToolCall(name) {
+  getRegistryMap().set(name, Date.now());
+}
+function clearToolCalls() {
+  getRegistryMap().clear();
+}
+function getActiveToolCalls() {
+  const map = getRegistryMap();
+  const now = Date.now();
+  const active = [];
+  for (const [name, timestamp] of map) {
+    if (now - timestamp < TOOL_CALL_TTL_MS) {
+      active.push(name);
+    } else {
+      map.delete(name);
+    }
+  }
+  return active;
+}
 function stripToolCallMarkers(content) {
   let stripped = content;
   stripped = stripped.replace(/<!--TOOL_CALL:[^:]+:[\s\S]+?-->/g, "");
@@ -1318,6 +1493,25 @@ function stripToolCallMarkers(content) {
   stripped = stripped.replace(/__TOOL_CALL__:[\s\S]*$/g, "");
   return stripped.trim();
 }
+function extractToolCallNames(content) {
+  if (!content.includes("TOOL_CALL")) return [];
+  const names = /* @__PURE__ */ new Set();
+  const patterns = [
+    /<!--TOOL_CALL:([^:]+):/g,
+    /__TOOL_CALL__:([^:]+):/g
+  ];
+  for (const pattern of patterns) {
+    let match;
+    while ((match = pattern.exec(content)) !== null) {
+      if (match[1]) names.add(match[1]);
+    }
+  }
+  return Array.from(names);
+}
+function formatToolName2(name) {
+  if (name === "update-workflow") return "Workflow";
+  return name.split(/[-_]/).map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
+}
 var ERROR_PATTERNS = [
   /\bfailed\b/i,
   /\berror\b/i,
@@ -1389,10 +1583,31 @@ function buildChatSnippet(messages, errorMessageContent, maxMessages = 5, maxLen
   }
   return result;
 }
-var GenerativeUIContainer = styled8__default.default.div`
+var GenerativeUIContainer = styled9__default.default.div`
   margin-top: ${tokens.spacing.sm};
   margin-bottom: ${tokens.spacing.sm};
 `;
+var ToolCallIndicator = styled9__default.default.div`
+  display: flex;
+  align-items: center;
+  gap: ${tokens.spacing.sm};
+  padding: ${tokens.spacing.xs} ${tokens.spacing.sm};
+  margin-bottom: ${tokens.spacing.sm};
+  border-radius: ${tokens.borderRadius.md};
+  background: ${tokens.colors.text.primary}08;
+  border: 1px solid ${tokens.colors.border.default};
+  font-size: ${tokens.typography.fontSize.xs};
+  color: ${tokens.colors.text.secondary};
+`;
+var ToolCallIcon = styled9__default.default.span`
+  display: flex;
+  align-items: center;
+  color: ${tokens.colors.primary};
+`;
+var ToolCallName = styled9__default.default.span`
+  font-weight: ${tokens.typography.fontWeight.medium};
+  color: ${tokens.colors.text.primary};
+`;
 var AssistantMessageAdapterBase = ({
   message,
   isLoading,
@@ -1406,8 +1621,8 @@ var AssistantMessageAdapterBase = ({
   // markdownTagRenderers,
   // ImageRenderer,
 }) => {
-  const lastGenerativeUIRef = react.useRef(null);
-  const rawContent = message?.content || "";
+  const lastGenerativeUIRef = React.useRef(null);
+  const rawContent = Array.isArray(message?.content) ? message.content.join("") : message?.content || "";
   const content = stripToolCallMarkers(rawContent);
   let generativeUIOutput = null;
   const msgWithUI = message;
@@ -1446,18 +1661,23 @@ var AssistantMessageAdapterBase = ({
     )
   ] });
 };
-var AssistantMessageAdapter = react.memo(AssistantMessageAdapterBase);
+var AssistantMessageAdapter = React.memo(AssistantMessageAdapterBase);
 AssistantMessageAdapter.displayName = "AssistantMessageAdapter";
 function createAssistantMessageAdapter(ThinkingIndicator, _ToolCallsComponent) {
   const CustomAssistantMessageAdapter = ({
     message,
     isLoading,
     isGenerating
-    // isCurrentMessage and ToolCallsComponent are no longer used but kept for backwards compat
   }) => {
-    const lastGenerativeUIRef = react.useRef(null);
-    const rawContent = message?.content || "";
+    const lastGenerativeUIRef = React.useRef(null);
+    const rawContent = Array.isArray(message?.content) ? message.content.join("") : message?.content || "";
     const content = stripToolCallMarkers(rawContent);
+    const toolCallNames = React.useMemo(() => {
+      const fromContent = extractToolCallNames(rawContent);
+      if (fromContent.length > 0) return fromContent;
+      if (isLoading || isGenerating || rawContent.length > 80) return getActiveToolCalls();
+      return [];
+    }, [rawContent, isLoading, isGenerating]);
     let generativeUIOutput = null;
     const msgWithUI = message;
     if (msgWithUI && typeof msgWithUI.generativeUI === "function") {
@@ -1477,10 +1697,18 @@ function createAssistantMessageAdapter(ThinkingIndicator, _ToolCallsComponent) {
     const attachments = [];
     const hasGenerativeUI = generativeUIOutput !== null;
     const showThinking = (isLoading || isGenerating && !content) && !hasGenerativeUI;
+    const toolCallIndicators = toolCallNames.map((name) => /* @__PURE__ */ jsxRuntime.jsxs(ToolCallIndicator, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ToolCallIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "hammer-fill", size: 14 }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(ToolCallName, { children: formatToolName2(name) })
+    ] }, name));
     if (showThinking) {
-      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: ThinkingIndicator ? /* @__PURE__ */ jsxRuntime.jsx(ThinkingIndicator, { isLoading, isGenerating }) : /* @__PURE__ */ jsxRuntime.jsx(AssistantThinking, { message: "Thinking..." }) });
+      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        toolCallIndicators,
+        ThinkingIndicator ? /* @__PURE__ */ jsxRuntime.jsx(ThinkingIndicator, { isLoading, isGenerating }) : /* @__PURE__ */ jsxRuntime.jsx(AssistantThinking, { message: "Thinking..." })
+      ] });
     }
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      toolCallIndicators,
       generativeUIOutput && /* @__PURE__ */ jsxRuntime.jsx(GenerativeUIContainer, { children: generativeUIOutput }),
       content && /* @__PURE__ */ jsxRuntime.jsx(
         AssistantMessage,
@@ -1496,25 +1724,30 @@ function createAssistantMessageAdapter(ThinkingIndicator, _ToolCallsComponent) {
     ] });
   };
   CustomAssistantMessageAdapter.displayName = "CustomAssistantMessageAdapter";
-  return react.memo(CustomAssistantMessageAdapter);
+  return React.memo(CustomAssistantMessageAdapter);
 }
 function createAssistantMessageAdapterWithErrorReporting(onReportIssue, ThinkingIndicator, _ToolCallsComponent) {
   const ErrorReportingAssistantMessageAdapter = ({
     message,
     isLoading,
     isGenerating
-    // isCurrentMessage and ToolCallsComponent are no longer used but kept for backwards compat
   }) => {
-    const lastGenerativeUIRef = react.useRef(null);
+    const lastGenerativeUIRef = React.useRef(null);
     const { visibleMessages } = reactCore.useCopilotChat();
-    const rawContent = message?.content || "";
+    const rawContent = Array.isArray(message?.content) ? message.content.join("") : message?.content || "";
     const content = stripToolCallMarkers(rawContent);
-    const errorContext = react.useMemo(() => detectErrorInMessage(content), [content]);
-    const chatSnippet = react.useMemo(() => {
+    const toolCallNames = React.useMemo(() => {
+      const fromContent = extractToolCallNames(rawContent);
+      if (fromContent.length > 0) return fromContent;
+      if (isLoading || isGenerating || rawContent.length > 80) return getActiveToolCalls();
+      return [];
+    }, [rawContent, isLoading, isGenerating]);
+    const errorContext = React.useMemo(() => detectErrorInMessage(content), [content]);
+    const chatSnippet = React.useMemo(() => {
       if (!errorContext.hasError) return "";
       return buildChatSnippet(visibleMessages, content);
     }, [visibleMessages, content, errorContext.hasError]);
-    const actions = react.useMemo(() => {
+    const actions = React.useMemo(() => {
       if (!errorContext.hasError || !onReportIssue || isGenerating) {
         return [];
       }
@@ -1570,9 +1803,19 @@ function createAssistantMessageAdapterWithErrorReporting(onReportIssue, Thinking
     const hasGenerativeUI = generativeUIOutput !== null;
     const showThinking = (isLoading || isGenerating && !content) && !hasGenerativeUI;
     if (showThinking) {
-      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: ThinkingIndicator ? /* @__PURE__ */ jsxRuntime.jsx(ThinkingIndicator, { isLoading, isGenerating }) : /* @__PURE__ */ jsxRuntime.jsx(AssistantThinking, { message: "Thinking..." }) });
+      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        toolCallNames.map((name) => /* @__PURE__ */ jsxRuntime.jsxs(ToolCallIndicator, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ToolCallIcon, { children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" }) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ToolCallName, { children: formatToolName2(name) })
+        ] }, name)),
+        ThinkingIndicator ? /* @__PURE__ */ jsxRuntime.jsx(ThinkingIndicator, { isLoading, isGenerating }) : /* @__PURE__ */ jsxRuntime.jsx(AssistantThinking, { message: "Thinking..." })
+      ] });
     }
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      toolCallNames.map((name) => /* @__PURE__ */ jsxRuntime.jsxs(ToolCallIndicator, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ToolCallIcon, { children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" }) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ToolCallName, { children: formatToolName2(name) })
+      ] }, name)),
       generativeUIOutput && /* @__PURE__ */ jsxRuntime.jsx(GenerativeUIContainer, { children: generativeUIOutput }),
       content && /* @__PURE__ */ jsxRuntime.jsx(
         AssistantMessage,
@@ -1589,9 +1832,9 @@ function createAssistantMessageAdapterWithErrorReporting(onReportIssue, Thinking
     ] });
   };
   ErrorReportingAssistantMessageAdapter.displayName = "ErrorReportingAssistantMessageAdapter";
-  return react.memo(ErrorReportingAssistantMessageAdapter);
+  return React.memo(ErrorReportingAssistantMessageAdapter);
 }
-var ChatInputContainer = styled8__default.default.div`
+var ChatInputContainer = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -1607,7 +1850,7 @@ var ChatInputContainer = styled8__default.default.div`
     padding: ${tokens.spacing.md};
   }
 `;
-var SuggestionsWrapper = styled8__default.default.div`
+var SuggestionsWrapper = styled9__default.default.div`
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
@@ -1616,7 +1859,7 @@ var SuggestionsWrapper = styled8__default.default.div`
   width: 100%;
   box-sizing: border-box;
 `;
-var SuggestionButton = styled8__default.default.button`
+var SuggestionButton = styled9__default.default.button`
   padding: ${tokens.spacing.sm} ${tokens.spacing.md};
   font-family: ${tokens.typography.fontFamily.primary};
   font-size: 13px;
@@ -1655,7 +1898,7 @@ var SuggestionButton = styled8__default.default.button`
     opacity: 0.4;
   }
 `;
-var InputWrapper = styled8__default.default.div`
+var InputWrapper = styled9__default.default.div`
   display: flex;
   align-items: flex-end; /* Align button to bottom when textarea expands */
   gap: ${tokens.spacing.sm};
@@ -1673,7 +1916,7 @@ var InputWrapper = styled8__default.default.div`
     background-color: rgba(50, 50, 52, 0.6);
   }
 `;
-var InputField = styled8__default.default.textarea`
+var InputField = styled9__default.default.textarea`
   flex: 1;
   border: none;
   outline: none;
@@ -1698,7 +1941,7 @@ var InputField = styled8__default.default.textarea`
     cursor: not-allowed;
   }
 `;
-var SubmitButton = styled8__default.default.button`
+var SubmitButton = styled9__default.default.button`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1747,18 +1990,18 @@ var ChatInput = ({
   // Note: Additional AriaTextFieldProps are accepted but not spread to textarea
   // since useTextField is not compatible with textarea elements
 }) => {
-  const [internalValue, setInternalValue] = react.useState(value);
-  const inputRef = react.useRef(null);
+  const [internalValue, setInternalValue] = React.useState(value);
+  const inputRef = React.useRef(null);
   const currentValue = value !== void 0 ? value : internalValue;
   const setValue = onChange || setInternalValue;
-  const autoResize = react.useCallback(() => {
+  const autoResize = React.useCallback(() => {
     const textarea = inputRef.current;
     if (textarea) {
       textarea.style.height = "auto";
       textarea.style.height = `${textarea.scrollHeight}px`;
     }
   }, []);
-  react.useEffect(() => {
+  React.useEffect(() => {
     autoResize();
   }, [currentValue, autoResize]);
   const handleDirectChange = (e) => {
@@ -1827,7 +2070,7 @@ var SuggestionButtonComponent = ({
   onSelect,
   isDisabled = false
 }) => {
-  const ref = react.useRef(null);
+  const ref = React.useRef(null);
   const { buttonProps } = button.useButton(
     {
       onPress: () => onSelect(suggestion.text),
@@ -1843,7 +2086,7 @@ var SubmitButtonComponent = ({
   isDisabled = false,
   ariaLabel = "Send message"
 }) => {
-  const ref = react.useRef(null);
+  const ref = React.useRef(null);
   const { buttonProps } = button.useButton(
     {
       onPress,
@@ -1884,8 +2127,8 @@ var InputAdapter = ({
   onSend,
   isVisible: _isVisible = true
 }) => {
-  const [value, setValue] = react.useState("");
-  const [isSubmitting, setIsSubmitting] = react.useState(false);
+  const [value, setValue] = React.useState("");
+  const [isSubmitting, setIsSubmitting] = React.useState(false);
   const handleSubmit = async (message) => {
     if (!message.trim()) {
       console.log("[InputAdapter] handleSubmit: empty message, ignoring");
@@ -1934,7 +2177,7 @@ var InputAdapter = ({
   );
 };
 InputAdapter.displayName = "InputAdapter";
-var StyledUserMessage = styled8__default.default.button`
+var StyledUserMessage = styled9__default.default.button`
   /* Base styles */
   display: inline-flex;
   align-items: center;
@@ -2004,7 +2247,7 @@ var StyledUserMessage = styled8__default.default.button`
     }
   }
 
-  ${({ $isPressed }) => $isPressed && styled8.css`
+  ${({ $isPressed }) => $isPressed && styled9.css`
       transform: translateY(0) scale(0.98);
       box-shadow: ${tokens.shadows.sm};
 
@@ -2044,7 +2287,7 @@ function UserMessageBase({
   onPress,
   ...ariaProps
 }) {
-  const ref = react.useRef(null);
+  const ref = React.useRef(null);
   if (!onPress) {
     return /* @__PURE__ */ jsxRuntime.jsx(StyledUserMessage, { as: "div", className, $isPressed: isPressed, role: "presentation", children });
   }
@@ -2068,9 +2311,9 @@ function UserMessageBase({
     }
   );
 }
-var UserMessage = react.memo(UserMessageBase);
+var UserMessage = React.memo(UserMessageBase);
 UserMessage.displayName = "UserMessage";
-var UserMessageWrapper = styled8__default.default.div`
+var UserMessageWrapper = styled9__default.default.div`
   display: flex;
   justify-content: flex-end;
   width: 100%;
@@ -2088,9 +2331,9 @@ var UserMessageAdapterBase = ({
   const content = message?.content || "";
   return /* @__PURE__ */ jsxRuntime.jsx(UserMessageWrapper, { children: /* @__PURE__ */ jsxRuntime.jsx(UserMessage, { children: content }) });
 };
-var UserMessageAdapter = react.memo(UserMessageAdapterBase);
+var UserMessageAdapter = React.memo(UserMessageAdapterBase);
 UserMessageAdapter.displayName = "UserMessageAdapter";
-var pulse3 = styled8.keyframes`
+var pulse3 = styled9.keyframes`
   0%, 100% {
     opacity: 1;
     transform: scale(1);
@@ -2100,7 +2343,7 @@ var pulse3 = styled8.keyframes`
     transform: scale(1.1);
   }
 `;
-var Container4 = styled8__default.default.div`
+var Container4 = styled9__default.default.div`
   display: inline-flex;
   align-items: center;
   gap: ${(props) => {
@@ -2116,7 +2359,7 @@ var Container4 = styled8__default.default.div`
 }};
   font-family: ${tokens.typography.fontFamily.primary};
 `;
-var StatusDot = styled8__default.default.div`
+var StatusDot = styled9__default.default.div`
   width: ${(props) => {
   if (props.variant === "badge") {
     switch (props.size) {
@@ -2177,7 +2420,7 @@ var StatusDot = styled8__default.default.div`
   animation: ${(props) => props.status === "streaming" ? pulse3 : "none"} 2s ease-in-out infinite;
   flex-shrink: 0;
 `;
-var Label = styled8__default.default.span`
+var Label = styled9__default.default.span`
   font-size: ${(props) => {
   if (props.variant === "badge") {
     switch (props.size) {
@@ -2204,7 +2447,7 @@ var Label = styled8__default.default.span`
   color: ${tokens.colors.text.secondary};
   line-height: ${tokens.typography.lineHeight.tight};
 `;
-var BadgeContainer = styled8__default.default.div`
+var BadgeContainer = styled9__default.default.div`
   display: inline-flex;
   align-items: center;
   gap: ${(props) => {
@@ -2281,7 +2524,7 @@ var StreamStatusIndicator = ({
   return /* @__PURE__ */ jsxRuntime.jsx(Container4, { size, className, role: "status", "aria-label": getStatusLabel(status), children: content });
 };
 StreamStatusIndicator.displayName = "StreamStatusIndicator";
-var HeaderContainer = styled8__default.default.header`
+var HeaderContainer = styled9__default.default.header`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -2297,14 +2540,14 @@ var HeaderContainer = styled8__default.default.header`
     padding: ${tokens.spacing.sm} ${tokens.spacing.md};
   }
 `;
-var HeaderContent = styled8__default.default.div`
+var HeaderContent = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   gap: ${tokens.spacing.xs};
   flex: 1;
   min-width: 0;
 `;
-var HeaderTitle = styled8__default.default.h1`
+var HeaderTitle = styled9__default.default.h1`
   margin: 0;
   font-size: ${tokens.typography.fontSize.base};
   font-weight: ${tokens.typography.fontWeight.semibold};
@@ -2315,7 +2558,7 @@ var HeaderTitle = styled8__default.default.h1`
   text-overflow: ellipsis;
   white-space: nowrap;
 `;
-var HeaderSubtitle = styled8__default.default.p`
+var HeaderSubtitle = styled9__default.default.p`
   margin: 0;
   font-size: ${tokens.typography.fontSize.sm};
   color: ${tokens.colors.text.secondary};
@@ -2325,13 +2568,13 @@ var HeaderSubtitle = styled8__default.default.p`
   text-overflow: ellipsis;
   white-space: nowrap;
 `;
-var HeaderActions = styled8__default.default.div`
+var HeaderActions = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
   margin-left: ${tokens.spacing.md};
 `;
-var ActionButton2 = styled8__default.default.button`
+var ActionButton2 = styled9__default.default.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -2378,8 +2621,8 @@ var Header = ({
   onMinimize,
   className
 }) => {
-  const minimizeRef = react.useRef(null);
-  const closeRef = react.useRef(null);
+  const minimizeRef = React.useRef(null);
+  const closeRef = React.useRef(null);
   const { buttonProps: minimizeProps } = button.useButton(
     {
       onPress: onMinimize,
@@ -2448,7 +2691,7 @@ var Header = ({
   ] });
 };
 Header.displayName = "Header";
-var MessagesContainer = styled8__default.default.div`
+var MessagesContainer = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   flex: 1;
@@ -2477,7 +2720,7 @@ var Messages = ({
   return /* @__PURE__ */ jsxRuntime.jsx(MessagesContainer, { className, role: "region", "aria-label": ariaLabel, children });
 };
 Messages.displayName = "Messages";
-var WindowContainer = styled8__default.default.div`
+var WindowContainer = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   /* Glassmorphism effect */
@@ -2496,7 +2739,7 @@ var WindowContainer = styled8__default.default.div`
   height: ${({ $height }) => $height};
 
   /* Fullscreen state */
-  ${({ $isFullscreen }) => $isFullscreen && styled8.css`
+  ${({ $isFullscreen }) => $isFullscreen && styled9.css`
       width: 100vw;
       height: 100vh;
       border-radius: 0;
@@ -2508,7 +2751,7 @@ var WindowContainer = styled8__default.default.div`
     `}
 
   /* Minimized state */
-  ${({ $isMinimized }) => $isMinimized && styled8.css`
+  ${({ $isMinimized }) => $isMinimized && styled9.css`
       height: 60px;
       width: 300px;
       box-shadow: ${tokens.shadows.sm};
@@ -2527,7 +2770,7 @@ var WindowContainer = styled8__default.default.div`
 
   /* Responsive behavior for smaller screens */
   @media (max-width: ${tokens.breakpoints.tablet}px) {
-    ${({ $isFullscreen, $isMinimized }) => !$isFullscreen && !$isMinimized && styled8.css`
+    ${({ $isFullscreen, $isMinimized }) => !$isFullscreen && !$isMinimized && styled9.css`
         width: 100vw;
         height: 100vh;
         border-radius: 0;
@@ -2570,7 +2813,7 @@ var Window = ({
   );
 };
 Window.displayName = "Window";
-var GlobalSidebarStyles = styled8.createGlobalStyle`
+var GlobalSidebarStyles = styled9.createGlobalStyle`
   /* Override CopilotKit's default positioning - start off-screen */
   .copilotKitSidebar {
     position: fixed !important;
@@ -2678,7 +2921,7 @@ var GlobalSidebarStyles = styled8.createGlobalStyle`
     }
   }
 `;
-var StyledChatButton = styled8__default.default.button`
+var StyledChatButton = styled9__default.default.button`
   position: fixed;
   bottom: 8px;
   right: 8px;
@@ -2808,7 +3051,7 @@ var CustomCopilotSidebar = ({
   ] });
 };
 CustomCopilotSidebar.displayName = "CustomCopilotSidebar";
-var GlobalSidebarStyles2 = styled8.createGlobalStyle`
+var GlobalSidebarStyles2 = styled9.createGlobalStyle`
   /* Override CopilotKit's content wrapper to respect safe areas in landscape */
   @media (orientation: landscape) {
     .copilotKitSidebarContentWrapper {
@@ -3088,7 +3331,7 @@ var GlobalSidebarStyles2 = styled8.createGlobalStyle`
     box-shadow: none !important;
   }
 `;
-var StyledChatButton2 = styled8__default.default.button`
+var StyledChatButton2 = styled9__default.default.button`
   position: fixed;
   bottom: calc(${tokens.spacing.sm} + var(--safe-area-bottom, 0px));
   right: calc(${tokens.spacing.sm} + var(--safe-area-right, 0px));
@@ -3192,15 +3435,15 @@ function CustomCopilotSidebar2({
   ToolCallsComponent,
   onReportIssue
 }) {
-  const HeaderAdapterWithClose = react.useMemo(
+  const HeaderAdapterWithClose = React.useMemo(
     () => createHeaderAdapter(onSetOpen),
     [onSetOpen]
   );
-  const CustomButton = react.useMemo(
+  const CustomButton = React.useMemo(
     () => createButtonAdapter(disabled, disabledReason, onSetOpen),
     [disabled, disabledReason, onSetOpen]
   );
-  const AssistantMessageAdapterMemo = react.useMemo(
+  const AssistantMessageAdapterMemo = React.useMemo(
     () => onReportIssue ? createAssistantMessageAdapterWithErrorReporting(onReportIssue, ThinkingIndicator) : ThinkingIndicator || ToolCallsComponent ? createAssistantMessageAdapter(ThinkingIndicator) : AssistantMessageAdapter,
     [ThinkingIndicator, ToolCallsComponent, onReportIssue]
   );
@@ -3234,7 +3477,7 @@ function CustomCopilotSidebar2({
   ] });
 }
 CustomCopilotSidebar2.displayName = "CustomCopilotSidebar";
-var FooterContainer = styled8__default.default.footer`
+var FooterContainer = styled9__default.default.footer`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -3243,7 +3486,7 @@ var FooterContainer = styled8__default.default.footer`
   border-top: 1px solid ${tokens.colors.border.default};
   min-height: 44px;
 `;
-var FooterContent = styled8__default.default.div`
+var FooterContent = styled9__default.default.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -3256,13 +3499,13 @@ var FooterContent = styled8__default.default.div`
   font-family: ${tokens.typography.fontFamily.primary};
   line-height: ${tokens.typography.lineHeight.tight};
 `;
-var FooterBranding = styled8__default.default.div`
+var FooterBranding = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
   flex-shrink: 0;
 `;
-var FooterStatus = styled8__default.default.div`
+var FooterStatus = styled9__default.default.div`
   display: flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
@@ -3272,7 +3515,7 @@ var FooterStatus = styled8__default.default.div`
   font-size: ${tokens.typography.fontSize.xs};
   opacity: 0.8;
 `;
-var FooterLink = styled8__default.default.a`
+var FooterLink = styled9__default.default.a`
   color: ${tokens.colors.primary};
   text-decoration: none;
   transition: opacity ${tokens.transitions.fast};
@@ -3320,13 +3563,13 @@ var Footer = ({
   ] }) });
 };
 Footer.displayName = "Footer";
-var InputContainer = styled8__default.default.div`
+var InputContainer = styled9__default.default.div`
 	display: flex;
 	flex-direction: column;
 	width: 100%;
 	position: relative;
 `;
-var InputWrapper2 = styled8__default.default.div`
+var InputWrapper2 = styled9__default.default.div`
 	display: flex;
 	align-items: flex-end;
 	gap: ${tokens.spacing.sm};
@@ -3346,7 +3589,7 @@ var InputWrapper2 = styled8__default.default.div`
 		border-color: ${tokens.colors.border.subtle};
 	}
 `;
-var TextArea = styled8__default.default.textarea`
+var TextArea = styled9__default.default.textarea`
 	flex: 1;
 	min-height: ${tokens.spacing.lg};
 	max-height: ${(props) => `${(props.$maxRows || 5) * 24}px`};
@@ -3392,7 +3635,7 @@ var TextArea = styled8__default.default.textarea`
 		background: ${tokens.colors.scrollbar.thumbHover};
 	}
 `;
-var SendButton = styled8__default.default.button`
+var SendButton = styled9__default.default.button`
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -3439,7 +3682,7 @@ var Input = ({
   "aria-label": ariaLabel = "Message input",
   ...ariaProps
 }) => {
-  const textareaRef = react.useRef(null);
+  const textareaRef = React.useRef(null);
   const { inputProps } = textfield.useTextField(
     {
       ...ariaProps,
@@ -3522,7 +3765,7 @@ var Input = ({
     )
   ] }) });
 };
-var MessagesListContainer = styled8__default.default.div`
+var MessagesListContainer = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -3562,7 +3805,7 @@ var MessagesListContainer = styled8__default.default.div`
   /* Ensure proper rendering on mobile */
   -webkit-overflow-scrolling: touch;
 `;
-var MessagesListContent = styled8__default.default.div`
+var MessagesListContent = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   gap: ${tokens.spacing.sm};
@@ -3625,11 +3868,11 @@ var MessagesList = ({
   onScrollTop,
   maxHeight = "600px"
 }) => {
-  const containerRef = react.useRef(null);
-  const contentRef = react.useRef(null);
-  const isUserScrollingRef = react.useRef(false);
-  const scrollTimeoutRef = react.useRef(null);
-  react.useEffect(() => {
+  const containerRef = React.useRef(null);
+  const contentRef = React.useRef(null);
+  const isUserScrollingRef = React.useRef(false);
+  const scrollTimeoutRef = React.useRef(null);
+  React.useEffect(() => {
     if (autoScroll && !isUserScrollingRef.current && containerRef.current) {
       const container = containerRef.current;
       container.scrollTop = container.scrollHeight;
@@ -3650,7 +3893,7 @@ var MessagesList = ({
       onScrollTop();
     }
   };
-  react.useEffect(() => {
+  React.useEffect(() => {
     return () => {
       if (scrollTimeoutRef.current) {
         clearTimeout(scrollTimeoutRef.current);
@@ -3678,7 +3921,7 @@ var MessagesList = ({
     }
   );
 };
-var StyledUserMessage2 = styled8__default.default.div`
+var StyledUserMessage2 = styled9__default.default.div`
   display: flex;
   justify-content: flex-end;
   align-items: flex-start;
@@ -3686,7 +3929,7 @@ var StyledUserMessage2 = styled8__default.default.div`
   padding: 0;
   width: 100%;
 `;
-var MessageBubble = styled8__default.default.div`
+var MessageBubble = styled9__default.default.div`
   display: flex;
   flex-direction: column;
   max-width: 85%;
@@ -3713,7 +3956,7 @@ var MessageBubble = styled8__default.default.div`
     opacity: 0.9;
   }
 `;
-var MessageContent2 = styled8__default.default.p`
+var MessageContent2 = styled9__default.default.p`
   margin: 0;
   font-size: ${tokens.typography.fontSize.sm};
   line-height: ${tokens.typography.lineHeight.normal};
@@ -3722,13 +3965,13 @@ var MessageContent2 = styled8__default.default.p`
   word-break: break-word;
   white-space: pre-wrap;
 `;
-var MessageTime2 = styled8__default.default.time`
+var MessageTime2 = styled9__default.default.time`
   font-size: ${tokens.typography.fontSize.xs};
   opacity: 0.7;
   margin-top: ${tokens.spacing.xs};
   text-align: right;
 `;
-var ActionButton3 = styled8__default.default.button`
+var ActionButton3 = styled9__default.default.button`
   display: inline-flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
@@ -3752,12 +3995,12 @@ var ActionButton3 = styled8__default.default.button`
     transform: scale(0.98);
   }
 `;
-var ActionsContainer3 = styled8__default.default.div`
+var ActionsContainer3 = styled9__default.default.div`
   display: flex;
   gap: ${tokens.spacing.xs};
   flex-wrap: wrap;
 `;
-var Avatar3 = styled8__default.default.img`
+var Avatar3 = styled9__default.default.img`
   width: ${tokens.spacing.xl};
   height: ${tokens.spacing.xl};
   border-radius: ${tokens.borderRadius.full};
@@ -3796,7 +4039,7 @@ var UserMessage2 = ({
     avatarUrl && /* @__PURE__ */ jsxRuntime.jsx(Avatar3, { src: avatarUrl, alt: username || "User" })
   ] });
 };
-var ErrorContainer = styled8__default.default.div`
+var ErrorContainer = styled9__default.default.div`
   display: flex;
   align-items: flex-start;
   gap: ${tokens.spacing.sm};
@@ -3810,7 +4053,7 @@ var ErrorContainer = styled8__default.default.div`
   width: ${(props) => props.variant === "banner" ? "100%" : "auto"};
   max-width: ${(props) => props.variant === "banner" ? "100%" : "600px"};
 `;
-var IconContainer = styled8__default.default.div`
+var IconContainer = styled9__default.default.div`
   flex-shrink: 0;
   width: 20px;
   height: 20px;
@@ -3827,29 +4070,29 @@ var ErrorIcon = () => /* @__PURE__ */ jsxRuntime.jsx(
     children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" })
   }
 );
-var Content2 = styled8__default.default.div`
+var Content2 = styled9__default.default.div`
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: ${tokens.spacing.sm};
 `;
-var ErrorMessage = styled8__default.default.div`
+var ErrorMessage = styled9__default.default.div`
   font-size: ${tokens.typography.fontSize.sm};
   line-height: ${tokens.typography.lineHeight.normal};
   color: ${tokens.colors.text.primary};
 `;
-var ErrorDetails = styled8__default.default.div`
+var ErrorDetails = styled9__default.default.div`
   font-size: ${tokens.typography.fontSize.xs};
   line-height: 1.4;
   color: ${tokens.colors.text.secondary};
   margin-top: ${tokens.spacing.xs};
 `;
-var Actions2 = styled8__default.default.div`
+var Actions2 = styled9__default.default.div`
   display: flex;
   gap: ${tokens.spacing.sm};
   margin-top: ${tokens.spacing.sm};
 `;
-var Button2 = styled8__default.default.button`
+var Button2 = styled9__default.default.button`
   display: inline-flex;
   align-items: center;
   gap: ${tokens.spacing.xs};
@@ -3878,7 +4121,7 @@ var Button2 = styled8__default.default.button`
     cursor: not-allowed;
   }
 `;
-var CloseButton = styled8__default.default.button`
+var CloseButton = styled9__default.default.button`
   flex-shrink: 0;
   width: 24px;
   height: 24px;
@@ -3937,7 +4180,7 @@ var StreamErrorMessage = ({
   ] });
 };
 StreamErrorMessage.displayName = "StreamErrorMessage";
-var SuggestionsContainer = styled8__default.default.div`
+var SuggestionsContainer = styled9__default.default.div`
   display: flex;
   flex-wrap: nowrap; /* Single row */
   gap: ${tokens.spacing.sm};
@@ -3970,7 +4213,7 @@ var SuggestionsContainer = styled8__default.default.div`
     display: none; /* Chrome/Safari/Opera */
   }
 `;
-var StyledSuggestion = styled8__default.default.button`
+var StyledSuggestion = styled9__default.default.button`
   /* Base styles */
   display: inline-flex;
   align-items: center;
@@ -4003,7 +4246,7 @@ var StyledSuggestion = styled8__default.default.button`
     box-shadow: none;
   }
 
-  ${({ $isPressed }) => $isPressed && styled8.css`
+  ${({ $isPressed }) => $isPressed && styled9.css`
       transform: scale(0.98);
     `}
 
@@ -4032,7 +4275,7 @@ function Suggestions({ suggestions, onSelect, className }) {
   return /* @__PURE__ */ jsxRuntime.jsx(SuggestionsContainer, { className, role: "list", "aria-label": "Suggested prompts", children: suggestions.map((suggestion) => /* @__PURE__ */ jsxRuntime.jsx(SuggestionChip, { suggestion, onSelect }, suggestion)) });
 }
 function SuggestionChip({ suggestion, onSelect }) {
-  const ref = react.useRef(null);
+  const ref = React.useRef(null);
   const { buttonProps, isPressed } = button.useButton(
     {
       onPress: () => onSelect(suggestion),
@@ -4069,5 +4312,7 @@ exports.Suggestions = Suggestions;
 exports.UserMessage = UserMessage2;
 exports.UserMessageAdapter = UserMessageAdapter;
 exports.Window = Window;
+exports.clearToolCalls = clearToolCalls;
+exports.registerToolCall = registerToolCall;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map