markstream-svelte 0.0.1-beta.3 → 0.0.1-beta.4

package/dist/components/MermaidBlockNode.svelte

@@ -250,7 +250,8 @@
         lastRenderedCode = normalized
         svgCache[theme] = safeSvg
       }
-      rendered?.bindFunctions?.(document.createElement('div'))
+      if (typeof rendered !== 'string')
+        rendered?.bindFunctions?.(document.createElement('div'))
     }
     catch (error) {
       if (token === renderToken) {
@@ -582,4 +583,4 @@
       </div>
     {/if}
   </div>
-{/if}
+{/if}

package/dist/components/shared/node-helpers.d.ts

@@ -4,9 +4,72 @@ import type { CodeBlockMonacoOptions, CodeBlockMonacoTheme } from '../../types/m
 import { getHtmlTagFromContent, hasCompleteHtmlTagContent, normalizeCustomHtmlTags, normalizeCustomHtmlTagName as normalizeTagName, stripCustomHtmlWrapper } from 'stream-markdown-parser';
 export { getHtmlTagFromContent, hasCompleteHtmlTagContent, normalizeCustomHtmlTags, normalizeTagName, stripCustomHtmlWrapper, };
 export type SvelteRenderableNode = (ParsedNode | BaseNode) & Record<string, unknown>;
+export interface CodeBlockPreviewPayload {
+    node: SvelteRenderableNode;
+    artifactType: 'text/html' | 'image/svg+xml';
+    artifactTitle: string;
+    id: string;
+}
+export type NodeRendererCodeBlockProps = Partial<{
+    stream: boolean;
+    darkTheme: CodeBlockMonacoTheme;
+    lightTheme: CodeBlockMonacoTheme;
+    themes: CodeBlockMonacoTheme[];
+    monacoOptions: CodeBlockMonacoOptions;
+    minWidth: string | number;
+    maxWidth: string | number;
+    isShowPreview: boolean;
+    enableFontSizeControl: boolean;
+    showHeader: boolean;
+    showCopyButton: boolean;
+    showExpandButton: boolean;
+    showPreviewButton: boolean;
+    showCollapseButton: boolean;
+    showFontSizeButtons: boolean;
+    htmlPreviewAllowScripts: boolean;
+    htmlPreviewSandbox: string;
+}> & Record<string, unknown>;
+export type NodeRendererMermaidProps = Partial<{
+    maxHeight: string | null;
+    estimatedPreviewHeightPx: number;
+    workerTimeoutMs: number;
+    parseTimeoutMs: number;
+    renderTimeoutMs: number;
+    fullRenderTimeoutMs: number;
+    renderDebounceMs: number;
+    showHeader: boolean;
+    showModeToggle: boolean;
+    showCopyButton: boolean;
+    showExportButton: boolean;
+    showFullscreenButton: boolean;
+    showCollapseButton: boolean;
+    showZoomControls: boolean;
+    isStrict: boolean;
+}> & Record<string, unknown>;
+export type NodeRendererD2Props = Partial<{
+    maxHeight: string | null;
+    themeId: number | null;
+    darkThemeId: number | null;
+    showHeader: boolean;
+    showModeToggle: boolean;
+    showCopyButton: boolean;
+    showExportButton: boolean;
+    showCollapseButton: boolean;
+}> & Record<string, unknown>;
+export type NodeRendererInfographicProps = Partial<{
+    maxHeight: string | null;
+    estimatedPreviewHeightPx: number;
+    showHeader: boolean;
+    showModeToggle: boolean;
+    showCopyButton: boolean;
+    showCollapseButton: boolean;
+    showExportButton: boolean;
+    showFullscreenButton: boolean;
+    showZoomControls: boolean;
+}> & Record<string, unknown>;
 export interface NodeRendererEvents {
     onCopy?: (code: string) => void;
-    onHandleArtifactClick?: (payload: any) => void;
+    onHandleArtifactClick?: (payload: CodeBlockPreviewPayload) => void;
 }
 export interface NodeRendererProps {
     content?: string;
@@ -25,10 +88,10 @@ export interface NodeRendererProps {
     renderCodeBlocksAsPre?: boolean;
     codeBlockMinWidth?: string | number;
     codeBlockMaxWidth?: string | number;
-    codeBlockProps?: Record<string, any>;
-    mermaidProps?: Record<string, any>;
-    d2Props?: Record<string, any>;
-    infographicProps?: Record<string, any>;
+    codeBlockProps?: NodeRendererCodeBlockProps;
+    mermaidProps?: NodeRendererMermaidProps;
+    d2Props?: NodeRendererD2Props;
+    infographicProps?: NodeRendererInfographicProps;
     customComponents?: CustomComponentMap;
     showTooltips?: boolean;
     themes?: CodeBlockMonacoTheme[];
@@ -63,10 +126,10 @@ export interface SvelteRenderContext {
     customHtmlTags?: readonly string[];
     parseOptions?: ParseOptions;
     customMarkdownIt?: (md: MarkdownIt) => MarkdownIt;
-    codeBlockProps?: Record<string, any>;
-    mermaidProps?: Record<string, any>;
-    d2Props?: Record<string, any>;
-    infographicProps?: Record<string, any>;
+    codeBlockProps?: NodeRendererCodeBlockProps;
+    mermaidProps?: NodeRendererMermaidProps;
+    d2Props?: NodeRendererD2Props;
+    infographicProps?: NodeRendererInfographicProps;
     customComponents?: CustomComponentMap;
     codeBlockThemes?: {
         themes?: CodeBlockMonacoTheme[];

package/dist/components/shared/node-outlet-helpers.d.ts

@@ -4,5 +4,7 @@ export declare function resolveNodeOutletCodeMode(node: SvelteRenderableNode, co
 export declare function resolveHtmlTag(node: SvelteRenderableNode): string;
 export declare function coerceCustomHtmlNode(node: SvelteRenderableNode): SvelteRenderableNode;
 export declare function coerceBuiltinHtmlNode(node: SvelteRenderableNode, resolvedType: string): SvelteRenderableNode;
-export declare function resolveNodeOutletCustomInputs(node: SvelteRenderableNode, context?: SvelteRenderContext): Record<string, any>;
+export declare function resolveNodeOutletCustomInputs(node: SvelteRenderableNode, context?: SvelteRenderContext): {
+    [x: string]: any;
+};
 export declare function resolveNodeOutletCustomComponent(node: SvelteRenderableNode, context?: SvelteRenderContext, customComponents?: Record<string, any> | null): any;

package/dist/customComponents.d.ts

@@ -1,5 +1,5 @@
 import type { Component } from 'svelte';
-export type MarkstreamSvelteComponent = Component<Record<string, any>>;
+export type MarkstreamSvelteComponent = Component<never>;
 export type CustomComponentMap = Record<string, MarkstreamSvelteComponent>;
 export declare function subscribeCustomComponents(listener: () => void): () => void;
 export declare function getCustomComponentsRevision(): number;

package/dist/enhanceRenderedHtml.d.ts

@@ -1,15 +1,17 @@
+import type { NodeRendererCodeBlockProps, NodeRendererD2Props, NodeRendererInfographicProps, NodeRendererMermaidProps } from './components/shared/node-helpers';
+import type { CodeBlockMonacoOptions } from './types/monaco';
 export interface EnhanceRenderedHtmlOptions {
     final?: boolean;
     isDark?: boolean;
     renderCodeBlocksAsPre?: boolean;
-    monacoOptions?: Record<string, any>;
+    monacoOptions?: CodeBlockMonacoOptions;
     d2ThemeId?: number | null;
     d2DarkThemeId?: number | null;
     showTooltips?: boolean;
-    codeBlockProps?: Record<string, any>;
-    mermaidProps?: Record<string, any>;
-    d2Props?: Record<string, any>;
-    infographicProps?: Record<string, any>;
+    codeBlockProps?: NodeRendererCodeBlockProps;
+    mermaidProps?: NodeRendererMermaidProps;
+    d2Props?: NodeRendererD2Props;
+    infographicProps?: NodeRendererInfographicProps;
     onCopy?: (code: string) => void;
     isCancelled?: () => boolean;
 }

package/dist/enhanceRenderedHtml.js

@@ -270,7 +270,8 @@ async function renderMermaid(root, cleanupFns, options, isActive) {
             shell.body.innerHTML = safeSvg;
             shell.body.classList.add('markstream-svelte-mermaid');
             shell.wrapper.dataset.markstreamMermaid = '1';
-            (_g = rendered === null || rendered === void 0 ? void 0 : rendered.bindFunctions) === null || _g === void 0 ? void 0 : _g.call(rendered, shell.body);
+            if (typeof rendered !== 'string')
+                (_g = rendered === null || rendered === void 0 ? void 0 : rendered.bindFunctions) === null || _g === void 0 ? void 0 : _g.call(rendered, shell.body);
             cleanupFns.push(() => {
                 if (shell.wrapper.isConnected)
                     shell.wrapper.replaceWith(originalPre.cloneNode(true));

package/dist/hydrateCustomTagContent.js

@@ -28,8 +28,10 @@ export function hydrateCustomTagContent(nodes, source, customHtmlTags) {
         for (const value of Object.values(node)) {
             if (!Array.isArray(value))
                 continue;
-            for (const child of value)
-                visitNode(child);
+            for (const child of value) {
+                if (child && typeof child === 'object')
+                    visitNode(child);
+            }
         }
     };
     for (const node of cloned)
@@ -122,8 +124,9 @@ function cloneNodeTree(node) {
         : { ...node };
     if (!Array.isArray(cloned)) {
         for (const [key, value] of Object.entries(cloned)) {
-            if (Array.isArray(value))
+            if (Array.isArray(value)) {
                 cloned[key] = value.map(item => cloneNodeTree(item));
+            }
         }
     }
     return cloned;

package/dist/index.d.ts

@@ -39,7 +39,7 @@ export { default as PreCodeNode } from './components/PreCodeNode.svelte';
 export { default as ReferenceNode } from './components/ReferenceNode.svelte';
 export { default as RenderChildren } from './components/RenderChildren.svelte';
 export { buildRenderContext, resolveParsedNodes, } from './components/shared/node-helpers';
-export type { NodeRendererEvents, NodeRendererProps, SvelteRenderableNode, SvelteRenderContext, } from './components/shared/node-helpers';
+export type { CodeBlockPreviewPayload, NodeRendererCodeBlockProps, NodeRendererD2Props, NodeRendererEvents, NodeRendererInfographicProps, NodeRendererMermaidProps, NodeRendererProps, SvelteRenderableNode, SvelteRenderContext, } from './components/shared/node-helpers';
 export { default as StrikethroughNode } from './components/StrikethroughNode.svelte';
 export { default as StrongNode } from './components/StrongNode.svelte';
 export { default as SubscriptNode } from './components/SubscriptNode.svelte';

package/dist/optional/d2.d.ts

@@ -1,6 +1,17 @@
-export type D2Loader = () => Promise<any> | any;
+export interface D2Instance {
+    D2?: D2Constructor;
+    compile?: (source: string, options?: Record<string, unknown>) => Promise<unknown> | unknown;
+    render?: (input: unknown, options?: Record<string, unknown>) => Promise<unknown> | unknown;
+}
+export interface D2Constructor {
+    new (): D2Instance;
+    D2?: D2Constructor;
+    compile?: D2Instance['compile'];
+}
+export type D2Module = D2Constructor | D2Instance;
+export type D2Loader = () => Promise<unknown> | unknown;
 export declare function setD2Loader(loader: D2Loader | null): void;
 export declare function enableD2(loader?: D2Loader): void;
 export declare function disableD2(): void;
 export declare function isD2Enabled(): boolean;
-export declare function getD2(): Promise<any>;
+export declare function getD2(): Promise<D2Module | null>;

package/dist/optional/infographic.d.ts

@@ -1 +1,13 @@
-export declare function getInfographic(): Promise<any>;
+export interface InfographicInstance {
+    render: (source: string) => unknown;
+    destroy?: () => unknown;
+    on?: (event: string, handler: (payload: unknown) => void) => unknown;
+}
+export interface InfographicConstructor {
+    new (options: {
+        container: HTMLElement;
+        width?: string | number;
+        height?: string | number;
+    }): InfographicInstance;
+}
+export declare function getInfographic(): Promise<InfographicConstructor | null>;

package/dist/optional/katex.d.ts

@@ -1,6 +1,9 @@
-export type KatexLoader = () => Promise<any> | any;
+export interface KatexModule {
+    renderToString: (content: string, options?: Record<string, unknown>) => string;
+}
+export type KatexLoader = () => Promise<unknown> | unknown;
 export declare function setKatexLoader(loader: KatexLoader | null): void;
 export declare function enableKatex(loader?: KatexLoader): void;
 export declare function disableKatex(): void;
 export declare function isKatexEnabled(): boolean;
-export declare function getKatex(): Promise<any>;
+export declare function getKatex(): Promise<KatexModule | null>;

package/dist/optional/mermaid.d.ts

@@ -1,6 +1,27 @@
-export type MermaidLoader = () => Promise<any> | any;
+export type MermaidLoader = () => Promise<unknown> | unknown;
+export interface MermaidModule {
+    render: (id: string, source: string) => Promise<MermaidRenderResult> | MermaidRenderResult;
+    parse?: (source: string) => Promise<unknown> | unknown;
+    initialize?: (config?: Record<string, unknown>) => unknown;
+    mermaidAPI?: {
+        render?: MermaidModule['render'];
+        parse?: MermaidModule['parse'];
+        initialize?: MermaidModule['initialize'];
+    };
+}
+export type MermaidRenderResult = string | {
+    svg?: string;
+    bindFunctions?: (element: Element) => unknown;
+};
+interface MermaidInitConfig extends Record<string, unknown> {
+    securityLevel?: unknown;
+    flowchart?: {
+        htmlLabels?: unknown;
+    };
+}
 export declare function setMermaidLoader(loader: MermaidLoader | null): void;
 export declare function enableMermaid(loader?: MermaidLoader): void;
 export declare function disableMermaid(): void;
 export declare function isMermaidEnabled(): boolean;
-export declare function getMermaid(initConfig?: Record<string, any>): Promise<any>;
+export declare function getMermaid(initConfig?: MermaidInitConfig): Promise<MermaidModule | null>;
+export {};

package/dist/optional/monaco.d.ts

@@ -1,4 +1,21 @@
+export interface MonacoRuntimeHelpers {
+    createEditor?: (container: HTMLElement, code: string, language: string) => Promise<unknown> | unknown;
+    createDiffEditor?: (container: HTMLElement, original: string, modified: string, language: string) => Promise<unknown> | unknown;
+    updateCode?: (code: string, language?: string) => Promise<unknown> | unknown;
+    updateDiff?: (original: string, modified: string, language?: string) => Promise<unknown> | unknown;
+    cleanupEditor?: () => unknown;
+    safeClean?: () => unknown;
+    setTheme?: (theme?: string | Record<string, unknown>) => Promise<unknown> | unknown;
+    getEditorView?: () => unknown;
+    getDiffEditorView?: () => unknown;
+    refreshDiffPresentation?: () => unknown;
+}
+export interface MonacoRuntimeModule {
+    useMonaco: (options?: Record<string, unknown>) => MonacoRuntimeHelpers;
+    preloadMonacoWorkers?: () => Promise<unknown> | unknown;
+    getOrCreateHighlighter?: (...args: unknown[]) => Promise<unknown> | unknown;
+}
 export declare function isCodeBlockRuntimeReady(): boolean;
 export declare function resetCodeBlockRuntimeReadyForTest(): void;
 export declare function preloadCodeBlockRuntime(): Promise<boolean>;
-export declare function getUseMonaco(): Promise<any>;
+export declare function getUseMonaco(): Promise<MonacoRuntimeModule | null>;

package/dist/parseNestedMarkdownToNodes.d.ts

@@ -1,6 +1,10 @@
 import type { BaseNode, MarkdownIt, ParseOptions } from 'stream-markdown-parser';
+type NestedMarkdownSourceNode = BaseNode & {
+    children?: BaseNode[];
+    content?: string;
+};
 export interface NestedMarkdownNodesInput {
-    node?: (BaseNode & Record<string, any>) | null;
+    node?: NestedMarkdownSourceNode | null;
     nodes?: readonly BaseNode[] | null;
     content?: string | null;
 }
@@ -12,3 +16,4 @@ export interface NestedMarkdownNodesOptions {
     customMarkdownIt?: (markdown: MarkdownIt) => MarkdownIt;
 }
 export declare function parseNestedMarkdownToNodes(input: NestedMarkdownNodesInput, options?: NestedMarkdownNodesOptions): BaseNode[];
+export {};

package/dist/types/monaco.d.ts

@@ -7,7 +7,7 @@ export interface CodeBlockMonacoThemeObject {
     [key: string]: unknown;
 }
 export type CodeBlockMonacoTheme = string | CodeBlockMonacoThemeObject;
-export type CodeBlockMonacoLanguage = string | ((...args: any[]) => unknown);
+export type CodeBlockMonacoLanguage = string | ((...args: unknown[]) => unknown);
 export interface CodeBlockDiffHideUnchangedRegionsOptions {
     enabled?: boolean;
     contextLineCount?: number;
@@ -60,6 +60,6 @@ export interface CodeBlockMonacoOptions {
     diffHunkActionsOnHover?: boolean;
     diffHunkHoverHideDelayMs?: number;
     onDiffHunkAction?: (context: CodeBlockDiffHunkActionContext) => void | boolean | Promise<void | boolean>;
-    scrollbar?: Record<string, any>;
-    [key: string]: any;
+    scrollbar?: Record<string, unknown>;
+    [key: string]: unknown;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "markstream-svelte",
   "type": "module",
-  "version": "0.0.1-beta.3",
+  "version": "0.0.1-beta.4",
   "description": "Svelte Markdown renderer for Markstream, aligned with markstream-vue and markstream-react.",
   "author": "Simon He",
   "license": "MIT",
@@ -71,7 +71,7 @@
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.6",
-    "stream-markdown-parser": "0.0.92"
+    "stream-markdown-parser": "0.0.93"
   },
   "devDependencies": {
     "@sveltejs/package": "^2.5.7",