@townco/ui 0.1.17 → 0.1.18

package/dist/gui/components/MarkdownRenderer.js

@@ -2,182 +2,85 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import ReactMarkdown from "react-markdown";
 import remarkGfm from "remark-gfm";
 import { cn } from "../lib/utils.js";
-export function MarkdownRenderer({ content, className }) {
-	if (!content) {
-		return null;
-	}
-	const components = {
-		// Table styling
-		table: ({ node, ...props }) =>
-			_jsx("div", {
-				className: "overflow-x-auto my-4",
-				children: _jsx("table", {
-					className:
-						"min-w-full border-collapse border border-border rounded-md",
-					...props,
-				}),
-			}),
-		thead: ({ node, ...props }) =>
-			_jsx("thead", { className: "bg-card border-b border-border", ...props }),
-		tbody: ({ node, ...props }) => _jsx("tbody", { ...props }),
-		tr: ({ node, ...props }) =>
-			_jsx("tr", {
-				className: "border-b border-border hover:bg-card transition-colors",
-				...props,
-			}),
-		th: ({ node, ...props }) =>
-			_jsx("th", {
-				className:
-					"px-4 py-2 text-left font-semibold text-foreground border-r border-border last:border-r-0",
-				...props,
-			}),
-		td: ({ node, ...props }) =>
-			_jsx("td", {
-				className:
-					"px-4 py-2 text-foreground border-r border-border last:border-r-0",
-				...props,
-			}),
-		// Task list styling
-		input: ({ node, checked, ...props }) => {
-			if (props.type === "checkbox") {
-				return _jsx("input", {
-					type: "checkbox",
-					checked: checked || false,
-					disabled: true,
-					readOnly: true,
-					className: "mr-2 w-4 h-4 accent-[primary] cursor-not-allowed",
-					...props,
-				});
-			}
-			return _jsx("input", { ...props });
-		},
-		// Code block styling
-		code: ({ node, ...props }) => {
-			const inline = !props.className?.includes("language-");
-			if (inline) {
-				return _jsx("code", {
-					className:
-						"px-1.5 py-0.5 bg-card border border-border rounded text-sm font-mono text-foreground",
-					...props,
-				});
-			}
-			return _jsx("code", {
-				className:
-					"block p-4 bg-card border border-border rounded-md overflow-x-auto text-sm font-mono text-foreground",
-				...props,
-			});
-		},
-		pre: ({ node, ...props }) => _jsx("pre", { className: "my-4", ...props }),
-		// Heading styling
-		h1: ({ node, ...props }) =>
-			_jsx("h1", {
-				className: "text-2xl font-bold mt-6 mb-4 text-foreground",
-				...props,
-			}),
-		h2: ({ node, ...props }) =>
-			_jsx("h2", {
-				className: "text-xl font-semibold mt-5 mb-3 text-foreground",
-				...props,
-			}),
-		h3: ({ node, ...props }) =>
-			_jsx("h3", {
-				className: "text-lg font-semibold mt-4 mb-2 text-foreground",
-				...props,
-			}),
-		// List styling
-		ul: ({ node, ...props }) => {
-			// Check if this is a task list by looking for checkbox inputs in children
-			const isTaskList = node?.children?.some(
-				(child) =>
-					typeof child === "object" &&
-					child !== null &&
-					"type" in child &&
-					child.type === "element" &&
-					"tagName" in child &&
-					child.tagName === "li" &&
-					"children" in child &&
-					Array.isArray(child.children) &&
-					child.children.some(
-						(grandChild) =>
-							typeof grandChild === "object" &&
-							grandChild !== null &&
-							"type" in grandChild &&
-							grandChild.type === "element" &&
-							"tagName" in grandChild &&
-							grandChild.tagName === "input" &&
-							"properties" in grandChild &&
-							typeof grandChild.properties === "object" &&
-							grandChild.properties !== null &&
-							"type" in grandChild.properties &&
-							grandChild.properties.type === "checkbox",
-					),
-			);
-			return _jsx("ul", {
-				className: cn(
-					"my-2 space-y-1 text-foreground",
-					isTaskList ? "list-none space-y-2" : "list-disc list-inside",
-				),
-				...props,
-			});
-		},
-		ol: ({ node, ...props }) =>
-			_jsx("ol", {
-				className: "list-decimal list-inside my-2 space-y-1 text-foreground",
-				...props,
-			}),
-		// List item styling
-		li: ({ node, ...props }) => {
-			// Check if this li contains a checkbox (task list item)
-			const isTaskListItem = node?.children?.some(
-				(child) =>
-					typeof child === "object" &&
-					child !== null &&
-					"type" in child &&
-					child.type === "element" &&
-					"tagName" in child &&
-					child.tagName === "input" &&
-					"properties" in child &&
-					typeof child.properties === "object" &&
-					child.properties !== null &&
-					"type" in child.properties &&
-					child.properties.type === "checkbox",
-			);
-			return _jsx("li", {
-				className: cn("flex items-start", isTaskListItem ? "gap-2" : "ml-2"),
-				...props,
-			});
-		},
-		// Link styling
-		a: ({ node, ...props }) =>
-			_jsx("a", {
-				className: "text-primary hover:underline",
-				target: "_blank",
-				rel: "noopener noreferrer",
-				...props,
-			}),
-		// Paragraph styling
-		p: ({ node, ...props }) =>
-			_jsx("p", {
-				className: "my-2 text-foreground leading-relaxed",
-				...props,
-			}),
-		// Blockquote styling
-		blockquote: ({ node, ...props }) =>
-			_jsx("blockquote", {
-				className:
-					"border-l-4 border-[primary] pl-4 italic my-4 text-foreground bg-card py-2",
-				...props,
-			}),
-	};
-	return _jsx("div", {
-		className: cn(
-			"markdown-content prose prose-sm max-w-none dark:prose-invert",
-			className,
-		),
-		children: _jsx(ReactMarkdown, {
-			remarkPlugins: [remarkGfm],
-			components: components,
-			children: content,
-		}),
-	});
+export function MarkdownRenderer({ content, className, }) {
+    if (!content) {
+        return null;
+    }
+    const components = {
+        // Table styling
+        table: ({ node, ...props }) => (_jsx("div", { className: "overflow-x-auto my-4", children: _jsx("table", { className: "min-w-full border-collapse border border-border rounded-md", ...props }) })),
+        thead: ({ node, ...props }) => (_jsx("thead", { className: "bg-card border-b border-border", ...props })),
+        tbody: ({ node, ...props }) => _jsx("tbody", { ...props }),
+        tr: ({ node, ...props }) => (_jsx("tr", { className: "border-b border-border hover:bg-card transition-colors", ...props })),
+        th: ({ node, ...props }) => (_jsx("th", { className: "px-4 py-2 text-left font-semibold text-foreground border-r border-border last:border-r-0", ...props })),
+        td: ({ node, ...props }) => (_jsx("td", { className: "px-4 py-2 text-foreground border-r border-border last:border-r-0", ...props })),
+        // Task list styling
+        input: ({ node, checked, ...props }) => {
+            if (props.type === "checkbox") {
+                return (_jsx("input", { type: "checkbox", checked: checked || false, disabled: true, readOnly: true, className: "mr-2 w-4 h-4 accent-[primary] cursor-not-allowed", ...props }));
+            }
+            return _jsx("input", { ...props });
+        },
+        // Code block styling
+        code: ({ node, ...props }) => {
+            const inline = !props.className?.includes("language-");
+            if (inline) {
+                return (_jsx("code", { className: "px-1.5 py-0.5 bg-card border border-border rounded text-sm font-mono text-foreground", ...props }));
+            }
+            return (_jsx("code", { className: "block p-4 bg-card border border-border rounded-md overflow-x-auto text-sm font-mono text-foreground", ...props }));
+        },
+        pre: ({ node, ...props }) => _jsx("pre", { className: "my-4", ...props }),
+        // Heading styling
+        h1: ({ node, ...props }) => (_jsx("h1", { className: "text-2xl font-bold mt-6 mb-4 text-foreground", ...props })),
+        h2: ({ node, ...props }) => (_jsx("h2", { className: "text-xl font-semibold mt-5 mb-3 text-foreground", ...props })),
+        h3: ({ node, ...props }) => (_jsx("h3", { className: "text-lg font-semibold mt-4 mb-2 text-foreground", ...props })),
+        // List styling
+        ul: ({ node, ...props }) => {
+            // Check if this is a task list by looking for checkbox inputs in children
+            const isTaskList = node?.children?.some((child) => typeof child === "object" &&
+                child !== null &&
+                "type" in child &&
+                child.type === "element" &&
+                "tagName" in child &&
+                child.tagName === "li" &&
+                "children" in child &&
+                Array.isArray(child.children) &&
+                child.children.some((grandChild) => typeof grandChild === "object" &&
+                    grandChild !== null &&
+                    "type" in grandChild &&
+                    grandChild.type === "element" &&
+                    "tagName" in grandChild &&
+                    grandChild.tagName === "input" &&
+                    "properties" in grandChild &&
+                    typeof grandChild.properties === "object" &&
+                    grandChild.properties !== null &&
+                    "type" in grandChild.properties &&
+                    grandChild.properties.type === "checkbox"));
+            return (_jsx("ul", { className: cn("my-2 space-y-1 text-foreground", isTaskList ? "list-none space-y-2" : "list-disc list-inside"), ...props }));
+        },
+        ol: ({ node, ...props }) => (_jsx("ol", { className: "list-decimal list-inside my-2 space-y-1 text-foreground", ...props })),
+        // List item styling
+        li: ({ node, ...props }) => {
+            // Check if this li contains a checkbox (task list item)
+            const isTaskListItem = node?.children?.some((child) => typeof child === "object" &&
+                child !== null &&
+                "type" in child &&
+                child.type === "element" &&
+                "tagName" in child &&
+                child.tagName === "input" &&
+                "properties" in child &&
+                typeof child.properties === "object" &&
+                child.properties !== null &&
+                "type" in child.properties &&
+                child.properties.type === "checkbox");
+            return (_jsx("li", { className: cn("flex items-start", isTaskListItem ? "gap-2" : "ml-2"), ...props }));
+        },
+        // Link styling
+        a: ({ node, ...props }) => (_jsx("a", { className: "text-primary hover:underline", target: "_blank", rel: "noopener noreferrer", ...props })),
+        // Paragraph styling
+        p: ({ node, ...props }) => (_jsx("p", { className: "my-2 text-foreground leading-relaxed", ...props })),
+        // Blockquote styling
+        blockquote: ({ node, ...props }) => (_jsx("blockquote", { className: "border-l-4 border-[primary] pl-4 italic my-4 text-foreground bg-card py-2", ...props })),
+    };
+    return (_jsx("div", { className: cn("markdown-content prose prose-sm max-w-none dark:prose-invert", className), children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], components: components, children: content }) }));
 }

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

@@ -1,33 +1,26 @@
 import { type VariantProps } from "class-variance-authority";
 import * as React from "react";
 import type { DisplayMessage } from "./MessageList.js";
-declare const messageContentVariants: (
-	props?:
-		| ({
-				role?: "user" | "assistant" | "system" | null | undefined;
-				variant?: "default" | "outline" | "ghost" | null | undefined;
-		  } & import("class-variance-authority/types").ClassProp)
-		| undefined,
-) => string;
-export interface MessageContentProps
-	extends Omit<React.HTMLAttributes<HTMLDivElement>, "children">,
-		VariantProps<typeof messageContentVariants> {
-	/** Message role - determines styling */
-	role?: "user" | "assistant" | "system";
-	/** Visual variant */
-	variant?: "default" | "outline" | "ghost";
-	/** Whether the message is currently streaming */
-	isStreaming?: boolean;
-	/**
-	 * Message object for smart rendering (optional)
-	 * When provided, automatically renders thinking, waiting, and content
-	 */
-	message?: DisplayMessage;
-	/** Display style for thinking/reasoning blocks (when using smart rendering) */
-	thinkingDisplayStyle?: "collapsible" | "inline";
-	/** Custom content (overrides smart rendering) */
-	children?: React.ReactNode;
+declare const messageContentVariants: (props?: ({
+    role?: "user" | "assistant" | "system" | null | undefined;
+    variant?: "default" | "outline" | "ghost" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface MessageContentProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children">, VariantProps<typeof messageContentVariants> {
+    /** Message role - determines styling */
+    role?: "user" | "assistant" | "system";
+    /** Visual variant */
+    variant?: "default" | "outline" | "ghost";
+    /** Whether the message is currently streaming */
+    isStreaming?: boolean;
+    /**
+     * Message object for smart rendering (optional)
+     * When provided, automatically renders thinking, waiting, and content
+     */
+    message?: DisplayMessage;
+    /** Display style for thinking/reasoning blocks (when using smart rendering) */
+    thinkingDisplayStyle?: "collapsible" | "inline";
+    /** Custom content (overrides smart rendering) */
+    children?: React.ReactNode;
 }
-export declare const MessageContent: React.ForwardRefExoticComponent<
-	MessageContentProps & React.RefAttributes<HTMLDivElement>
->;
+export declare const MessageContent: React.ForwardRefExoticComponent<MessageContentProps & React.RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { TabsList } from "./Tabs.js";
+export interface PanelTabsHeaderProps extends Omit<React.ComponentPropsWithoutRef<typeof TabsList>, "children"> {
+    /**
+     * Whether to show icons
+     */
+    showIcons?: boolean;
+    /**
+     * Which tabs to show
+     */
+    visibleTabs?: ("todo" | "files" | "database")[];
+    /**
+     * Styling variant
+     */
+    variant?: "default" | "compact";
+}
+export declare const PanelTabsHeader: React.ForwardRefExoticComponent<PanelTabsHeaderProps & React.RefAttributes<HTMLDivElement>>;

package/dist/gui/components/PanelTabsHeader.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CheckSquare, Database, FileText } from "lucide-react";
+import * as React from "react";
+import { cn } from "../lib/utils.js";
+import { TabsList, TabsTrigger } from "./Tabs.js";
+export const PanelTabsHeader = React.forwardRef(({ showIcons = true, visibleTabs = ["todo", "files"], variant = "default", className, ...props }, ref) => {
+    const allTabs = [
+        {
+            id: "todo",
+            label: "To-do",
+            icon: CheckSquare,
+        },
+        {
+            id: "files",
+            label: "Files",
+            icon: FileText,
+        },
+        {
+            id: "database",
+            label: "Database",
+            icon: Database,
+        },
+    ];
+    const tabs = allTabs.filter((tab) => visibleTabs.includes(tab.id));
+    const gap = variant === "compact" ? "gap-[4px]" : "gap-3";
+    return (_jsx(TabsList, { ref: ref, className: cn("w-full justify-start bg-transparent p-0 h-auto", gap, className), ...props, children: tabs.map((tab) => {
+            const Icon = tab.icon;
+            return (_jsxs(TabsTrigger, { value: tab.id, className: cn("gap-2 px-3 py-1.5 rounded-lg text-sm font-medium", "data-[state=active]:bg-zinc-100 data-[state=active]:text-foreground", "data-[state=inactive]:text-muted-foreground"), children: [showIcons && Icon && _jsx(Icon, { className: "size-4" }), tab.label] }, tab.id));
+        }) }));
+});
+PanelTabsHeader.displayName = "PanelTabsHeader";

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

@@ -4,34 +4,28 @@ import * as React from "react";
  * Reasoning component inspired by shadcn.io/ai
  * Displays AI thinking/reasoning process with auto-collapse support
  */
-declare const reasoningContainerVariants: (
-	props?:
-		| ({
-				variant?: "default" | "subtle" | "prominent" | null | undefined;
-		  } & import("class-variance-authority/types").ClassProp)
-		| undefined,
-) => string;
-export interface ReasoningProps
-	extends VariantProps<typeof reasoningContainerVariants> {
-	/** The reasoning/thinking content */
-	content?: string;
-	/** Whether the content is currently streaming */
-	isStreaming?: boolean;
-	/** Display mode - collapsible or always visible */
-	mode?: "collapsible" | "inline";
-	/** Default expanded state (default: false - collapsed by default) */
-	defaultExpanded?: boolean;
-	/** Auto-expand when streaming starts (default: false) */
-	autoExpand?: boolean;
-	/** Auto-collapse after streaming completes */
-	autoCollapse?: boolean;
-	/** Delay before auto-collapsing (ms) */
-	autoCollapseDelay?: number;
-	/** Custom label */
-	label?: string;
-	/** Additional CSS class */
-	className?: string;
+declare const reasoningContainerVariants: (props?: ({
+    variant?: "default" | "subtle" | "prominent" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface ReasoningProps extends VariantProps<typeof reasoningContainerVariants> {
+    /** The reasoning/thinking content */
+    content?: string;
+    /** Whether the content is currently streaming */
+    isStreaming?: boolean;
+    /** Display mode - collapsible or always visible */
+    mode?: "collapsible" | "inline";
+    /** Default expanded state (default: false - collapsed by default) */
+    defaultExpanded?: boolean;
+    /** Auto-expand when streaming starts (default: false) */
+    autoExpand?: boolean;
+    /** Auto-collapse after streaming completes */
+    autoCollapse?: boolean;
+    /** Delay before auto-collapsing (ms) */
+    autoCollapseDelay?: number;
+    /** Custom label */
+    label?: string;
+    /** Additional CSS class */
+    className?: string;
 }
-export declare const Reasoning: React.ForwardRefExoticComponent<
-	ReasoningProps & React.RefAttributes<HTMLDivElement>
->;
+export declare const Reasoning: React.ForwardRefExoticComponent<ReasoningProps & React.RefAttributes<HTMLDivElement>>;
+export {};