@tangle-network/sandbox-ui 0.31.0 → 0.32.0

package/dist/chat.js

@@ -16,9 +16,9 @@ import {
   modelProvider,
   snapHarnessToModel,
   snapModelToHarness
-} from "./chunk-BJFWPP5T.js";
-import "./chunk-ELGN7DPS.js";
-import "./chunk-6NQBODYV.js";
+} from "./chunk-E267TDZP.js";
+import "./chunk-JC7GMQK7.js";
+import "./chunk-NMR2CTGP.js";
 import "./chunk-EI44GEQ5.js";
 export {
   AgentSessionControls,

package/dist/{chunk-DNZ4DTNA.js → chunk-2XNT74ZX.js}

@@ -414,7 +414,7 @@ function UsageChart({ data, title, unit, className }) {
                 onMouseEnter: () => setHoveredIndex(index),
                 onMouseLeave: () => setHoveredIndex(null),
                 children: [
-                  isHovered && /* @__PURE__ */ jsxs3("div", { className: "absolute -top-12 z-10 rounded-lg bg-popover px-3 py-1.5 text-sm shadow-lg", children: [
+                  isHovered && /* @__PURE__ */ jsxs3("div", { className: "absolute -top-12 z-10 rounded-lg border border-border bg-popover px-3 py-1.5 text-sm shadow-[var(--shadow-dropdown)]", children: [
                     /* @__PURE__ */ jsxs3("p", { className: "font-medium", children: [
                       formatValue(point.value),
                       " ",
@@ -490,7 +490,7 @@ function TemplateCard({ template, onUseTemplate, className }) {
     "div",
     {
       className: cn(
-        "group relative flex flex-col justify-between rounded-2xl border border-border bg-card p-6 transition-all hover:border-primary/30 hover:shadow-md",
+        "group relative flex flex-col justify-between rounded-xl border border-border bg-card p-6 transition-colors hover:border-[var(--border-accent)]",
         className
       ),
       children: [

package/dist/{chunk-AUFV7766.js → chunk-6NDOA4SB.js}

@@ -1048,7 +1048,7 @@ function SessionSidebar({
       className: cn("relative flex shrink-0 flex-col border-r border-border bg-card", className),
       style: { width: resizable ? resize.width : defaultWidth },
       children: [
-        /* @__PURE__ */ jsx7("div", { className: "flex h-14 shrink-0 items-center border-b border-border px-3", children: /* @__PURE__ */ jsxs7("div", { className: "flex w-full items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsx7("div", { className: "flex shrink-0 items-center border-b border-border bg-muted/20 px-3 py-1.5", children: /* @__PURE__ */ jsxs7("div", { className: "flex w-full items-center justify-between gap-2", children: [
           /* @__PURE__ */ jsxs7("div", { className: "flex min-w-0 items-center gap-2", children: [
             /* @__PURE__ */ jsx7("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-[var(--radius-sm)] border border-[var(--border-accent)] bg-[var(--accent-surface-soft)] text-primary", children: /* @__PURE__ */ jsx7(MessageSquareText, { className: "h-3.5 w-3.5" }) }),
             /* @__PURE__ */ jsxs7("div", { className: "min-w-0", children: [
@@ -1080,7 +1080,7 @@ function SessionSidebar({
                 onChange: (event) => setQuery(event.target.value),
                 placeholder: searchPlaceholder,
                 "aria-label": searchPlaceholder,
-                className: "h-8 w-full rounded-[var(--radius-sm)] border border-border bg-muted pl-7 pr-2 text-sm text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-[var(--border-accent)]"
+                className: "h-8 w-full rounded-[var(--radius-sm)] border border-transparent bg-muted/40 pl-7 pr-2 text-sm text-foreground placeholder:text-muted-foreground transition-colors focus-visible:border-[var(--border-accent)] focus-visible:bg-transparent focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-[var(--border-accent)]"
               }
             )
           ] }),
@@ -1104,20 +1104,23 @@ function SessionSidebar({
             );
           }) })
         ] }),
-        /* @__PURE__ */ jsx7("nav", { "aria-label": "Sessions", className: "flex-1 overflow-y-auto px-1.5 py-1.5", children: visibleItems.length === 0 ? /* @__PURE__ */ jsx7("div", { className: "rounded-[var(--radius-lg)] border border-dashed border-border px-3 py-3 text-sm text-muted-foreground", children: query.trim() ? `No sessions match "${query.trim()}".` : emptyMessage }) : /* @__PURE__ */ jsx7("ul", { className: "space-y-px", children: visibleItems.map((item) => {
+        /* @__PURE__ */ jsx7("nav", { "aria-label": "Sessions", className: "flex-1 overflow-y-auto px-1.5 py-1.5", children: visibleItems.length === 0 ? /* @__PURE__ */ jsxs7("div", { className: "flex flex-col items-center justify-center gap-2 px-4 py-10 text-center text-sm text-muted-foreground", children: [
+          /* @__PURE__ */ jsx7(MessageSquareText, { className: "h-5 w-5 opacity-50", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx7("p", { children: query.trim() ? `No sessions match "${query.trim()}".` : emptyMessage })
+        ] }) : /* @__PURE__ */ jsx7("ul", { className: "space-y-px", children: visibleItems.map((item) => {
           const session = sessionsById.get(item.id) ?? null;
           const isActive = currentItemId === item.id;
           const status = session?.status ?? item.status;
           const visibleBadges = [
-            ...item.isPinned ? [{ id: `${item.id}-pinned`, label: "Pinned", tone: "accent" }] : [],
+            ...item.isPinned ? [{ id: `${item.id}-pinned`, label: "Pinned", tone: "neutral" }] : [],
             ...item.badges ?? []
           ];
-          return /* @__PURE__ */ jsx7("li", { children: /* @__PURE__ */ jsxs7(
+          return /* @__PURE__ */ jsx7("li", { className: "animate-row-in", children: /* @__PURE__ */ jsxs7(
             "div",
             {
               className: cn(
-                "group relative flex items-center gap-2 rounded-[var(--radius-sm)] px-3 py-2 transition-colors",
-                isActive ? "bg-primary/10 font-medium text-foreground" : "text-muted-foreground hover:bg-accent/30"
+                "group relative flex items-center gap-2 rounded-[var(--radius-sm)] px-2.5 py-1.5 transition-colors",
+                isActive ? "bg-accent font-medium text-foreground" : "text-muted-foreground hover:bg-accent/30"
               ),
               children: [
                 /* @__PURE__ */ jsxs7(
@@ -1157,7 +1160,7 @@ function SessionSidebar({
                     },
                     badge.id
                   )),
-                  session?.isForeground && /* @__PURE__ */ jsx7("span", { className: "h-1.5 w-1.5 rounded-full bg-primary animate-pulse", title: "Live" }),
+                  session?.isForeground && /* @__PURE__ */ jsx7("span", { className: "h-1.5 w-1.5 rounded-full bg-[var(--status-running)]", title: "Live" }),
                   renderItemActions ? /* @__PURE__ */ jsx7(
                     "div",
                     {