@genesislcap/ai-assistant 14.421.1 → 14.422.0

package/dist/esm/main/main.template.js

@@ -1,3 +1,19 @@
+/**
+ * Whitespace in FAST templates
+ * ────────────────────────────
+ * The formatter adds newlines/indentation to static template string parts,
+ * which FAST renders as real text nodes. With `white-space: pre-wrap` these
+ * are visible as blank lines. To avoid this:
+ *
+ * - Apply `white-space: pre-wrap` only on leaf elements whose *content* needs
+ *   it, never on containers.
+ * - Inside pre-wrap elements keep content on the same line as the opening tag:
+ *   GOOD `<div>${expr}</div>` / BAD `<div>\n  ${expr}\n</div>`
+ * - Extract shared or deeply-nested templates as named module-level consts to
+ *   keep indentation shallow.
+ * - Chain adjacent `when()` calls as `${when(a,tA)}${when(b,tB)}` — separate
+ *   lines let the formatter inject whitespace between them.
+ */
 import { isChatToolCallUnknown } from '@genesislcap/foundation-ai';
 import { html, ref, repeat, when } from '@genesislcap/web-core';
 import { ANIMATION_DEFS } from './main.types';
@@ -63,6 +79,41 @@ const senderLabel = {
     interaction: 'Assistant',
     ai: 'Assistant',
 };
+// ─── Sub-agent trace fragments ────────────────────────────────────────────────
+const subAgentAssistantTemplate = html `
+  <div class="sub-agent-message sub-agent-assistant">${(m) => m.content}</div>
+`;
+const subAgentToolCallTemplate = html `
+  <div class="sub-agent-message sub-agent-tool-call">
+    ${repeat((m) => m.toolCalls, html `
+        <span class="sub-agent-tool-name">${(tc) => tc.name}</span>
+      `)}
+  </div>
+`;
+const subAgentToolResultTemplate = html `
+  <div class="sub-agent-message sub-agent-tool-result">${(m) => m.toolResult.content}</div>
+`;
+/** Renders one row of a sub-agent trace (assistant text, tool call, or tool result). */
+const subAgentMessageRowTemplate = html `
+  ${when((m) => { var _a; return m.role === 'assistant' && !((_a = m.toolCalls) === null || _a === void 0 ? void 0 : _a.length) && !!m.content; }, subAgentAssistantTemplate)}${when((m) => { var _a; return !!((_a = m.toolCalls) === null || _a === void 0 ? void 0 : _a.length); }, subAgentToolCallTemplate)}${when((m) => { var _a; return m.role === 'tool' && !!((_a = m.toolResult) === null || _a === void 0 ? void 0 : _a.content); }, subAgentToolResultTemplate)}
+`;
+/** Collapsed <details> trace shown inside a tool-call card once the sub-agent finishes. */
+const subAgentTraceTemplate = html `
+  <details class="sub-agent-trace">
+    <summary class="sub-agent-trace-summary">
+      ${(tc) => { var _a, _b; return (_b = (_a = tc.subAgentTrace[0]) === null || _a === void 0 ? void 0 : _a.agentName) !== null && _b !== void 0 ? _b : 'Sub-agent'; }} trace
+    </summary>
+    ${repeat((tc) => tc.subAgentTrace.filter((m) => m.role !== 'user'), subAgentMessageRowTemplate)}
+  </details>
+`;
+/** Live streaming trace panel shown while a sub-agent is actively running. */
+const liveSubAgentTraceTemplate = html `
+  <div class="live-sub-agent-trace" part="live-sub-agent-trace">
+    <span class="live-sub-agent-name">${(x) => { var _a; return (_a = x.liveSubAgentName) !== null && _a !== void 0 ? _a : 'Sub-agent'; }}</span>
+    ${repeat((x) => x.liveSubAgentTrace.filter((m) => m.role !== 'user'), subAgentMessageRowTemplate)}
+  </div>
+`;
+// ─── Public factory ───────────────────────────────────────────────────────────
 /** @internal */
 export const FoundationAiAssistantTemplate = (designSystemPrefix) => {
     const buttonTag = `${designSystemPrefix}-button`;
@@ -71,6 +122,75 @@ export const FoundationAiAssistantTemplate = (designSystemPrefix) => {
     const textareaTag = `${designSystemPrefix}-text-area`;
     const iconTag = `${designSystemPrefix}-icon`;
     const progressTag = `${designSystemPrefix}-progress`;
+    // ── Tool call item ──────────────────────────────────────────────────────────
+    const toolCallItemTemplate = html `
+    ${when((tc) => tc.foldEvent === 'open', html `
+        <pre class="payload fold-event fold-open">&#9658; ${(tc) => tc.name}</pre>
+      `)}
+    ${when((tc) => tc.foldEvent === 'close', html `
+        <pre class="payload fold-event fold-close">&#9668; ${(tc) => tc.name}</pre>
+      `)}
+    ${when((tc) => !tc.foldEvent && !isChatToolCallUnknown(tc), html `
+        <pre class="payload">
+${(tc) => { var _a; return (((_a = tc.foldPath) === null || _a === void 0 ? void 0 : _a.length) ? `${tc.foldPath.join(' › ')} › ` : ''); }}<strong>${(tc) => tc.name}</strong>(${(tc) => JSON.stringify(tc.args, null, 2)})</pre
+        >
+      `)}
+    ${when(isChatToolCallUnknown, html `
+        <pre class="payload unknown-tool">${(tc) => unknownToolPayload(tc)}</pre>
+      `)}
+    ${when((tc) => { var _a; return !!((_a = tc.subAgentTrace) === null || _a === void 0 ? void 0 : _a.length); }, subAgentTraceTemplate)}
+  `;
+    // ── Message row ─────────────────────────────────────────────────────────────
+    const messageRowTemplate = html `
+    ${when((m) => m.role === 'system-event', html `
+        <div class="agent-switch-indicator" part="agent-switch-indicator">
+          <span class="agent-switch-label">${(m) => m.content}</span>
+        </div>
+      `)}
+    ${when((m) => m.role !== 'system-event', html `
+        <div class="message-row ${(m) => messageType(m)}">
+          ${when((m) => m.role !== 'user', html `
+              <div class="avatar ${(m) => messageType(m)}">
+                ${when((m, c) => !!c.parent.imageSrc, html `
+                    <img
+                      src="${(m, c) => c.parent.imageSrc}"
+                      alt="Assistant"
+                      class="avatar-img"
+                    />
+                  `)}
+                ${when((m, c) => !c.parent.imageSrc, genesisIconTemplate)}
+              </div>
+            `)}
+          <div class="message ${(m) => messageType(m)}">
+            <div class="sender">
+              ${(m, c) => messageType(m) === 'ai-function' &&
+        m.agentName &&
+        c.parent.showAgentSwitchIndicator
+        ? `Tool Call · ${m.agentName}`
+        : senderLabel[messageType(m)]}
+            </div>
+            <div class="content">
+              ${when((m) => m.content, html `
+                  <ai-chat-markdown :content="${(m) => m.content}"></ai-chat-markdown>
+                `)}
+              ${when((m) => m.toolCalls, html `
+                  ${repeat((m) => { var _a; return (_a = m.toolCalls) !== null && _a !== void 0 ? _a : []; }, toolCallItemTemplate)}
+                `)}
+              ${when((m) => m.interaction, html `
+                  <ai-chat-interaction-wrapper
+                    :componentName=${(m) => m.interaction.componentName}
+                    :data=${(m) => m.interaction.data}
+                    :interactionId=${(m) => m.interaction.interactionId}
+                    :resolved=${(m) => m.interaction.resolved}
+                    @interaction-completed=${(m, c) => c.parent.handleInteractionCompleted(c.event)}
+                  ></ai-chat-interaction-wrapper>
+                `)}
+            </div>
+          </div>
+        </div>
+      `)}
+  `;
+    // ── Root template ───────────────────────────────────────────────────────────
     return html `
     <div class="chat-wrapper" part="chat-wrapper">
       ${when((x) => { var _a; return !!((_a = x.chatConfig.ui) === null || _a === void 0 ? void 0 : _a.acceptedFiles); }, html `
@@ -204,77 +324,8 @@ export const FoundationAiAssistantTemplate = (designSystemPrefix) => {
       </div>
 
       <div class="messages" part="messages" ${ref('messagesEl')}>
-
-        ${repeat((x) => x.visibleMessages, html `
-            ${when((m) => m.role === 'system-event', html `
-                <div class="agent-switch-indicator" part="agent-switch-indicator">
-                  <span class="agent-switch-label">${(m) => m.content}</span>
-                </div>
-              `)}
-            ${when((m) => m.role !== 'system-event', html `
-                <div class="message-row ${(m) => messageType(m)}">
-                  ${when((m) => m.role !== 'user', html `
-                      <div class="avatar ${(m) => messageType(m)}">
-                        ${when((m, c) => !!c.parent.imageSrc, html `
-                            <img
-                              src="${(m, c) => c.parent.imageSrc}"
-                              alt="Assistant"
-                              class="avatar-img"
-                            />
-                          `)}
-                        ${when((m, c) => !c.parent.imageSrc, genesisIconTemplate)}
-                      </div>
-                    `)}
-                  <div class="message ${(m) => messageType(m)}">
-                    <div class="sender">
-                      ${(m, c) => messageType(m) === 'ai-function' &&
-        m.agentName &&
-        c.parent.showAgentSwitchIndicator
-        ? `Tool Call · ${m.agentName}`
-        : senderLabel[messageType(m)]}
-                    </div>
-                    <div class="content">
-                      ${when((m) => m.content, html `
-                          <ai-chat-markdown :content="${(m) => m.content}"></ai-chat-markdown>
-                        `)}
-                      ${when((m) => m.toolCalls, html `
-                          ${repeat((m) => { var _a; return (_a = m.toolCalls) !== null && _a !== void 0 ? _a : []; }, html `
-                              ${when((tc) => tc.foldEvent === 'open', html `
-                                  <pre class="payload fold-event fold-open">
-&#9658; ${(tc) => tc.name}</pre
-                                  >
-                                `)}
-                              ${when((tc) => tc.foldEvent === 'close', html `
-                                  <pre class="payload fold-event fold-close">
-&#9668; ${(tc) => tc.name}</pre
-                                  >
-                                `)}
-                              ${when((tc) => !tc.foldEvent && !isChatToolCallUnknown(tc), html `
-                                  <pre class="payload">
-${(tc) => { var _a; return (((_a = tc.foldPath) === null || _a === void 0 ? void 0 : _a.length) ? `${tc.foldPath.join(' › ')} › ` : ''); }}<strong>${(tc) => tc.name}</strong>(${(tc) => JSON.stringify(tc.args, null, 2)})</pre
-                                  >
-                                `)}
-                              ${when(isChatToolCallUnknown, html `
-                                  <pre class="payload unknown-tool">
-${(tc) => unknownToolPayload(tc)}</pre
-                                  >
-                                `)}
-                            `)}
-                        `)}
-                      ${when((m) => m.interaction, html `
-                          <ai-chat-interaction-wrapper
-                            :componentName=${(m) => m.interaction.componentName}
-                            :data=${(m) => m.interaction.data}
-                            :interactionId=${(m) => m.interaction.interactionId}
-                            :resolved=${(m) => m.interaction.resolved}
-                            @interaction-completed=${(m, c) => c.parent.handleInteractionCompleted(c.event)}
-                          ></ai-chat-interaction-wrapper>
-                        `)}
-                    </div>
-                  </div>
-                </div>
-              `)}
-          `)}
+        ${repeat((x) => x.visibleMessages, messageRowTemplate)}
+        ${when((x) => x.liveSubAgentTrace.length > 0 && x.showToolCalls, liveSubAgentTraceTemplate)}
         ${when((x) => {
         var _a;
         return x.showLoadingIndicator &&

package/dist/esm/state/ai-assistant-slice.js

@@ -11,6 +11,8 @@ export const defaultSessionState = {
     contextLimit: undefined,
     activeAgent: undefined,
     inputValue: '',
+    liveSubAgentTrace: [],
+    liveSubAgentName: null,
 };
 export const aiAssistantSlice = createSlice({
     name: 'aiAssistant',
@@ -49,6 +51,12 @@ export const aiAssistantSlice = createSlice({
         setInputValue(state, action) {
             state.inputValue = action.payload;
         },
+        setLiveSubAgentTrace(state, action) {
+            state.liveSubAgentTrace = action.payload;
+        },
+        setLiveSubAgentName(state, action) {
+            state.liveSubAgentName = action.payload;
+        },
     },
     selectors: {},
 });

package/dist/esm/utils/history-transform.js

@@ -0,0 +1,35 @@
+/**
+ * Masks the tool-specific payload of a single message — clears tool call args
+ * and replaces tool result content with a placeholder. Used when passing history
+ * to an agent that should not see another agent's implementation detail.
+ */
+function maskToolPayload(msg) {
+    var _a;
+    if ((_a = msg.toolCalls) === null || _a === void 0 ? void 0 : _a.length) {
+        return Object.assign(Object.assign({}, msg), { toolCalls: msg.toolCalls.map((tc) => (Object.assign(Object.assign({}, tc), { args: {} }))) });
+    }
+    if (msg.toolResult) {
+        return Object.assign(Object.assign({}, msg), { toolResult: Object.assign(Object.assign({}, msg.toolResult), { content: "[other agent's tool result omitted]" }) });
+    }
+    return msg;
+}
+/**
+ * Prepares history for the LLM only: masks tool call args and results from other
+ * agents so the active specialist is not confused by tools it does not have.
+ * Canonical history in `ChatDriver` stays unmasked for UI and logging.
+ */
+export function transformHistoryForAgent(history, agentName) {
+    return history.map((msg) => {
+        if (!msg.agentName || msg.agentName === agentName)
+            return msg;
+        return maskToolPayload(msg);
+    });
+}
+/**
+ * Applies a history cap for sub-agent context: the last `cap` messages are passed
+ * verbatim; older messages have their tool payloads masked.
+ */
+export function applyHistoryCap(history, cap) {
+    const cutoff = history.length - cap;
+    return history.map((msg, i) => (i < cutoff ? maskToolPayload(msg) : msg));
+}

package/dist/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["../src/index.ts","../src/channel/ai-activity-bus.ts","../src/channel/ai-activity-channel.ts","../src/components/halo-overlay.ts","../src/components/activity-halo/activity-halo.ts","../src/components/ai-driver/ai-driver.ts","../src/components/ai-driver/index.ts","../src/components/chat-bubble/chat-bubble.styles.ts","../src/components/chat-bubble/chat-bubble.template.ts","../src/components/chat-bubble/chat-bubble.ts","../src/components/chat-bubble/index.ts","../src/components/chat-driver/chat-driver.ts","../src/components/chat-driver/index.ts","../src/components/chat-interaction-wrapper/chat-interaction-wrapper.styles.ts","../src/components/chat-interaction-wrapper/chat-interaction-wrapper.template.ts","../src/components/chat-interaction-wrapper/chat-interaction-wrapper.ts","../src/components/chat-interaction-wrapper/index.ts","../src/components/chat-markdown/chat-markdown.ts","../src/components/chat-markdown/index.ts","../src/components/orchestrating-driver/index.ts","../src/components/orchestrating-driver/orchestrating-driver.ts","../src/components/popout-manager/index.ts","../src/components/popout-manager/popout-manager.ts","../src/config/config.ts","../src/config/fallback-agents.ts","../src/config/index.ts","../src/main/index.ts","../src/main/main.styles.ts","../src/main/main.template.ts","../src/main/main.ts","../src/main/main.types.ts","../src/state/ai-assistant-slice.ts","../src/state/driver-registry.ts","../src/state/session-store.ts","../src/styles/ai-colours.ts","../src/styles/index.ts","../src/styles/styles.ts","../src/suggestions/chat-suggestions.ts","../src/tags/index.ts","../src/types/ai-chat-widget.ts","../src/utils/index.ts","../src/utils/logger.ts","../src/utils/tool-fold.ts"],"version":"5.9.2"}
+{"root":["../src/index.ts","../src/channel/ai-activity-bus.ts","../src/channel/ai-activity-channel.ts","../src/components/halo-overlay.ts","../src/components/activity-halo/activity-halo.ts","../src/components/ai-driver/ai-driver.ts","../src/components/ai-driver/index.ts","../src/components/chat-bubble/chat-bubble.styles.ts","../src/components/chat-bubble/chat-bubble.template.ts","../src/components/chat-bubble/chat-bubble.ts","../src/components/chat-bubble/index.ts","../src/components/chat-driver/chat-driver.ts","../src/components/chat-driver/index.ts","../src/components/chat-interaction-wrapper/chat-interaction-wrapper.styles.ts","../src/components/chat-interaction-wrapper/chat-interaction-wrapper.template.ts","../src/components/chat-interaction-wrapper/chat-interaction-wrapper.ts","../src/components/chat-interaction-wrapper/index.ts","../src/components/chat-markdown/chat-markdown.ts","../src/components/chat-markdown/index.ts","../src/components/orchestrating-driver/index.ts","../src/components/orchestrating-driver/orchestrating-driver.ts","../src/components/popout-manager/index.ts","../src/components/popout-manager/popout-manager.ts","../src/config/config.ts","../src/config/fallback-agents.ts","../src/config/index.ts","../src/main/index.ts","../src/main/main.styles.ts","../src/main/main.template.ts","../src/main/main.ts","../src/main/main.types.ts","../src/state/ai-assistant-slice.ts","../src/state/driver-registry.ts","../src/state/session-store.ts","../src/styles/ai-colours.ts","../src/styles/index.ts","../src/styles/styles.ts","../src/suggestions/chat-suggestions.ts","../src/tags/index.ts","../src/types/ai-chat-widget.ts","../src/utils/history-transform.ts","../src/utils/index.ts","../src/utils/logger.ts","../src/utils/tool-fold.ts"],"version":"5.9.2"}