@ai-matrx/chat 0.7.5 → 0.7.7

package/dist/agents/services/mcp-connections.service.js

@@ -4,7 +4,7 @@ import {
   readMatrxJsonResponse,
   sendMatrxRequest
 } from "@ai-matrx/agents/matrx";
-import { applyOrganizationContextHeader } from "../../host/server/organization-context.js";
+import { chatRequestHeaders } from "../../host/request-headers.js";
 import { ensureOrganizationForRequest } from "../../host/org.js";
 import { readSessionToken } from "../../host/identity.js";
 function backendBase() {
@@ -17,13 +17,10 @@ async function authHeaders(method, explicitOrganizationId) {
     method,
     organizationId: explicitOrganizationId
   });
-  return applyOrganizationContextHeader(
-    {
-      Authorization: `Bearer ${accessToken}`,
-      "Content-Type": "application/json"
-    },
-    organizationId
-  );
+  return {
+    "Content-Type": "application/json",
+    ...chatRequestHeaders({ accessToken, fingerprintId: null }, organizationId)
+  };
 }
 async function mcpFetch(path, init, explicitOrganizationId) {
   const headers = await authHeaders(init?.method ?? "GET", explicitOrganizationId);

package/dist/agents/ui-first-tools/dispatcher/dispatch-ui-first-tool.thunk.js

@@ -3,11 +3,12 @@ import { extractErrorMessage } from "@ai-matrx/data/net";
 import { submitToolResult } from "../../api/submit-tool-results.js";
 import { upsertToolLifecycle } from "../../redux/execution-system/active-requests/active-requests.slice.js";
 import { getUiFirstToolEntry } from "../tools/registry.js";
+import { selectUserId } from "../../../host/identity.js";
 const dispatchUiFirstTool = createAsyncThunk(
   "uiFirstTools/dispatch",
   async ({ conversationId, requestId, callId, toolName, args }, { dispatch, getState }) => {
     const state = getState();
-    const userId = state.userAuth?.id ?? null;
+    const userId = selectUserId(state);
     if (!userId) {
       dispatch(
         upsertToolLifecycle({

package/dist/host/defaults/files-host.js

@@ -3,6 +3,7 @@ import {
   isFilesHostConfigured
 } from "@ai-matrx/media/files/engine/host/configure";
 import { getStoreSingleton } from "../../store/store-singleton.js";
+import { chatRequestHeaders } from "../request-headers.js";
 const DEFAULT_FILES_SERVICE_URL = "https://files.matrxserver.com";
 const UUID = "[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}";
 const FILES_SERVICE_ROUTES = [
@@ -45,7 +46,16 @@ function createDefaultFilesServer(host) {
   async function buildHeaders(opts, includeContentType) {
     const requestId = opts.requestId ?? (globalThis.crypto?.randomUUID?.() ?? `${Date.now()}`);
     const headers = { ...await host().server.headers?.() ?? {}, "X-Request-Id": requestId };
-    if (opts.organizationId) headers["X-Organization-Id"] = opts.organizationId;
+    if (opts.organizationId) {
+      const identity = host().identity;
+      Object.assign(
+        headers,
+        chatRequestHeaders(
+          { accessToken: await identity.getAccessToken(), fingerprintId: identity.current().fingerprintId },
+          opts.organizationId
+        )
+      );
+    }
     if (opts.idempotencyKey) headers["Idempotency-Key"] = opts.idempotencyKey;
     if (includeContentType) headers["Content-Type"] = "application/json";
     return { headers, requestId };

package/dist/host/defaults/files-ui.js

@@ -3,6 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from "react";
 import { X } from "lucide-react";
 import { downloadFile as saveBlob } from "@ai-matrx/kit/download";
+import { formatFileSize } from "@ai-matrx/kit/format";
 import { FileIcon, MediaThumbnail } from "@ai-matrx/media/react";
 import { downloadFile } from "@ai-matrx/media/files/engine/api/files";
 import { useFile } from "@ai-matrx/media/files/engine/handler/hooks/useFile";
@@ -115,7 +116,7 @@ function useDefaultFileResourceFamily(fileId) {
   if (state.fileId !== fileId) return { data: null, loading: true, error: null };
   return { data: state.data, loading: false, error: state.error };
 }
-const formatBytes = (n) => n == null ? null : n < 1024 ? `${n} B` : n < 1024 * 1024 ? `${(n / 1024).toFixed(0)} KB` : `${(n / 1024 / 1024).toFixed(1)} MB`;
+const formatBytes = (n) => n == null ? null : formatFileSize(n);
 function DefaultFileResourceChip({ fileId, fileHint, nameOverride, badge, onOpen, onRemove, className }) {
   const { file, status } = useFile(fileId && !isSyntheticId(fileId) ? { kind: "file_id", fileId } : null);
   const name = nameOverride || file?.meta.fileName || fileHint?.fileName || (status === "resolving" ? "Loading\u2026" : "File");

package/dist/host/defaults/server-api.d.ts

@@ -10,7 +10,7 @@
  * values here — no admin lane, no admin door, no endpoint overrides, no local
  * engine, no browser extension (each refusal says so once).
  */
-import { applyOrganizationContextHeader, type MatrxCallError, type MatrxCallResult, type MatrxCancelResponse, type MatrxTransport, type ProviderSessionFailure, type ProviderSessionFailureVerdict } from "@ai-matrx/agents/matrx";
+import { applyOrganizationContextHeader, type MatrxCallError, type MatrxCallResult, type MatrxTransport, type ProviderSessionFailure, type ProviderSessionFailureVerdict } from "@ai-matrx/agents/matrx";
 import type { TypedStreamEvent } from "@ai-matrx/agents/generated/stream-events";
 import type { ApiPaths, ApiSchemas as Schemas, DefaultBrokeredCredential, DefaultRequestOptions, GetResult, PatchBody, PatchResult, PathWith, PostBody, PostResult } from "./typed-paths.js";
 import type { ChatIdentityPort, ChatOrgPort, ChatServerPort } from "../contract.js";
@@ -113,19 +113,6 @@ export declare function createDefaultServerApi(host: () => ServerHostView): {
     resolveScope: (_state?: unknown, overrides?: Partial<DefaultCallScope>) => DefaultCallScope;
     buildRequestBody: (body: unknown, scope: DefaultCallScope) => Record<string, unknown>;
     waitForAuthReady: (_getState?: AnyGetState) => Promise<boolean>;
-    callConversationMemoryCost: (conversationId: string, options?: {
-        signal?: AbortSignal;
-        scopeOverrides?: Partial<DefaultCallScope>;
-    }) => DefaultServerThunk<Promise<DefaultApiCallResult<{
-        conversation_id: string;
-        total_cost: number;
-        total_input_tokens: number;
-        total_output_tokens: number;
-        event_count: number;
-        by_event_type: {
-            [key: string]: import("@ai-matrx/agents/generated/api-types").components["schemas"]["MemoryCostByEventType"];
-        };
-    }>>>;
     callConversationFork: (options: {
         conversationId: string;
         body?: unknown;
@@ -302,7 +289,6 @@ export declare function createDefaultServerApi(host: () => ServerHostView): {
         source?: string;
         expectedErrorStatuses?: readonly number[];
     }) => MatrxTransport;
-    cancelAgentRunRequest: (requestId: string, mode?: "cancel" | "interrupt", seenSeq?: number) => DefaultServerThunk<Promise<DefaultApiCallResult<MatrxCancelResponse>>>;
     peekSelectedOrganizationId: () => string | null;
     waitForOrganizationAdmission: () => Promise<DefaultChatServerTypes["OrganizationAdmission"]>;
     adminLaneOrganizationId: () => string | null;

package/dist/host/defaults/server-api.js

@@ -3,7 +3,6 @@ import {
   applyOrganizationContextHeader,
   buildMatrxRequestBody,
   buildMatrxRequestUrl,
-  cancelAgentRun,
   createMatrxTransport as createPackageTransport,
   executeMatrxCall,
   normalizeMatrxError,
@@ -156,14 +155,6 @@ function createDefaultServerApi(host) {
     resolveScope,
     buildRequestBody,
     waitForAuthReady: async (_getState) => true,
-    callConversationMemoryCost: (conversationId, options) => callApi({
-      path: "/ai/conversations/{conversation_id}/memory_cost",
-      method: "GET",
-      pathParams: { conversation_id: conversationId },
-      stream: false,
-      ...options?.signal ? { signal: options.signal } : {},
-      ...options?.scopeOverrides ? { scopeOverrides: options.scopeOverrides } : {}
-    }),
     callConversationFork: call("POST", "/cx/conversations/{conversation_id}/fork"),
     callConversationForkAndRun: call("POST", "/ai/conversations/{conversation_id}/fork-and-run", true),
     callBatchDeleteMessages: call("POST", "/cx/conversations/{conversation_id}/messages/delete"),
@@ -184,18 +175,6 @@ function createDefaultServerApi(host) {
       ...options.source ? { source: options.source } : {},
       ...options.expectedErrorStatuses ? { expectedErrorStatuses: options.expectedErrorStatuses } : {}
     }),
-    cancelAgentRunRequest: (requestId, mode = "cancel", seenSeq) => async () => {
-      const base = transport();
-      const sender = seenSeq === void 0 ? base : {
-        fetch: (path, init) => base.fetch(`${path}${path.includes("?") ? "&" : "?"}seen_seq=${seenSeq}`, init)
-      };
-      try {
-        const data = await cancelAgentRun(sender, requestId, { mode });
-        return { data, requestId: data.request_id };
-      } catch (error) {
-        return { error: normalizeMatrxError(error) };
-      }
-    },
     // organization admission + the admin seat (none in a bare host)
     peekSelectedOrganizationId: () => host().org.active()?.id ?? null,
     waitForOrganizationAdmission: async () => host().org.active() ? "ready" : "unresolved",

package/dist/host/defaults/server.d.ts

@@ -1,6 +1,7 @@
 /**
  * Default server port: the production AI Dream server; headers carry the
- * bearer token and the active organization.
+ * session credential and the active organization, built by THE ONE header
+ * builder (`../request-headers.ts`).
  */
 import type { ChatIdentityPort, ChatOrgPort, ChatServerPort } from "../contract.js";
 export declare const DEFAULT_CHAT_SERVER_URL = "https://server.app.matrxserver.com";

package/dist/host/defaults/server.js

@@ -1,14 +1,16 @@
+import { chatRequestHeaders } from "../request-headers.js";
 const DEFAULT_CHAT_SERVER_URL = "https://server.app.matrxserver.com";
 function createDefaultServer(identity, org) {
   return {
     baseUrl: () => DEFAULT_CHAT_SERVER_URL,
     async headers() {
-      const headers = {};
-      const token = await identity().getAccessToken();
-      if (token) headers.Authorization = `Bearer ${token}`;
-      const active = org().active();
-      if (active) headers["X-Organization-Id"] = active.id;
-      return headers;
+      return chatRequestHeaders(
+        {
+          accessToken: await identity().getAccessToken(),
+          fingerprintId: identity().current().fingerprintId
+        },
+        org().active()?.id ?? null
+      );
     }
   };
 }

package/dist/host/request-headers.d.ts

@@ -0,0 +1,26 @@
+/**
+ * THE ONE HEADER BUILDER for every request the chat package sends to an AI Matrx server
+ * (Audit B family 8, "the inbox class").
+ *
+ * Who is asking (credential) and which organization the request names, as headers:
+ *   - `Authorization: Bearer <jwt>` for a signed-in session, else `X-Fingerprint-ID` for a guest
+ *     (the platform's one credential mapping, `credentialToHeaders` in `@ai-matrx/data`, which
+ *     `@ai-matrx/api` carries forward unchanged);
+ *   - `X-Organization-Id` when an organization is named;
+ *   - the admin-lane marker when that organization is the platform tenant on the admin seat
+ *     (`adminLaneHeadersFor`, the host's rule; none in a bare host).
+ *
+ * Every request path uses it: the conversation door (`resolveBackendForConversation`, which every
+ * turn and every conversation-bound call rides), the package default server port and the web
+ * app's server port. WHICH organization a conversation request names is a separate, single rule:
+ * `conversationRequestOrganizationId` (`agents/redux/execution-system/utils/required-organization.ts`).
+ * Guard: `host/__tests__/one-header-builder.test.ts` fails when a second builder appears.
+ */
+export interface ChatRequestCredential {
+    /** The session's bearer token, or null. */
+    accessToken: string | null;
+    /** The guest fingerprint a signed-out visitor is known by, or null. */
+    fingerprintId: string | null;
+}
+/** The headers that say who is asking and in which organization. */
+export declare function chatRequestHeaders(credential: ChatRequestCredential, organizationId: string | null | undefined): Record<string, string>;

package/dist/host/request-headers.js

@@ -0,0 +1,15 @@
+import { credentialToHeaders } from "@ai-matrx/data";
+import { adminLaneHeadersFor } from "./server/admin-lane.js";
+function chatRequestHeaders(credential, organizationId) {
+  const presented = credential.accessToken ? { kind: "user", accessToken: credential.accessToken } : credential.fingerprintId ? { kind: "guest", fingerprintId: credential.fingerprintId } : null;
+  const headers = credentialToHeaders(presented);
+  if (!organizationId) return headers;
+  return {
+    ...headers,
+    "X-Organization-Id": organizationId,
+    ...adminLaneHeadersFor(organizationId)
+  };
+}
+export {
+  chatRequestHeaders
+};

package/dist/host/server/call-api.d.ts

@@ -8,19 +8,6 @@ export declare const callApi: <T = unknown>(config: import("../defaults/server-a
 export declare const buildRequestBody: (body: unknown, scope: import("../defaults/server-api.js").DefaultCallScope) => Record<string, unknown>;
 export declare const resolveScope: (_state?: unknown, overrides?: Partial<import("../defaults/server-api.js").DefaultCallScope>) => import("../defaults/server-api.js").DefaultCallScope;
 export declare const waitForAuthReady: (_getState?: () => unknown) => Promise<boolean>;
-export declare const callConversationMemoryCost: (conversationId: string, options?: {
-    signal?: AbortSignal;
-    scopeOverrides?: Partial<import("../defaults/server-api.js").DefaultCallScope>;
-}) => import("../defaults/server-api.js").DefaultServerThunk<Promise<import("../defaults/server-api.js").DefaultApiCallResult<{
-    conversation_id: string;
-    total_cost: number;
-    total_input_tokens: number;
-    total_output_tokens: number;
-    event_count: number;
-    by_event_type: {
-        [key: string]: import("@ai-matrx/agents/generated/api-types").components["schemas"]["MemoryCostByEventType"];
-    };
-}>>>;
 export declare const callConversationFork: (options: {
     conversationId: string;
     body?: unknown;

package/dist/host/server/call-api.js

@@ -3,7 +3,6 @@ const callApi = forwardServer("callApi");
 const buildRequestBody = forwardServer("buildRequestBody");
 const resolveScope = forwardServer("resolveScope");
 const waitForAuthReady = forwardServer("waitForAuthReady");
-const callConversationMemoryCost = forwardServer("callConversationMemoryCost");
 const callConversationFork = forwardServer("callConversationFork");
 const callConversationForkAndRun = forwardServer("callConversationForkAndRun");
 const callBatchDeleteMessages = forwardServer("callBatchDeleteMessages");
@@ -23,7 +22,6 @@ export {
   callConversationDelete,
   callConversationFork,
   callConversationForkAndRun,
-  callConversationMemoryCost,
   callConversationSandboxBind,
   callConversationSandboxUnbind,
   callConversationUpdate,

package/dist/host/server/matrx-transport.d.ts

@@ -17,5 +17,4 @@ export declare const createMatrxTransportFromTarget: (getState: () => unknown, r
     source?: string;
     expectedErrorStatuses?: readonly number[];
 }) => import("@ai-matrx/agents").MatrxTransport;
-export declare const cancelAgentRunRequest: (requestId: string, mode?: "cancel" | "interrupt", seenSeq?: number) => import("../defaults/server-api.js").DefaultServerThunk<Promise<import("../defaults/server-api.js").DefaultApiCallResult<import("@ai-matrx/agents").MatrxCancelResponse>>>;
 export type MatrxTransportOptions = ChatServerTypes["MatrxTransportOptions"];

package/dist/host/server/matrx-transport.js

@@ -1,9 +1,7 @@
 import { forwardServer } from "../server.js";
 const createMatrxTransport = forwardServer("createMatrxTransport");
 const createMatrxTransportFromTarget = forwardServer("createMatrxTransportFromTarget");
-const cancelAgentRunRequest = forwardServer("cancelAgentRunRequest");
 export {
-  cancelAgentRunRequest,
   createMatrxTransport,
   createMatrxTransportFromTarget
 };

package/dist/store/root-state.d.ts

@@ -4,32 +4,15 @@ import type { ChatState } from "./state.js";
 export interface ChatStoreRegister {
 }
 /**
- * Slices the HOST owns that package code reads when present (§2.3). A private store has none of
+ * Slices the HOST owns that package code reads when present (§2.3). Identity, the active
+ * organization and the profile are NEVER read from host slices: they come from the package's own
+ * `chatHost` slice (the host's identity and org ports) — guard
+ * `store/__tests__/no-host-identity-slice-reads.test.ts`. A private store has none of
  * them, so every read is optional; a registered host store supplies the real shapes. Only the
  * fields the package reads are named, with no index signatures, so a host's concrete slice
  * interfaces (which carry extra fields) stay assignable.
  */
 export interface ChatHostReadSlices {
-    userAuth?: {
-        id: string | null;
-        email?: string | null;
-        isAnonymous?: boolean;
-        accessToken?: string | null;
-        isAdmin?: boolean;
-        adminLaneOpen?: boolean;
-        adminLevel?: string | null;
-    };
-    appContext?: {
-        organization_id?: string | null;
-    };
-    userProfile?: {
-        fingerprintId?: string | null;
-        userMetadata?: {
-            fullName?: string | null;
-            name?: string | null;
-            preferredUsername?: string | null;
-        } | null;
-    };
     cloudFiles?: {
         filesById: Record<string, {
             fileName?: string | null;

package/dist/surfaces/hooks/useSurfaceConfig.js

@@ -12,6 +12,7 @@ import {
   addRosterItem
 } from "../services/surface-config.service.js";
 import { getNamespaceHandler } from "../config/namespace-registry.js";
+import { selectUserId } from "../../host/identity.js";
 function useSurfaceConfig(surfaceName) {
   const dispatch = useAppDispatch();
   const entry = useAppSelector((s) => selectSurfaceConfigEntry(s, surfaceName));
@@ -42,7 +43,7 @@ function useSurfaceConfig(surfaceName) {
 }
 function useSurfaceAgentRoles(surfaceName) {
   const { status, roles, refresh } = useSurfaceConfig(surfaceName);
-  const userId = useAppSelector((s) => s.userAuth?.id ?? null);
+  const userId = useAppSelector(selectUserId);
   const buildView = useCallback(
     (resolved) => {
       const first = resolved.effective[0] ?? null;

package/dist/surfaces/runtime/surface-feedback.js

@@ -6,6 +6,7 @@ import {
   SURFACE_FEEDBACK_MESSAGE_MAX,
   SURFACE_FEEDBACK_MESSAGE_MIN
 } from "../manifests/_baseline.manifest.js";
+import { selectOrganizationId } from "../../host/org.js";
 const SURFACE_FEEDBACK_TARGET_NAME = PLATFORM_WRITE_TARGETS.surface_feedback.name;
 const KIND_LIST = SURFACE_FEEDBACK_KINDS.join(" | ");
 const SURFACE_FEEDBACK_TARGET = PLATFORM_WRITE_TARGETS.surface_feedback;
@@ -72,8 +73,7 @@ ${message}`,
   };
 }
 function readActiveOrganizationId() {
-  const state = getStoreSingleton()?.getState();
-  return state?.appContext?.organization_id ?? null;
+  return selectOrganizationId(getStoreSingleton()?.getState());
 }
 async function saveSurfaceFeedback(value, ctx) {
   const result = await getChatHost().feedback.submit(

package/dist/tool-call-visualization/components/ArtifactResultBar.js

@@ -92,7 +92,7 @@ function ArtifactResultBar({
           }
         },
         className: cn(
-          "group/bar flex w-full cursor-pointer items-center gap-3 border border-border/50 bg-card px-4 py-2.5 text-left transition-colors hover:bg-accent/30",
+          "group/bar flex w-full cursor-pointer items-center gap-3 border border-border/50 bg-[var(--mx-chat-card,hsl(var(--card)))] px-4 py-2.5 text-left transition-colors hover:bg-accent/30",
           // Collapsed: a full pill. Expanded: the letterhead of the attached
           // document — square bottom, no bottom border, the body continues it.
           peekExpanded ? "rounded-t-xl border-b-0" : "rounded-xl"
@@ -106,8 +106,8 @@ function ArtifactResultBar({
             }
           ),
           /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ jsx("span", { className: "block truncate text-sm font-medium text-foreground", children: title }),
-            /* @__PURE__ */ jsxs("span", { className: "block truncate text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx("span", { className: "block truncate text-sm font-medium text-[color:var(--mx-chat-text,hsl(var(--foreground)))]", children: title }),
+            /* @__PURE__ */ jsxs("span", { className: "block truncate text-xs text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: [
               meta.noun,
               " \xB7 ",
               artifact.verbPast
@@ -121,7 +121,7 @@ function ArtifactResultBar({
                 tabIndex: 0,
                 onClick: (e) => e.stopPropagation(),
                 onKeyDown: (e) => e.stopPropagation(),
-                className: "flex shrink-0 cursor-pointer items-center gap-1.5 rounded-xl border border-border/70 bg-background/60 px-2.5 py-1.5 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent/40 hover:text-foreground",
+                className: "flex shrink-0 cursor-pointer items-center gap-1.5 rounded-xl border border-border/70 bg-background/60 px-2.5 py-1.5 text-xs font-medium text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))] transition-colors hover:bg-accent/40 hover:text-[color:var(--mx-chat-text,hsl(var(--foreground)))]",
                 "aria-label": "Open options",
                 children: [
                   /* @__PURE__ */ jsx(PanelRightOpen, { className: "size-3.5" }),

package/dist/tool-call-visualization/components/ChatResultColumn.d.ts

@@ -6,7 +6,7 @@ import React from "react";
  * In the real conversation, a tool card sits inside `AgentConversationColumn`'s
  * centered content (`w-full max-w-3xl mx-auto px-2`) directly on the plain
  * conversation surface — NO surrounding card, border, padding, or background
- * change. Tools that look fine inside a decorative `bg-card` demo panel can
+ * change. Tools that look fine inside a decorative `bg-[var(--mx-chat-card,hsl(var(--card)))]` demo panel can
  * render badly in chat (stray borders, odd bg shifts). Previewing in anything
  * but this column lies about how the tool actually renders, so every gallery /
  * "in action" preview must wrap its `ToolCallVisualization` in this.

package/dist/tool-call-visualization/components/ToolCallBatch.js

@@ -131,8 +131,8 @@ const ToolCallBatch = ({
               text: `Running ${count} tools\u2026`,
               className: "truncate font-sans text-sm leading-relaxed tracking-wide"
             }
-          ) : /* @__PURE__ */ jsx("span", { className: "truncate font-sans text-sm leading-relaxed tracking-wide text-muted-foreground", children: label }),
-          isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" })
+          ) : /* @__PURE__ */ jsx("span", { className: "truncate font-sans text-sm leading-relaxed tracking-wide text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: label }),
+          isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-3.5 w-3.5 shrink-0 text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5 shrink-0 text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]" })
         ]
       }
     ),

package/dist/tool-call-visualization/components/ToolCallVisualization.js

@@ -282,7 +282,7 @@ const ToolCallVisualizationInner = ({
                 ) : /* @__PURE__ */ jsx(
                   "span",
                   {
-                    className: "truncate font-sans text-sm leading-relaxed tracking-wide text-muted-foreground",
+                    className: "truncate font-sans text-sm leading-relaxed tracking-wide text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]",
                     title: guardRouting?.tooltip,
                     children: phaseLabel
                   }
@@ -298,7 +298,7 @@ const ToolCallVisualizationInner = ({
                   querySubtitle
                 ] }))
               ] }),
-              isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
+              isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "h-3.5 w-3.5 shrink-0 text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5 shrink-0 text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]" }),
               /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity focus-within:opacity-100 group-hover/toolcard:opacity-100", children: [
                 /* @__PURE__ */ jsx(
                   "span",
@@ -316,7 +316,7 @@ const ToolCallVisualizationInner = ({
                         handleOpenWindowPanel();
                       }
                     },
-                    className: "cursor-pointer rounded p-0.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
+                    className: "cursor-pointer rounded p-0.5 text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))] transition-colors hover:bg-[var(--mx-chat-fill,hsl(var(--muted)))] hover:text-[color:var(--mx-chat-text,hsl(var(--foreground)))]",
                     title: "Open in floating window",
                     children: /* @__PURE__ */ jsx(PanelRightOpen, { className: "h-3 w-3" })
                   }
@@ -339,7 +339,7 @@ const ToolCallVisualizationInner = ({
                         setIsOverlayOpen(true);
                       }
                     },
-                    className: "cursor-pointer rounded p-0.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
+                    className: "cursor-pointer rounded p-0.5 text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))] transition-colors hover:bg-[var(--mx-chat-fill,hsl(var(--muted)))] hover:text-[color:var(--mx-chat-text,hsl(var(--foreground)))]",
                     title: "Open fullscreen overlay",
                     children: /* @__PURE__ */ jsx(Maximize2, { className: "h-3 w-3" })
                   }
@@ -372,7 +372,7 @@ const ToolCallVisualizationInner = ({
                   const entryParked = parkedOnPersonOf(entry, suspendedCallIds);
                   const InlineRenderer = isErrored || entryWait || entryParked ? null : getInlineRenderer(entry.toolName);
                   return /* @__PURE__ */ jsxs("div", { children: [
-                    entries.length > 1 && /* @__PURE__ */ jsx("div", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-muted-foreground", children: groupDisplayName }),
+                    entries.length > 1 && /* @__PURE__ */ jsx("div", { className: "mb-1 text-[10px] font-semibold uppercase tracking-wide text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: groupDisplayName }),
                     entryParked ? /* @__PURE__ */ jsx(
                       ParkedOnPersonCard,
                       {

package/dist/tool-call-visualization/components/ToolTabBodies.js

@@ -34,8 +34,8 @@ const InputView = ({
   const args = entry.arguments ?? {};
   const argCount = Object.keys(args).length;
   return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center justify-between border-b border-border bg-muted/30 px-3 py-1.5", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center justify-between border-b border-[color:var(--mx-chat-border,hsl(var(--border)))] bg-muted/30 px-3 py-1.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: [
         /* @__PURE__ */ jsx(Settings2, { className: "h-3.5 w-3.5" }),
         /* @__PURE__ */ jsx("span", { children: "Tool input" }),
         /* @__PURE__ */ jsxs(Badge, { variant: "outline", className: "px-1.5 py-0 text-[10px]", children: [
@@ -102,9 +102,9 @@ const ErrorView = ({
   const hasArgs = Object.keys(args).length > 0;
   const bundle = buildToolEntryBundle(entry);
   return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center justify-between border-b border-border bg-muted/30 px-3 py-1.5", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
-        routed ? /* @__PURE__ */ jsx(Route, { className: "h-3.5 w-3.5 text-muted-foreground" }) : /* @__PURE__ */ jsx(CircleAlert, { className: "h-3.5 w-3.5 text-destructive" }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center justify-between border-b border-[color:var(--mx-chat-border,hsl(var(--border)))] bg-muted/30 px-3 py-1.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: [
+        routed ? /* @__PURE__ */ jsx(Route, { className: "h-3.5 w-3.5 text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]" }) : /* @__PURE__ */ jsx(CircleAlert, { className: "h-3.5 w-3.5 text-destructive" }),
         /* @__PURE__ */ jsx("span", { children: routed ? "Routed" : "Error" }),
         entry.errorType && /* @__PURE__ */ jsxs(
           Badge,
@@ -134,11 +134,11 @@ const ErrorView = ({
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4 overflow-auto px-3 py-3", children: [
       /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-foreground", children: label }),
-        message ? /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap break-words text-sm leading-relaxed text-muted-foreground", children: message }) : /* @__PURE__ */ jsx("p", { className: "text-sm italic text-muted-foreground", children: "No error message was recorded. Check the Raw tab for events." })
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[color:var(--mx-chat-text,hsl(var(--foreground)))]", children: label }),
+        message ? /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap break-words text-sm leading-relaxed text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: message }) : /* @__PURE__ */ jsx("p", { className: "text-sm italic text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: "No error message was recorded. Check the Raw tab for events." })
       ] }),
-      hasArgs && /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 border-t border-border pt-3", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: "Input that failed" }),
+      hasArgs && /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 border-t border-[color:var(--mx-chat-border,hsl(var(--border)))] pt-3", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: "Input that failed" }),
         /* @__PURE__ */ jsx(KeyValueGrid, { value: args, density: "full" })
       ] })
     ] })
@@ -149,8 +149,8 @@ const RawDataView = ({
 }) => {
   const bundle = buildToolEntryBundle(entry);
   return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center justify-between border-b border-border bg-muted/30 px-3 py-1.5", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center justify-between border-b border-[color:var(--mx-chat-border,hsl(var(--border)))] bg-muted/30 px-3 py-1.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: [
         /* @__PURE__ */ jsx(FileCode2, { className: "h-3.5 w-3.5" }),
         /* @__PURE__ */ jsx("span", { children: "All" }),
         /* @__PURE__ */ jsxs(Badge, { variant: "outline", className: "px-1.5 py-0 text-[10px]", children: [
@@ -172,7 +172,7 @@ const RawDataView = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-hidden p-2", children: /* @__PURE__ */ jsx("div", { className: "h-full min-h-[280px] overflow-hidden rounded-md border border-border bg-card", children: /* @__PURE__ */ jsx(JsonInspector, { showSource: true, data: bundle }) }) })
+    /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-hidden p-2", children: /* @__PURE__ */ jsx("div", { className: "h-full min-h-[280px] overflow-hidden rounded-md border border-[color:var(--mx-chat-border,hsl(var(--border)))] bg-[var(--mx-chat-card,hsl(var(--card)))]", children: /* @__PURE__ */ jsx(JsonInspector, { showSource: true, data: bundle }) }) })
   ] });
 };
 const EntryResultsBody = ({ entry, conversationId: conversationIdProp }) => {

package/dist/tool-call-visualization/components/ToolUpdatesOverlay.js

@@ -19,8 +19,8 @@ import {
 import { Button } from "@ai-matrx/design-system/controls";
 const EntrySelector = ({ entries, selectedCallId, onSelect }) => {
   if (entries.length <= 1) return null;
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center gap-1.5 overflow-x-auto border-b border-border bg-muted/40 px-3 py-1.5 scrollbar-none", children: [
-    /* @__PURE__ */ jsx("span", { className: "mr-1 flex-shrink-0 text-xs text-muted-foreground", children: "Tool" }),
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-shrink-0 items-center gap-1.5 overflow-x-auto border-b border-[color:var(--mx-chat-border,hsl(var(--border)))] bg-muted/40 px-3 py-1.5 scrollbar-none", children: [
+    /* @__PURE__ */ jsx("span", { className: "mr-1 flex-shrink-0 text-xs text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: "Tool" }),
     entries.map((entry, idx) => {
       const label = getToolDisplayName(entry.toolName);
       const isActive = entry.callId === selectedCallId;
@@ -72,7 +72,7 @@ const InputTabContent = ({ entries, selectedCallId, onSelect }) => {
         onSelect
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden", children: entry ? /* @__PURE__ */ jsx(InputView, { entry }) : /* @__PURE__ */ jsx("div", { className: "p-8 text-center text-muted-foreground", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: "No tool data available" }) }) })
+    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden", children: entry ? /* @__PURE__ */ jsx(InputView, { entry }) : /* @__PURE__ */ jsx("div", { className: "p-8 text-center text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: "No tool data available" }) }) })
   ] });
 };
 const RawTabContent = ({ entries, selectedCallId, onSelect }) => {
@@ -86,7 +86,7 @@ const RawTabContent = ({ entries, selectedCallId, onSelect }) => {
         onSelect
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden", children: entry ? /* @__PURE__ */ jsx(RawDataView, { entry }) : /* @__PURE__ */ jsx("div", { className: "p-8 text-center text-muted-foreground", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: "No tool data available" }) }) })
+    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden", children: entry ? /* @__PURE__ */ jsx(RawDataView, { entry }) : /* @__PURE__ */ jsx("div", { className: "p-8 text-center text-[color:var(--mx-chat-text-secondary,hsl(var(--muted-foreground)))]", children: /* @__PURE__ */ jsx("p", { className: "text-sm", children: "No tool data available" }) }) })
   ] });
 };
 const ToolUpdatesOverlay = ({