markstream-react 0.0.48 → 0.0.50-beta.1

package/dist/tailwind.ts

@@ -1,3 +1,3 @@
-export const safeList = `use client react string cannot delete global call clearGlobalCustomComponents dependency is not install it to enable checkbox-node checkbox checkbox-input note is-dark data-index-key headerId admonition-header admonition-icon admonition-title admonition-toggle aria-expanded aria-controls collapsed admonition-content aria-labelledby stream-markdown-parser typeof window.requestIdleCallback [data-node-index] node-spacer dark virtualized data-custom-id code_block node-slot data-node-index data-node-type typewriter-node node-placeholder performance [markstream-react][perf] mermaid theme object name markdown-renderer boolean safe clsx href xlink:href markstream-d2-root-svg number window.requestAnimationFrame instance.render instance missing render returned empty top d2-block my-4 rounded-lg border overflow-hidden shadow-sm border-gray-700/30 bg-gray-900 text-gray-100 border-gray-200 bg-white text-gray-900 d2-block-header flex justify-between items-center px-4 py-2.5 border-b border-gray-400/5 gap-x-2 text-sm font-medium font-mono gap-x-1 rounded-md p-0.5 bg-gray-700 bg-gray-100 mode-btn px-2 py-1 text-xs rounded !showSource is-active showSource d2-action-btn p-2 transition-colors hover:bg-[var(--vscode-editor-selectionBackground)] copying w-3 h-3 none currentColor round aria-pressed m9 bodyRef d2-block-body bodyStyle !hasPreview d2-source py-4 d2-code d2-error mt-2 d2-render d2-svg pb-3 line-info diffUnchangedRegionStyle line-info-basic metadata legacy off never background auto night moon black dracula mocha frappe macchiato palenight ocean poimandres monokai laserwave tokyo slack-dark rose-pine github-dark material-theme one-dark catppuccin-mocha catppuccin-frappe catppuccin-macchiato light latte dawn lotus plaintext diff visible view.getModifiedEditor ?? explicit on same helpers.cleanupEditor canonicalLanguage single window.cancelAnimationFrame clientX navigator.clipboard navigator.clipboard.writeText code-block-container is-rendering is-diff is-plain-text code-block-header space-x-2 flex-1 icon-slot h-4 w-4 flex-shrink-0 truncate code-action-btn copied m14 evenodd code-block-body--collapsed code-block-body--expanded code-editor-layer code-height-placeholder hidden aria-hidden code-editor-fallback-surface code-fallback-plain m-0 aria-busy aria-label no code-loading-placeholder loading-skeleton skeleton-line short sr-only polite status emoji-node emphasis-node smooth footnote-reference handleScroll footnote-link cursor-pointer footnote-node leading-relaxed border-t border-[var(--footnote-border,#eaecef)] pt-2 insert-node mark highlight-node blockquote-node heading-node font-semibold inline-code inline text-[85%] px-1 py-0.5 bg-[hsl(var(--secondary))] whitespace-normal break-words max-w-full text-node-stream-delta text-node-stream-delta--a text-node-stream-delta--b dl definition-list indexKey mb-4 dt definition-term ctx renderNode definition dd definition-desc ml-4 hard-break footnote-anchor hover:underline ↩︎ react-dom library failed text-red-500 p-4">Failed instanceof error.message error keydown transform ease center fullscreen touches text-gray-400 hover:bg-gray-700 hover:text-gray-200 text-gray-600 hover:bg-gray-200 hover:text-gray-700 source hasPreview preview pending bg-gray-800 bg-gray-50 px-2.5 bg-gray-600 text-gray-200 text-gray-700 text-gray-500 m16 isCollapsed opacity-50 cursor-not-allowed m7 whitespace-pre-wrap text-gray-300 baseCode relative absolute top-2 right-2 z-10 gap-2 backdrop-blur infographic-preview min-h-[360px] transition-all duration-100 block inset-0 cursor-grab isDragging containerRef w-full text-center justify-center min-h-full fixed z-50 bg-black/70 p-4 closeModal dialog h-full max-h-full shadow-lg top-6 right-6 !isDragging cursor-grabbing list-item pl-1.5 my-2 valueAttr children is-loaded lazy eager async image image-node__placeholder image-node__spinner image-node__placeholder-text image… placeholder image-node__error load ease-in-out infinite node.title link-loading inline-flex items-baseline gap-1.5 link-text-wrapper leading-[normal] link-text text link-loading-indicator link-node noopener noreferrer html-block-node escape html-block html-block-node__placeholder html-block-node__placeholder-bar w-4/5 w-2/3 setHostEl shouldRender useDynamic reactNodes list-node my-5 pl-[calc(13/8*1em)] list-decimal list-disc max-lg:my-[calc(4/3*1em)] max-lg:pl-[calc(14/9*1em)] list vitesse-dark vitesse-light shiki shiki-fallback stream-markdown code-block-content rendererTargetRef code-block-render paragraph-node paragraph strong-node reference-node bg-[hsl(var(--muted))] px-1.5 mx-0.5 hover:bg-[hsl(var(--secondary))] event.key unknown-node italic node strikethrough-node subscript-node superscript-node in out zoom hr-node thematic-break containerClass vmr-container javascript typescript python ruby shell d2 plain cpp markdown right text-right text-left pointermove pointerup pointercancel table-node-wrapper my-8 table-node table-node--loading colgroup border-[var(--table-border,#cbd5e1)] p-[calc(4/7*1em)] table-node__resize-handle table-node__loading table-node__spinner window.matchMedia ms-tooltip z-[9999] inline-block text-base py-2 px-3 shadow-md whitespace-nowrap pointer-events-none tooltip-element text-white border-gray-700 tooltip text-node text-node-center afterbegin viewBox loose strict gantt open-modal [data-mermaid-wrapper] mermaid-action-btn toggle-mode common.zoomIn common.zoomOut common.resetZoom transition-[height] duration-150 ease-out data-mermaid-wrapper mermaid-loading mermaid-spinner diagram… mermaid-block-header space-x-1 common.preview common.source common.export mermaid-error hasRenderedOnce mermaid-block modeContainerRef mermaid-modal-overlay mermaid-modal-panel mermaid-modal-header mermaid-modal-title mermaid-modal-close mermaid-modal-body modalContentRef mermaid-modal-content available default abort timed [mermaidWorkerClient] messageerror cleared worker inject via busy canParse findPrefix infographic language d2lang html_block node.type html_inline text_special node.content heading list_item definition_list footnote footnote_reference footnote_anchor admonition hardbreak inline_code emphasis strikethrough highlight insert subscript superscript checkbox_input emoji thematic_break math_inline math_block reference vmr_container label_open label_close stream-monaco document data-language thinking htmlFor class className role aria-describedby self_closing tag_open tag_close parse dynamic template html-inline-node html-inline-node--loading [markstream-react] htmlPreviewSandbox contains both allow-scripts and this only fully trusted content served an isolated en utf-8 viewport content="width=device-width initial-scale=1 html-preview-frame__backdrop--dark html-preview-frame--dark html-preview-frame__header html-preview-frame__title html-preview-frame__dot html-preview-frame__label html-preview-frame__close--dark html-preview-frame__iframe no-referrer about:blank data-ssr-fallback normalizedLanguage renderNodeProp classAttr node.cite value void rowIdx bodyRows.length isOpen thematic-break-node cssVars image-node__img code-block-node code-block markdown-code-block-node markdown-code-block mermaid-block-node d2-block-node infographic-block-node math-block overflow-x-auto min-h-[40px] $$ math-inline-wrapper math-inline data-reference-id customComponents server-renderer node-content mathRef math-inline--hidden math-inline__loading math-inline__spinner rendering math-rendering normalizedType globalThis.requestAnimationFrame globalThis.cancelAnimationFrame sequencediagram classdiagram kind statediagram erdiagram flowchart graph module did expected [katexWorkerClient] init cache-hit timeout waiting slot existingEnv.getWorkerUrl °C process katex`
+export const safeList = `use client react string cannot delete global call clearGlobalCustomComponents blockquote-node auto note is-dark data-index-key headerId admonition-header admonition-icon admonition-title admonition-toggle aria-expanded aria-controls collapsed admonition-content aria-labelledby stream-markdown-parser code_block next.type typeof window.requestIdleCallback [data-node-index] node-spacer dark virtualized data-custom-id node-slot data-node-index data-node-type fade-node typewriter-node node-placeholder typewriterCursorRef typewriter-cursor admonition math_block html_block image object [data-node-type="code_block"] [data-node-type="admonition"] [data-node-type="table"] [data-node-type="math_block"] [data-node-type="html_block"] [data-node-type="image"] performance [markstream-react][perf] mermaid theme name markdown-renderer boolean safe mark highlight-node emphasis-node hard-break dependency is not install it to enable smooth footnote-anchor text-sm hover:underline cursor-pointer ↩︎ clsx heading-node font-semibold footnote-reference handleScroll footnote-link emoji-node number ?? ease-in-out infinite node.title top link-loading inline-flex items-baseline gap-1.5 link-text-wrapper relative leading-[normal] link-text text link-loading-indicator link-node aria-label noopener noreferrer dl definition-list indexKey mb-4 dt definition-term ctx renderNode definition dd definition-desc ml-4 html-block-node escape html-block html-block-node__placeholder html-block-node__placeholder-bar w-4/5 w-2/3 setHostEl shouldRender useDynamic reactNodes insert-node checkbox-node checkbox checkbox-input footnote-node flex leading-relaxed border-t border-[var(--footnote-border,#eaecef)] pt-2 flex-1 line-info diffUnchangedRegionStyle line-info-basic metadata legacy none off never background night moon black dracula mocha frappe macchiato palenight ocean poimandres monokai laserwave tokyo slack-dark rose-pine github-dark material-theme one-dark catppuccin-mocha catppuccin-frappe catppuccin-macchiato light latte dawn lotus plaintext diff visible view.getModifiedEditor explicit on same helpers.cleanupEditor canonicalLanguage window.requestAnimationFrame single window.cancelAnimationFrame clientX navigator.clipboard navigator.clipboard.writeText code-block-container my-4 rounded-lg border overflow-hidden shadow-sm border-gray-700/30 bg-gray-900 border-gray-200 bg-white is-rendering is-diff is-plain-text code-block-header justify-between items-center px-4 py-2.5 border-b border-gray-400/5 space-x-2 icon-slot h-4 w-4 flex-shrink-0 font-medium font-mono truncate code-action-btn p-2 text-xs rounded-md transition-colors hover:bg-[var(--vscode-editor-selectionBackground)] aria-pressed w-3 h-3 currentColor round m9 copied m14 evenodd code-block-body--collapsed code-block-body--expanded code-editor-layer code-height-placeholder hidden aria-hidden code-editor-fallback-surface code-fallback-plain m-0 aria-busy no code-loading-placeholder loading-skeleton skeleton-line short sr-only polite status href xlink:href markstream-d2-root-svg instance.render instance missing render returned empty d2-block text-gray-100 text-gray-900 d2-block-header gap-x-2 gap-x-1 p-0.5 bg-gray-700 bg-gray-100 mode-btn px-2 py-1 rounded !showSource is-active showSource d2-action-btn copying bodyRef d2-block-body bodyStyle !hasPreview d2-source py-4 d2-code d2-error mt-2 d2-render d2-svg pb-3 react-dom library failed text-red-500 p-4">Failed instanceof error.message error keydown transform ease center fullscreen touches text-gray-400 hover:bg-gray-700 hover:text-gray-200 text-gray-600 hover:bg-gray-200 hover:text-gray-700 source hasPreview preview pending bg-gray-800 bg-gray-50 px-2.5 bg-gray-600 text-gray-200 text-gray-700 text-gray-500 m16 isCollapsed opacity-50 cursor-not-allowed m7 whitespace-pre-wrap text-gray-300 baseCode absolute top-2 right-2 z-10 gap-2 backdrop-blur infographic-preview min-h-[360px] transition-all duration-100 block inset-0 cursor-grab isDragging containerRef w-full text-center justify-center min-h-full fixed z-50 bg-black/70 p-4 closeModal dialog h-full max-w-full max-h-full shadow-lg top-6 right-6 !isDragging cursor-grabbing unknown-node italic node list-item pl-1.5 my-2 valueAttr children list-node my-5 pl-[calc(13/8*1em)] list-decimal list-disc max-lg:my-[calc(4/3*1em)] max-lg:pl-[calc(14/9*1em)] list markstream-core inline-code inline text-[85%] px-1 py-0.5 bg-[hsl(var(--secondary))] whitespace-normal break-words text-node-stream-delta text-node-stream-delta--a text-node-stream-delta--b primary fallback is-loaded lazy eager async image-node__placeholder image-node__spinner image-node__placeholder-text image… placeholder image-node__error load superscript-node paragraph-node paragraph right text-right text-left pointermove pointerup pointercancel table-node-wrapper my-8 table-node table-node--loading colgroup border-[var(--table-border,#cbd5e1)] p-[calc(4/7*1em)] table-node__resize-handle table-node__loading table-node__spinner strong-node strikethrough-node window.matchMedia ms-tooltip z-[9999] inline-block text-base py-2 px-3 shadow-md whitespace-nowrap pointer-events-none tooltip-element text-white border-gray-700 tooltip [mermaidWorkerClient] messageerror cleared worker inject via busy timed out canParse findPrefix hr-node thematic-break reference-node bg-[hsl(var(--muted))] px-1.5 mx-0.5 hover:bg-[hsl(var(--secondary))] event.key subscript-node text-node text-node-center in zoom loose strict viewBox gantt open-modal [data-mermaid-wrapper] mermaid-action-btn toggle-mode common.zoomIn common.zoomOut common.resetZoom transition-[height] duration-150 ease-out data-mermaid-wrapper mermaid-loading mermaid-spinner diagram… mermaid-block-header space-x-1 common.preview common.source common.export mermaid-error hasRenderedOnce mermaid-block modeContainerRef mermaid-modal-overlay mermaid-modal-panel mermaid-modal-header mermaid-modal-title mermaid-modal-close mermaid-modal-body modalContentRef mermaid-modal-content available default abort vitesse-dark vitesse-light shiki shiki-fallback [MarkdownCodeBlockNode] dispose stream-markdown stream-markdown.createShikiStreamRenderer stale ready requires with ignoring and using language register configured retrying without code-block-content rendererTargetRef code-block-render infographic d2 d2lang node.type html_inline text_special node.content heading list_item definition_list footnote footnote_reference footnote_anchor hardbreak inline_code emphasis strikethrough highlight insert subscript superscript checkbox_input emoji thematic_break math_inline reference vmr_container label_open label_close containerClass vmr-container javascript typescript go python ruby shell powershell plain cpp csharp objectivec objectivecpp yaml markdown rust kotlin stream-monaco thinking htmlFor class className [markstream-react] htmlPreviewSandbox contains both allow-scripts this only fully trusted content served an isolated en utf-8 viewport content="width=device-width initial-scale=1 html-preview-frame__backdrop--dark html-preview-frame--dark html-preview-frame__header html-preview-frame__title html-preview-frame__dot html-preview-frame__label html-preview-frame__close--dark html-preview-frame__iframe no-referrer about:blank data-ssr-fallback normalizedLanguage data-language renderNodeProp classAttr node.cite value void rowIdx bodyRows.length isOpen thematic-break-node cssVars image-node__img code-block-node code-block markdown-code-block-node markdown-code-block mermaid-block-node d2-block-node infographic-block-node math-block overflow-x-auto min-h-[40px] $$ math-inline-wrapper math-inline data-reference-id customComponents server-renderer node-content document role aria-describedby self_closing tag_open tag_close parse dynamic template html-inline-node html-inline-node--loading mathRef rendering math-rendering math-inline--hidden math-inline__loading math-inline__spinner normalizedType [katexWorkerClient] init cache-hit startTime normalizedContent.length timeout waiting slot globalThis.requestAnimationFrame globalThis.cancelAnimationFrame sequencediagram classdiagram kind statediagram erdiagram flowchart graph module did expected key ref prototype constructor existingEnv.getWorkerUrl npm development process katex °C`
 module.exports = safeList;
 export default safeList;

package/dist/types/components/DefinitionListNode/DefinitionListNode.d.ts

@@ -1,5 +1,5 @@
-import { NodeComponentProps } from '../../types/node-component';
 import { DefinitionItemNode } from 'stream-markdown-parser';
+import { NodeComponentProps } from '../../types/node-component';
 export declare function DefinitionListNode(props: NodeComponentProps<{
     type: 'definition_list';
     items?: DefinitionItemNode[];

package/dist/types/components/ListNode/ListNode.d.ts

@@ -1,5 +1,5 @@
-import { NodeComponentProps } from '../../types/node-component';
 import { ListItemNode as ParsedListItemNode } from 'stream-markdown-parser';
+import { NodeComponentProps } from '../../types/node-component';
 export declare function ListNode(props: NodeComponentProps<{
     type: 'list';
     ordered?: boolean;

package/dist/types/components/MarkdownCodeBlockNode/MarkdownCodeBlockNode.d.ts

@@ -1,4 +1,5 @@
-export interface MarkdownCodeBlockNodeProps {
+import { ShikiCodeBlockProps } from '../../types/component-props';
+export interface MarkdownCodeBlockNodeProps extends ShikiCodeBlockProps {
     node: {
         type: 'code_block';
         language: string;
@@ -17,10 +18,6 @@ export interface MarkdownCodeBlockNodeProps {
     enableFontSizeControl?: boolean;
     minWidth?: string | number;
     maxWidth?: string | number;
-    themes?: string[];
-    showHeader?: boolean;
-    showCopyButton?: boolean;
-    showExpandButton?: boolean;
     showPreviewButton?: boolean;
     showCollapseButton?: boolean;
     showFontSizeButtons?: boolean;

package/dist/types/components/TableNode/TableNode.d.ts

@@ -1,5 +1,5 @@
-import { NodeComponentProps } from '../../types/node-component';
 import { TableRowNode } from 'stream-markdown-parser';
+import { NodeComponentProps } from '../../types/node-component';
 export declare function TableNode(props: NodeComponentProps<{
     type: 'table';
     header?: TableRowNode;

package/dist/types/context/smoothStreaming.d.ts

@@ -0,0 +1 @@
+export declare const SmoothStreamingContext: import('react').Context<boolean>;

package/dist/types/context/streamState.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Holds mutable streaming state that updates on every streaming chunk
+ * without triggering React re-renders. TextNode and InlineCodeNode read
+ * from this ref inside effects / callbacks rather than from renderCtx props,
+ * so that the renderCtx object can stay referentially stable during streaming.
+ */
+export interface StreamStateRef {
+    /** Map from node key to last-settled text content (shared across renders). */
+    textStreamState: Map<string, string>;
+    /** Returns the current stream render version counter. */
+    getStreamRenderVersion: () => number;
+}
+/**
+ * React Context that carries a stable StreamStateRef.
+ * The context value itself never changes (same ref object for the lifetime
+ * of the NodeRenderer), so subscribing components do NOT re-render when
+ * the stream version increments.  Consumers read the latest value inside
+ * effects or callbacks via `ref.getStreamRenderVersion()`.
+ */
+export declare const StreamStateRefContext: import('react').Context<StreamStateRef>;
+/**
+ * Hook that returns the nearest StreamStateRef, or null if none is provided.
+ */
+export declare function useStreamStateRef(): StreamStateRef | null;

package/dist/types/hooks/useSmoothMarkdownStream.d.ts

@@ -0,0 +1,20 @@
+import { SmoothMarkdownStreamOptions, SmoothMarkdownStreamSnapshot } from 'markstream-core';
+export type { SmoothMarkdownStreamOptions, SmoothMarkdownStreamSnapshot };
+export declare function useSmoothMarkdownStream(options?: SmoothMarkdownStreamOptions): {
+    enqueue: (chunk: string) => void;
+    finish: (options?: {
+        flush?: boolean;
+    }) => void;
+    flush: () => void;
+    reset: (initialMarkdown?: string) => void;
+    pause: () => void;
+    resume: () => void;
+    getSnapshot: () => SmoothMarkdownStreamSnapshot;
+    source: string;
+    visible: string;
+    done: boolean;
+    paused: boolean;
+    pendingChars: number;
+    caughtUp: boolean;
+    final: boolean;
+};

package/dist/types/index.d.ts

@@ -53,10 +53,12 @@ export type { TooltipPlacement, TooltipProps } from './components/Tooltip/Toolti
 export { VmrContainerNode } from './components/VmrContainerNode/VmrContainerNode';
 export { clearGlobalCustomComponents, getCustomComponentDisplay, getCustomNodeComponents, removeCustomComponents, setCustomComponents, withMarkstreamComponentDisplay, } from './customComponents';
 export type { CustomComponentDisplayMode, MarkstreamCustomComponent, } from './customComponents';
+export { useSmoothMarkdownStream } from './hooks/useSmoothMarkdownStream';
+export type { SmoothMarkdownStreamOptions, SmoothMarkdownStreamSnapshot, } from './hooks/useSmoothMarkdownStream';
 export * from './i18n/useSafeI18n';
 export * from './renderers/renderNode';
 export type { NodeRendererCodeBlockProps, NodeRendererProps } from './types';
-export type { CodeBlockDiffAppearance, CodeBlockDiffHideUnchangedRegions, CodeBlockDiffHideUnchangedRegionsOptions, CodeBlockDiffHunkActionContext, CodeBlockDiffHunkActionKind, CodeBlockDiffHunkSide, CodeBlockDiffLineStyle, CodeBlockDiffUnchangedRegionStyle, CodeBlockMonacoLanguage, CodeBlockMonacoOptions, CodeBlockMonacoTheme, CodeBlockMonacoThemeObject, CodeBlockNodeProps, CodeBlockPreviewPayload, D2BlockNodeProps, ImageNodeProps, InfographicBlockNodeProps, LinkNodeProps, MathBlockNodeProps, MathInlineNodeProps, MermaidBlockEvent, MermaidBlockNodeProps, PreCodeNodeProps, } from './types/component-props';
+export type { CodeBlockDiffAppearance, CodeBlockDiffHideUnchangedRegions, CodeBlockDiffHideUnchangedRegionsOptions, CodeBlockDiffHunkActionContext, CodeBlockDiffHunkActionKind, CodeBlockDiffHunkSide, CodeBlockDiffLineStyle, CodeBlockDiffUnchangedRegionStyle, CodeBlockMonacoLanguage, CodeBlockMonacoOptions, CodeBlockMonacoTheme, CodeBlockMonacoThemeObject, CodeBlockNodeProps, CodeBlockPreviewPayload, D2BlockNodeProps, ImageNodeProps, InfographicBlockNodeProps, LinkNodeProps, MathBlockNodeProps, MathInlineNodeProps, MermaidBlockEvent, MermaidBlockNodeProps, PreCodeNodeProps, ShikiCodeBlockProps, } from './types/component-props';
 export type { NodeComponentProps } from './types/node-component';
 export * from './utils/languageIcon';
 export * from './workers/katexWorkerClient';

package/dist/types/renderers/codeBlockExtraProps.d.ts

@@ -0,0 +1 @@
+export declare function getCodeBlockExtraProps(source: unknown): Record<string, unknown>;

package/dist/types/types/component-props.d.ts

@@ -9,6 +9,19 @@ export interface CodeBlockMonacoThemeObject {
 }
 export type CodeBlockMonacoTheme = string | CodeBlockMonacoThemeObject;
 export type CodeBlockMonacoLanguage = string | ((...args: unknown[]) => unknown);
+export interface CommonCodeBlockProps {
+    showHeader?: boolean;
+    showCopyButton?: boolean;
+    showExpandButton?: boolean;
+}
+export interface ShikiCodeBlockProps extends CommonCodeBlockProps {
+    themes?: readonly string[];
+    /**
+     * Shiki language preload request forwarded to stream-markdown's registerHighlight().
+     * This is not a rendering allow-list; already available Shiki languages may still highlight.
+     */
+    langs?: readonly string[];
+}
 export interface CodeBlockDiffHideUnchangedRegionsOptions {
     enabled?: boolean;
     contextLineCount?: number;
@@ -64,7 +77,7 @@ export interface CodeBlockMonacoOptions {
     scrollbar?: Record<string, unknown>;
     [key: string]: unknown;
 }
-export interface CodeBlockNodeProps {
+export interface CodeBlockNodeProps extends CommonCodeBlockProps {
     node: CodeBlockNode;
     isDark?: boolean;
     loading?: boolean;
@@ -77,9 +90,6 @@ export interface CodeBlockNodeProps {
     minWidth?: string | number;
     maxWidth?: string | number;
     themes?: CodeBlockMonacoTheme[];
-    showHeader?: boolean;
-    showCopyButton?: boolean;
-    showExpandButton?: boolean;
     showPreviewButton?: boolean;
     showCollapseButton?: boolean;
     showFontSizeButtons?: boolean;
@@ -153,6 +163,7 @@ export interface MermaidBlockNodeProps {
     showZoomControls?: boolean;
     enableWheelZoom?: boolean;
     isStrict?: boolean;
+    enableMermaidInteractions?: boolean;
     showTooltips?: boolean;
     onRenderError?: (error: unknown, code: string, container: HTMLElement) => boolean | void;
 }

package/dist/types/types/node-component.d.ts

@@ -8,5 +8,7 @@ export interface NodeComponentProps<TNode = unknown> {
     customId?: string;
     isDark?: boolean;
     typewriter?: boolean;
+    /** Enable/disable fade animations. Default: true */
+    fade?: boolean;
     children?: React.ReactNode;
 }

package/dist/types/types.d.ts

@@ -1,8 +1,12 @@
 import { default as React } from 'react';
 import { BaseNode, HtmlPolicy, MarkdownIt, ParsedNode, ParseOptions } from 'stream-markdown-parser';
 import { CustomComponentMap } from './customComponents';
-import { CodeBlockPreviewPayload, CodeBlockMonacoOptions, CodeBlockMonacoTheme, CodeBlockNodeProps, D2BlockNodeProps, InfographicBlockNodeProps, MermaidBlockNodeProps } from './types/component-props';
-export type NodeRendererCodeBlockProps = Partial<Omit<CodeBlockNodeProps, 'node'>> & Record<string, unknown>;
+import { SmoothMarkdownStreamOptions } from './hooks/useSmoothMarkdownStream';
+import { CodeBlockMonacoOptions, CodeBlockMonacoTheme, CodeBlockNodeProps, CodeBlockPreviewPayload, D2BlockNodeProps, InfographicBlockNodeProps, MermaidBlockNodeProps, ShikiCodeBlockProps } from './types/component-props';
+type NodeRendererCodeBlockThemes = CodeBlockNodeProps['themes'] | ShikiCodeBlockProps['themes'];
+export type NodeRendererCodeBlockProps = Partial<Omit<CodeBlockNodeProps, 'node' | 'themes'>> & Partial<Omit<ShikiCodeBlockProps, 'themes'>> & {
+    themes?: NodeRendererCodeBlockThemes;
+} & Record<string, unknown>;
 export interface NodeRendererProps {
     content?: string;
     nodes?: readonly BaseNode[] | null;
@@ -34,11 +38,36 @@ export interface NodeRendererProps {
     d2Props?: Partial<Omit<D2BlockNodeProps, 'node' | 'loading' | 'isDark'>>;
     infographicProps?: Partial<Omit<InfographicBlockNodeProps, 'node' | 'loading' | 'isDark'>>;
     showTooltips?: boolean;
+    /**
+     * Theme names or theme objects preloaded for Monaco-backed code blocks.
+     * When Shiki code blocks are used, only string theme names are forwarded to
+     * MarkdownCodeBlockNode / stream-markdown; theme objects are ignored.
+     */
     themes?: CodeBlockMonacoTheme[];
+    /**
+     * Shiki language preload list forwarded to MarkdownCodeBlockNode.
+     *
+     * The default React code block renderer is Monaco-backed. This prop is used
+     * when a custom `code_block` or language renderer uses MarkdownCodeBlockNode.
+     */
+    langs?: readonly string[];
     isDark?: boolean;
     customId?: string;
     indexKey?: number | string;
+    /** Show a blinking typewriter cursor while streamed content grows. Default: false */
     typewriter?: boolean;
+    /** Enable/disable non-code-node enter and streamed-text fade animations. Default: true */
+    fade?: boolean;
+    /**
+     * Enable built-in smooth pacing for streaming `content` updates.
+     * - `true`: force-enable smooth streaming (content mode only)
+     * - `false`: force-disable smooth streaming
+     * - `'auto'` (default): enable only when typewriter/incremental mode is active
+     * Applies when rendering from `content` (not `nodes`).
+     */
+    smoothStreaming?: boolean | 'auto';
+    /** Options forwarded to the built-in smooth streaming controller. Read once when the renderer is created. */
+    smoothStreamingOptions?: SmoothMarkdownStreamOptions;
     batchRendering?: boolean;
     initialRenderBatchSize?: number;
     renderBatchSize?: number;
@@ -59,6 +88,8 @@ export interface RenderContext {
     isDark?: boolean;
     indexKey?: string;
     typewriter?: boolean;
+    /** Enable/disable fade animations. Default: true */
+    fade?: boolean;
     textStreamState?: Map<string, string>;
     streamRenderVersion?: number;
     customComponents?: CustomComponentMap;
@@ -78,6 +109,7 @@ export interface RenderContext {
         monacoOptions?: CodeBlockMonacoOptions;
         minWidth?: string | number;
         maxWidth?: string | number;
+        langs?: readonly string[];
     };
     events: {
         onCopy?: (code: string) => void;
@@ -85,3 +117,4 @@ export interface RenderContext {
     };
 }
 export type RenderNodeFn = (node: ParsedNode, key: React.Key, ctx: RenderContext) => React.ReactNode;
+export {};

package/dist/types/utils/devEnv.d.ts

@@ -0,0 +1 @@
+export declare function isDevEnvironment(): boolean;

package/dist/types/utils/streamingTextState.d.ts

@@ -1,23 +1,2 @@
-export interface ResolveStreamingTextStateOptions {
-    nextContent: string;
-    previousContent: string;
-    typewriterEnabled: boolean;
-}
-export interface StreamingTextStateResult {
-    settledContent: string;
-    streamedDelta: string;
-    appended: boolean;
-}
-export interface StreamingRenderState {
-    settledContent: string;
-    streamedDelta: string;
-}
-export interface ResolveStreamingTextUpdateOptions {
-    nextContent: string;
-    persistedContent?: string;
-    currentState: StreamingRenderState;
-    typewriterEnabled: boolean;
-    streamRenderVersionChanged?: boolean;
-}
-export declare function resolveStreamingTextState({ nextContent, previousContent, typewriterEnabled, }: ResolveStreamingTextStateOptions): StreamingTextStateResult;
-export declare function resolveStreamingTextUpdate({ nextContent, persistedContent, currentState, typewriterEnabled, streamRenderVersionChanged, }: ResolveStreamingTextUpdateOptions): StreamingTextStateResult;
+export { resolveStreamingTextState, resolveStreamingTextUpdate } from 'markstream-core';
+export type { ResolveStreamingTextStateOptions, ResolveStreamingTextUpdateOptions, StreamingRenderState, StreamingTextStateResult } from 'markstream-core';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "markstream-react",
   "type": "module",
-  "version": "0.0.48",
+  "version": "0.0.50-beta.1",
   "description": "React Markdown renderer optimized for large documents with progressive Mermaid rendering, streaming diff code blocks, and fast real-time preview. Built on stream-markdown AST for consistent rendering across frameworks. Perfect for documentation sites, AI chat interfaces, and content management systems.",
   "author": "Simon He",
   "license": "MIT",
@@ -90,8 +90,8 @@
     "mermaid": ">=11",
     "react": ">=18",
     "react-dom": ">=18",
-    "stream-markdown": ">=0.0.15",
-    "stream-monaco": ">=0.0.40"
+    "stream-markdown": ">=0.0.16",
+    "stream-monaco": ">=0.0.41"
   },
   "peerDependenciesMeta": {
     "@antv/infographic": {
@@ -116,29 +116,32 @@
   "dependencies": {
     "@floating-ui/dom": "^1.7.6",
     "clsx": "^2.1.1",
-    "stream-markdown-parser": "0.0.93"
+    "markstream-core": "1.0.3",
+    "stream-markdown-parser": "1.0.5"
   },
   "devDependencies": {
     "@types/react": "^18.3.28",
     "@types/react-dom": "^18.3.7",
     "@vitejs/plugin-react-swc": "^3.11.0",
-    "autoprefixer": "^10.4.27",
+    "autoprefixer": "^10.5.0",
     "rollup": "^3.30.0",
     "rollup-plugin-dts": "^5.3.1",
     "rollup-plugin-visualizer": "^6.0.11",
     "tailwindcss": "^3.4.19",
     "typescript": "^5.9.3",
-    "vite": "^7.3.1",
+    "vite": "^7.3.3",
     "vite-plugin-dts": "^4.5.4"
   },
   "scripts": {
     "dev": "vite dev",
-    "build": "vite build --mode npm && vite build -c vite.config.tailwind.ts --mode npm && node ./scripts/copy-tailwind-css.mjs && node ../../scripts/generate-px-css.mjs && pnpm run build:dts && node ./scripts/ensure-next-client-directive.mjs",
+    "build": "pnpm --dir ../markstream-core build && vite build --mode npm && vite build -c vite.config.tailwind.ts --mode npm && node ./scripts/copy-tailwind-css.mjs && node ../../scripts/generate-px-css.mjs && pnpm run build:dts && node ./scripts/ensure-next-client-directive.mjs",
     "build:analyze": "ANALYZE=true pnpm build",
     "build:dts": "rollup -c ./scripts/rollup.dts.config.mjs && node ./scripts/clean-dts.cjs",
     "preview": "vite preview",
     "typecheck": "tsc --noEmit",
     "size:check": "node ../../scripts/check-package-size.mjs",
-    "release": "bumpp --commit --no-tag --no-push && pnpm publish --access public && node ../../scripts/tag-package.mjs --package-json package.json --push"
+    "check:core-published": "node ../../scripts/check-core-published.mjs --package-json package.json --core-package-json ../markstream-core/package.json",
+    "check:workspace-deps-published": "node ../../scripts/check-workspace-deps-published.mjs --package-json package.json",
+    "release": "pnpm run check:workspace-deps-published && bumpp --commit --no-tag --no-push && pnpm publish --access public && node ../../scripts/tag-package.mjs --package-json package.json --push"
   }
 }