@burtson-labs/bandit-engine 2.0.90 → 2.0.92

package/dist/index.js

@@ -15412,83 +15412,134 @@ var init_source_chips = __esm({
       const [failed, setFailed] = (0, import_react18.useState)(false);
       const domain = domainOf(source.url);
       const label = source.title?.trim() || domain;
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material11.Tooltip, { title: `${label} \xB7 ${domain}`, arrow: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
-        import_material11.Box,
+      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        import_material11.Tooltip,
         {
-          component: "a",
-          href: source.url,
-          target: "_blank",
-          rel: "noopener noreferrer",
-          sx: {
-            display: "inline-flex",
-            alignItems: "center",
-            gap: 0.75,
-            maxWidth: 240,
-            px: 1,
-            py: 0.4,
-            borderRadius: 999,
-            border: "1px solid",
-            borderColor: "divider",
-            bgcolor: "action.hover",
-            textDecoration: "none",
-            color: "text.primary",
-            fontSize: 12.5,
-            lineHeight: 1.4,
-            transition: "border-color 0.15s ease, background-color 0.15s ease",
-            "&:hover": { borderColor: "primary.main", bgcolor: "action.selected" }
-          },
-          children: [
-            failed ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-              import_material11.Box,
-              {
-                sx: {
-                  width: 16,
-                  height: 16,
-                  borderRadius: "4px",
-                  bgcolor: "primary.main",
-                  color: "primary.contrastText",
-                  display: "grid",
-                  placeItems: "center",
-                  fontSize: 9,
-                  fontWeight: 700,
-                  flexShrink: 0
-                },
-                children: domain.charAt(0).toUpperCase()
-              }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-              import_material11.Box,
-              {
-                component: "img",
-                src: `https://icons.duckduckgo.com/ip3/${domain}.ico`,
-                alt: "",
-                loading: "lazy",
-                onError: () => setFailed(true),
-                sx: { width: 16, height: 16, borderRadius: "4px", flexShrink: 0 }
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-              import_material11.Box,
-              {
-                component: "span",
-                sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
-                children: label
-              }
-            )
-          ]
+          title: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material11.Box, { sx: { fontWeight: 600 }, children: label }),
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material11.Box, { sx: { opacity: 0.75, fontSize: 11, wordBreak: "break-all", mt: 0.25 }, children: source.url })
+          ] }),
+          arrow: true,
+          children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+            import_material11.Box,
+            {
+              component: "a",
+              href: source.url,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className: "source-chip",
+              sx: {
+                display: "inline-flex",
+                alignItems: "center",
+                flexShrink: 0,
+                height: 26,
+                px: 0.4,
+                borderRadius: 999,
+                border: "1px solid",
+                borderColor: "divider",
+                bgcolor: "background.paper",
+                textDecoration: "none",
+                color: "text.primary",
+                fontSize: 12.5,
+                lineHeight: 1.4,
+                transition: "border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease",
+                "&:hover": { borderColor: "primary.main", bgcolor: "action.hover", boxShadow: 1, zIndex: 2 }
+              },
+              children: [
+                failed ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                  import_material11.Box,
+                  {
+                    sx: {
+                      width: 18,
+                      height: 18,
+                      borderRadius: "50%",
+                      bgcolor: "primary.main",
+                      color: "primary.contrastText",
+                      display: "grid",
+                      placeItems: "center",
+                      fontSize: 9,
+                      fontWeight: 700,
+                      flexShrink: 0
+                    },
+                    children: domain.charAt(0).toUpperCase()
+                  }
+                ) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                  import_material11.Box,
+                  {
+                    component: "img",
+                    src: `https://icons.duckduckgo.com/ip3/${domain}.ico`,
+                    alt: "",
+                    loading: "lazy",
+                    onError: () => setFailed(true),
+                    sx: { width: 18, height: 18, borderRadius: "50%", flexShrink: 0 }
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                  import_material11.Box,
+                  {
+                    className: "chip-label",
+                    component: "span",
+                    sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
+                    children: label
+                  }
+                )
+              ]
+            }
+          )
         }
-      ) });
+      );
     };
     SourceChips = ({ content }) => {
       const sources = (0, import_react18.useMemo)(() => parseWebSources(content), [content]);
       if (sources.length === 0) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-        import_material11.Box,
-        {
-          sx: { display: "flex", flexWrap: "wrap", gap: 0.75, mt: 1.5 },
-          "aria-label": "Sources",
-          children: sources.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SourceChip, { source: s }, `${s.url}-${i}`))
-        }
-      );
+      return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_material11.Box, { sx: { display: "flex", alignItems: "center", gap: 0.75, mt: 1.5, flexWrap: "wrap" }, "aria-label": "Sources", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          import_material11.Box,
+          {
+            component: "span",
+            sx: {
+              fontSize: 11,
+              fontWeight: 700,
+              color: "text.secondary",
+              textTransform: "uppercase",
+              letterSpacing: 0.5,
+              flexShrink: 0
+            },
+            children: "Sources"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          import_material11.Box,
+          {
+            sx: {
+              display: "flex",
+              alignItems: "center",
+              flexWrap: "wrap",
+              rowGap: 0.5,
+              // Touch / no-hover devices: chips stay expanded (no hover to reveal).
+              "& .source-chip": { ml: "4px" },
+              "& .source-chip:first-of-type": { ml: 0 },
+              "& .chip-label": { maxWidth: 200, opacity: 1, ml: 0.6 },
+              // Hover-capable devices: collapse into an overlapping favicon stack
+              // that spreads out and reveals titles when the rail is hovered.
+              "@media (hover: hover)": {
+                "& .source-chip": { ml: "-10px", transition: "margin-left 0.22s ease" },
+                "& .source-chip:first-of-type": { ml: 0 },
+                "& .chip-label": {
+                  maxWidth: 0,
+                  opacity: 0,
+                  ml: 0,
+                  transition: "max-width 0.28s ease, opacity 0.18s ease, margin-left 0.2s ease"
+                },
+                "&:hover .source-chip": { ml: "6px" },
+                "&:hover .source-chip:first-of-type": { ml: 0 },
+                "&:hover .chip-label": { maxWidth: 200, opacity: 1, ml: 0.6 }
+              }
+            },
+            children: sources.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SourceChip, { source: s }, `${s.url}-${i}`))
+          }
+        )
+      ] });
     };
     source_chips_default = SourceChips;
   }
@@ -15598,7 +15649,7 @@ var init_chat_messages = __esm({
                       /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                         StreamingMarkdown_default,
                         {
-                          content: isStreaming && isLast ? content : stripSourcesForDisplay(content),
+                          content: stripSourcesForDisplay(content),
                           isStreaming: isStreaming && isLast,
                           sources: sourceSummaries
                         }