@gram-ai/elements 1.27.4 → 1.27.5

package/src/lib/errorTracking.ts

@@ -1,19 +1,19 @@
-import { datadogRum } from '@datadog/browser-rum'
-import { DATADOG_CONFIG } from './errorTracking.config'
+import { datadogRum } from "@datadog/browser-rum";
+import { DATADOG_CONFIG } from "./errorTracking.config";
 
-let initialized = false
-let enabled = true
+let initialized = false;
+let enabled = true;
 
 export interface ErrorTrackingConfig {
-  enabled?: boolean
-  projectSlug?: string
-  variant?: string
+  enabled?: boolean;
+  projectSlug?: string;
+  variant?: string;
 }
 
 export interface ErrorContext {
-  source: 'error-boundary' | 'streaming' | 'stream-creation' | 'custom'
-  componentStack?: string
-  [key: string]: unknown
+  source: "error-boundary" | "streaming" | "stream-creation" | "custom";
+  componentStack?: string;
+  [key: string]: unknown;
 }
 
 /**
@@ -23,19 +23,19 @@ export interface ErrorContext {
 export function initErrorTracking(config: ErrorTrackingConfig = {}): void {
   // Check if explicitly disabled
   if (config.enabled === false) {
-    enabled = false
-    return
+    enabled = false;
+    return;
   }
 
   // Prevent double initialization
   if (initialized) {
-    return
+    return;
   }
 
   // Skip if credentials not configured (e.g., local dev without env vars)
   if (!DATADOG_CONFIG.applicationId || !DATADOG_CONFIG.clientToken) {
-    enabled = false
-    return
+    enabled = false;
+    return;
   }
 
   try {
@@ -44,7 +44,7 @@ export function initErrorTracking(config: ErrorTrackingConfig = {}): void {
       clientToken: DATADOG_CONFIG.clientToken,
       site: DATADOG_CONFIG.site,
       service: DATADOG_CONFIG.service,
-      env: process.env.NODE_ENV || 'production',
+      env: process.env.NODE_ENV || "production",
       sessionSampleRate: 100,
       sessionReplaySampleRate: 100,
       trackUserInteractions: true,
@@ -53,21 +53,21 @@ export function initErrorTracking(config: ErrorTrackingConfig = {}): void {
 
       // Note: we need to mask everything, not just user input, as sensitive data may be echo-ed
       // back in the LLM messages or the user messages in the chat window
-      defaultPrivacyLevel: 'mask',
-    })
+      defaultPrivacyLevel: "mask",
+    });
 
     // Set global context
     if (config.projectSlug) {
-      datadogRum.setGlobalContextProperty('projectSlug', config.projectSlug)
+      datadogRum.setGlobalContextProperty("projectSlug", config.projectSlug);
     }
     if (config.variant) {
-      datadogRum.setGlobalContextProperty('variant', config.variant)
+      datadogRum.setGlobalContextProperty("variant", config.variant);
     }
 
-    initialized = true
+    initialized = true;
   } catch (error) {
-    console.warn('[Elements] Failed to initialize Datadog RUM:', error)
-    enabled = false
+    console.warn("[Elements] Failed to initialize Datadog RUM:", error);
+    enabled = false;
   }
 }
 
@@ -77,22 +77,22 @@ export function initErrorTracking(config: ErrorTrackingConfig = {}): void {
  */
 export function trackError(
   error: Error | unknown,
-  context: ErrorContext
+  context: ErrorContext,
 ): void {
   if (!enabled || !initialized) {
-    return
+    return;
   }
 
-  const errorObj = error instanceof Error ? error : new Error(String(error))
+  const errorObj = error instanceof Error ? error : new Error(String(error));
 
   try {
     datadogRum.addError(errorObj, {
       ...context,
       timestamp: new Date().toISOString(),
-    })
+    });
   } catch (e) {
     // Silently fail - we don't want error tracking to cause more errors
-    console.warn('[Elements] Failed to track error:', e)
+    console.warn("[Elements] Failed to track error:", e);
   }
 }
 
@@ -100,5 +100,5 @@ export function trackError(
  * Check if error tracking is currently enabled.
  */
 export function isErrorTrackingEnabled(): boolean {
-  return enabled && initialized
+  return enabled && initialized;
 }

package/src/lib/generative-ui.ts

@@ -1,8 +1,8 @@
 // Type for json-render tree structure
 export interface JsonRenderNode {
-  type: string
-  props?: Record<string, unknown>
-  children?: JsonRenderNode[]
+  type: string;
+  props?: Record<string, unknown>;
+  children?: JsonRenderNode[];
 }
 
 /**
@@ -10,9 +10,9 @@ export interface JsonRenderNode {
  */
 export function isJsonRenderTree(content: unknown): content is JsonRenderNode {
   return (
-    typeof content === 'object' &&
+    typeof content === "object" &&
     content !== null &&
-    'type' in content &&
-    typeof (content as JsonRenderNode).type === 'string'
-  )
+    "type" in content &&
+    typeof (content as JsonRenderNode).type === "string"
+  );
 }

package/src/lib/humanize.ts

@@ -5,10 +5,10 @@
 // - title case the string
 export function humanizeToolName(toolName: string): string {
   return toolName
-    .replace(/[-_]/g, ' ') // Replace hyphens and underscores with spaces
+    .replace(/[-_]/g, " ") // Replace hyphens and underscores with spaces
     .split(/(?=[A-Z])/) // Split on camelCase boundaries
-    .join(' ') // Join with spaces
+    .join(" ") // Join with spaces
     .split(/\s+/) // Split on any whitespace to normalize
     .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()) // Title case each word
-    .join(' ')
+    .join(" ");
 }

package/src/lib/messageConverter.test.ts

@@ -1,82 +1,85 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { describe, expect, it } from 'vitest'
+import { describe, expect, it } from "vitest";
 import {
   convertGramMessagesToExported,
   convertGramMessagesToUIMessages,
   convertGramMessagePartsToUIMessageParts,
   type GramChatMessage,
-} from './messageConverter'
+} from "./messageConverter";
 
 /**
  * Helper to create a minimal GramChatMessage for testing.
  */
 function makeMsg(
-  overrides: Partial<GramChatMessage> & { role: string }
+  overrides: Partial<GramChatMessage> & { role: string },
 ): GramChatMessage {
   return {
     id: crypto.randomUUID(),
-    model: 'test-model',
+    model: "test-model",
     created_at: new Date().toISOString(),
     ...overrides,
-  } as GramChatMessage
+  } as GramChatMessage;
 }
 
 function makeToolCallsJSON(
-  calls: { id: string; name: string; args?: string }[]
+  calls: { id: string; name: string; args?: string }[],
 ): string {
   return JSON.stringify(
     calls.map((c) => ({
       id: c.id,
-      type: 'function',
-      function: { name: c.name, arguments: c.args ?? '{}' },
-    }))
-  )
+      type: "function",
+      function: { name: c.name, arguments: c.args ?? "{}" },
+    })),
+  );
 }
 
-describe('convertGramMessagePartsToUIMessageParts', () => {
-  it('includes tool calls for a single assistant message', () => {
+describe("convertGramMessagePartsToUIMessageParts", () => {
+  it("includes tool calls for a single assistant message", () => {
     const msg = makeMsg({
-      role: 'assistant',
-      content: 'Let me search.',
-      tool_calls: makeToolCallsJSON([{ id: 'tc_1', name: 'search_deals' }]),
-    } as Partial<GramChatMessage> & { role: string })
+      role: "assistant",
+      content: "Let me search.",
+      tool_calls: makeToolCallsJSON([{ id: "tc_1", name: "search_deals" }]),
+    } as Partial<GramChatMessage> & { role: string });
 
-    const parts = convertGramMessagePartsToUIMessageParts(msg as any, new Map())
+    const parts = convertGramMessagePartsToUIMessageParts(
+      msg as any,
+      new Map(),
+    );
 
-    const toolParts = parts.filter((p) => p.type === 'dynamic-tool')
-    expect(toolParts).toHaveLength(1)
+    const toolParts = parts.filter((p) => p.type === "dynamic-tool");
+    expect(toolParts).toHaveLength(1);
     expect(toolParts[0]).toMatchObject({
-      type: 'dynamic-tool',
-      toolCallId: 'tc_1',
-      toolName: 'search_deals',
-    })
-  })
-
-  it('deduplicates tool calls when seenToolCallIds is provided', () => {
-    const seen = new Set(['tc_1'])
+      type: "dynamic-tool",
+      toolCallId: "tc_1",
+      toolName: "search_deals",
+    });
+  });
+
+  it("deduplicates tool calls when seenToolCallIds is provided", () => {
+    const seen = new Set(["tc_1"]);
     const msg = makeMsg({
-      role: 'assistant',
-      content: 'Trying again.',
+      role: "assistant",
+      content: "Trying again.",
       tool_calls: makeToolCallsJSON([
-        { id: 'tc_1', name: 'search_deals' },
-        { id: 'tc_2', name: 'search_deals' },
+        { id: "tc_1", name: "search_deals" },
+        { id: "tc_2", name: "search_deals" },
       ]),
-    } as Partial<GramChatMessage> & { role: string })
+    } as Partial<GramChatMessage> & { role: string });
 
     const parts = convertGramMessagePartsToUIMessageParts(
       msg as any,
       new Map(),
-      seen
-    )
+      seen,
+    );
 
-    const toolParts = parts.filter((p) => p.type === 'dynamic-tool')
-    expect(toolParts).toHaveLength(1)
-    expect(toolParts[0]).toMatchObject({ toolCallId: 'tc_2' })
-    expect(seen.has('tc_2')).toBe(true)
-  })
-})
+    const toolParts = parts.filter((p) => p.type === "dynamic-tool");
+    expect(toolParts).toHaveLength(1);
+    expect(toolParts[0]).toMatchObject({ toolCallId: "tc_2" });
+    expect(seen.has("tc_2")).toBe(true);
+  });
+});
 
-describe('convertGramMessagesToUIMessages - tool call deduplication', () => {
+describe("convertGramMessagesToUIMessages - tool call deduplication", () => {
   /**
    * Simulates the server behavior where each assistant message in a multi-step
    * tool use flow accumulates ALL tool calls from the turn, not just its own.
@@ -90,153 +93,153 @@ describe('convertGramMessagesToUIMessages - tool call deduplication', () => {
    * Without dedup, each message renders all its tool calls → every group shows
    * the accumulated count. With dedup, each message only renders the new ones.
    */
-  it('deduplicates accumulated tool calls across assistant messages', () => {
+  it("deduplicates accumulated tool calls across assistant messages", () => {
     const messages: GramChatMessage[] = [
       makeMsg({
-        role: 'user',
-        content: 'Search for deals',
+        role: "user",
+        content: "Search for deals",
       }),
       makeMsg({
-        role: 'assistant',
+        role: "assistant",
         content: "I'll search for deals.",
         tool_calls: makeToolCallsJSON([
-          { id: 'tc_1', name: 'hubspot_search_deals' },
+          { id: "tc_1", name: "hubspot_search_deals" },
         ]),
       } as Partial<GramChatMessage> & { role: string }),
       makeMsg({
-        role: 'tool',
+        role: "tool",
         content: '{"error": "invalid filter"}',
-        tool_call_id: 'tc_1',
+        tool_call_id: "tc_1",
       } as Partial<GramChatMessage> & { role: string }),
       makeMsg({
-        role: 'assistant',
-        content: 'Let me try differently.',
+        role: "assistant",
+        content: "Let me try differently.",
         tool_calls: makeToolCallsJSON([
-          { id: 'tc_1', name: 'hubspot_search_deals' },
-          { id: 'tc_2', name: 'hubspot_search_deals' },
+          { id: "tc_1", name: "hubspot_search_deals" },
+          { id: "tc_2", name: "hubspot_search_deals" },
         ]),
       } as Partial<GramChatMessage> & { role: string }),
       makeMsg({
-        role: 'tool',
+        role: "tool",
         content: '{"error": "empty filters"}',
-        tool_call_id: 'tc_2',
+        tool_call_id: "tc_2",
       } as Partial<GramChatMessage> & { role: string }),
       makeMsg({
-        role: 'assistant',
-        content: 'Let me try with proper filters.',
+        role: "assistant",
+        content: "Let me try with proper filters.",
         tool_calls: makeToolCallsJSON([
-          { id: 'tc_1', name: 'hubspot_search_deals' },
-          { id: 'tc_2', name: 'hubspot_search_deals' },
-          { id: 'tc_3', name: 'hubspot_search_deals' },
+          { id: "tc_1", name: "hubspot_search_deals" },
+          { id: "tc_2", name: "hubspot_search_deals" },
+          { id: "tc_3", name: "hubspot_search_deals" },
         ]),
       } as Partial<GramChatMessage> & { role: string }),
       makeMsg({
-        role: 'tool',
+        role: "tool",
         content: '{"deals": []}',
-        tool_call_id: 'tc_3',
+        tool_call_id: "tc_3",
       } as Partial<GramChatMessage> & { role: string }),
       makeMsg({
-        role: 'assistant',
-        content: 'Here are the results.',
+        role: "assistant",
+        content: "Here are the results.",
       }),
-    ]
+    ];
 
-    const result = convertGramMessagesToUIMessages(messages)
+    const result = convertGramMessagesToUIMessages(messages);
     const assistantMessages = result.messages.filter(
-      (m) => m.message.role === 'assistant'
-    )
+      (m) => m.message.role === "assistant",
+    );
 
     // Each assistant message should only have its OWN tool call, not all accumulated ones
     const firstAssistant = assistantMessages[0]!.message.parts.filter(
-      (p) => p.type === 'dynamic-tool'
-    )
-    expect(firstAssistant).toHaveLength(1)
-    expect(firstAssistant[0]).toMatchObject({ toolCallId: 'tc_1' })
+      (p) => p.type === "dynamic-tool",
+    );
+    expect(firstAssistant).toHaveLength(1);
+    expect(firstAssistant[0]).toMatchObject({ toolCallId: "tc_1" });
 
     const secondAssistant = assistantMessages[1]!.message.parts.filter(
-      (p) => p.type === 'dynamic-tool'
-    )
-    expect(secondAssistant).toHaveLength(1)
-    expect(secondAssistant[0]).toMatchObject({ toolCallId: 'tc_2' })
+      (p) => p.type === "dynamic-tool",
+    );
+    expect(secondAssistant).toHaveLength(1);
+    expect(secondAssistant[0]).toMatchObject({ toolCallId: "tc_2" });
 
     const thirdAssistant = assistantMessages[2]!.message.parts.filter(
-      (p) => p.type === 'dynamic-tool'
-    )
-    expect(thirdAssistant).toHaveLength(1)
-    expect(thirdAssistant[0]).toMatchObject({ toolCallId: 'tc_3' })
+      (p) => p.type === "dynamic-tool",
+    );
+    expect(thirdAssistant).toHaveLength(1);
+    expect(thirdAssistant[0]).toMatchObject({ toolCallId: "tc_3" });
 
     // Final assistant message has no tool calls
     const fourthAssistant = assistantMessages[3]!.message.parts.filter(
-      (p) => p.type === 'dynamic-tool'
-    )
-    expect(fourthAssistant).toHaveLength(0)
-  })
+      (p) => p.type === "dynamic-tool",
+    );
+    expect(fourthAssistant).toHaveLength(0);
+  });
 
-  it('resets dedup tracking after a user message', () => {
+  it("resets dedup tracking after a user message", () => {
     const messages: GramChatMessage[] = [
-      makeMsg({ role: 'user', content: 'First question' }),
+      makeMsg({ role: "user", content: "First question" }),
       makeMsg({
-        role: 'assistant',
-        content: 'Searching.',
-        tool_calls: makeToolCallsJSON([{ id: 'tc_1', name: 'search' }]),
+        role: "assistant",
+        content: "Searching.",
+        tool_calls: makeToolCallsJSON([{ id: "tc_1", name: "search" }]),
       } as Partial<GramChatMessage> & { role: string }),
       makeMsg({
-        role: 'tool',
-        content: '{}',
-        tool_call_id: 'tc_1',
+        role: "tool",
+        content: "{}",
+        tool_call_id: "tc_1",
       } as Partial<GramChatMessage> & { role: string }),
-      makeMsg({ role: 'user', content: 'Second question' }),
+      makeMsg({ role: "user", content: "Second question" }),
       // New turn — tc_1 reused as ID (different conversation turn)
       makeMsg({
-        role: 'assistant',
-        content: 'Searching again.',
-        tool_calls: makeToolCallsJSON([{ id: 'tc_1', name: 'search' }]),
+        role: "assistant",
+        content: "Searching again.",
+        tool_calls: makeToolCallsJSON([{ id: "tc_1", name: "search" }]),
       } as Partial<GramChatMessage> & { role: string }),
-    ]
+    ];
 
-    const result = convertGramMessagesToUIMessages(messages)
+    const result = convertGramMessagesToUIMessages(messages);
     const assistantMessages = result.messages.filter(
-      (m) => m.message.role === 'assistant'
-    )
+      (m) => m.message.role === "assistant",
+    );
 
     // Both assistant messages should have tc_1 since the user message resets tracking
     const first = assistantMessages[0]!.message.parts.filter(
-      (p) => p.type === 'dynamic-tool'
-    )
-    expect(first).toHaveLength(1)
+      (p) => p.type === "dynamic-tool",
+    );
+    expect(first).toHaveLength(1);
 
     const second = assistantMessages[1]!.message.parts.filter(
-      (p) => p.type === 'dynamic-tool'
-    )
-    expect(second).toHaveLength(1)
-  })
-})
-
-describe('convertGramMessagesToExported - string content with tool calls', () => {
-  it('includes tool calls when assistant message has string content', () => {
+      (p) => p.type === "dynamic-tool",
+    );
+    expect(second).toHaveLength(1);
+  });
+});
+
+describe("convertGramMessagesToExported - string content with tool calls", () => {
+  it("includes tool calls when assistant message has string content", () => {
     const messages: GramChatMessage[] = [
-      makeMsg({ role: 'user', content: 'Search for deals' }),
+      makeMsg({ role: "user", content: "Search for deals" }),
       makeMsg({
-        role: 'assistant',
-        content: 'Let me search.',
+        role: "assistant",
+        content: "Let me search.",
         tool_calls: makeToolCallsJSON([
-          { id: 'tc_1', name: 'hubspot_search_deals' },
+          { id: "tc_1", name: "hubspot_search_deals" },
         ]),
       } as Partial<GramChatMessage> & { role: string }),
-    ]
+    ];
 
-    const result = convertGramMessagesToExported(messages)
+    const result = convertGramMessagesToExported(messages);
     const assistantEntry = result.messages.find(
-      (m) => m.message.role === 'assistant'
-    )!
+      (m) => m.message.role === "assistant",
+    )!;
     const toolCallParts = (assistantEntry.message as any).content.filter(
-      (p: any) => p.type === 'tool-call'
-    )
-    expect(toolCallParts).toHaveLength(1)
+      (p: any) => p.type === "tool-call",
+    );
+    expect(toolCallParts).toHaveLength(1);
     expect(toolCallParts[0]).toMatchObject({
-      type: 'tool-call',
-      toolCallId: 'tc_1',
-      toolName: 'hubspot_search_deals',
-    })
-  })
-})
+      type: "tool-call",
+      toolCallId: "tc_1",
+      toolName: "hubspot_search_deals",
+    });
+  });
+});