kanban-lite 1.2.13 → 1.2.16

package/dist/standalone.js

@@ -56311,6 +56311,15 @@ async function broadcastLogsUpdatedToEditingClients(ctx, cardId, logs) {
     client.send(json2);
   }
 }
+function broadcastCommentStreamStart(ctx, cardId, commentId, author, created) {
+  broadcast(ctx, { type: "commentStreamStart", cardId, commentId, author, created });
+}
+function broadcastCommentChunk(ctx, cardId, commentId, chunk) {
+  broadcast(ctx, { type: "commentChunk", cardId, commentId, chunk });
+}
+function broadcastCommentStreamDone(ctx, cardId, commentId) {
+  broadcast(ctx, { type: "commentStreamDone", cardId, commentId });
+}
 
 // src/standalone/watcherSetup.ts
 var fs5 = __toESM(require("fs"));
@@ -60550,6 +60559,56 @@ async function updateComment(ctx, { cardId, commentId, content, boardId }) {
   });
   return card;
 }
+async function streamComment(ctx, {
+  cardId,
+  author,
+  boardId,
+  stream,
+  onStart,
+  onChunk
+}) {
+  if (!author?.trim())
+    throw new Error("Comment author cannot be empty");
+  const card = await ctx.getCard(cardId, boardId);
+  if (!card)
+    throw new Error(`Card not found: ${cardId}`);
+  if (!card.comments)
+    card.comments = [];
+  const maxId = card.comments.reduce((max, c) => {
+    const num = parseInt(c.id.replace("c", ""), 10);
+    return Number.isNaN(num) ? max : Math.max(max, num);
+  }, 0);
+  const commentId = `c${maxId + 1}`;
+  const created = (/* @__PURE__ */ new Date()).toISOString();
+  onStart?.(commentId, author, created);
+  let accumulated = "";
+  for await (const chunk of stream) {
+    accumulated += chunk;
+    onChunk?.(commentId, chunk);
+  }
+  const comment = {
+    id: commentId,
+    author,
+    created,
+    content: accumulated
+  };
+  card.comments.push(comment);
+  card.modified = (/* @__PURE__ */ new Date()).toISOString();
+  await ctx._storage.writeCard(card);
+  await appendActivityLog(ctx, {
+    cardId: card.id,
+    boardId: card.boardId || ctx._resolveBoardId(boardId),
+    eventType: "comment.created",
+    text: `Comment added by \`${author}\` (streamed)`,
+    metadata: {
+      commentId: comment.id,
+      author,
+      created: comment.created
+    }
+  }).catch(() => {
+  });
+  return card;
+}
 async function deleteComment(ctx, { cardId, commentId, boardId }) {
   const card = await ctx.getCard(cardId, boardId);
   if (!card)
@@ -62611,7 +62670,47 @@ var KanbanSDK = class _KanbanSDK {
       this._runAfterEvent("comment.deleted", { ...deletedComment, cardId: mergedInput.cardId }, void 0, card.boardId ?? this._resolveBoardId(mergedInput.boardId));
     return card;
   }
-  // --- Log management ---
+  /**
+   * Creates a comment on a card from a streaming text source, persisting it
+   * once the stream is exhausted.
+   *
+   * This method is the streaming counterpart to {@link addComment}. It is
+   * intended for use by AI agents that generate comment text incrementally
+   * (e.g. an LLM `textStream`). The caller may supply `onStart` and `onChunk`
+   * callbacks to fan live progress out to connected WebSocket viewers without
+   * requiring intermediate disk writes.
+   *
+   * @param cardId - The ID of the card to comment on.
+   * @param author - Display name of the streaming author.
+   * @param stream - An `AsyncIterable<string>` that yields text chunks.
+   * @param options.boardId - Optional board ID override.
+   * @param options.onStart - Called once before iteration with the allocated
+   *   comment ID, author, and ISO timestamp.
+   * @param options.onChunk - Called after each chunk with the comment ID and
+   *   the raw chunk string.
+   * @returns A promise resolving to the updated {@link Card} once the stream
+   *   has been fully consumed and the comment has been persisted.
+   * @throws {Error} If the card is not found.
+   * @throws {Error} If `author` is empty.
+   *
+   * @example
+   * ```ts
+   * // Stream an AI SDK textStream as a comment
+   * const { textStream } = await streamText({ model, prompt })
+   * const card = await sdk.streamComment('42', 'ai-agent', textStream, {
+   *   onStart: (id, author, created) => broadcast({ type: 'commentStreamStart', cardId: '42', commentId: id, author, created }),
+   *   onChunk: (id, chunk) => broadcast({ type: 'commentChunk', cardId: '42', commentId: id, chunk }),
+   * })
+   * ```
+   */
+  async streamComment(cardId, author, stream, options) {
+    const { boardId, onStart, onChunk } = options ?? {};
+    const card = await streamComment(this, { cardId, author, boardId, stream, onStart, onChunk });
+    const newComment = card.comments?.[card.comments.length - 1];
+    if (newComment)
+      this._runAfterEvent("comment.created", { ...newComment, cardId }, void 0, card.boardId ?? this._resolveBoardId(boardId));
+    return card;
+  }
   /**
    * Returns the absolute path to the log file for a card.
    *
@@ -64816,6 +64915,49 @@ async function handleTaskRoutes(request) {
     }
     return true;
   }
+  params = route("POST", "/api/tasks/:id/comments/stream");
+  if (params) {
+    const { id } = params;
+    const author = (url.searchParams.get("author") ?? req.headers["x-comment-author"] ?? "").trim();
+    if (!author) {
+      jsonError(res, 400, "author query param is required");
+      return true;
+    }
+    let commentId;
+    try {
+      async function* requestTextStream() {
+        const decoder = new TextDecoder("utf-8");
+        for await (const chunk of req) {
+          yield decoder.decode(chunk, { stream: true });
+        }
+      }
+      const card = await runWithRequestAuth(
+        () => ctx.sdk.streamComment(id, author, requestTextStream(), {
+          boardId: url.searchParams.get("boardId") ?? void 0,
+          onStart: (cid, commentAuthor, created) => {
+            commentId = cid;
+            broadcastCommentStreamStart(ctx, id, cid, commentAuthor, created);
+          },
+          onChunk: (cid, chunk) => {
+            broadcastCommentChunk(ctx, id, cid, chunk);
+          }
+        })
+      );
+      if (!card) {
+        jsonError(res, 404, "Task not found");
+        return true;
+      }
+      await loadCards(ctx);
+      broadcast(ctx, buildInitMessage(ctx));
+      if (commentId)
+        broadcastCommentStreamDone(ctx, id, commentId);
+      const comment = card.comments?.find((c) => c.id === commentId);
+      jsonOk(res, comment ?? null, 201);
+    } catch (err) {
+      handleKnownError(err);
+    }
+    return true;
+  }
   params = route("PUT", "/api/tasks/:id/comments/:commentId");
   if (params) {
     try {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kanban-lite",
-  "version": "1.2.13",
+  "version": "1.2.16",
   "description": "Kanban board manager - VSCode extension, CLI, MCP server, and standalone web app",
   "license": "MIT",
   "repository": {

package/src/cli/index.ts

@@ -918,7 +918,7 @@ async function cmdComment(sdk: KanbanSDK, positional: string[], flags: Flags): P
   const subcommand = positional[0] || 'list'
   const boardId = getBoardId(flags)
 
-  if (subcommand !== 'list' && subcommand !== 'add' && subcommand !== 'edit' && subcommand !== 'remove' && subcommand !== 'rm') {
+  if (subcommand !== 'list' && subcommand !== 'add' && subcommand !== 'edit' && subcommand !== 'remove' && subcommand !== 'rm' && subcommand !== 'stream') {
     // If first positional looks like a card ID, treat it as "list <cardId>"
     const resolvedId = await resolveCardId(sdk, subcommand, boardId)
     const comments = await sdk.listComments(resolvedId, boardId)
@@ -1026,6 +1026,37 @@ async function cmdComment(sdk: KanbanSDK, positional: string[], flags: Flags): P
       console.log(green(`Deleted comment ${commentId}`))
       break
     }
+    case 'stream': {
+      // Reads text from stdin and streams it as a comment in real-time.
+      // Useful for piping LLM output: `llm-cli generate | kl comment stream <card-id> --author agent`
+      if (!cardId) {
+        console.error(red('Usage: kl comment stream <card-id> --author <name>'))
+        process.exit(1)
+      }
+      const author = typeof flags.author === 'string' ? flags.author : ''
+      if (!author) {
+        console.error(red('Error: --author is required'))
+        process.exit(1)
+      }
+      const resolvedId = await resolveCardId(sdk, cardId, boardId)
+      async function* stdinStream(): AsyncIterable<string> {
+        process.stdin.setEncoding('utf8')
+        for await (const chunk of process.stdin) {
+          if (!flags.json) process.stderr.write('.')
+          yield chunk as string
+        }
+      }
+      if (!flags.json) process.stderr.write('Streaming comment')
+      const card = await sdk.streamComment(resolvedId, author, stdinStream(), { boardId })
+      if (!flags.json) process.stderr.write('\n')
+      const added = card.comments?.[card.comments.length - 1]
+      if (flags.json) {
+        console.log(JSON.stringify(added, null, 2))
+      } else {
+        console.log(green(`Streamed comment ${added?.id ?? '?'} to card ${resolvedId}`))
+      }
+      break
+    }
   }
 }
 
@@ -1585,6 +1616,7 @@ ${bold('Attachment Commands:')}
 ${bold('Comment Commands:')}
   comment <id>                List comments on a card
   comment add <id>            Add a comment (--author, --body)
+  comment stream <id>         Stream a comment from stdin (--author)
   comment edit <id> <cid>     Edit a comment (--body)
   comment remove <id> <cid>   Remove a comment
 

package/src/mcp-server/index.ts

@@ -1092,6 +1092,58 @@ async function main(): Promise<void> {
     }
   )
 
+  server.tool(
+    'stream_comment',
+    'Add a comment to a kanban card from a streaming text source. Provide the full content string; it will be written via the streaming path so connected webview clients see it arrive incrementally.',
+    {
+      boardId: z.string().optional().describe('Board ID (uses default board if omitted)'),
+      cardId: z.string().describe('Card ID (or partial ID)'),
+      author: z.string().describe('Comment author name'),
+      content: z.string().describe('Full comment text (supports markdown). The content is streamed word-by-word to connected viewers.'),
+    },
+    async ({ boardId, cardId, author, content }) => {
+      let resolvedId = cardId
+      const card = await sdk.getCard(cardId, boardId)
+      if (!card) {
+        const all = await sdk.listCards(undefined, boardId)
+        const matches = all.filter(c => c.id.includes(cardId))
+        if (matches.length === 1) {
+          resolvedId = matches[0].id
+        } else if (matches.length > 1) {
+          return {
+            content: [{ type: 'text' as const, text: `Multiple cards match "${cardId}": ${matches.map(m => m.id).join(', ')}` }],
+            isError: true,
+          }
+        } else {
+          return {
+            content: [{ type: 'text' as const, text: `Card not found: ${cardId}` }],
+            isError: true,
+          }
+        }
+      }
+
+      // Wrap the full content string as an async iterable so it exercises the
+      // same SDK streaming code path that a real token stream would use.
+      async function* singleChunk(): AsyncIterable<string> { yield content }
+
+      try {
+        const updated = await runWithMcpAuth(() => sdk.streamComment(resolvedId, author, singleChunk(), { boardId }))
+        const added = updated.comments?.[updated.comments.length - 1]
+        return {
+          content: [{
+            type: 'text' as const,
+            text: JSON.stringify(added, null, 2),
+          }],
+        }
+      } catch (err) {
+        return {
+          content: [{ type: 'text' as const, text: String(err) }],
+          isError: true,
+        }
+      }
+    }
+  )
+
   server.tool(
     'update_comment',
     'Update the content of a comment on a kanban card.',

package/src/sdk/KanbanSDK.ts

@@ -2224,7 +2224,57 @@ export class KanbanSDK {
     return card
   }
 
-  // --- Log management ---
+  /**
+   * Creates a comment on a card from a streaming text source, persisting it
+   * once the stream is exhausted.
+   *
+   * This method is the streaming counterpart to {@link addComment}. It is
+   * intended for use by AI agents that generate comment text incrementally
+   * (e.g. an LLM `textStream`). The caller may supply `onStart` and `onChunk`
+   * callbacks to fan live progress out to connected WebSocket viewers without
+   * requiring intermediate disk writes.
+   *
+   * @param cardId - The ID of the card to comment on.
+   * @param author - Display name of the streaming author.
+   * @param stream - An `AsyncIterable<string>` that yields text chunks.
+   * @param options.boardId - Optional board ID override.
+   * @param options.onStart - Called once before iteration with the allocated
+   *   comment ID, author, and ISO timestamp.
+   * @param options.onChunk - Called after each chunk with the comment ID and
+   *   the raw chunk string.
+   * @returns A promise resolving to the updated {@link Card} once the stream
+   *   has been fully consumed and the comment has been persisted.
+   * @throws {Error} If the card is not found.
+   * @throws {Error} If `author` is empty.
+   *
+   * @example
+   * ```ts
+   * // Stream an AI SDK textStream as a comment
+   * const { textStream } = await streamText({ model, prompt })
+   * const card = await sdk.streamComment('42', 'ai-agent', textStream, {
+   *   onStart: (id, author, created) => broadcast({ type: 'commentStreamStart', cardId: '42', commentId: id, author, created }),
+   *   onChunk: (id, chunk) => broadcast({ type: 'commentChunk', cardId: '42', commentId: id, chunk }),
+   * })
+   * ```
+   */
+  async streamComment(
+    cardId: string,
+    author: string,
+    stream: AsyncIterable<string>,
+    options?: {
+      boardId?: string
+      onStart?: (commentId: string, author: string, created: string) => void
+      onChunk?: (commentId: string, chunk: string) => void
+    }
+  ): Promise<Card> {
+    const { boardId, onStart, onChunk } = options ?? {}
+    const card = await Comments.streamComment(this, { cardId, author, boardId, stream, onStart, onChunk })
+    const newComment = card.comments?.[card.comments.length - 1]
+    if (newComment) this._runAfterEvent('comment.created', { ...newComment, cardId }, undefined, card.boardId ?? this._resolveBoardId(boardId))
+    return card
+  }
+
+
 
   /**
    * Returns the absolute path to the log file for a card.

package/src/sdk/modules/comments.ts

@@ -89,6 +89,97 @@ export async function updateComment(
   return card
 }
 
+/**
+ * Creates a comment on a card from a streaming text source.
+ *
+ * Allocates a comment ID immediately, then reads text chunks from the given
+ * `AsyncIterable<string>`. After each chunk the optional `onChunk` callback is
+ * invoked so callers can broadcast partial content in real-time. When the
+ * iterable is exhausted the complete comment is persisted to storage.
+ *
+ * @param ctx - SDK context.
+ * @param options.cardId - ID of the card to comment on.
+ * @param options.author - Display name of the author.
+ * @param options.stream - Async iterable that yields text chunks.
+ * @param options.boardId - Optional board ID override.
+ * @param options.onStart - Called once before iteration with the allocated
+ *   comment ID and author so the caller can broadcast a stream-start event.
+ * @param options.onChunk - Called for each chunk with the comment ID and the
+ *   raw chunk string so the caller can broadcast partial content.
+ * @returns The updated card after the comment has been persisted.
+ *
+ * @example
+ * // Stream an AI response as a comment
+ * await sdk.streamComment('42', 'agent', aiTextStream, {
+ *   onChunk: (commentId, chunk) => broadcastCommentChunk(ctx, cardId, commentId, chunk),
+ * })
+ */
+export async function streamComment(
+  ctx: SDKContext,
+  {
+    cardId,
+    author,
+    boardId,
+    stream,
+    onStart,
+    onChunk,
+  }: {
+    cardId: string
+    author: string
+    boardId?: string
+    stream: AsyncIterable<string>
+    onStart?: (commentId: string, author: string, created: string) => void
+    onChunk?: (commentId: string, chunk: string) => void
+  }
+): Promise<Card> {
+  if (!author?.trim()) throw new Error('Comment author cannot be empty')
+
+  const card = await ctx.getCard(cardId, boardId)
+  if (!card) throw new Error(`Card not found: ${cardId}`)
+
+  if (!card.comments) card.comments = []
+
+  const maxId = card.comments.reduce((max, c) => {
+    const num = parseInt(c.id.replace('c', ''), 10)
+    return Number.isNaN(num) ? max : Math.max(max, num)
+  }, 0)
+
+  const commentId = `c${maxId + 1}`
+  const created = new Date().toISOString()
+
+  onStart?.(commentId, author, created)
+
+  let accumulated = ''
+  for await (const chunk of stream) {
+    accumulated += chunk
+    onChunk?.(commentId, chunk)
+  }
+
+  const comment: Comment = {
+    id: commentId,
+    author,
+    created,
+    content: accumulated,
+  }
+
+  card.comments.push(comment)
+  card.modified = new Date().toISOString()
+  await ctx._storage.writeCard(card)
+  await appendActivityLog(ctx, {
+    cardId: card.id,
+    boardId: card.boardId || ctx._resolveBoardId(boardId),
+    eventType: 'comment.created',
+    text: `Comment added by \`${author}\` (streamed)`,
+    metadata: {
+      commentId: comment.id,
+      author,
+      created: comment.created,
+    },
+  }).catch(() => {})
+
+  return card
+}
+
 /**
  * Deletes a comment from a card.
  */

package/src/shared/types.ts

@@ -112,6 +112,12 @@ export interface Comment {
   created: string
   /** Markdown body of the comment. */
   content: string
+  /**
+   * When `true`, the comment is currently being streamed by an agent and has
+   * not yet been fully written. The content field contains whatever has
+   * accumulated so far. This field is stripped before persisting to storage.
+   */
+  streaming?: boolean
 }
 
 /**
@@ -759,6 +765,9 @@ export type ExtensionMessage =
   | { type: 'submitFormResult'; callbackKey: string; result?: SubmitFormTransportResult; error?: string }
   | { type: 'logsUpdated'; cardId: string; logs: import('./types').LogEntry[] }
   | { type: 'boardLogsUpdated'; boardId: string; logs: import('./types').LogEntry[] }
+  | { type: 'commentStreamStart'; cardId: string; commentId: string; author: string; created: string }
+  | { type: 'commentChunk'; cardId: string; commentId: string; chunk: string }
+  | { type: 'commentStreamDone'; cardId: string; commentId: string }
 
 export type WebviewMessage =
   | { type: 'ready' }

package/src/standalone/broadcastService.ts

@@ -112,3 +112,43 @@ export async function broadcastLogsUpdatedToEditingClients(ctx: StandaloneContex
     client.send(json)
   }
 }
+
+/**
+ * Broadcasts a `commentStreamStart` event to ALL connected WebSocket clients.
+ * Called once when a streaming comment session begins, before any chunks arrive.
+ */
+export function broadcastCommentStreamStart(
+  ctx: StandaloneContext,
+  cardId: string,
+  commentId: string,
+  author: string,
+  created: string
+): void {
+  broadcast(ctx, { type: 'commentStreamStart', cardId, commentId, author, created })
+}
+
+/**
+ * Broadcasts a `commentChunk` event to ALL connected WebSocket clients.
+ * Called for every text chunk received during a streaming comment session.
+ */
+export function broadcastCommentChunk(
+  ctx: StandaloneContext,
+  cardId: string,
+  commentId: string,
+  chunk: string
+): void {
+  broadcast(ctx, { type: 'commentChunk', cardId, commentId, chunk })
+}
+
+/**
+ * Broadcasts a `commentStreamDone` event to ALL connected WebSocket clients.
+ * Called once after the stream has been fully consumed and persisted.
+ */
+export function broadcastCommentStreamDone(
+  ctx: StandaloneContext,
+  cardId: string,
+  commentId: string
+): void {
+  broadcast(ctx, { type: 'commentStreamDone', cardId, commentId })
+}
+

package/src/standalone/internal/routes/tasks.ts

@@ -3,7 +3,7 @@ import type { Card, CreateCardPayload, Priority } from '../../../shared/types'
 import type { CardStateCursor } from '../../../sdk/plugins'
 import { sanitizeCard, AuthError } from '../../../sdk/types'
 import { authErrorToHttpStatus, extractAuthContext, getCardStateErrorLike } from '../../authUtils'
-import { broadcast, broadcastCardContentToEditingClients, broadcastLogsUpdatedToEditingClients, buildInitMessage, loadCards } from '../../broadcastService'
+import { broadcast, broadcastCardContentToEditingClients, broadcastCommentStreamStart, broadcastCommentChunk, broadcastCommentStreamDone, broadcastLogsUpdatedToEditingClients, buildInitMessage, loadCards } from '../../broadcastService'
 import { getListCardsOptions, getSubmitErrorStatus, parseSubmitData } from '../../cardHelpers'
 import {
   doAddAttachment,
@@ -398,6 +398,50 @@ export async function handleTaskRoutes(request: StandaloneRequestContext): Promi
     return true
   }
 
+  params = route('POST', '/api/tasks/:id/comments/stream')
+  if (params) {
+    const { id } = params
+    const author = (url.searchParams.get('author') ?? (req.headers['x-comment-author'] as string | undefined) ?? '').trim()
+    if (!author) {
+      jsonError(res, 400, 'author query param is required')
+      return true
+    }
+    let commentId: string | undefined
+    try {
+      // Convert the Node.js IncomingMessage readable into an AsyncIterable<string>
+      async function* requestTextStream(): AsyncIterable<string> {
+        const decoder = new TextDecoder('utf-8')
+        for await (const chunk of req as unknown as AsyncIterable<Buffer>) {
+          yield decoder.decode(chunk as Buffer, { stream: true })
+        }
+      }
+      const card = await runWithRequestAuth(() =>
+        ctx.sdk.streamComment(id, author, requestTextStream(), {
+          boardId: url.searchParams.get('boardId') ?? undefined,
+          onStart: (cid, commentAuthor, created) => {
+            commentId = cid
+            broadcastCommentStreamStart(ctx, id, cid, commentAuthor, created)
+          },
+          onChunk: (cid, chunk) => {
+            broadcastCommentChunk(ctx, id, cid, chunk)
+          },
+        })
+      )
+      if (!card) {
+        jsonError(res, 404, 'Task not found')
+        return true
+      }
+      await loadCards(ctx)
+      broadcast(ctx, buildInitMessage(ctx))
+      if (commentId) broadcastCommentStreamDone(ctx, id, commentId)
+      const comment = card.comments?.find(c => c.id === commentId)
+      jsonOk(res, comment ?? null, 201)
+    } catch (err) {
+      handleKnownError(err)
+    }
+    return true
+  }
+
   params = route('PUT', '/api/tasks/:id/comments/:commentId')
   if (params) {
     try {

package/src/webview/App.tsx

@@ -467,6 +467,37 @@ function App(): React.JSX.Element {
           setBoardLogs(message.logs)
           break
         }
+        case 'commentStreamStart': {
+          // An agent has started streaming a comment — add a streaming placeholder
+          setEditingCard(prev => {
+            if (!prev || prev.id !== message.cardId) return prev
+            const placeholder = { id: message.commentId, author: message.author, created: message.created, content: '', streaming: true }
+            return { ...prev, comments: [...(prev.comments || []), placeholder] }
+          })
+          break
+        }
+        case 'commentChunk': {
+          // Append an incoming text chunk to the streaming comment
+          setEditingCard(prev => {
+            if (!prev || prev.id !== message.cardId) return prev
+            const comments = (prev.comments || []).map(c =>
+              c.id === message.commentId ? { ...c, content: c.content + message.chunk } : c
+            )
+            return { ...prev, comments }
+          })
+          break
+        }
+        case 'commentStreamDone': {
+          // Mark the streaming comment as complete (strip the streaming flag)
+          setEditingCard(prev => {
+            if (!prev || prev.id !== message.cardId) return prev
+            const comments = (prev.comments || []).map(c =>
+              c.id === message.commentId ? { ...c, streaming: false } : c
+            )
+            return { ...prev, comments }
+          })
+          break
+        }
       }
     }
 

package/src/webview/assets/main.css

@@ -419,6 +419,7 @@ body.vscode-high-contrast {
   padding: clamp(12px, 1.4vw, 16px);
   border-radius: 14px;
   background: var(--card-view-hero-bg);
+  z-index: 10;
 }
 
 .card-editor-hero-copy {
@@ -802,6 +803,10 @@ body.vscode-high-contrast {
   position: fixed;
   inset: 0;
   z-index: 60;
+  background: transparent;
+  border: none;
+  cursor: default;
+  padding: 0;
 }
 
 .card-floating-menu {
@@ -1095,6 +1100,47 @@ body.vscode-high-contrast {
   align-items: flex-start;
 }
 
+/* Streaming comment — subtle animated border to indicate live content */
+.card-comment-streaming .card-comment-bubble {
+  border-color: var(--vscode-focusBorder, #007fd4);
+  opacity: 0.92;
+}
+
+.card-comment-streaming-badge {
+  display: inline-flex;
+  align-items: center;
+  font-size: 0.65rem;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  color: var(--vscode-focusBorder, #007fd4);
+  padding: 1px 5px;
+  border-radius: 4px;
+  border: 1px solid var(--vscode-focusBorder, #007fd4);
+  opacity: 0.85;
+}
+
+/* Blinking cursor appended at the end of a streaming comment body */
+.card-comment-cursor {
+  display: inline-block;
+  width: 2px;
+  height: 1em;
+  vertical-align: text-bottom;
+  background: currentColor;
+  margin-left: 1px;
+  animation: comment-blink 1s step-end infinite;
+}
+
+@keyframes comment-blink {
+  0%, 100% { opacity: 1; }
+  50%       { opacity: 0; }
+}
+
+.card-comment-content-wrap {
+  display: inline;
+}
+
+
 .card-comment-avatar {
   display: inline-flex;
   align-items: center;