Resolves #303

Author: haydenbleasel

.changeset/better-badgers-think.md

@@ -0,0 +1,6 @@
+---
+"streamdown": patch
+"remend": patch
+---
+
+Make remend configurable

apps/website/content/docs/configuration.mdx

@@ -18,6 +18,10 @@ Streamdown can be configured to suit your needs. This guide will walk you throug
       type: 'boolean',
       default: 'true',
     },
+    remend: {
+      description: 'Configure which Markdown completions remend should perform',
+      type: 'RemendOptions',
+    },
     isAnimating: {
       description: 'Indicates if content is currently streaming (disables copy buttons)',
       type: 'boolean',
@@ -151,3 +155,68 @@ The `controls` prop can be configured granularly:
   {markdown}
 </Streamdown>
 ```
+
+### Remend Options
+
+The `remend` prop configures which Markdown completions are performed during streaming. All options default to `true` when not specified. Set an option to `false` to disable that completion:
+
+<TypeTable
+  type={{
+    links: {
+      description: 'Complete incomplete links',
+      type: 'boolean',
+      default: 'true',
+    },
+    images: {
+      description: 'Complete incomplete images',
+      type: 'boolean',
+      default: 'true',
+    },
+    bold: {
+      description: 'Complete bold formatting (**)',
+      type: 'boolean',
+      default: 'true',
+    },
+    italic: {
+      description: 'Complete italic formatting (* and _)',
+      type: 'boolean',
+      default: 'true',
+    },
+    boldItalic: {
+      description: 'Complete bold-italic formatting (***)',
+      type: 'boolean',
+      default: 'true',
+    },
+    inlineCode: {
+      description: 'Complete inline code formatting (`)',
+      type: 'boolean',
+      default: 'true',
+    },
+    strikethrough: {
+      description: 'Complete strikethrough formatting (~~)',
+      type: 'boolean',
+      default: 'true',
+    },
+    katex: {
+      description: 'Complete block KaTeX math ($$)',
+      type: 'boolean',
+      default: 'true',
+    },
+    setextHeadings: {
+      description: 'Handle incomplete setext headings',
+      type: 'boolean',
+      default: 'true',
+    },
+  }}
+/>
+
+```tsx title="app/page.tsx"
+<Streamdown
+  remend={{
+    links: false,    // Disable link completion
+    katex: false,    // Disable KaTeX completion
+  }}
+>
+  {markdown}
+</Streamdown>
+```

packages/remend/README.md

@@ -54,6 +54,34 @@ const completed = remend(partialLink);
 // Result: "Check out [this link](streamdown:incomplete-link)"
 ```
 
+### Configuration
+
+You can selectively disable specific completions by passing an options object. All options default to `true`:
+
+```typescript
+import remend from "remend";
+
+// Disable link and KaTeX completion
+const completed = remend(partialMarkdown, {
+  links: false,
+  katex: false,
+});
+```
+
+Available options:
+
+| Option | Description |
+|--------|-------------|
+| `links` | Complete incomplete links |
+| `images` | Complete incomplete images |
+| `bold` | Complete bold formatting (`**`) |
+| `italic` | Complete italic formatting (`*` and `_`) |
+| `boldItalic` | Complete bold-italic formatting (`***`) |
+| `inlineCode` | Complete inline code formatting (`` ` ``) |
+| `strikethrough` | Complete strikethrough formatting (`~~`) |
+| `katex` | Complete block KaTeX math (`$$`) |
+| `setextHeadings` | Handle incomplete setext headings |
+
 ### Usage with Remark
 
 Remend is a preprocessor that must be run on the raw Markdown string **before** passing it into the unified/remark processing pipeline:

packages/remend/src/index.ts

@@ -11,8 +11,37 @@ import { handleIncompleteLinksAndImages } from "./link-image-handler";
 import { handleIncompleteSetextHeading } from "./setext-heading-handler";
 import { handleIncompleteStrikethrough } from "./strikethrough-handler";
 
+/**
+ * Configuration options for the remend function.
+ * All options default to `true` when not specified.
+ * Set an option to `false` to disable that specific completion.
+ */
+export type RemendOptions = {
+  /** Complete links and images (e.g., `[text](url` → `[text](streamdown:incomplete-link)`) */
+  links?: boolean;
+  /** Complete images (e.g., `![alt](url` → removed) */
+  images?: boolean;
+  /** Complete bold formatting (e.g., `**text` → `**text**`) */
+  bold?: boolean;
+  /** Complete italic formatting (e.g., `*text` → `*text*` or `_text` → `_text_`) */
+  italic?: boolean;
+  /** Complete bold-italic formatting (e.g., `***text` → `***text***`) */
+  boldItalic?: boolean;
+  /** Complete inline code formatting (e.g., `` `code `` → `` `code` ``) */
+  inlineCode?: boolean;
+  /** Complete strikethrough formatting (e.g., `~~text` → `~~text~~`) */
+  strikethrough?: boolean;
+  /** Complete block KaTeX math (e.g., `$$equation` → `$$equation$$`) */
+  katex?: boolean;
+  /** Handle incomplete setext headings to prevent misinterpretation */
+  setextHeadings?: boolean;
+};
+
+// Helper to check if an option is enabled (defaults to true)
+const isEnabled = (option: boolean | undefined): boolean => option !== false;
+
 // Parses markdown text and removes incomplete tokens to prevent partial rendering
-const remend = (text: string): string => {
+const remend = (text: string, options?: RemendOptions): string => {
   if (!text || typeof text !== "string") {
     return text;
   }
@@ -23,31 +52,48 @@ const remend = (text: string): string => {
 
   // Handle incomplete setext headings first (before other processing)
   // This prevents partial list items (like "-") from being interpreted as heading underlines
-  result = handleIncompleteSetextHeading(result);
+  if (isEnabled(options?.setextHeadings)) {
+    result = handleIncompleteSetextHeading(result);
+  }
 
   // Handle incomplete links and images
-  const processedResult = handleIncompleteLinksAndImages(result);
+  // Note: links and images share the same handler
+  if (isEnabled(options?.links) || isEnabled(options?.images)) {
+    const processedResult = handleIncompleteLinksAndImages(result);
 
-  // If we added an incomplete link marker, don't process other formatting
-  // as the content inside the link should be preserved as-is
-  if (processedResult.endsWith("](streamdown:incomplete-link)")) {
-    return processedResult;
-  }
+    // If we added an incomplete link marker, don't process other formatting
+    // as the content inside the link should be preserved as-is
+    if (processedResult.endsWith("](streamdown:incomplete-link)")) {
+      return processedResult;
+    }
 
-  result = processedResult;
+    result = processedResult;
+  }
 
   // Handle various formatting completions
   // Handle triple asterisks first (most specific)
-  result = handleIncompleteBoldItalic(result);
-  result = handleIncompleteBold(result);
-  result = handleIncompleteDoubleUnderscoreItalic(result);
-  result = handleIncompleteSingleAsteriskItalic(result);
-  result = handleIncompleteSingleUnderscoreItalic(result);
-  result = handleIncompleteInlineCode(result);
-  result = handleIncompleteStrikethrough(result);
+  if (isEnabled(options?.boldItalic)) {
+    result = handleIncompleteBoldItalic(result);
+  }
+  if (isEnabled(options?.bold)) {
+    result = handleIncompleteBold(result);
+  }
+  if (isEnabled(options?.italic)) {
+    result = handleIncompleteDoubleUnderscoreItalic(result);
+    result = handleIncompleteSingleAsteriskItalic(result);
+    result = handleIncompleteSingleUnderscoreItalic(result);
+  }
+  if (isEnabled(options?.inlineCode)) {
+    result = handleIncompleteInlineCode(result);
+  }
+  if (isEnabled(options?.strikethrough)) {
+    result = handleIncompleteStrikethrough(result);
+  }
 
   // Handle KaTeX formatting (only block math with $$)
-  result = handleIncompleteBlockKatex(result);
+  if (isEnabled(options?.katex)) {
+    result = handleIncompleteBlockKatex(result);
+  }
   // Note: We don't handle inline KaTeX with single $ as they're likely currency symbols
 
   return result;

packages/streamdown/index.tsx

@@ -19,7 +19,7 @@ import remarkCjkFriendly from "remark-cjk-friendly";
 import remarkCjkFriendlyGfmStrikethrough from "remark-cjk-friendly-gfm-strikethrough";
 import remarkGfm from "remark-gfm";
 import remarkMath from "remark-math";
-import remend from "remend";
+import remend, { type RemendOptions } from "remend";
 import type { BundledTheme } from "shiki";
 import type { Pluggable } from "unified";
 import { components as defaultComponents } from "./lib/components";
@@ -34,6 +34,7 @@ const START_DOLLAR_PATTERN = /^\$[^$]/;
 const END_DOLLAR_PATTERN = /[^$]\$$/;
 
 export type { MermaidConfig } from "mermaid";
+export type { RemendOptions } from "remend";
 export type { BundledLanguageName } from "./lib/code-block/bundled-languages";
 
 // biome-ignore lint/performance/noBarrelFile: "required"
@@ -81,6 +82,7 @@ export type StreamdownProps = Options & {
   isAnimating?: boolean;
   caret?: keyof typeof carets;
   cdnUrl?: string | null;
+  remend?: RemendOptions;
 };
 
 export const defaultRehypePlugins: Record<string, Pluggable> = {
@@ -280,6 +282,7 @@ export const Streamdown = memo(
     parseMarkdownIntoBlocksFn = parseMarkdownIntoBlocks,
     caret,
     cdnUrl,
+    remend: remendOptions,
     ...props
   }: StreamdownProps) => {
     // All hooks must be called before any conditional returns
@@ -294,9 +297,9 @@ export const Streamdown = memo(
         return "";
       }
       return mode === "streaming" && shouldParseIncompleteMarkdown
-        ? remend(children)
+        ? remend(children, remendOptions)
         : children;
-    }, [children, mode, shouldParseIncompleteMarkdown]);
+    }, [children, mode, shouldParseIncompleteMarkdown, remendOptions]);
 
     const blocks = useMemo(
       () => parseMarkdownIntoBlocksFn(processedChildren),