svelte-streamdown 2.2.7 → 2.3.1

package/dist/marked/marked-math.js

@@ -1,6 +1,20 @@
-// Use the standard rule that requires proper spacing after math expressions
-const inlineRule = /^(\${1,2})(?!\$)((?:\\.|[^\\\n])*?(?:\\.|[^\\\n\$]))\1(?=[\s?!\.,:？！。，：]|$)/;
-const blockRule = /^(\${1,2})\n((?:\\[\s\S]|[^\\])+?)\n\1(?:\n|$)/;
+// Math parsing rules
+// Block math: supports both newline format ($$\nmath\n$$) and single-line format ($$math$$)
+const blockRule = /^(\$\$)(?:\n((?:\\[\s\S]|[^\\])+?)\n\1(?:\n|$)|([^$\n]+?)\1(?=\s|$|$))/;
+// Inline math: handles both single ($) and double ($$) dollar delimiters
+// Avoids matching currency by checking context and requiring proper content
+const inlineRule = /^(\${1,2})(?!\$)((?:[^$\n]|\\\$)*?)\1(?!\d)/;
+// Enhanced currency detection patterns
+const currencyPatterns = {
+    // Simple price patterns: $123, $123.45, $1,234.56
+    simplePrice: /^\d{1,3}(?:,\d{3})*(?:\.\d{2})?$/,
+    // Multiple prices or numbers: "123, 456", "123.45, 678.90", "123 or 456"
+    multipleNumbers: /^\d+(?:[.,]\d+)*(?:\s*[,;]\s*\d+(?:[.,]\d+)*)+$/,
+    // Price ranges: "123-456", "123 - 456", "123 to 456"
+    priceRange: /^\d+(?:\.\d{2})?\s*(?:-|to|or)\s*\d+(?:\.\d{2})?$/i,
+    // Common currency words nearby (check surrounding context)
+    currencyContext: /(?:price|cost|dollar|euro|pound|yen|currency|pay|buy|sell|expensive|cheap)/i
+};
 export function markedMath() {
     return {
         extensions: [
@@ -10,11 +24,14 @@ export function markedMath() {
                 tokenizer(src) {
                     const match = src.match(blockRule);
                     if (match) {
+                        // match[2] is multiline format, match[3] is single-line format
+                        const content = (match[2] || match[3]).trim();
                         return {
                             type: 'math',
                             isInline: false,
+                            displayMode: true,
                             raw: match[0],
-                            text: match[2].trim()
+                            text: content
                         };
                     }
                 }
@@ -23,31 +40,54 @@ export function markedMath() {
                 name: 'math',
                 level: 'inline',
                 start(src) {
-                    let index;
-                    let indexSrc = src;
-                    while (indexSrc) {
-                        index = indexSrc.indexOf('$');
-                        if (index === -1) {
+                    let index = 0;
+                    let searchSrc = src;
+                    while (searchSrc) {
+                        const dollarIndex = searchSrc.indexOf('$');
+                        if (dollarIndex === -1) {
                             return;
                         }
-                        const f = index > -1;
-                        if (f) {
-                            const possibleKatex = indexSrc.substring(index);
-                            if (possibleKatex.match(inlineRule)) {
-                                return index;
+                        const currentIndex = index + dollarIndex;
+                        const possibleMath = src.substring(currentIndex);
+                        // Check if this could be math (not currency)
+                        if (possibleMath.match(inlineRule)) {
+                            const match = possibleMath.match(inlineRule);
+                            if (match) {
+                                const content = match[2];
+                                const dollarCount = match[1]; // '$' or '$$'
+                                // Only apply currency detection to single dollars
+                                // Double dollars ($$) indicate explicit math intent
+                                if (dollarCount === '$' && isCurrencyPattern(content, src, currentIndex)) {
+                                    // This looks like currency with single dollars, skip it
+                                    index += dollarIndex + 1;
+                                    searchSrc = src.substring(index);
+                                    continue;
+                                }
+                                return currentIndex;
                             }
                         }
-                        indexSrc = indexSrc.substring(index + 1).replace(/^\$+/, '');
+                        index += dollarIndex + 1;
+                        searchSrc = src.substring(index);
                     }
                 },
                 tokenizer(src) {
                     const match = src.match(inlineRule);
                     if (match) {
+                        const content = match[2];
+                        const dollarCount = match[1]; // '$' or '$$'
+                        const isDisplayMode = dollarCount === '$$';
+                        // Only apply currency detection to single dollars
+                        // Double dollars ($$) indicate explicit math intent
+                        if (dollarCount === '$' && isCurrencyPattern(content, src, 0)) {
+                            // This looks like currency with single dollars, skip it
+                            return;
+                        }
                         return {
                             type: 'math',
-                            isInline: true,
+                            isInline: true, // Inline tokenizer always produces inline math
+                            displayMode: isDisplayMode, // $$ = display mode styling, $ = inline styling
                             raw: match[0],
-                            text: match[2].trim()
+                            text: content.trim()
                         };
                     }
                 }
@@ -55,3 +95,34 @@ export function markedMath() {
         ]
     };
 }
+// Helper function to detect currency patterns
+function isCurrencyPattern(content, fullSrc, dollarIndex) {
+    const trimmedContent = content.trim();
+    // Check for simple price patterns
+    if (currencyPatterns.simplePrice.test(trimmedContent)) {
+        return true;
+    }
+    // Check for multiple numbers/prices pattern (like "199, 199")
+    if (currencyPatterns.multipleNumbers.test(trimmedContent)) {
+        return true;
+    }
+    // Check for price ranges
+    if (currencyPatterns.priceRange.test(trimmedContent)) {
+        return true;
+    }
+    // Check surrounding context for currency-related words
+    const contextStart = Math.max(0, dollarIndex - 50);
+    const contextEnd = Math.min(fullSrc.length, dollarIndex + content.length + 50);
+    const context = fullSrc.substring(contextStart, contextEnd);
+    if (currencyPatterns.currencyContext.test(context)) {
+        // If currency context is found and content is purely numeric, likely currency
+        if (/^\d+(?:[.,]\d+)*$/.test(trimmedContent)) {
+            return true;
+        }
+    }
+    // Additional check: if content is just numbers with common currency formatting
+    if (/^\d{1,3}(?:,\d{3})*(?:\.\d{1,2})?$/.test(trimmedContent)) {
+        return true;
+    }
+    return false;
+}

package/dist/marked/marked-subsup.d.ts

@@ -1,5 +1,5 @@
 import type { TokenizerExtensionFunction, TokenizerStartFunction } from 'marked';
-export default function markedSubSup(): {
+export declare function markedSubSup(): {
     extensions: {
         name: string;
         level: 'inline';

package/dist/marked/marked-subsup.js

@@ -1,6 +1,6 @@
 const subRule = /^~([^~\s](?:[^~]*[^~\s])?)~/; // ~text~
 const supRule = /^\^([^\^\s](?:[^\^]*[^\^\s])?)\^/; // ^text^
-export default function markedSubSup() {
+export function markedSubSup() {
     return {
         extensions: [
             {

package/dist/marked/marked-table.d.ts

@@ -48,6 +48,7 @@ export interface TableToken {
     type: 'table';
     tokens: TableSection[];
     raw: string;
+    align: (string | null)[];
 }
 interface WorkingCell extends BaseCell {
 }

package/dist/marked/marked-table.js

@@ -114,8 +114,11 @@ const processSpans = (cells, count, prevRow = [], maxColspan = null) => {
     for (i = 0; i < processedCells.length; i++) {
         const cell = processedCells[i];
         let cellText = cell.text;
-        // Handle Rowspan - cells ending with ^
-        if (cellText.slice(-1) === '^' && prevRow.length > 0) {
+        // Handle Rowspan - cells ending with ^ (but not superscript ^text^)
+        // Check if it's a rowspan indicator (single ^ at end) vs superscript (^text^)
+        const isRowspanIndicator = cellText.slice(-1) === '^' &&
+            !cellText.match(/\^[^^\n\r]+\^$/); // Not a superscript pattern ^text^
+        if (isRowspanIndicator && prevRow.length > 0) {
             // Clean the ^ indicator from the cell text
             cell.text = cellText.slice(0, -1).trim();
             cellText = cell.text;
@@ -179,7 +182,10 @@ const processSpans = (cells, count, prevRow = [], maxColspan = null) => {
             }
             // If no target was found but it's a rowspan cell, clean the ^ indicator
             if (!targetFound && cell.rowspan > 0) {
-                cell.text = cell.text.slice(0, -1);
+                // Only clean if it was actually a rowspan indicator, not superscript
+                if (isRowspanIndicator) {
+                    cell.text = cell.text.slice(0, -1);
+                }
             }
         }
     }
@@ -485,7 +491,8 @@ export function markedTable(options = {}) {
                     const item = {
                         type: 'table',
                         tokens,
-                        raw: cap[0]
+                        raw: cap[0],
+                        align: alignment
                     };
                     return item;
                 }

package/dist/theme.d.ts

@@ -40,6 +40,7 @@ export declare const theme: {
         base: string;
         container: string;
         header: string;
+        buttons: string;
         button: string;
         language: string;
         skeleton: string;
@@ -168,6 +169,7 @@ export declare const shadcnTheme: {
         base: string;
         container: string;
         header: string;
+        buttons: string;
         button: string;
         language: string;
         skeleton: string;
@@ -257,7 +259,11 @@ export declare const shadcnTheme: {
     };
 };
 export type Theme = typeof theme;
-export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tailwind" | "shadcn") => {
+type DeepPartial<T> = {
+    [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];
+};
+export type DeepPartialTheme = DeepPartial<Theme>;
+export declare const mergeTheme: (customTheme?: DeepPartialTheme, baseTheme?: "tailwind" | "shadcn") => {
     link: {
         base: string;
         blocked: string;
@@ -297,6 +303,7 @@ export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tai
         base: string;
         container: string;
         header: string;
+        buttons: string;
         button: string;
         language: string;
         skeleton: string;
@@ -385,3 +392,4 @@ export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tai
         base: string;
     };
 };
+export {};

package/dist/theme.js

@@ -41,6 +41,7 @@ export const theme = {
         base: 'my-4 w-full overflow-hidden rounded-xl border border-gray-200 flex flex-col',
         container: ' relative overflow-visible bg-gray-100 p-2 font-mono text-sm ',
         header: 'flex items-center justify-between bg-gray-100/80 p-2	 text-gray-600 text-xs',
+        buttons: 'flex items-center gap-2',
         button: 'cursor-pointer size-6 p-1 text-gray-600 transition-all hover:text-gray-900 rounded hover:bg-gray-100',
         language: 'ml-1 font-mono lowercase',
         skeleton: 'block rounded-md font-mono text-transparent bg-gray-200 scale-y-90 animate-pulse whitespace-nowrap',
@@ -120,7 +121,7 @@ export const theme = {
         base: 'italic'
     },
     del: {
-        base: 'line-through'
+        base: 'text-gray-600'
     },
     footnoteRef: {
         base: 'text-gray-600 px-1 py-0.5 rounded-md bg-gray-100/80'
@@ -169,6 +170,7 @@ export const shadcnTheme = {
         base: 'my-4 w-full overflow-hidden rounded-lg border border-border flex flex-col',
         container: 'relative overflow-visible bg-muted p-2 font-mono text-sm',
         header: 'flex items-center justify-between bg-muted/80 px-2 py-1 text-muted-foreground text-xs',
+        buttons: 'flex items-center gap-2',
         button: 'cursor-pointer size-6 p-1 text-muted-foreground transition-all hover:text-foreground rounded hover:bg-muted',
         language: 'ml-1 font-mono lowercase',
         skeleton: 'block rounded-md font-mono text-transparent bg-border/80 scale-y-90 w-fit animate-pulse whitespace-nowrap',
@@ -248,7 +250,7 @@ export const shadcnTheme = {
         base: 'italic text-foreground'
     },
     del: {
-        base: 'line-through text-muted-foreground'
+        base: 'text-muted-foreground'
     },
     footnoteRef: {
         base: 'text-muted-foreground px-1 text-sm inline-block rounded-full bg-muted/80 aspect-square border border-border'

package/dist/utils/hightlighter.svelte.d.ts

@@ -1,29 +1,31 @@
-import { type BundledLanguage, type BundledTheme, type ThemedToken } from 'shiki';
-import { SvelteSet } from 'svelte/reactivity';
+import { type BundledLanguage, type BundledTheme, type HighlighterGeneric, type ThemedToken } from 'shiki';
+import { SvelteMap, SvelteSet } from 'svelte/reactivity';
 export declare const loadShiki: () => Promise<[any, import("shiki").CreateHighlighterFactory<BundledLanguage, BundledTheme>]>;
+export type Highlighter = HighlighterGeneric<BundledLanguage, BundledTheme>;
 declare class HighlighterManager {
-    initialized: boolean;
-    private highlighters;
-    private createHighlighter;
-    private engine;
-    preloadedThemes: BundledTheme[];
-    loadedLanguages: SvelteSet<BundledLanguage>;
-    loadedThemes: SvelteSet<BundledTheme>;
+    loadedLanguages: SvelteMap<BundledLanguage, boolean | Promise<void>>;
+    loadedThemes: SvelteMap<BundledTheme, boolean | Promise<void>>;
+    preloadedThemes: SvelteSet<BundledTheme>;
+    highlighter: Highlighter | Promise<Highlighter> | null;
     constructor(preloadedThemes: BundledTheme[]);
-    isReady(theme: BundledTheme, language: BundledLanguage): boolean;
+    private loadHighlighter;
+    private loadTheme;
+    private loadLanguage;
+    private isLanguageSupported;
+    isReady(theme: BundledTheme, language?: string | undefined): boolean;
     /**
      * Preloads themes by creating minimal highlighter instances.
      * This reduces flickering when switching themes.
      */
-    preloadThemes(themes: BundledTheme[], language: BundledLanguage): Promise<void>;
+    preloadThemes(highlighter: Highlighter): Promise<void>;
     /**
      * Ensures the highlighter is ready for the given theme and language.
      */
-    load(theme: BundledTheme, language: BundledLanguage): Promise<void>;
+    load(theme: BundledTheme, language?: string | undefined): Promise<void>;
     /**
      * Highlights code synchronously. Must call isReady() first.
      */
-    highlightCode(code: string, language: BundledLanguage, theme: BundledTheme): ThemedToken[][];
+    highlightCode(code: string, language: string | undefined, theme: BundledTheme): ThemedToken[][];
     static create(preloadedThemes: BundledTheme[]): HighlighterManager;
 }
 export { HighlighterManager };

package/dist/utils/hightlighter.svelte.js

@@ -1,9 +1,5 @@
 import { bundledLanguages } from 'shiki';
-import { untrack } from 'svelte';
 import { SvelteMap, SvelteSet } from 'svelte/reactivity';
-const isLanguageSupported = (language) => {
-    return Object.hasOwn(bundledLanguages, language);
-};
 export const loadShiki = async () => {
     return Promise.all([
         import('shiki/engine/javascript').then((mod) => mod.createJavaScriptRegexEngine({ forgiving: true })),
@@ -11,87 +7,135 @@ export const loadShiki = async () => {
     ]);
 };
 class HighlighterManager {
-    initialized = $state(false);
-    highlighters = new SvelteMap();
-    createHighlighter = null;
-    engine = null;
-    preloadedThemes;
-    loadedLanguages = new SvelteSet();
-    loadedThemes = new SvelteSet();
+    loadedLanguages = new SvelteMap();
+    loadedThemes = new SvelteMap();
+    preloadedThemes = new SvelteSet();
+    highlighter = $state(null);
     constructor(preloadedThemes) {
-        this.preloadedThemes = preloadedThemes;
+        preloadedThemes.forEach((theme) => this.preloadedThemes.add(theme));
         if (typeof window !== 'undefined') {
             Object.assign(window, {
                 STREAMDOWN_HIGHLIGHTER: this
             });
         }
     }
-    isReady(theme, language) {
-        return this.highlighters.has(`${theme}:${language}`);
+    async loadHighlighter() {
+        if (this.highlighter instanceof Promise) {
+            return this.highlighter;
+        }
+        else {
+            this.highlighter = new Promise((resolve, reject) => {
+                loadShiki().then(([engine, createHighlighter]) => {
+                    return createHighlighter({
+                        themes: [],
+                        langs: [],
+                        engine
+                    }).then((highlighter) => {
+                        this.highlighter = highlighter;
+                        resolve(highlighter);
+                    });
+                });
+            });
+            return this.highlighter;
+        }
+    }
+    async loadTheme(theme, highlighter) {
+        const themeLoader = this.loadedThemes.get(theme);
+        if (themeLoader instanceof Promise) {
+            await themeLoader;
+        }
+        else {
+            const themeLoaderPromise = highlighter.loadTheme(theme).then(() => {
+                this.loadedThemes.set(theme, true);
+            });
+            this.loadedThemes.set(theme, themeLoaderPromise);
+            await themeLoaderPromise;
+        }
+    }
+    async loadLanguage(language, highlighter) {
+        const languageLoader = this.loadedLanguages.get(language);
+        if (languageLoader instanceof Promise) {
+            await languageLoader;
+        }
+        else {
+            const languageLoaderPromise = highlighter.loadLanguage(language).then(() => {
+                this.loadedLanguages.set(language, true);
+            });
+            this.loadedLanguages.set(language, languageLoaderPromise);
+            await languageLoaderPromise;
+        }
+    }
+    isLanguageSupported = (language) => {
+        return Object.hasOwn(bundledLanguages, language);
+    };
+    isReady(theme, language = 'bash') {
+        return (!(this.highlighter instanceof Promise) &&
+            this.loadedLanguages.get(this.isLanguageSupported(language) ? language : 'bash') === true &&
+            this.loadedThemes.get(theme) === true);
     }
     /**
      * Preloads themes by creating minimal highlighter instances.
      * This reduces flickering when switching themes.
      */
-    async preloadThemes(themes, language) {
-        if (!themes.length) {
-            return;
-        }
-        await Promise.all(themes
-            .filter((theme) => !this.highlighters.has(`${theme}:${language}`))
-            .map(async (theme) => {
-            if (!this.createHighlighter || !this.engine) {
+    async preloadThemes(highlighter) {
+        for (const theme of this.preloadedThemes) {
+            const themeLoader = this.loadedThemes.get(theme);
+            if (themeLoader === true) {
                 return;
             }
-            const highlighter = await this.createHighlighter?.({
-                themes: [theme],
-                langs: isLanguageSupported(language) ? [language] : ['text'],
-                engine: this.engine
-            });
-            this.highlighters.set(`${theme}:${language}`, highlighter);
-        }));
+            else if (themeLoader instanceof Promise) {
+                await themeLoader;
+            }
+            else {
+                await this.loadTheme(theme, highlighter);
+            }
+        }
     }
     /**
      * Ensures the highlighter is ready for the given theme and language.
      */
-    async load(theme, language) {
-        return untrack(async () => {
-            if (!this.createHighlighter || !this.engine) {
-                const [engine, createHighlighter] = await loadShiki();
-                this.createHighlighter = createHighlighter;
-                this.engine = engine;
-            }
-            if (!this.highlighters.has(`${theme}:${language}`)) {
-                const highlighter = await this.createHighlighter({
-                    themes: [theme],
-                    langs: isLanguageSupported(language) ? [language] : ['text'],
-                    engine: this.engine
-                });
-                this.highlighters.set(`${theme}:${language}`, highlighter);
-            }
-            void this.preloadThemes(this.preloadedThemes || [], language);
-        });
+    async load(theme, language = 'bash') {
+        const themeLoader = this.loadedThemes.get(theme);
+        const languageLoader = this.loadedLanguages.get(this.isLanguageSupported(language) ? language : 'bash');
+        if (this.highlighter !== null &&
+            !(this.highlighter instanceof Promise) &&
+            themeLoader === true &&
+            languageLoader === true) {
+            // already loaded
+            return;
+        }
+        const highlighter = await this.loadHighlighter();
+        await Promise.all([
+            this.loadTheme(theme, highlighter),
+            this.loadLanguage(this.isLanguageSupported(language) ? language : 'bash', highlighter)
+        ]);
+        await this.preloadThemes(highlighter);
     }
     /**
      * Highlights code synchronously. Must call isReady() first.
      */
-    highlightCode(code, language, theme) {
-        const highlighter = this.highlighters.get(`${theme}:${language}`);
-        if (!highlighter) {
+    highlightCode(code, language = 'bash', theme) {
+        try {
+            // const highlighter = this.highlighters.get(`${theme}:${language}`);
+            const highlighter = this.highlighter;
+            if (!highlighter || highlighter instanceof Promise) {
+                return [];
+            }
+            const tokens = highlighter.codeToTokensBase(code, {
+                lang: this.isLanguageSupported(language) ? language : 'bash',
+                theme
+            });
+            return tokens;
+        }
+        catch (error) {
             return [];
         }
-        const tokens = highlighter.codeToTokensBase(code, {
-            lang: isLanguageSupported(language) ? language : 'text',
-            theme: theme
-        });
-        return tokens;
     }
     static create(preloadedThemes) {
         if (typeof window !== 'undefined' && 'STREAMDOWN_HIGHLIGHTER' in window) {
             const previousHighlighter = window.STREAMDOWN_HIGHLIGHTER;
-            previousHighlighter.preloadedThemes = Array.from(new Set([...previousHighlighter.preloadedThemes, ...preloadedThemes]));
-            // @ts-ignore
-            return window.STREAMDOWN_HIGHLIGHTER;
+            preloadedThemes.forEach((theme) => previousHighlighter.preloadedThemes.add(theme));
+            return previousHighlighter;
         }
         return new HighlighterManager(preloadedThemes);
     }