@webless/agent 0.10.0 → 0.10.2

package/dist/{chunk-6OCODDRO.js → chunk-Q7H4RRS4.js}

@@ -4298,8 +4298,7 @@ function workSummary(steps, failed, brandLabel) {
     )}`;
   const active = [...steps].reverse().find((step) => step.state === "active");
   if (active?.kind === "search") return "Searching this site";
-  if (active)
-    return brandLabel ? `${brandLabel} is choosing the best way to help` : "Choosing the best way to help";
+  if (active) return "Reviewing your details to find the best approach";
   if (failed) return "Couldn\u2019t complete this request";
   const hasError = steps.some((step) => step.state === "error");
   const specialists = steps.filter(
@@ -4408,7 +4407,7 @@ function AgentActivityBubble({
         }
       ),
       workSummary(steps, failed, brandLabel),
-      active ? "\u2026" : ""
+      active ? "..." : ""
     ] }),
     !active ? /* @__PURE__ */ jsxs2("div", { className: "agent-activity-bubble__details", children: [
       /* @__PURE__ */ jsx2(
@@ -5442,7 +5441,7 @@ function MessageBubble({
     /* @__PURE__ */ jsx8(
       Streamdown,
       {
-        animated: isStreaming,
+        animated: false,
         caret: "circle",
         className: "message-bubble__markdown",
         controls: false,
@@ -6339,14 +6338,21 @@ function AgentRail({
   const activeVisitorToolInput = [...visitorToolResults].reverse().find((result) => result.kind === "input");
   const visibleVisitorToolResults = activeVisitorToolInput ? [activeVisitorToolInput] : visitorToolResults;
   const activityActive = state.toolSteps.some((step) => step.state === "active");
-  const showActivity = state.toolSteps.length > 0 && pendingInputRequests.length === 0 && !state.pendingOffer && activityActive;
+  const showActivity = state.toolSteps.length > 0 && pendingInputRequests.length === 0 && !state.pendingOffer && (activityActive || isBusy && !state.streamingText);
+  const activitySteps = activityActive || !isBusy || state.streamingText ? state.toolSteps : [...state.toolSteps, {
+    id: "preparing-answer",
+    kind: "tool",
+    label: "Preparing your answer",
+    detail: "Preparing your answer",
+    state: "active"
+  }];
   const hasVisitorMessages2 = state.messages.some(
     (message) => message.role === "visitor"
   );
   const hasAgentResponseAfterVisitor = state.messages.some(
     (message) => message.role === "agent" && message.id !== "greeting"
   );
-  const showDisclaimerLabel = Boolean(resolvedDisclaimerLabel) && hasVisitorMessages2 && (hasAgentResponseAfterVisitor || state.phase === "streaming" && Boolean(state.streamingText));
+  const showDisclaimerLabel = Boolean(resolvedDisclaimerLabel) && hasVisitorMessages2 && (hasAgentResponseAfterVisitor || Boolean(state.streamingText));
   const showIdleFollowUps = !hasVisitorMessages2 && state.followUps.length > 0;
   const greeting = state.messages.find(
     (message) => message.role === "agent" && message.id === "greeting"
@@ -6369,11 +6375,11 @@ function AgentRail({
   }
   const lastIsAgent = lastMessage?.role === "agent";
   const showMessageActions = state.phase === "complete" && lastIsAgent && hasVisitorMessages2 && Boolean(hideToolCardFences(lastMessage.text).trim());
-  const streamingMessage = state.phase === "streaming" && state.streamingText && !lastIsAgent ? {
+  const streamingMessage = state.streamingText && !lastIsAgent ? {
     createdAt: 0,
     id: "streaming-response",
     role: "agent",
-    streaming: true,
+    streaming: isBusy,
     text: state.streamingText,
     searchResults: (state.toolResults ?? []).filter(
       (result) => result.kind === "search"
@@ -6385,6 +6391,7 @@ function AgentRail({
     streaming: false,
     text: "Pick a date and time that works for you."
   } : null;
+  const transcriptMessages = streamingMessage ? [...visibleMessages, streamingMessage] : visibleMessages;
   const bookingReadyText = state.streamingText || (lastIsAgent && lastMessage?.role === "agent" ? lastMessage.text : "");
   const waitingForBooking = !state.pendingOffer && looksLikeBookingReady(bookingReadyText) && (state.phase === "thinking" || state.phase === "running-tools" || state.phase === "streaming");
   const lastAgentText = lastIsAgent && lastMessage?.role === "agent" ? lastMessage.text : "";
@@ -6617,7 +6624,7 @@ function AgentRail({
                       brandLabel: resolvedBrandLabel,
                       brandLogoUrl: showBrandLogo ? resolvedBrandLogoUrl : void 0,
                       failed: state.phase === "error",
-                      steps: state.toolSteps
+                      steps: activitySteps
                     }
                   ) : null,
                   visibleVisitorToolResults.map((result) => /* @__PURE__ */ jsx17(
@@ -6638,7 +6645,7 @@ function AgentRail({
                     request.requestId
                   ))
                 ] }) : null,
-                visibleMessages.map((message, index) => /* @__PURE__ */ jsxs16(
+                transcriptMessages.map((message, index) => /* @__PURE__ */ jsxs16(
                   "div",
                   {
                     ref: index === lastVisitorIndex + 1 ? responseRef : void 0,
@@ -6651,7 +6658,7 @@ function AgentRail({
                           message,
                           bookingDisabled: isBusy,
                           brandLogoUrl: showBrandLogo ? resolvedBrandLogoUrl : void 0,
-                          offer: index === lastAgentIndex ? state.pendingOffer : void 0,
+                          offer: index === transcriptMessages.length - 1 ? state.pendingOffer : void 0,
                           onBook
                         }
                       ),
@@ -6674,7 +6681,7 @@ function AgentRail({
                             brandLabel: resolvedBrandLabel,
                             brandLogoUrl: showBrandLogo ? resolvedBrandLogoUrl : void 0,
                             failed: state.phase === "error",
-                            steps: state.toolSteps
+                            steps: activitySteps
                           }
                         ) : null,
                         visibleVisitorToolResults.map((result) => /* @__PURE__ */ jsx17(
@@ -6697,18 +6704,8 @@ function AgentRail({
                       ] }) : null
                     ]
                   },
-                  message.id
+                  message.role === "agent" && transcriptMessages[index - 1]?.role === "visitor" ? `answer-${transcriptMessages[index - 1]?.id}` : message.id
                 )),
-                streamingMessage ? /* @__PURE__ */ jsx17("div", { ref: responseRef, children: /* @__PURE__ */ jsx17(
-                  MessageBubble,
-                  {
-                    message: streamingMessage,
-                    bookingDisabled: isBusy,
-                    brandLogoUrl: showBrandLogo ? resolvedBrandLogoUrl : void 0,
-                    offer: state.pendingOffer,
-                    onBook
-                  }
-                ) }) : null,
                 waitingForBooking ? /* @__PURE__ */ jsx17(BookingCardLoader, {}) : null,
                 state.error ? /* @__PURE__ */ jsxs16("section", { className: "agent-rail__error", role: "alert", children: [
                   /* @__PURE__ */ jsxs16("div", { children: [
@@ -6771,6 +6768,7 @@ function AgentRail({
 }
 
 // src/react/components/AssistEdgeTab/AssistEdgeTab.tsx
+import { useState as useState10 } from "react";
 import { Fragment as Fragment5, jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
 function ChatSparkIcon() {
   return /* @__PURE__ */ jsxs17(
@@ -6845,16 +6843,35 @@ function ChatSparkIcon() {
     }
   );
 }
-function TabMarkIcon({ customIconUrl }) {
-  const url = customIconUrl?.trim();
-  if (url) {
+function TabMarkIcon({
+  customIconUrl,
+  logoUrl
+}) {
+  const custom = customIconUrl?.trim();
+  const logo = logoUrl?.trim();
+  const [customFailed, setCustomFailed] = useState10(false);
+  const [logoFailed, setLogoFailed] = useState10(false);
+  if (custom && !customFailed) {
     return /* @__PURE__ */ jsx18(
       "img",
       {
         alt: "",
         "aria-hidden": true,
         className: "assist-edge-tab__custom-icon",
-        src: url
+        src: custom,
+        onError: () => setCustomFailed(true)
+      }
+    );
+  }
+  if (logo && !logoFailed) {
+    return /* @__PURE__ */ jsx18(
+      "img",
+      {
+        alt: "",
+        "aria-hidden": true,
+        className: "assist-edge-tab__logo",
+        src: logo,
+        onError: () => setLogoFailed(true)
       }
     );
   }
@@ -6917,13 +6934,14 @@ function AssistEdgeTab({
   const visibleLabel = label?.trim() || copy.label;
   const visibleSubLabel = subLabel?.trim() || "";
   const pill = mobile || side === "bottom";
+  const chromeScheme = pill ? "light" : resolvedColorScheme;
   const ariaLabel = visibleSubLabel ? `Open ${visibleLabel} \u2014 ${visibleSubLabel}` : `Open ${visibleLabel}`;
   const alignment = along < 50 ? "start" : along > 50 ? "end" : "center";
-  const showLogo = Boolean(logoUrl?.trim()) && !customIconUrl?.trim();
-  const resolvedBrandColor = brandColor ?? (resolvedColorScheme === "dark" ? defaultDarkAgentRailTheme.brand : void 0);
-  const resolvedBorderColor = resolvedColorScheme === "dark" ? defaultDarkAgentRailTheme.border : borderColor;
-  const resolvedSurfaceColor = resolvedColorScheme === "dark" ? defaultDarkAgentRailTheme.surface : surfaceColor;
-  const resolvedTextColor = resolvedColorScheme === "dark" ? defaultDarkAgentRailTheme.text : textColor;
+  const resolvedBrandColor = brandColor ?? (chromeScheme === "dark" ? defaultDarkAgentRailTheme.brand : void 0);
+  const resolvedBorderColor = chromeScheme === "dark" ? defaultDarkAgentRailTheme.border : borderColor;
+  const resolvedSurfaceColor = chromeScheme === "dark" ? defaultDarkAgentRailTheme.surface : surfaceColor;
+  const resolvedTextColor = chromeScheme === "dark" ? defaultDarkAgentRailTheme.text : textColor;
+  const markSourceKey = `${customIconUrl?.trim() ?? ""}|${logoUrl?.trim() ?? ""}`;
   const style = {
     "--tab-along": `${along}%`,
     "--tab-inset": `${inset}px`,
@@ -6931,16 +6949,16 @@ function AssistEdgeTab({
     ...brandForeground ? { "--as-visitor-text": brandForeground } : {},
     ...resolvedBorderColor ? { "--as-border": resolvedBorderColor } : {},
     ...fontFamily ? { "--as-font-display": fontFamily } : {},
-    ...resolvedSurfaceColor ? { "--as-surface": resolvedSurfaceColor } : {},
-    ...resolvedTextColor ? { "--as-text": resolvedTextColor } : {},
-    colorScheme: resolvedColorScheme
+    ...pill ? { "--as-surface": "#ffffff", "--as-text": "#171717" } : resolvedSurfaceColor ? { "--as-surface": resolvedSurfaceColor } : {},
+    ...!pill && resolvedTextColor ? { "--as-text": resolvedTextColor } : {},
+    colorScheme: chromeScheme
   };
   return /* @__PURE__ */ jsxs17(
     "button",
     {
       type: "button",
       className: `assist-edge-tab assist-edge-tab--${variant} assist-edge-tab--${side} assist-edge-tab--align-${alignment}${mobile ? " assist-edge-tab--mobile" : ""}${visible ? " is-visible" : ""}`,
-      "data-color-scheme": resolvedColorScheme,
+      "data-color-scheme": chromeScheme,
       style,
       "aria-label": ariaLabel,
       "aria-hidden": !visible,
@@ -6956,18 +6974,14 @@ function AssistEdgeTab({
               children: [
                 /* @__PURE__ */ jsx18("span", { className: "assist-edge-tab__wash assist-edge-tab__wash--light" }),
                 /* @__PURE__ */ jsx18("span", { className: "assist-edge-tab__wash assist-edge-tab__wash--cool" }),
-                /* @__PURE__ */ jsx18(TabMarkIcon, { customIconUrl }),
-                showLogo ? /* @__PURE__ */ jsx18(
-                  "img",
+                /* @__PURE__ */ jsx18(
+                  TabMarkIcon,
                   {
-                    className: "assist-edge-tab__logo",
-                    src: logoUrl,
-                    alt: "",
-                    onError: (event) => {
-                      event.currentTarget.hidden = true;
-                    }
-                  }
-                ) : null
+                    customIconUrl,
+                    logoUrl
+                  },
+                  markSourceKey
+                )
               ]
             }
           ),
@@ -6976,20 +6990,14 @@ function AssistEdgeTab({
             visibleSubLabel ? /* @__PURE__ */ jsx18("span", { className: "assist-edge-tab__sublabel", children: visibleSubLabel }) : null
           ] })
         ] }) : variant === "outline" ? /* @__PURE__ */ jsxs17(Fragment5, { children: [
-          /* @__PURE__ */ jsxs17("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: [
-            /* @__PURE__ */ jsx18(TabMarkIcon, { customIconUrl }),
-            showLogo ? /* @__PURE__ */ jsx18(
-              "img",
-              {
-                className: "assist-edge-tab__logo",
-                src: logoUrl,
-                alt: "",
-                onError: (event) => {
-                  event.currentTarget.hidden = true;
-                }
-              }
-            ) : null
-          ] }),
+          /* @__PURE__ */ jsx18("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: /* @__PURE__ */ jsx18(
+            TabMarkIcon,
+            {
+              customIconUrl,
+              logoUrl
+            },
+            markSourceKey
+          ) }),
           /* @__PURE__ */ jsx18("span", { className: "assist-edge-tab__label", children: visibleLabel }),
           /* @__PURE__ */ jsx18(ChevronDownIcon2, {})
         ] }) : null,
@@ -6999,20 +7007,14 @@ function AssistEdgeTab({
           /* @__PURE__ */ jsx18(DragDots, {})
         ] }) : null,
         !pill && variant === "fill" ? /* @__PURE__ */ jsxs17(Fragment5, { children: [
-          /* @__PURE__ */ jsxs17("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: [
-            /* @__PURE__ */ jsx18(TabMarkIcon, { customIconUrl }),
-            showLogo ? /* @__PURE__ */ jsx18(
-              "img",
-              {
-                className: "assist-edge-tab__logo",
-                src: logoUrl,
-                alt: "",
-                onError: (event) => {
-                  event.currentTarget.hidden = true;
-                }
-              }
-            ) : null
-          ] }),
+          /* @__PURE__ */ jsx18("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: /* @__PURE__ */ jsx18(
+            TabMarkIcon,
+            {
+              customIconUrl,
+              logoUrl
+            },
+            markSourceKey
+          ) }),
           /* @__PURE__ */ jsx18("span", { className: "assist-edge-tab__label", children: visibleLabel }),
           /* @__PURE__ */ jsx18(ChevronLeftIcon, {})
         ] }) : null
@@ -7078,7 +7080,7 @@ function sendAgentAnswerFeedback(eventUrl, event) {
 }
 
 // src/react/components/AgentWidget/AgentWidget.tsx
-import { useEffect as useEffect9, useRef as useRef7, useState as useState11 } from "react";
+import { useEffect as useEffect9, useRef as useRef7, useState as useState12 } from "react";
 
 // src/react/page-shift.ts
 import { useEffect as useEffect7 } from "react";
@@ -7161,9 +7163,9 @@ function usePageShift(input) {
 }
 
 // src/react/hooks/useIsMobile.ts
-import { useEffect as useEffect8, useState as useState10 } from "react";
+import { useEffect as useEffect8, useState as useState11 } from "react";
 function useIsMobile(breakpoint = 767) {
-  const [isMobile, setIsMobile] = useState10(
+  const [isMobile, setIsMobile] = useState11(
     () => typeof window !== "undefined" && window.matchMedia(`(max-width: ${breakpoint}px)`).matches
   );
   useEffect8(() => {
@@ -7197,8 +7199,8 @@ function AgentWidget({
   const isMobile = useIsMobile();
   const placement = normalizeAgentPlacement(placementInput);
   const railSlotRef = useRef7(null);
-  const [railCollapsed, setRailCollapsed] = useState11(defaultCollapsed);
-  const [railExpanded, setRailExpanded] = useState11(false);
+  const [railCollapsed, setRailCollapsed] = useState12(defaultCollapsed);
+  const [railExpanded, setRailExpanded] = useState12(false);
   const pageShiftActive = shouldApplyPageShift({
     pageShift,
     isMobile,
@@ -7430,4 +7432,4 @@ export {
   sendAgentAnswerFeedback,
   AgentWidget
 };
-//# sourceMappingURL=chunk-6OCODDRO.js.map
+//# sourceMappingURL=chunk-Q7H4RRS4.js.map