@optilogic/chat 1.0.0-beta.13 → 1.0.0-beta.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@optilogic/chat",
-  "version": "1.0.0-beta.13",
+  "version": "1.0.0-beta.15",
   "description": "Chat UI components for Optilogic - AgentResponse and related components for LLM interactions",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -24,8 +24,8 @@
     "README.md"
   ],
   "dependencies": {
-    "@optilogic/editor": "1.0.0-beta.13",
-    "@optilogic/core": "1.0.0-beta.13"
+    "@optilogic/editor": "1.0.0-beta.15",
+    "@optilogic/core": "1.0.0-beta.15"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",

package/src/components/agent-response/AgentResponse.tsx

@@ -261,7 +261,7 @@ const AgentResponse = React.forwardRef<HTMLDivElement, AgentResponseProps>(
               {/* Thinking Content - AgentTimeline when timeline entries exist, ThinkingSection otherwise */}
               {hasTimelineEntries ? (
                 thinkingExpanded && (
-                  <div className="pl-3 pb-3 border-t border-border">
+                  <div className="pb-3 border-t border-border">
                     <AgentTimeline
                       entries={state.timelineEntries!}
                       renderMarkdown={renderThinkingMarkdown}

package/src/components/agent-timeline/AgentTimeline.tsx

@@ -155,7 +155,7 @@ export function AgentTimeline({ entries, renderMarkdown, uiState, maxHeight = "3
       style={scrollStyle}
     >
       {/* Filter + controls bar (sticky within scroll container) */}
-      <div className="sticky top-0 z-10 bg-background flex items-center gap-1 py-1.5 mb-1 border-b border-border/50 flex-wrap">
+      <div className="sticky top-0 z-10 bg-background flex items-center gap-1 py-1.5 mb-1 border-b border-border/50 flex-wrap pl-2">
         {/* Type filter chips */}
         {TYPE_CONFIG.filter((tc) => availableTypes.has(tc.type)).map((tc) => {
           const isActive = activeFilters.has(tc.type);

package/src/components/user-prompt-input/UserPromptInput.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { Send, Loader2, Square } from "lucide-react";
-import { cn, IconButton } from "@optilogic/core";
+import { cn, IconButton, Tooltip } from "@optilogic/core";
 import {
   SlateEditor,
   Text,
@@ -143,6 +143,8 @@ export const UserPromptInput = React.forwardRef<
       disabled = false,
       isSubmitting = false,
       onStop,
+      stopTooltip,
+      stopClassName,
       disableWhileSubmitting = true,
       autoFocus = false,
       refocusAfterSubmit = false,
@@ -294,13 +296,16 @@ export const UserPromptInput = React.forwardRef<
 
           {/* Send/Stop button */}
           {isSubmitting && onStop ? (
-            <IconButton
-              icon={<Square />}
-              variant="filled"
-              size="sm"
-              aria-label="Stop"
-              onClick={onStop}
-            />
+            <Tooltip content={stopTooltip} disabled={!stopTooltip}>
+              <IconButton
+                icon={<Square />}
+                variant="filled"
+                size="sm"
+                aria-label={stopTooltip || "Stop"}
+                onClick={onStop}
+                className={stopClassName}
+              />
+            </Tooltip>
           ) : (
             <IconButton
               icon={

package/src/components/user-prompt-input/types.ts

@@ -18,6 +18,10 @@ export interface UserPromptInputProps
   isSubmitting?: boolean;
   /** Called when user clicks Stop during submission */
   onStop?: () => void;
+  /** Tooltip text shown on hover over the stop button */
+  stopTooltip?: string;
+  /** Additional CSS class names applied to the stop button */
+  stopClassName?: string;
   /** Whether to disable input while submitting (default: true) */
   disableWhileSubmitting?: boolean;
   /** Auto-focus the editor when mounted (handles Slate initialization timing) */