svelte-streamdown 1.0.8 → 2.0.0

package/dist/theme.d.ts

@@ -1,7 +1,7 @@
 import { type ClassValue } from 'clsx';
 export declare const cn: (...inputs: ClassValue[]) => string;
 export declare const theme: {
-    a: {
+    link: {
         base: string;
         blocked: string;
     };
@@ -34,6 +34,7 @@ export declare const theme: {
     };
     li: {
         base: string;
+        checkbox: string;
     };
     code: {
         base: string;
@@ -44,17 +45,14 @@ export declare const theme: {
         skeleton: string;
         pre: string;
     };
-    inlineCode: {
+    codespan: {
         base: string;
     };
-    img: {
+    image: {
         base: string;
         image: string;
         downloadButton: string;
     };
-    pre: {
-        base: string;
-    };
     blockquote: {
         base: string;
     };
@@ -78,15 +76,18 @@ export declare const theme: {
     tbody: {
         base: string;
     };
-    tr: {
+    tfoot: {
         base: string;
     };
-    th: {
+    tr: {
         base: string;
     };
     td: {
         base: string;
     };
+    th: {
+        base: string;
+    };
     sup: {
         base: string;
     };
@@ -107,9 +108,10 @@ export declare const theme: {
         buttons: string;
     };
     math: {
-        base: string;
+        block: string;
+        inline: string;
     };
-    inlineMath: {
+    br: {
         base: string;
     };
     em: {
@@ -118,9 +120,15 @@ export declare const theme: {
     del: {
         base: string;
     };
+    footnoteRef: {
+        base: string;
+    };
+    footnotePopover: {
+        base: string;
+    };
 };
 export declare const shadcnTheme: {
-    a: {
+    link: {
         base: string;
         blocked: string;
     };
@@ -153,6 +161,7 @@ export declare const shadcnTheme: {
     };
     li: {
         base: string;
+        checkbox: string;
     };
     code: {
         base: string;
@@ -163,17 +172,14 @@ export declare const shadcnTheme: {
         skeleton: string;
         pre: string;
     };
-    inlineCode: {
+    codespan: {
         base: string;
     };
-    img: {
+    image: {
         base: string;
         image: string;
         downloadButton: string;
     };
-    pre: {
-        base: string;
-    };
     blockquote: {
         base: string;
     };
@@ -197,15 +203,18 @@ export declare const shadcnTheme: {
     tbody: {
         base: string;
     };
-    tr: {
+    tfoot: {
         base: string;
     };
-    th: {
+    tr: {
         base: string;
     };
     td: {
         base: string;
     };
+    th: {
+        base: string;
+    };
     sup: {
         base: string;
     };
@@ -226,9 +235,10 @@ export declare const shadcnTheme: {
         buttons: string;
     };
     math: {
-        base: string;
+        block: string;
+        inline: string;
     };
-    inlineMath: {
+    br: {
         base: string;
     };
     em: {
@@ -237,10 +247,16 @@ export declare const shadcnTheme: {
     del: {
         base: string;
     };
+    footnoteRef: {
+        base: string;
+    };
+    footnotePopover: {
+        base: string;
+    };
 };
 export type Theme = typeof theme;
 export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tailwind" | "shadcn") => {
-    a: {
+    link: {
         base: string;
         blocked: string;
     };
@@ -273,6 +289,7 @@ export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tai
     };
     li: {
         base: string;
+        checkbox: string;
     };
     code: {
         base: string;
@@ -283,17 +300,14 @@ export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tai
         skeleton: string;
         pre: string;
     };
-    inlineCode: {
+    codespan: {
         base: string;
     };
-    img: {
+    image: {
         base: string;
         image: string;
         downloadButton: string;
     };
-    pre: {
-        base: string;
-    };
     blockquote: {
         base: string;
     };
@@ -317,15 +331,18 @@ export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tai
     tbody: {
         base: string;
     };
-    tr: {
+    tfoot: {
         base: string;
     };
-    th: {
+    tr: {
         base: string;
     };
     td: {
         base: string;
     };
+    th: {
+        base: string;
+    };
     sup: {
         base: string;
     };
@@ -346,9 +363,10 @@ export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tai
         buttons: string;
     };
     math: {
-        base: string;
+        block: string;
+        inline: string;
     };
-    inlineMath: {
+    br: {
         base: string;
     };
     em: {
@@ -357,4 +375,10 @@ export declare const mergeTheme: (customTheme?: Partial<Theme>, baseTheme?: "tai
     del: {
         base: string;
     };
+    footnoteRef: {
+        base: string;
+    };
+    footnotePopover: {
+        base: string;
+    };
 };

package/dist/theme.js

@@ -2,7 +2,7 @@ import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 export const cn = (...inputs) => twMerge(clsx(inputs));
 export const theme = {
-    a: {
+    link: {
         base: 'text-blue-600 font-medium underline',
         blocked: 'text-gray-500'
     },
@@ -28,13 +28,14 @@ export const theme = {
         base: ''
     },
     ul: {
-        base: 'ml-4 list-outside list-disc whitespace-normal'
+        base: 'ml-4 list-inside list-disc whitespace-normal'
     },
     ol: {
-        base: 'ml-4 list-outside list-decimal whitespace-normal'
+        base: 'ml-4 list-inside whitespace-normal'
     },
     li: {
-        base: 'py-1'
+        base: 'py-1 marker:hidden',
+        checkbox: '-ml-2'
     },
     code: {
         base: 'my-4 w-full overflow-hidden rounded-xl border border-gray-200 flex flex-col',
@@ -45,17 +46,14 @@ export const theme = {
         skeleton: 'rounded-md font-mono text-transparent bg-gray-200 whitespace-nowrap inline-block',
         pre: 'overflow-x-auto font-mono p-0 bg-gray-100/40'
     },
-    inlineCode: {
-        base: 'bg-gray-100 rounded px-1.5 py-0.5 font-mono'
+    codespan: {
+        base: 'bg-gray-100 rounded px-1.5 py-0.5 font-mono text-[0.9em]'
     },
-    img: {
+    image: {
         base: 'group relative my-4  mx-auto w-fit block',
         image: 'max-w-full rounded-lg',
         downloadButton: 'absolute right-2 bottom-2 flex h-8 w-8 cursor-pointer items-center justify-center rounded-md border border-gray-200 bg-white/90 shadow-sm backdrop-blur-sm transition-all duration-200 hover:bg-white opacity-0 group-hover:opacity-100'
     },
-    pre: {
-        base: 'overflow-x-auto font-mono text-xs p-4 bg-gray-100/40'
-    },
     blockquote: {
         base: 'border-gray-600/30 text-gray-600 my-4 border-l-4 pl-4 italic'
     },
@@ -74,20 +72,23 @@ export const theme = {
         table: 'w-full border-collapse min-w-full'
     },
     thead: {
-        base: 'bg-gray-100/80'
+        base: 'bg-gray-200/80'
     },
     tbody: {
-        base: 'divide-gray-200 bg-gray-100/40 divide-y'
+        base: ''
+    },
+    tfoot: {
+        base: 'bg-gray-100/50 border-t border-gray-300'
     },
     tr: {
         base: 'border-gray-200 border-b hover:bg-gray-100/50 transition-colors'
     },
-    th: {
-        base: 'px-4 py-3 text-left text-sm font-semibold whitespace-nowrap min-w-[200px]'
-    },
     td: {
         base: 'px-4 py-3 text-sm min-w-[200px] max-w-[400px] break-words'
     },
+    th: {
+        base: 'px-4 py-3 text-sm text-foreground min-w-[200px] max-w-[400px] break-words'
+    },
     sup: {
         base: 'text-sm'
     },
@@ -108,9 +109,10 @@ export const theme = {
         buttons: 'absolute right-1 top-1 z-10 flex h-fit w-fit items-center gap-1'
     },
     math: {
-        base: ''
+        block: '',
+        inline: ''
     },
-    inlineMath: {
+    br: {
         base: ''
     },
     em: {
@@ -118,10 +120,16 @@ export const theme = {
     },
     del: {
         base: 'line-through'
+    },
+    footnoteRef: {
+        base: 'text-gray-600 px-1 py-0.5 rounded-md bg-gray-100/80'
+    },
+    footnotePopover: {
+        base: 'fixed z-50 max-h-[30vh] max-w-3xl overflow-y-auto rounded-lg bg-background p-4 shadow'
     }
 };
 export const shadcnTheme = {
-    a: {
+    link: {
         base: 'text-primary font-medium underline hover:text-primary/80',
         blocked: 'text-muted-foreground'
     },
@@ -147,13 +155,14 @@ export const shadcnTheme = {
         base: 'text-foreground'
     },
     ul: {
-        base: 'ml-4 list-outside list-disc whitespace-normal text-foreground'
+        base: 'ml-4 list-inside list-disc whitespace-normal text-foreground'
     },
     ol: {
-        base: 'ml-4 list-outside list-decimal whitespace-normal text-foreground'
+        base: 'ml-4 list-inside whitespace-normal text-foreground'
     },
     li: {
-        base: 'py-1'
+        base: 'py-1',
+        checkbox: '-ml-2'
     },
     code: {
         base: 'my-4 w-full overflow-hidden rounded-lg border border-border flex flex-col',
@@ -164,17 +173,14 @@ export const shadcnTheme = {
         skeleton: 'rounded-md font-mono text-transparent bg-muted whitespace-nowrap inline-block',
         pre: 'overflow-x-auto font-mono p-0 bg-muted/40'
     },
-    inlineCode: {
-        base: 'bg-muted rounded px-1.5 py-0.5 font-mono text-foreground'
+    codespan: {
+        base: 'bg-muted rounded px-1.5 py-0.5 font-mono text-foreground text-[0.9em]'
     },
-    img: {
+    image: {
         base: 'group relative my-4 mx-auto w-fit block',
         image: 'max-w-full rounded-lg',
         downloadButton: 'absolute right-2 bottom-2 flex h-8 w-8 cursor-pointer items-center justify-center rounded-md border border-border bg-background/90 shadow-sm backdrop-blur-sm transition-all duration-200 hover:bg-background opacity-0 group-hover:opacity-100'
     },
-    pre: {
-        base: 'overflow-x-auto font-mono text-xs p-4 bg-muted/40'
-    },
     blockquote: {
         base: 'border-muted-foreground/30 text-muted-foreground my-4 border-l-4 pl-4 italic'
     },
@@ -193,20 +199,23 @@ export const shadcnTheme = {
         table: 'w-full border-collapse min-w-full'
     },
     thead: {
-        base: 'bg-muted/50'
+        base: 'bg-muted/80'
     },
     tbody: {
-        base: 'divide-border bg-card divide-y'
+        base: ''
+    },
+    tfoot: {
+        base: 'bg-muted/50 border-t border-border'
     },
     tr: {
         base: 'border-border border-b hover:bg-muted/50 transition-colors'
     },
-    th: {
-        base: 'px-4 py-3 text-left text-sm font-semibold whitespace-nowrap text-foreground min-w-[200px]'
-    },
     td: {
         base: 'px-4 py-3 text-sm text-foreground min-w-[200px] max-w-[400px] break-words'
     },
+    th: {
+        base: 'px-4 py-3 text-sm text-foreground min-w-[200px] max-w-[400px] break-words'
+    },
     sup: {
         base: 'text-sm'
     },
@@ -227,16 +236,23 @@ export const shadcnTheme = {
         buttons: 'absolute right-1 top-1 z-10 flex h-fit w-fit items-center gap-1'
     },
     math: {
-        base: 'text-foreground'
+        block: 'text-foreground',
+        inline: 'text-foreground'
     },
-    inlineMath: {
-        base: 'text-foreground'
+    br: {
+        base: ''
     },
     em: {
         base: 'italic text-foreground'
     },
     del: {
         base: 'line-through text-muted-foreground'
+    },
+    footnoteRef: {
+        base: 'text-muted-foreground px-1 text-sm inline-block rounded-full bg-muted/80 aspect-square border border-border'
+    },
+    footnotePopover: {
+        base: 'fixed z-50 max-h-[30vh] shadow max-w-3xl overflow-y-auto rounded-lg bg-background p-4'
     }
 };
 export const mergeTheme = (customTheme, baseTheme) => {

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

@@ -8,29 +8,28 @@ export interface PanzoomOptions {
     initialY?: number;
     activateMouseWheel?: boolean;
 }
-export interface PanzoomInstance {
-    attach: (node: HTMLElement | SVGSVGElement) => () => void;
+export interface ExpandOptions {
+    padding?: number;
+    duration?: number;
+    easing?: string;
+    zIndex?: number;
+    fitRatio?: number;
+}
+export declare const usePanzoom: (opts?: PanzoomOptions) => {
+    attach: (target: HTMLElement | SVGSVGElement) => () => void;
     zoomToFit: (padding?: number) => void;
     zoomBy: (factor: number) => void;
     zoomIn: (factor?: number) => void;
     zoomOut: (factor?: number) => void;
     moveBy: (dx: number, dy: number) => void;
-    setTransform: (x: number, y: number, scale: number) => void;
+    setTransform: (nx: number, ny: number, ns: number) => void;
     expand: () => void;
     collapse: () => void;
-    toggleExpand: (options?: ExpandOptions | number) => Promise<void>;
+    toggleExpand: () => Promise<void>;
+    readonly transform: {
+        readonly x: number;
+        readonly y: number;
+        readonly scale: number;
+    };
     readonly expanded: boolean;
-    readonly transform: Readonly<{
-        x: number;
-        y: number;
-        scale: number;
-    }>;
-}
-export interface ExpandOptions {
-    padding?: number;
-    duration?: number;
-    easing?: string;
-    zIndex?: number;
-    fitRatio?: number;
-}
-export declare const usePanzoom: (opts?: PanzoomOptions) => PanzoomInstance;
+};

package/dist/utils/panzoom.svelte.js

@@ -429,7 +429,6 @@ export const usePanzoom = (opts = {}) => {
         apply();
     }
     function zoomBy(factor) {
-        console.log('zoomBy', factor);
         if (!node)
             return;
         // Use zoomAt with the center of the container for consistent behavior
@@ -448,7 +447,6 @@ export const usePanzoom = (opts = {}) => {
         zoomBy(factor);
     }
     function zoomOut(factor = 1.25) {
-        console.log('zoomOut', factor);
         // zoom out by inverse multiplier
         if (factor <= 0)
             return;

package/dist/utils/parse-incomplete-markdown.js

@@ -6,6 +6,8 @@ const singleAsteriskPattern = /(\*)([^*]*?)$/;
 const singleUnderscorePattern = /(_)([^_]*?)$/;
 const inlineCodePattern = /(`)([^`]*?)$/;
 const strikethroughPattern = /(~~)([^~]*?)$/;
+const subPattern = /(~)([^~]*?)$/;
+const supPattern = /(\^)([^\^]*?)$/;
 // Helper function to check if we have a complete code block
 const hasCompleteCodeBlock = (text) => {
     const tripleBackticks = (text.match(/```/g) || []).length;
@@ -196,6 +198,38 @@ const isWithinMathBlock = (text, position) => {
     }
     return inInlineMath || inBlockMath;
 };
+// Check if a position is within a footnote reference pattern [^label]
+const isWithinFootnoteRef = (text, position) => {
+    // Look backwards from position to find if we're inside [^...]
+    let openBracketPos = -1;
+    let caretPos = -1;
+    for (let i = position; i >= 0; i--) {
+        if (text[i] === ']') {
+            // Found closing bracket before our position, not in footnote
+            return false;
+        }
+        if (text[i] === '^' && caretPos === -1) {
+            caretPos = i;
+        }
+        if (text[i] === '[') {
+            openBracketPos = i;
+            break;
+        }
+    }
+    // Check if we have the pattern [^ and our position is after the caret
+    if (openBracketPos !== -1 && caretPos === openBracketPos + 1 && position >= caretPos) {
+        // Look forward to see if there's a closing bracket
+        for (let i = position + 1; i < text.length; i++) {
+            if (text[i] === ']') {
+                return true; // We're inside [^...] pattern
+            }
+            if (text[i] === '[' || text[i] === '\n') {
+                break; // Invalid pattern
+            }
+        }
+    }
+    return false;
+};
 // Counts single underscores that are not part of double underscores, not escaped, and not in math blocks
 const countSingleUnderscores = (text) => {
     return text.split('').reduce((acc, char, index) => {
@@ -335,6 +369,127 @@ const handleIncompleteStrikethrough = (text) => {
     }
     return text;
 };
+// Counts single tildes that are not part of double tildes and not escaped
+const countSingleTildes = (text) => {
+    return text.split('').reduce((acc, char, index) => {
+        if (char === '~') {
+            const prevChar = text[index - 1];
+            const nextChar = text[index + 1];
+            // Skip if escaped with backslash
+            if (prevChar === '\\') {
+                return acc;
+            }
+            if (prevChar !== '~' && nextChar !== '~') {
+                return acc + 1;
+            }
+        }
+        return acc;
+    }, 0);
+};
+// Completes incomplete subscript formatting (~)
+const handleIncompleteSub = (text) => {
+    // Don't process if inside a complete code block
+    if (hasCompleteCodeBlock(text)) {
+        return text;
+    }
+    const singleTildes = countSingleTildes(text);
+    if (singleTildes % 2 === 1) {
+        // Find the last unmatched tilde and add content until we find a good place to close
+        const lastTildeIndex = text.lastIndexOf('~');
+        if (lastTildeIndex !== -1) {
+            // Check if the tilde is within a math block - if so, don't process
+            if (isWithinMathBlock(text, lastTildeIndex)) {
+                return text;
+            }
+            const afterTilde = text.substring(lastTildeIndex + 1);
+            // Don't close if there's no meaningful content after the opening marker
+            if (!afterTilde || /^[\s_~*`^]*$/.test(afterTilde)) {
+                return text;
+            }
+            // Find the end of the subscript content
+            // For typical sub/sup patterns, look for single numbers, letters, or simple expressions
+            const endMatch = afterTilde.match(/^([0-9]+|[a-zA-Z]|[a-zA-Z0-9]{1,3})(?=\s|[^a-zA-Z0-9]|$)/);
+            if (endMatch) {
+                const contentLength = endMatch[1].length;
+                const insertPosition = lastTildeIndex + 1 + contentLength;
+                return text.substring(0, insertPosition) + '~' + text.substring(insertPosition);
+            }
+            else {
+                // Fallback: if no clear boundary, treat everything until space as content
+                const spaceMatch = afterTilde.match(/^([^\s]+)/);
+                if (spaceMatch) {
+                    const contentLength = spaceMatch[1].length;
+                    const insertPosition = lastTildeIndex + 1 + contentLength;
+                    return text.substring(0, insertPosition) + '~' + text.substring(insertPosition);
+                }
+            }
+        }
+    }
+    return text;
+};
+// Counts single carets that are not escaped and not in footnote references
+const countSingleCarets = (text) => {
+    return text.split('').reduce((acc, char, index) => {
+        if (char === '^') {
+            const prevChar = text[index - 1];
+            // Skip if escaped with backslash
+            if (prevChar === '\\') {
+                return acc;
+            }
+            // Skip if within footnote reference
+            if (isWithinFootnoteRef(text, index)) {
+                return acc;
+            }
+            return acc + 1;
+        }
+        return acc;
+    }, 0);
+};
+// Completes incomplete superscript formatting (^)
+const handleIncompleteSup = (text) => {
+    // Don't process if inside a complete code block
+    if (hasCompleteCodeBlock(text)) {
+        return text;
+    }
+    const singleCarets = countSingleCarets(text);
+    if (singleCarets % 2 === 1) {
+        // Find the last unmatched caret and add content until we find a good place to close
+        const lastCaretIndex = text.lastIndexOf('^');
+        if (lastCaretIndex !== -1) {
+            // Check if the caret is within a math block - if so, don't process
+            if (isWithinMathBlock(text, lastCaretIndex)) {
+                return text;
+            }
+            // Check if the caret is within a footnote reference - if so, don't process
+            if (isWithinFootnoteRef(text, lastCaretIndex)) {
+                return text;
+            }
+            const afterCaret = text.substring(lastCaretIndex + 1);
+            // Don't close if there's no meaningful content after the opening marker
+            if (!afterCaret || /^[\s_~*`^]*$/.test(afterCaret)) {
+                return text;
+            }
+            // Find the end of the superscript content
+            // For typical sub/sup patterns, look for single numbers, letters, or simple expressions
+            const endMatch = afterCaret.match(/^([0-9]+|[a-zA-Z]|[a-zA-Z0-9]{1,3})(?=\s|[^a-zA-Z0-9]|$)/);
+            if (endMatch) {
+                const contentLength = endMatch[1].length;
+                const insertPosition = lastCaretIndex + 1 + contentLength;
+                return text.substring(0, insertPosition) + '^' + text.substring(insertPosition);
+            }
+            else {
+                // Fallback: if no clear boundary, treat everything until space as content
+                const spaceMatch = afterCaret.match(/^([^\s]+)/);
+                if (spaceMatch) {
+                    const contentLength = spaceMatch[1].length;
+                    const insertPosition = lastCaretIndex + 1 + contentLength;
+                    return text.substring(0, insertPosition) + '^' + text.substring(insertPosition);
+                }
+            }
+        }
+    }
+    return text;
+};
 // Counts single dollar signs that are not part of double dollar signs and not escaped
 const _countSingleDollarSigns = (text) => {
     return text.split('').reduce((acc, char, index) => {
@@ -435,6 +590,8 @@ export const parseIncompleteMarkdown = (text) => {
     result = handleIncompleteSingleUnderscoreItalic(result);
     result = handleIncompleteInlineCode(result);
     result = handleIncompleteStrikethrough(result);
+    result = handleIncompleteSub(result);
+    result = handleIncompleteSup(result);
     // Handle KaTeX formatting (only block math with $$)
     result = handleIncompleteBlockKatex(result);
     // Note: We don't handle inline KaTeX with single $ as they're likely currency symbols

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

@@ -0,0 +1,8 @@
+type ClickOutsideHandlerOptions = {
+    isActive: boolean;
+    callback: () => void;
+};
+export declare const useClickOutside: (props: ClickOutsideHandlerOptions) => {
+    readonly attachment: ((node: HTMLElement) => () => void) | null;
+};
+export {};