@sero-ai/ui 0.4.0 → 0.4.2

package/dist/components/ai-elements/speech-input.cjs

@@ -30,6 +30,7 @@ const SpeechInput = ({
   const [isRecognitionReady, setIsRecognitionReady] = _react.useState.call(void 0, false);
   const recognitionRef = _react.useRef.call(void 0, null);
   const mediaRecorderRef = _react.useRef.call(void 0, null);
+  const mediaRecorderCleanupRef = _react.useRef.call(void 0, null);
   const streamRef = _react.useRef.call(void 0, null);
   const audioChunksRef = _react.useRef.call(void 0, []);
   const onTranscriptionChangeRef = _react.useRef.call(void 0, onTranscriptionChange);
@@ -88,6 +89,7 @@ const SpeechInput = ({
       if (_optionalChain([mediaRecorderRef, 'access', _5 => _5.current, 'optionalAccess', _6 => _6.state]) === "recording") {
         mediaRecorderRef.current.stop();
       }
+      _optionalChain([mediaRecorderCleanupRef, 'access', _7 => _7.current, 'optionalCall', _8 => _8()]);
       if (streamRef.current) {
         for (const track of streamRef.current.getTracks()) {
           track.stop();
@@ -115,6 +117,7 @@ const SpeechInput = ({
           track.stop();
         }
         streamRef.current = null;
+        cleanupMediaRecorder();
         const audioBlob = new Blob(audioChunksRef.current, {
           type: "audio/webm"
         });
@@ -123,7 +126,7 @@ const SpeechInput = ({
           try {
             const transcript = await onAudioRecordedRef.current(audioBlob);
             if (transcript) {
-              _optionalChain([onTranscriptionChangeRef, 'access', _7 => _7.current, 'optionalCall', _8 => _8(transcript)]);
+              _optionalChain([onTranscriptionChangeRef, 'access', _9 => _9.current, 'optionalCall', _10 => _10(transcript)]);
             }
           } catch (e) {
           } finally {
@@ -137,11 +140,24 @@ const SpeechInput = ({
           track.stop();
         }
         streamRef.current = null;
+        cleanupMediaRecorder();
+      };
+      const cleanupMediaRecorder = () => {
+        mediaRecorder.removeEventListener("dataavailable", handleDataAvailable);
+        mediaRecorder.removeEventListener("stop", handleStop);
+        mediaRecorder.removeEventListener("error", handleError);
+        if (mediaRecorderRef.current === mediaRecorder) {
+          mediaRecorderRef.current = null;
+        }
+        if (mediaRecorderCleanupRef.current === cleanupMediaRecorder) {
+          mediaRecorderCleanupRef.current = null;
+        }
       };
       mediaRecorder.addEventListener("dataavailable", handleDataAvailable);
       mediaRecorder.addEventListener("stop", handleStop);
       mediaRecorder.addEventListener("error", handleError);
       mediaRecorderRef.current = mediaRecorder;
+      mediaRecorderCleanupRef.current = cleanupMediaRecorder;
       mediaRecorder.start();
       setIsListening(true);
     } catch (e2) {
@@ -149,7 +165,7 @@ const SpeechInput = ({
     }
   }, []);
   const stopMediaRecorder = _react.useCallback.call(void 0, () => {
-    if (_optionalChain([mediaRecorderRef, 'access', _9 => _9.current, 'optionalAccess', _10 => _10.state]) === "recording") {
+    if (_optionalChain([mediaRecorderRef, 'access', _11 => _11.current, 'optionalAccess', _12 => _12.state]) === "recording") {
       mediaRecorderRef.current.stop();
     }
     setIsListening(false);

package/dist/components/ai-elements/speech-input.js

@@ -30,6 +30,7 @@ const SpeechInput = ({
   const [isRecognitionReady, setIsRecognitionReady] = useState(false);
   const recognitionRef = useRef(null);
   const mediaRecorderRef = useRef(null);
+  const mediaRecorderCleanupRef = useRef(null);
   const streamRef = useRef(null);
   const audioChunksRef = useRef([]);
   const onTranscriptionChangeRef = useRef(onTranscriptionChange);
@@ -88,6 +89,7 @@ const SpeechInput = ({
       if (mediaRecorderRef.current?.state === "recording") {
         mediaRecorderRef.current.stop();
       }
+      mediaRecorderCleanupRef.current?.();
       if (streamRef.current) {
         for (const track of streamRef.current.getTracks()) {
           track.stop();
@@ -115,6 +117,7 @@ const SpeechInput = ({
           track.stop();
         }
         streamRef.current = null;
+        cleanupMediaRecorder();
         const audioBlob = new Blob(audioChunksRef.current, {
           type: "audio/webm"
         });
@@ -137,11 +140,24 @@ const SpeechInput = ({
           track.stop();
         }
         streamRef.current = null;
+        cleanupMediaRecorder();
+      };
+      const cleanupMediaRecorder = () => {
+        mediaRecorder.removeEventListener("dataavailable", handleDataAvailable);
+        mediaRecorder.removeEventListener("stop", handleStop);
+        mediaRecorder.removeEventListener("error", handleError);
+        if (mediaRecorderRef.current === mediaRecorder) {
+          mediaRecorderRef.current = null;
+        }
+        if (mediaRecorderCleanupRef.current === cleanupMediaRecorder) {
+          mediaRecorderCleanupRef.current = null;
+        }
       };
       mediaRecorder.addEventListener("dataavailable", handleDataAvailable);
       mediaRecorder.addEventListener("stop", handleStop);
       mediaRecorder.addEventListener("error", handleError);
       mediaRecorderRef.current = mediaRecorder;
+      mediaRecorderCleanupRef.current = cleanupMediaRecorder;
       mediaRecorder.start();
       setIsListening(true);
     } catch {

package/dist/components/ai-elements/stack-trace.cjs

@@ -131,7 +131,7 @@ const StackTrace = _react.memo.call(void 0,
       "div",
       {
         className: _utils.cn.call(void 0, 
-          "not-prose w-full overflow-hidden rounded-lg border bg-background font-mono text-sm",
+          "not-prose w-full overflow-hidden rounded-lg border bg-background font-mono text-base",
           className
         ),
         ...props,

package/dist/components/ai-elements/stack-trace.js

@@ -131,7 +131,7 @@ const StackTrace = memo(
       "div",
       {
         className: cn(
-          "not-prose w-full overflow-hidden rounded-lg border bg-background font-mono text-sm",
+          "not-prose w-full overflow-hidden rounded-lg border bg-background font-mono text-base",
           className
         ),
         ...props,

package/dist/components/ai-elements/task.cjs

@@ -22,7 +22,7 @@ const TaskItemFile = ({
     children
   }
 );
-const TaskItem = ({ children, className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _utils.cn.call(void 0, "text-muted-foreground text-sm", className), ...props, children });
+const TaskItem = ({ children, className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _utils.cn.call(void 0, "text-muted-foreground text-base", className), ...props, children });
 const Task = ({
   defaultOpen = true,
   className,
@@ -33,9 +33,9 @@ const TaskTrigger = ({
   className,
   title,
   ...props
-}) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _collapsible.CollapsibleTrigger, { asChild: true, className: _utils.cn.call(void 0, "group", className), ...props, children: _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full cursor-pointer items-center gap-2 text-muted-foreground text-sm transition-colors hover:text-foreground", children: [
+}) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _collapsible.CollapsibleTrigger, { asChild: true, className: _utils.cn.call(void 0, "group", className), ...props, children: _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full cursor-pointer items-center gap-2 text-muted-foreground text-base transition-colors hover:text-foreground", children: [
   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.SearchIcon, { className: "size-4" }),
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-sm", children: title }),
+  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-base", children: title }),
   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ChevronDownIcon, { className: "size-4 transition-transform group-data-[state=open]:rotate-180" })
 ] }))) });
 const TaskContent = ({

package/dist/components/ai-elements/task.js

@@ -22,7 +22,7 @@ const TaskItemFile = ({
     children
   }
 );
-const TaskItem = ({ children, className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("text-muted-foreground text-sm", className), ...props, children });
+const TaskItem = ({ children, className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("text-muted-foreground text-base", className), ...props, children });
 const Task = ({
   defaultOpen = true,
   className,
@@ -33,9 +33,9 @@ const TaskTrigger = ({
   className,
   title,
   ...props
-}) => /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, className: cn("group", className), ...props, children: children ?? /* @__PURE__ */ jsxs("div", { className: "flex w-full cursor-pointer items-center gap-2 text-muted-foreground text-sm transition-colors hover:text-foreground", children: [
+}) => /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, className: cn("group", className), ...props, children: children ?? /* @__PURE__ */ jsxs("div", { className: "flex w-full cursor-pointer items-center gap-2 text-muted-foreground text-base transition-colors hover:text-foreground", children: [
   /* @__PURE__ */ jsx(SearchIcon, { className: "size-4" }),
-  /* @__PURE__ */ jsx("p", { className: "text-sm", children: title }),
+  /* @__PURE__ */ jsx("p", { className: "text-base", children: title }),
   /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4 transition-transform group-data-[state=open]:rotate-180" })
 ] }) });
 const TaskContent = ({

package/dist/components/ai-elements/terminal.cjs

@@ -78,7 +78,7 @@ const TerminalTitle = ({
 }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
   "div",
   {
-    className: _utils.cn.call(void 0, "flex items-center gap-2 text-sm text-zinc-400", className),
+    className: _utils.cn.call(void 0, "flex items-center gap-2 text-base text-zinc-400", className),
     ...props,
     children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.TerminalIcon, { className: "size-4" }),
@@ -196,7 +196,7 @@ const TerminalContent = ({
     "div",
     {
       className: _utils.cn.call(void 0, 
-        "max-h-96 overflow-auto p-4 font-mono text-sm leading-relaxed",
+        "max-h-96 overflow-auto p-4 font-mono text-base leading-relaxed",
         className
       ),
       ref: containerRef,

package/dist/components/ai-elements/terminal.js

@@ -78,7 +78,7 @@ const TerminalTitle = ({
 }) => /* @__PURE__ */ jsxs(
   "div",
   {
-    className: cn("flex items-center gap-2 text-sm text-zinc-400", className),
+    className: cn("flex items-center gap-2 text-base text-zinc-400", className),
     ...props,
     children: [
       /* @__PURE__ */ jsx(TerminalIcon, { className: "size-4" }),
@@ -196,7 +196,7 @@ const TerminalContent = ({
     "div",
     {
       className: cn(
-        "max-h-96 overflow-auto p-4 font-mono text-sm leading-relaxed",
+        "max-h-96 overflow-auto p-4 font-mono text-base leading-relaxed",
         className
       ),
       ref: containerRef,

package/dist/components/ai-elements/test-results.cjs

@@ -113,7 +113,7 @@ const TestResultsDuration = ({
   if (!_optionalChain([summary, 'optionalAccess', _ => _.duration])) {
     return null;
   }
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: _utils.cn.call(void 0, "text-muted-foreground text-sm", className), ...props, children: _nullishCoalesce(children, () => ( formatDuration(summary.duration))) });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: _utils.cn.call(void 0, "text-muted-foreground text-base", className), ...props, children: _nullishCoalesce(children, () => ( formatDuration(summary.duration))) });
 };
 const TestResultsProgress = ({
   className,
@@ -193,7 +193,7 @@ const TestSuiteName = ({
       children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TestStatusIcon, { status }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium text-sm", children: _nullishCoalesce(children, () => ( name)) })
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium text-base", children: _nullishCoalesce(children, () => ( name)) })
       ]
     }
   );
@@ -250,7 +250,7 @@ const Test = ({
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TestContext.Provider, { value: contextValue, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     "div",
     {
-      className: _utils.cn.call(void 0, "flex items-center gap-2 px-4 py-2 text-sm", className),
+      className: _utils.cn.call(void 0, "flex items-center gap-2 px-4 py-2 text-base", className),
       ...props,
       children: _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TestStatus, {}),
@@ -333,7 +333,7 @@ const TestErrorMessage = ({
   "p",
   {
     className: _utils.cn.call(void 0, 
-      "font-medium text-red-700 text-sm dark:text-red-400",
+      "font-medium text-red-700 text-base dark:text-red-400",
       className
     ),
     ...props,

package/dist/components/ai-elements/test-results.js

@@ -113,7 +113,7 @@ const TestResultsDuration = ({
   if (!summary?.duration) {
     return null;
   }
-  return /* @__PURE__ */ jsx("span", { className: cn("text-muted-foreground text-sm", className), ...props, children: children ?? formatDuration(summary.duration) });
+  return /* @__PURE__ */ jsx("span", { className: cn("text-muted-foreground text-base", className), ...props, children: children ?? formatDuration(summary.duration) });
 };
 const TestResultsProgress = ({
   className,
@@ -193,7 +193,7 @@ const TestSuiteName = ({
       children: [
         /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }),
         /* @__PURE__ */ jsx(TestStatusIcon, { status }),
-        /* @__PURE__ */ jsx("span", { className: "font-medium text-sm", children: children ?? name })
+        /* @__PURE__ */ jsx("span", { className: "font-medium text-base", children: children ?? name })
       ]
     }
   );
@@ -250,7 +250,7 @@ const Test = ({
   return /* @__PURE__ */ jsx(TestContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
     "div",
     {
-      className: cn("flex items-center gap-2 px-4 py-2 text-sm", className),
+      className: cn("flex items-center gap-2 px-4 py-2 text-base", className),
       ...props,
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx(TestStatus, {}),
@@ -333,7 +333,7 @@ const TestErrorMessage = ({
   "p",
   {
     className: cn(
-      "font-medium text-red-700 text-sm dark:text-red-400",
+      "font-medium text-red-700 text-base dark:text-red-400",
       className
     ),
     ...props,

package/dist/components/ai-elements/tool.cjs

@@ -65,7 +65,7 @@ const ToolHeader = ({
       ...props,
       children: [
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.WrenchIcon, { className: "size-4 text-muted-foreground" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.WrenchIcon, { className: "size-3.5 text-muted-foreground" }),
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium text-sm", children: _nullishCoalesce(title, () => ( derivedName)) }),
           getStatusBadge(state)
         ] }),
@@ -86,7 +86,7 @@ const ToolContent = ({ className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx
 );
 const ToolInput = ({ className, input, ...props }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _utils.cn.call(void 0, "space-y-2 overflow-hidden", className), ...props, children: [
   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h4", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: "Parameters" }),
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "rounded-md bg-muted/50", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _codeblock.CodeBlock, { code: JSON.stringify(input, null, 2), language: "json" }) })
+  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "rounded-md bg-muted/50", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _codeblock.CodeBlock, { className: "text-sm", code: JSON.stringify(input, null, 2), language: "json" }) })
 ] });
 const ToolOutput = ({
   className,
@@ -99,9 +99,9 @@ const ToolOutput = ({
   }
   let Output = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: output });
   if (typeof output === "object" && !_react.isValidElement.call(void 0, output)) {
-    Output = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _codeblock.CodeBlock, { code: JSON.stringify(output, null, 2), language: "json" });
+    Output = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _codeblock.CodeBlock, { className: "text-sm", code: JSON.stringify(output, null, 2), language: "json" });
   } else if (typeof output === "string") {
-    Output = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _codeblock.CodeBlock, { code: output, language: "json" });
+    Output = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _codeblock.CodeBlock, { className: "text-sm", code: output, language: "json" });
   }
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _utils.cn.call(void 0, "space-y-2", className), ...props, children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h4", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: errorText ? "Error" : "Result" }),

package/dist/components/ai-elements/tool.js

@@ -65,7 +65,7 @@ const ToolHeader = ({
       ...props,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx(WrenchIcon, { className: "size-4 text-muted-foreground" }),
+          /* @__PURE__ */ jsx(WrenchIcon, { className: "size-3.5 text-muted-foreground" }),
           /* @__PURE__ */ jsx("span", { className: "font-medium text-sm", children: title ?? derivedName }),
           getStatusBadge(state)
         ] }),
@@ -86,7 +86,7 @@ const ToolContent = ({ className, ...props }) => /* @__PURE__ */ jsx(
 );
 const ToolInput = ({ className, input, ...props }) => /* @__PURE__ */ jsxs("div", { className: cn("space-y-2 overflow-hidden", className), ...props, children: [
   /* @__PURE__ */ jsx("h4", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: "Parameters" }),
-  /* @__PURE__ */ jsx("div", { className: "rounded-md bg-muted/50", children: /* @__PURE__ */ jsx(CodeBlock, { code: JSON.stringify(input, null, 2), language: "json" }) })
+  /* @__PURE__ */ jsx("div", { className: "rounded-md bg-muted/50", children: /* @__PURE__ */ jsx(CodeBlock, { className: "text-sm", code: JSON.stringify(input, null, 2), language: "json" }) })
 ] });
 const ToolOutput = ({
   className,
@@ -99,9 +99,9 @@ const ToolOutput = ({
   }
   let Output = /* @__PURE__ */ jsx("div", { children: output });
   if (typeof output === "object" && !isValidElement(output)) {
-    Output = /* @__PURE__ */ jsx(CodeBlock, { code: JSON.stringify(output, null, 2), language: "json" });
+    Output = /* @__PURE__ */ jsx(CodeBlock, { className: "text-sm", code: JSON.stringify(output, null, 2), language: "json" });
   } else if (typeof output === "string") {
-    Output = /* @__PURE__ */ jsx(CodeBlock, { code: output, language: "json" });
+    Output = /* @__PURE__ */ jsx(CodeBlock, { className: "text-sm", code: output, language: "json" });
   }
   return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", className), ...props, children: [
     /* @__PURE__ */ jsx("h4", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: errorText ? "Error" : "Result" }),

package/dist/components/ai-elements/transcription.cjs

@@ -36,7 +36,7 @@ const Transcription = ({
     "div",
     {
       className: _utils.cn.call(void 0, 
-        "flex flex-wrap gap-1 text-sm leading-relaxed",
+        "flex flex-wrap gap-1 text-base leading-relaxed",
         className
       ),
       "data-slot": "transcription",

package/dist/components/ai-elements/transcription.js

@@ -36,7 +36,7 @@ const Transcription = ({
     "div",
     {
       className: cn(
-        "flex flex-wrap gap-1 text-sm leading-relaxed",
+        "flex flex-wrap gap-1 text-base leading-relaxed",
         className
       ),
       "data-slot": "transcription",

package/dist/components/ai-elements/web-preview.cjs

@@ -130,7 +130,7 @@ const WebPreviewUrl = ({
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _input.Input,
     {
-      className: "h-8 flex-1 text-sm",
+      className: "h-8 flex-1 text-base",
       onChange: _nullishCoalesce(onChange, () => ( handleChange)),
       onKeyDown: handleKeyDown,
       placeholder: "Enter URL...",
@@ -170,7 +170,7 @@ const WebPreviewConsole = ({
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     _collapsible.Collapsible,
     {
-      className: _utils.cn.call(void 0, "border-t bg-muted/50 font-mono text-sm", className),
+      className: _utils.cn.call(void 0, "border-t bg-muted/50 font-mono text-base", className),
       onOpenChange: setConsoleOpen,
       open: consoleOpen,
       ...props,

package/dist/components/ai-elements/web-preview.js

@@ -130,7 +130,7 @@ const WebPreviewUrl = ({
   return /* @__PURE__ */ jsx(
     Input,
     {
-      className: "h-8 flex-1 text-sm",
+      className: "h-8 flex-1 text-base",
       onChange: onChange ?? handleChange,
       onKeyDown: handleKeyDown,
       placeholder: "Enter URL...",
@@ -170,7 +170,7 @@ const WebPreviewConsole = ({
   return /* @__PURE__ */ jsxs(
     Collapsible,
     {
-      className: cn("border-t bg-muted/50 font-mono text-sm", className),
+      className: cn("border-t bg-muted/50 font-mono text-base", className),
       onOpenChange: setConsoleOpen,
       open: consoleOpen,
       ...props,

package/dist/components/context-editor/CapabilitySection.cjs

@@ -27,7 +27,7 @@ function CapabilitySection({
       defaultOpen: false,
       children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-1", children: [
         items.length > 0 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-1 flex items-center justify-between rounded-md border-b border-border/20 px-2 pb-2", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-[11px] font-medium text-[var(--text-secondary)]", children: includeAllLabel }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm font-medium text-[var(--text-secondary)]", children: includeAllLabel }),
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             _switch.Switch,
             {
@@ -47,7 +47,7 @@ function CapabilitySection({
           },
           item.name
         )),
-        items.length === 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-[11px] italic text-[var(--text-muted)]", children: emptyLabel })
+        items.length === 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm italic text-[var(--text-muted)]", children: emptyLabel })
       ] })
     }
   );

package/dist/components/context-editor/CapabilitySection.js

@@ -27,7 +27,7 @@ function CapabilitySection({
       defaultOpen: false,
       children: /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
         items.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-1 flex items-center justify-between rounded-md border-b border-border/20 px-2 pb-2", children: [
-          /* @__PURE__ */ jsx("span", { className: "text-[11px] font-medium text-[var(--text-secondary)]", children: includeAllLabel }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--text-secondary)]", children: includeAllLabel }),
           /* @__PURE__ */ jsx(
             Switch,
             {
@@ -47,7 +47,7 @@ function CapabilitySection({
           },
           item.name
         )),
-        items.length === 0 && /* @__PURE__ */ jsx("span", { className: "text-[11px] italic text-[var(--text-muted)]", children: emptyLabel })
+        items.length === 0 && /* @__PURE__ */ jsx("span", { className: "text-sm italic text-[var(--text-muted)]", children: emptyLabel })
       ] })
     }
   );

package/dist/components/context-editor/ContextEditor.cjs

@@ -49,7 +49,7 @@ function ContextEditor({
       showCloseButton: true,
       children: [
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _dialog.DialogHeader, { children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _dialog.DialogTitle, { className: "flex items-center gap-2 text-sm", children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _dialog.DialogTitle, { className: "flex items-center gap-2 text-base", children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Settings2, { className: "size-4 text-[var(--text-muted)]" }),
             title
           ] }),
@@ -74,7 +74,7 @@ function ContextEditor({
         ] }) }),
         applyError && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start gap-2 rounded-md border border-status-error-border bg-status-error-muted px-3 py-2", children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.AlertCircle, { className: "mt-0.5 size-3.5 shrink-0 text-status-error" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-[11px] text-status-error", children: applyError })
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm text-status-error", children: applyError })
         ] }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _dialog.DialogFooter, { children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 

package/dist/components/context-editor/ContextEditor.js

@@ -49,7 +49,7 @@ function ContextEditor({
       showCloseButton: true,
       children: [
         /* @__PURE__ */ jsxs(DialogHeader, { children: [
-          /* @__PURE__ */ jsxs(DialogTitle, { className: "flex items-center gap-2 text-sm", children: [
+          /* @__PURE__ */ jsxs(DialogTitle, { className: "flex items-center gap-2 text-base", children: [
             /* @__PURE__ */ jsx(Settings2, { className: "size-4 text-[var(--text-muted)]" }),
             title
           ] }),
@@ -74,7 +74,7 @@ function ContextEditor({
         ] }) }),
         applyError && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2 rounded-md border border-status-error-border bg-status-error-muted px-3 py-2", children: [
           /* @__PURE__ */ jsx(AlertCircle, { className: "mt-0.5 size-3.5 shrink-0 text-status-error" }),
-          /* @__PURE__ */ jsx("span", { className: "text-[11px] text-status-error", children: applyError })
+          /* @__PURE__ */ jsx("span", { className: "text-sm text-status-error", children: applyError })
         ] }),
         /* @__PURE__ */ jsxs(DialogFooter, { children: [
           /* @__PURE__ */ jsx(

package/dist/components/context-editor/PresetBar.cjs

@@ -23,7 +23,7 @@ function PresetBar({
 }) {
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-[11px] font-medium text-[var(--text-muted)]", children: "Preset:" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm font-medium text-[var(--text-muted)]", children: "Preset:" }),
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _select.Select, { value: _nullishCoalesce(activePresetId, () => ( "")), onValueChange: onPresetChange, children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _select.SelectTrigger, { size: "sm", className: "h-7 w-40 text-xs", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _select.SelectValue, { placeholder: "Custom" }) }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _select.SelectContent, { children: allPresets.map((preset) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _select.SelectItem, { value: preset.id, children: preset.name }, preset.id)) })
@@ -43,7 +43,7 @@ function PresetBar({
         {
           type: "button",
           onClick: onShowSave,
-          className: "flex items-center gap-1 rounded-md px-2 py-1 text-[11px] text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
+          className: "flex items-center gap-1 rounded-md px-2 py-1 text-sm text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
           children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Save, { className: "size-3" }),
             "Save as"
@@ -55,7 +55,7 @@ function PresetBar({
         {
           type: "button",
           onClick: onReset,
-          className: "ml-auto flex items-center gap-1 rounded-md px-2 py-1 text-[11px] text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
+          className: "ml-auto flex items-center gap-1 rounded-md px-2 py-1 text-sm text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
           children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.RotateCcw, { className: "size-3" }),
             "Reset"

package/dist/components/context-editor/PresetBar.js

@@ -23,7 +23,7 @@ function PresetBar({
 }) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-[11px] font-medium text-[var(--text-muted)]", children: "Preset:" }),
+      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--text-muted)]", children: "Preset:" }),
       /* @__PURE__ */ jsxs(Select, { value: activePresetId ?? "", onValueChange: onPresetChange, children: [
         /* @__PURE__ */ jsx(SelectTrigger, { size: "sm", className: "h-7 w-40 text-xs", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Custom" }) }),
         /* @__PURE__ */ jsx(SelectContent, { children: allPresets.map((preset) => /* @__PURE__ */ jsx(SelectItem, { value: preset.id, children: preset.name }, preset.id)) })
@@ -43,7 +43,7 @@ function PresetBar({
         {
           type: "button",
           onClick: onShowSave,
-          className: "flex items-center gap-1 rounded-md px-2 py-1 text-[11px] text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
+          className: "flex items-center gap-1 rounded-md px-2 py-1 text-sm text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
           children: [
             /* @__PURE__ */ jsx(Save, { className: "size-3" }),
             "Save as"
@@ -55,7 +55,7 @@ function PresetBar({
         {
           type: "button",
           onClick: onReset,
-          className: "ml-auto flex items-center gap-1 rounded-md px-2 py-1 text-[11px] text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
+          className: "ml-auto flex items-center gap-1 rounded-md px-2 py-1 text-sm text-[var(--text-muted)] transition-colors hover:bg-[var(--bg-elevated)] hover:text-[var(--text-secondary)]",
           children: [
             /* @__PURE__ */ jsx(RotateCcw, { className: "size-3" }),
             "Reset"

package/dist/components/context-editor/SystemPromptSection.cjs

@@ -27,13 +27,13 @@ function SystemPromptSection({
       defaultOpen: false,
       children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-2", children: [
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-between", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-[10px] text-[var(--text-muted)]", children: systemPrompt === null ? c.defaultHint : systemPrompt === "" ? c.emptyHint : c.customHint }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm text-[var(--text-muted)]", children: systemPrompt === null ? c.defaultHint : systemPrompt === "" ? c.emptyHint : c.customHint }),
           systemPrompt !== null && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "button",
             {
               type: "button",
               onClick: () => onSystemPromptChange(null),
-              className: "text-[10px] text-[var(--text-muted)] transition-colors hover:text-[var(--text-secondary)]",
+              className: "text-sm text-[var(--text-muted)] transition-colors hover:text-[var(--text-secondary)]",
               children: "Reset to default"
             }
           )
@@ -44,11 +44,11 @@ function SystemPromptSection({
             "aria-label": "System prompt",
             value: displayedPrompt,
             onChange: (event) => onSystemPromptChange(event.target.value),
-            className: "h-80 w-full resize-y rounded-md border border-border/30 bg-[var(--bg-base)] p-2 font-mono text-[11px] text-[var(--text-secondary)] placeholder:text-[var(--text-muted)] outline-none focus:border-[var(--accent-primary)]",
+            className: "h-80 w-full resize-y rounded-md border border-border/30 bg-[var(--bg-base)] p-2 font-mono text-sm text-[var(--text-secondary)] placeholder:text-[var(--text-muted)] outline-none focus:border-[var(--accent-primary)]",
             placeholder: c.placeholder
           }
         ),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-[10px] text-[var(--text-muted)]", children: c.footnote })
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-sm text-[var(--text-muted)]", children: c.footnote })
       ] })
     }
   );

package/dist/components/context-editor/SystemPromptSection.js

@@ -27,13 +27,13 @@ function SystemPromptSection({
       defaultOpen: false,
       children: /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-          /* @__PURE__ */ jsx("span", { className: "text-[10px] text-[var(--text-muted)]", children: systemPrompt === null ? c.defaultHint : systemPrompt === "" ? c.emptyHint : c.customHint }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm text-[var(--text-muted)]", children: systemPrompt === null ? c.defaultHint : systemPrompt === "" ? c.emptyHint : c.customHint }),
           systemPrompt !== null && /* @__PURE__ */ jsx(
             "button",
             {
               type: "button",
               onClick: () => onSystemPromptChange(null),
-              className: "text-[10px] text-[var(--text-muted)] transition-colors hover:text-[var(--text-secondary)]",
+              className: "text-sm text-[var(--text-muted)] transition-colors hover:text-[var(--text-secondary)]",
               children: "Reset to default"
             }
           )
@@ -44,11 +44,11 @@ function SystemPromptSection({
             "aria-label": "System prompt",
             value: displayedPrompt,
             onChange: (event) => onSystemPromptChange(event.target.value),
-            className: "h-80 w-full resize-y rounded-md border border-border/30 bg-[var(--bg-base)] p-2 font-mono text-[11px] text-[var(--text-secondary)] placeholder:text-[var(--text-muted)] outline-none focus:border-[var(--accent-primary)]",
+            className: "h-80 w-full resize-y rounded-md border border-border/30 bg-[var(--bg-base)] p-2 font-mono text-sm text-[var(--text-secondary)] placeholder:text-[var(--text-muted)] outline-none focus:border-[var(--accent-primary)]",
             placeholder: c.placeholder
           }
         ),
-        /* @__PURE__ */ jsx("p", { className: "text-[10px] text-[var(--text-muted)]", children: c.footnote })
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--text-muted)]", children: c.footnote })
       ] })
     }
   );