@townco/ui 0.1.67 → 0.1.69

package/dist/core/utils/tool-verbiage.js

@@ -0,0 +1,185 @@
+/**
+ * Mapping of tool names to their verbiage templates
+ *
+ * NOTE: Built-in Town SDK tools now include verbiage metadata in their definitions.
+ * This map is kept as a fallback for:
+ * - Legacy/external tools (e.g., Cursor IDE tools)
+ * - Custom tools without verbiage metadata
+ * - Backward compatibility
+ */
+export const TOOL_VERBIAGE_MAP = {
+    // Town SDK filesystem tools (actual names: "Grep", "Read", "Write")
+    Read: {
+        active: "Reading {file}",
+        past: "Read {file}",
+        paramKey: "file_path",
+    },
+    Write: {
+        active: "Writing {file}",
+        past: "Wrote {file}",
+        paramKey: "file_path",
+    },
+    Grep: {
+        active: "Searching for {query}",
+        past: "Searched for {query}",
+        paramKey: "pattern",
+    },
+    // Town SDK web tools (actual names: "WebSearch", "WebFetch")
+    WebSearch: {
+        active: "Searching the web for {query}",
+        past: "Searched the web for {query}",
+        paramKey: "query",
+    },
+    WebFetch: {
+        active: "Fetching {url}",
+        past: "Fetched {url}",
+        paramKey: "url",
+    },
+    // Legacy/external tool names (for backward compatibility)
+    read_file: {
+        active: "Reading {file}",
+        past: "Read {file}",
+        paramKey: "target_file",
+    },
+    write: {
+        active: "Writing {file}",
+        past: "Wrote {file}",
+        paramKey: "file_path",
+    },
+    grep: {
+        active: "Searching for {query}",
+        past: "Searched for {query}",
+        paramKey: "pattern",
+    },
+    web_search: {
+        active: "Searching the web for {query}",
+        past: "Searched the web for {query}",
+        paramKey: "search_term",
+    },
+    search_replace: {
+        active: "Editing {file}",
+        past: "Edited {file}",
+        paramKey: "file_path",
+    },
+    delete_file: {
+        active: "Deleting {file}",
+        past: "Deleted {file}",
+        paramKey: "target_file",
+    },
+    codebase_search: {
+        active: "Searching codebase for {query}",
+        past: "Searched codebase for {query}",
+        paramKey: "query",
+    },
+    glob_file_search: {
+        active: "Finding files matching {pattern}",
+        past: "Found files matching {pattern}",
+        paramKey: "glob_pattern",
+    },
+    run_terminal_cmd: {
+        active: "Running {command}",
+        past: "Ran {command}",
+        paramKey: "command",
+    },
+    list_dir: {
+        active: "Listing {directory}",
+        past: "Listed {directory}",
+        paramKey: "target_directory",
+    },
+    edit_notebook: {
+        active: "Editing notebook",
+        past: "Edited notebook",
+    },
+    read_lints: {
+        active: "Reading linter errors",
+        past: "Read linter errors",
+    },
+    // Town SDK todo tool
+    todo_write: {
+        active: "Updating to-do's",
+        past: "Updated to-do's",
+    },
+};
+/**
+ * Extract parameter value from tool call
+ */
+function extractParameter(toolCall, paramKey) {
+    if (!paramKey || !toolCall.rawInput)
+        return null;
+    const value = toolCall.rawInput[paramKey];
+    if (typeof value === "string") {
+        return value;
+    }
+    return null;
+}
+/**
+ * Format verbiage template with parameter values
+ */
+function formatVerbiage(template, params) {
+    let result = template;
+    for (const [key, value] of Object.entries(params)) {
+        result = result.replace(`{${key}}`, value);
+    }
+    return result;
+}
+/**
+ * Truncate text to a maximum length with ellipsis
+ */
+function truncate(text, maxLength) {
+    if (text.length <= maxLength)
+        return text;
+    return text.substring(0, maxLength - 1) + "…";
+}
+/**
+ * Get display verbiage for a tool call
+ */
+export function getToolCallVerbiage(toolCall, tense) {
+    // First check if the tool has verbiage metadata
+    const template = toolCall.verbiage || TOOL_VERBIAGE_MAP[toolCall.title];
+    // If no template, fall back to pretty name or title
+    if (!template) {
+        const baseName = toolCall.prettyName || toolCall.title;
+        return tense === "active" ? `Using ${baseName}` : `Used ${baseName}`;
+    }
+    const verbiageTemplate = tense === "active" ? template.active : template.past;
+    // Extract parameter if specified
+    if (template.paramKey) {
+        const paramValue = extractParameter(toolCall, template.paramKey);
+        if (paramValue) {
+            // Truncate long parameter values
+            const truncatedValue = truncate(paramValue, 50);
+            // Determine the placeholder name based on param key
+            let placeholderName = "value";
+            if (template.paramKey.includes("file") ||
+                template.paramKey.includes("path")) {
+                placeholderName = "file";
+            }
+            else if (template.paramKey.includes("query") ||
+                template.paramKey.includes("pattern")) {
+                placeholderName = "query";
+            }
+            else if (template.paramKey.includes("command")) {
+                placeholderName = "command";
+            }
+            else if (template.paramKey.includes("directory")) {
+                placeholderName = "directory";
+            }
+            return formatVerbiage(verbiageTemplate, {
+                [placeholderName]: truncatedValue,
+            });
+        }
+    }
+    // If subline exists, use it as context
+    if (toolCall.subline) {
+        const prefix = verbiageTemplate.split("{")[0];
+        return prefix ? `${prefix.trim()} ${toolCall.subline}` : toolCall.subline;
+    }
+    // Return template without parameters
+    return verbiageTemplate.replace(/\s*\{[^}]+\}/g, "");
+}
+/**
+ * Get a short display name for a tool (for grouping)
+ */
+export function getToolDisplayName(toolCall) {
+    return toolCall.prettyName || toolCall.title;
+}

package/dist/gui/components/AppSidebar.d.ts

@@ -0,0 +1,22 @@
+import type { AcpClient } from "../../sdk/client/index.js";
+export interface AppSidebarProps {
+    /** The ACP client for fetching sessions */
+    client: AcpClient | null;
+    /** The current session ID */
+    currentSessionId: string | null;
+    /** Callback when a session is selected */
+    onSessionSelect?: (sessionId: string) => void;
+    /** Callback when a new session is requested */
+    onNewSession?: () => void;
+    /** Callback when a session is renamed */
+    onRenameSession?: (sessionId: string) => void;
+    /** Callback when a session is archived */
+    onArchiveSession?: (sessionId: string) => void;
+    /** Callback when a session is deleted */
+    onDeleteSession?: (sessionId: string) => void;
+    /** Optional footer content */
+    footer?: React.ReactNode;
+    /** Additional className for the sidebar */
+    className?: string;
+}
+export declare function AppSidebar({ client, currentSessionId, onSessionSelect, onNewSession, onRenameSession, onArchiveSession, onDeleteSession, footer, className, }: AppSidebarProps): import("react/jsx-runtime").JSX.Element;

package/dist/gui/components/AppSidebar.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Plus } from "lucide-react";
+import { cn } from "../lib/utils.js";
+import { IconButton } from "./IconButton.js";
+import { SessionHistory } from "./SessionHistory.js";
+import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, useSidebar, } from "./Sidebar.js";
+export function AppSidebar({ client, currentSessionId, onSessionSelect, onNewSession, onRenameSession, onArchiveSession, onDeleteSession, footer, className, }) {
+    const { setOpenMobile } = useSidebar();
+    const handleNewSession = () => {
+        if (onNewSession) {
+            onNewSession();
+        }
+        else {
+            // Default behavior: clear session from URL and reload
+            const url = new URL(window.location.href);
+            url.searchParams.delete("session");
+            window.location.href = url.toString();
+        }
+        setOpenMobile(false);
+    };
+    return (_jsxs(Sidebar, { className: cn("group-data-[side=left]:border-r-0", className), children: [_jsx(SidebarHeader, { className: "h-16 py-5 pl-6 pr-4", children: _jsxs("div", { className: "flex flex-row items-center justify-between w-full", children: [_jsx("span", { className: "font-semibold text-lg", children: "Sessions" }), _jsx(IconButton, { onClick: handleNewSession, "aria-label": "New Chat", children: _jsx(Plus, { className: "size-4 text-muted-foreground" }) })] }) }), _jsx(SidebarContent, { children: _jsx(SessionHistory, { client: client, currentSessionId: currentSessionId, onSessionSelect: onSessionSelect, onRenameSession: onRenameSession, onArchiveSession: onArchiveSession, onDeleteSession: onDeleteSession }) }), footer && _jsx(SidebarFooter, { children: footer })] }));
+}

package/dist/gui/components/ChatLayout.d.ts

@@ -8,6 +8,9 @@ interface ChatLayoutContextValue {
     setPanelSize: (size: PanelSize) => void;
     activeTab: PanelTabType;
     setActiveTab: (tab: PanelTabType) => void;
+    panelOpen: boolean;
+    setPanelOpen: (open: boolean) => void;
+    togglePanel: () => void;
 }
 declare const ChatLayoutContext: React.Context<ChatLayoutContextValue | undefined>;
 declare const useChatLayoutContext: () => ChatLayoutContextValue;
@@ -36,6 +39,8 @@ export interface ChatLayoutMessagesProps extends React.HTMLAttributes<HTMLDivEle
     onScrollChange?: (isAtBottom: boolean) => void;
     /** Whether to show scroll to bottom button */
     showScrollToBottom?: boolean;
+    /** Whether to scroll to bottom on initial mount (default: true) */
+    initialScrollToBottom?: boolean;
 }
 declare const ChatLayoutMessages: React.ForwardRefExoticComponent<ChatLayoutMessagesProps & React.RefAttributes<HTMLDivElement>>;
 export interface ChatLayoutFooterProps extends React.HTMLAttributes<HTMLDivElement> {