@saadnvd1/agent-os 0.3.497 → 0.3.498

package/components/Chat/Messages.tsx

@@ -5,6 +5,8 @@ import type { ChatItem } from "@/lib/chat/events";
 import { cn } from "@/lib/utils";
 import { leadingCommand } from "@/lib/chat/commands";
 import { compactedLine } from "@/lib/chat/stale";
+import { splitInlineCode, splitUserText } from "@/lib/chat/user-text";
+import { CodeBlock } from "./Code";
 import { CopyButton } from "./CopyButton";
 import { ImageThumb } from "./ImageThumb";
 import { Markdown } from "./Markdown";
@@ -13,13 +15,44 @@ import { useRowState } from "./rowState";
 
 type Of<K extends ChatItem["kind"]> = Extract<ChatItem, { kind: K }>;
 
+function Prose({ text }: { text: string }) {
+  return (
+    <>
+      {splitInlineCode(text).map((p, i) =>
+        p.code ? (
+          <code
+            key={i}
+            className="bg-foreground/[0.06] rounded px-1 py-0.5 font-mono text-[0.9em]"
+          >
+            {p.text}
+          </code>
+        ) : (
+          <span key={i}>{p.text}</span>
+        )
+      )}
+    </>
+  );
+}
+
 function UserText({ text }: { text: string }) {
-  const command = leadingCommand(text);
-  if (!command) return <>{text}</>;
   return (
     <>
-      <span className="text-primary font-mono">{command}</span>
-      {text.slice(command.length)}
+      {splitUserText(text).map((part, i) => {
+        if (part.kind === "code")
+          return (
+            <div key={i} className="my-1.5 first:mt-0 last:mb-0">
+              <CodeBlock code={part.code} language={part.language} />
+            </div>
+          );
+        const command = i === 0 ? leadingCommand(part.text) : null;
+        if (!command) return <Prose key={i} text={part.text} />;
+        return (
+          <span key={i}>
+            <span className="text-primary font-mono">{command}</span>
+            <Prose text={part.text.slice(command.length)} />
+          </span>
+        );
+      })}
     </>
   );
 }

package/lib/chat/user-text.ts

@@ -0,0 +1,64 @@
+export type UserTextPart =
+  | { kind: "text"; text: string }
+  | { kind: "code"; code: string; language?: string };
+
+const OPEN = /^ {0,3}(`{3,}|~{3,})\s*([\w+-]*)[^\n`]*$/;
+
+// A sent message split at its fenced code blocks. Everything else stays the
+// text it was typed as: no emphasis, no HTML, no reflow. An unclosed fence
+// runs to the end, as in markdown.
+export function splitUserText(text: string): UserTextPart[] {
+  if (!text.includes("```") && !text.includes("~~~"))
+    return [{ kind: "text", text }];
+  const parts: UserTextPart[] = [];
+  let prose: string[] = [];
+  let code: string[] | null = null;
+  let fence = "";
+  let language: string | undefined;
+  const flushProse = () => {
+    if (prose.length) parts.push({ kind: "text", text: prose.join("\n") });
+    prose = [];
+  };
+  for (const line of text.replace(/\r\n?/g, "\n").split("\n")) {
+    if (code === null) {
+      const m = OPEN.exec(line);
+      if (m) {
+        flushProse();
+        code = [];
+        fence = m[1];
+        language = m[2] || undefined;
+      } else prose.push(line);
+      continue;
+    }
+    const t = line.trim();
+    if (
+      t.startsWith(fence[0]) &&
+      t.length >= fence.length &&
+      !/[^`~]/.test(t) &&
+      t[0] === fence[0]
+    ) {
+      parts.push({ kind: "code", code: code.join("\n"), language });
+      code = null;
+    } else code.push(line);
+  }
+  if (code !== null)
+    parts.push({ kind: "code", code: code.join("\n"), language });
+  flushProse();
+  return parts;
+}
+
+// Backtick spans inside prose, split out so they can be set in monospace.
+export function splitInlineCode(
+  text: string
+): { code: boolean; text: string }[] {
+  const out: { code: boolean; text: string }[] = [];
+  let last = 0;
+  for (const m of text.matchAll(/(`+)(?!`)([^\n]*?[^`\n])\1(?!`)/g)) {
+    if (m.index > last)
+      out.push({ code: false, text: text.slice(last, m.index) });
+    out.push({ code: true, text: m[2] });
+    last = m.index + m[0].length;
+  }
+  if (last < text.length) out.push({ code: false, text: text.slice(last) });
+  return out;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saadnvd1/agent-os",
-  "version": "0.3.497",
+  "version": "0.3.498",
   "description": "Self-hosted web UI for managing Claude Code sessions",
   "bin": {
     "agent-os": "scripts/agent-os"